Merge branch 'feature/hotel-cruise'
commit
7c08e8bfe6
@ -0,0 +1,40 @@
|
||||
import React from 'react';
|
||||
import { Select } from 'antd';
|
||||
import { observer } from 'mobx-react';
|
||||
import { HotelStars as options } from '../../libs/ht';
|
||||
|
||||
const HotelStars = (props) => {
|
||||
const { mode, value, onChange, show_all, ...extProps } = props;
|
||||
const _show_all = ['tags', 'multiple'].includes(mode) ? false : show_all;
|
||||
return (
|
||||
<div>
|
||||
<Select
|
||||
mode={mode || null}
|
||||
allowClear
|
||||
style={{ width: '100%' }}
|
||||
placeholder="星级"
|
||||
value={value || undefined}
|
||||
onChange={(value) => {
|
||||
if (typeof onChange === 'function') {
|
||||
onChange(value);
|
||||
}
|
||||
}}
|
||||
labelInValue={false}
|
||||
{...extProps}
|
||||
options={options}
|
||||
>
|
||||
{_show_all ? (
|
||||
<Select.Option key="-1" value="ALL">
|
||||
ALL
|
||||
</Select.Option>
|
||||
) : (
|
||||
''
|
||||
)}
|
||||
</Select>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
/**
|
||||
* 酒店星级
|
||||
*/
|
||||
export default observer(HotelStars);
|
@ -0,0 +1,109 @@
|
||||
import React, { Children, useContext, useState } from 'react';
|
||||
import { observer } from 'mobx-react';
|
||||
import { stores_Context } from '../config';
|
||||
import moment from 'moment';
|
||||
import { Row, Col, Table, Select, Space, Typography, Progress, Spin, Divider, Button, Switch } from 'antd';
|
||||
import SearchForm from './../components/search/SearchForm';
|
||||
import { VSTag, TableExportBtn } from './../components/Data';
|
||||
|
||||
const {Text} = Typography;
|
||||
|
||||
export default observer((props) => {
|
||||
const { sale_store, date_picker_store: searchFormStore } = useContext(stores_Context);
|
||||
const { customerServicesStore, HotelCruiseStore, date_picker_store } = useContext(stores_Context);
|
||||
const { loading, dataSource } = HotelCruiseStore.cruise;
|
||||
|
||||
const { formValues, siderBroken } = searchFormStore;
|
||||
|
||||
const tableSorter = (a, b, colName) => (a[colName] - b[colName]);
|
||||
const tableProps = {
|
||||
size: 'small',
|
||||
bordered: true, pagination: false,
|
||||
columns: [
|
||||
{ title: '产品', dataIndex: 'ProductName', key: 'ProductName' },
|
||||
{
|
||||
title: '房间数',
|
||||
dataIndex: 'TotalNum',
|
||||
key: 'TotalNum',
|
||||
sorter: (a, b) => tableSorter(a, b, 'TotalNum'),
|
||||
render: (v, r) => (
|
||||
<>
|
||||
<Space direction={'vertical'}>
|
||||
<Text strong>
|
||||
{v}
|
||||
{r.CPTotalNum && <Text type="secondary"> VS {r.CPTotalNum}</Text>}
|
||||
</Text>
|
||||
{r.CPTotalNum && <VSTag diffPercent={r.TotalNumPercent} />}
|
||||
</Space>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{ title: '人数', dataIndex: 'TotalPersonNum', key: 'TotalPersonNum',
|
||||
sorter: (a, b) => tableSorter(a, b, 'TotalPersonNum'),
|
||||
render: (v, r) => (
|
||||
<>
|
||||
<Space direction={'vertical'}>
|
||||
<Text strong>
|
||||
{v}
|
||||
{r.CPTotalPersonNum && <Text type="secondary"> VS {r.CPTotalPersonNum}</Text>}
|
||||
</Text>
|
||||
{r.CPTotalNum && <VSTag diffPercent={r.TotalPersonNumPercent} />}
|
||||
</Space>
|
||||
</>
|
||||
),},
|
||||
{ title: '总利润', dataIndex: 'TotalProfit', key: 'TotalProfit',
|
||||
sorter: (a, b) => tableSorter(a, b, 'TotalProfit'),
|
||||
render: (v, r) => (
|
||||
<>
|
||||
<Space direction={'vertical'}>
|
||||
<Text strong>
|
||||
{v}
|
||||
{r.CPTotalProfit && <Text type="secondary"> VS {r.CPTotalProfit}</Text>}
|
||||
</Text>
|
||||
{r.CPTotalNum && <VSTag diffPercent={r.TotalProfitPercent} />}
|
||||
</Space>
|
||||
</>
|
||||
), },
|
||||
// { title: '单订船', dataIndex: '', key: '' },
|
||||
// { title: '订单含行程', dataIndex: '', key: '' },
|
||||
// { title: '国籍', dataIndex: '', key: '' },
|
||||
],
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Row gutter={16} className={siderBroken ? '' : 'sticky-top'}>
|
||||
<Col md={24} lg={24} xxl={24}>
|
||||
<SearchForm
|
||||
defaultValue={{
|
||||
initialValue: {
|
||||
...date_picker_store.formValues,
|
||||
...HotelCruiseStore.searchValues,
|
||||
},
|
||||
// 'countryArea',
|
||||
shows: [
|
||||
'DepartmentList', 'orderStatus', 'dates', 'keyword', 'cruiseDirection', 'agency',
|
||||
// 'cruiseBookType', 'country', 'roomsRange', 'personRange'
|
||||
],
|
||||
sort: { keyword: 101, agency: 103, cruiseDirection: 102, country: 104 },
|
||||
fieldProps: {
|
||||
keyword: { placeholder: '产品名', col: 4 },
|
||||
DepartmentList: { show_all: true, mode: 'multiple' },
|
||||
orderStatus: { show_all: true },
|
||||
cruiseDirection: { show_all: true },
|
||||
// years: { hide_vs: false },
|
||||
},
|
||||
}}
|
||||
onSubmit={(_err, obj, form) => {
|
||||
HotelCruiseStore.setSearchValues(obj, form);
|
||||
HotelCruiseStore.getCruiseData(obj);
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
</Row>
|
||||
<section>
|
||||
<Table {...tableProps} {...{loading, dataSource}} rowKey={(record) => record.ProductName} />
|
||||
</section>
|
||||
</>
|
||||
);
|
||||
});
|
@ -0,0 +1,112 @@
|
||||
import React, { useContext } from 'react';
|
||||
import { observer } from 'mobx-react';
|
||||
import { stores_Context } from '../config';
|
||||
import { Row, Col, Table, Space, Typography } from 'antd';
|
||||
import SearchForm from './../components/search/SearchForm';
|
||||
import { VSTag, TableExportBtn } from './../components/Data';
|
||||
const { Text } = Typography;
|
||||
|
||||
export default observer((props) => {
|
||||
const { sale_store, date_picker_store: searchFormStore } = useContext(stores_Context);
|
||||
const { customerServicesStore, date_picker_store, HotelCruiseStore } = useContext(stores_Context);
|
||||
const { loading, dataSource } = HotelCruiseStore.hotel;
|
||||
|
||||
const { formValues, siderBroken } = searchFormStore;
|
||||
|
||||
const tableSorter = (a, b, colName) => (a[colName] - b[colName]);
|
||||
|
||||
const tableProps = {
|
||||
size: 'small',
|
||||
bordered: true,
|
||||
pagination: false,
|
||||
columns: [
|
||||
{ title: '目的地', dataIndex: 'CityName', key: 'CityName' },
|
||||
{
|
||||
title: '总间夜',
|
||||
dataIndex: 'TotalNum',
|
||||
key: 'TotalNum',
|
||||
sorter: (a, b) => tableSorter(a, b, 'TotalNum'),
|
||||
render: (v, r) => (
|
||||
<>
|
||||
<Space direction={'vertical'}>
|
||||
<Text strong>
|
||||
{v}
|
||||
{r.CPTotalNum && <Text type="secondary"> VS {r.CPTotalNum}</Text>}
|
||||
</Text>
|
||||
{r.CPTotalNum && <VSTag diffPercent={r.TotalNumPercent} />}
|
||||
</Space>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: '主推',
|
||||
dataIndex: 'RecomendNum',
|
||||
key: 'RecomendNum',
|
||||
sorter: (a, b) => tableSorter(a, b, 'RecomendNum'),
|
||||
render: (v, r) => (
|
||||
<>
|
||||
<Space direction={'vertical'}>
|
||||
<Text strong>
|
||||
{v}
|
||||
{r.CPRecomendNum && <Text type="secondary"> VS {r.CPRecomendNum}</Text>}
|
||||
</Text>
|
||||
{r.CPRecomendNum && <VSTag diffPercent={r.RecomendNumPercent} />}
|
||||
</Space>
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: '使用比例',
|
||||
dataIndex: 'RecommendRate_100',
|
||||
key: 'RecommendRate_100',
|
||||
render: (v, r) => (
|
||||
<>
|
||||
<Space direction={'vertical'}>
|
||||
<Text strong>
|
||||
{v}
|
||||
{r.RecommendRateDelta !== undefined && <Text type="secondary"> VS {r.CPRecommendRate_100}</Text>}
|
||||
</Text>
|
||||
{r.RecommendRateDelta !== undefined && <VSTag diffPercent={r.RecommendRateDelta} />}
|
||||
</Space>
|
||||
</>
|
||||
),
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Row gutter={16} className={siderBroken ? '' : 'sticky-top'}>
|
||||
<Col md={24} lg={24} xxl={24}>
|
||||
<SearchForm
|
||||
defaultValue={{
|
||||
initialValue: {
|
||||
...date_picker_store.formValues,
|
||||
...HotelCruiseStore.searchValues,
|
||||
},
|
||||
// 'countryArea', 'DateType', 'dates',
|
||||
shows: ['DepartmentList', 'countryArea', 'orderStatus', 'hotelBookType', 'hotelRecommandRate', 'hotelStar', 'DateType', 'dates'],
|
||||
sort: { DateType: 101, dates: 102 },
|
||||
fieldProps: {
|
||||
DepartmentList: { show_all: true, mode: 'multiple' },
|
||||
countryArea: { show_all: true },
|
||||
orderStatus: { show_all: true },
|
||||
hotelBookType: { show_all: true },
|
||||
hotelRecommandRate: { show_all: true },
|
||||
// years: { hide_vs: false },
|
||||
DateType: { disabledKeys: ['applyDate'] },
|
||||
},
|
||||
}}
|
||||
onSubmit={(_err, obj, form) => {
|
||||
HotelCruiseStore.setSearchValues(obj, form);
|
||||
HotelCruiseStore.getHotelData(obj);
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
</Row>
|
||||
<section>
|
||||
<Table {...tableProps} bordered {...{ loading, dataSource }} rowKey={(record) => record.CityName} />
|
||||
</section>
|
||||
</>
|
||||
);
|
||||
});
|
Loading…
Reference in New Issue