feat:东道主项目页
ZJYHX
2 months ago
parent
e297d36256
commit
fee1185406
@ -0,0 +1,157 @@
|
|||||||
|
import { useContext } from 'react';
|
||||||
|
import { Row, Col, Typography, Space, Table, Divider } from 'antd';
|
||||||
|
import { stores_Context } from '../config';
|
||||||
|
import { observer } from 'mobx-react';
|
||||||
|
import 'moment/locale/zh-cn';
|
||||||
|
import SearchForm from '../components/search/SearchForm';
|
||||||
|
import { TableExportBtn } from '../components/Data';
|
||||||
|
import * as comm from '../utils/commons';
|
||||||
|
|
||||||
|
const HostCaseCount = () => {
|
||||||
|
const { customer_store, date_picker_store } = useContext(stores_Context);
|
||||||
|
const host_case_data = customer_store.host_case_data;
|
||||||
|
|
||||||
|
const columnsList = [
|
||||||
|
{
|
||||||
|
title: '团数',
|
||||||
|
dataIndex: 'TotalGroupNum',
|
||||||
|
key: 'TotalGroupNum',
|
||||||
|
sorter: (a, b) => parseInt(a.TotalGroupNum) - parseInt(b.TotalGroupNum),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '人数',
|
||||||
|
dataIndex: 'TotalPersonNum',
|
||||||
|
key: 'TotalPersonNum',
|
||||||
|
sorter: (a, b) => parseInt(a.TotalPersonNum) - parseInt(b.TotalPersonNum),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '计费团天数',
|
||||||
|
dataIndex: 'TotalDays',
|
||||||
|
key: 'TotalDays',
|
||||||
|
sorter: (a, b) => parseInt(a.TotalDays) - parseInt(b.TotalDays),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '交易额',
|
||||||
|
dataIndex: 'TotalPrice',
|
||||||
|
key: 'TotalPrice',
|
||||||
|
sorter: (a, b) => parseInt(a.TotalPrice) - parseInt(b.TotalPrice),
|
||||||
|
},
|
||||||
|
];
|
||||||
|
// 小组筛选菜单项
|
||||||
|
console.log(host_case_data.groupData);
|
||||||
|
const allOPI1 = comm.uniqWith(host_case_data.groupData.map(rr => ({ text: rr.GroupBy, value: rr.GroupBy })),
|
||||||
|
(a, b) => JSON.stringify(a) === JSON.stringify(b)).sort((a, b) => a.text.localeCompare(b.text));
|
||||||
|
// 顾问筛选菜单项
|
||||||
|
const allOPI2 = comm.uniqWith(host_case_data.counselorData.map(rr => ({ text: rr.GroupBy, value: rr.GroupBy })),
|
||||||
|
(a, b) => JSON.stringify(a) === JSON.stringify(b)).sort((a, b) => a.text.localeCompare(b.text));
|
||||||
|
const summaryColumnsList = [{
|
||||||
|
title: '',
|
||||||
|
dataIndex: 'GroupBy',
|
||||||
|
key: 'GroupBy',
|
||||||
|
}, ...columnsList];
|
||||||
|
const groupColumnsList = [{
|
||||||
|
title: '组名',
|
||||||
|
dataIndex: 'GroupBy',
|
||||||
|
key: 'GroupBy',
|
||||||
|
filters: allOPI1,
|
||||||
|
onFilter: (value, record) => record.GroupBy === value,
|
||||||
|
filterSearch: true,
|
||||||
|
}, ...columnsList];
|
||||||
|
const counselorColumnsList = [{
|
||||||
|
title: '顾问名',
|
||||||
|
dataIndex: 'GroupBy',
|
||||||
|
key: 'GroupBy',
|
||||||
|
filters: allOPI2,
|
||||||
|
onFilter: (value, record) => record.GroupBy === value,
|
||||||
|
filterSearch: true,
|
||||||
|
}, ...columnsList];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Space direction="vertical" style={{ width: '100%' }}>
|
||||||
|
<Row gutter={16} className={date_picker_store.siderBroken ? "" : "sticky-top"} >
|
||||||
|
<Col className="gutter-row" span={24}>
|
||||||
|
<SearchForm
|
||||||
|
defaultValue={{
|
||||||
|
initialValue: {
|
||||||
|
...date_picker_store.formValues,
|
||||||
|
...host_case_data.searchValues,
|
||||||
|
},
|
||||||
|
shows: ['DepartmentList', 'dates'],
|
||||||
|
fieldProps: {
|
||||||
|
DepartmentList: { show_all: false, mode: 'multiple' },
|
||||||
|
dates: { hide_vs: true },
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
onSubmit={(_err, obj, form) => {
|
||||||
|
customer_store.setSearchValues(obj, form,"host_case_data");
|
||||||
|
customer_store.getHostCaseData("1");
|
||||||
|
customer_store.getHostCaseData("2");
|
||||||
|
customer_store.getHostCaseData("3");
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
<Row>
|
||||||
|
<Col span={24}>
|
||||||
|
<Typography.Title level={3}>东道主项目汇总</Typography.Title>
|
||||||
|
<Divider orientation="right" plain>
|
||||||
|
<TableExportBtn label={'东道主项目汇总'} {...{ columns: summaryColumnsList, dataSource: host_case_data.summaryData }} />
|
||||||
|
</Divider>
|
||||||
|
<Table
|
||||||
|
sticky
|
||||||
|
id="summaryCountList"
|
||||||
|
dataSource={host_case_data.summaryData}
|
||||||
|
columns={summaryColumnsList}
|
||||||
|
size="small"
|
||||||
|
rowKey={(record) => record.key}
|
||||||
|
loading={host_case_data.loading}
|
||||||
|
pagination={false}
|
||||||
|
scroll={{ x: 1000 }}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
<Row>
|
||||||
|
<Col span={24}>
|
||||||
|
<Typography.Title level={3}>东道主项目小组统计</Typography.Title>
|
||||||
|
<Divider orientation="right" plain>
|
||||||
|
<TableExportBtn label={'东道主项目小组统计'} {...{ columns: groupColumnsList, dataSource: host_case_data.groupData }} />
|
||||||
|
</Divider>
|
||||||
|
<Table
|
||||||
|
sticky
|
||||||
|
id="summaryCountList"
|
||||||
|
dataSource={host_case_data.groupData}
|
||||||
|
columns={groupColumnsList}
|
||||||
|
size="small"
|
||||||
|
rowKey={(record) => record.key}
|
||||||
|
loading={host_case_data.loading}
|
||||||
|
pagination={false}
|
||||||
|
scroll={{ x: 1000 }}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
<Row>
|
||||||
|
<Col span={24}>
|
||||||
|
<Typography.Title level={3}>东道主项目顾问统计</Typography.Title>
|
||||||
|
<Divider orientation="right" plain>
|
||||||
|
<TableExportBtn label={'东道主项目顾问统计'} {...{ columns: counselorColumnsList, dataSource: host_case_data.counselorData }} />
|
||||||
|
</Divider>
|
||||||
|
<Table
|
||||||
|
sticky
|
||||||
|
id="summaryCountList"
|
||||||
|
dataSource={host_case_data.counselorData}
|
||||||
|
columns={counselorColumnsList}
|
||||||
|
size="small"
|
||||||
|
rowKey={(record) => record.key}
|
||||||
|
loading={host_case_data.loading}
|
||||||
|
pagination={false}
|
||||||
|
scroll={{ x: 1000 }}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Space>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default observer(HostCaseCount);
|
||||||
Loading…
Reference in New Issue