Merge branch 'feature/hotel-cruise'
Lei OT
2 months ago
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