diff --git a/src/App.js b/src/App.js index 207e392..f209d8f 100644 --- a/src/App.js +++ b/src/App.js @@ -13,8 +13,10 @@ import Customer_care_potential from "./charts/Customer_care_potential"; import Customer_care_regular from "./charts/Customer_care_regular"; import Wechat_session from "./charts/Wechat_session"; import WhatsApp_session from "./charts/WhatsApp_session"; -import AgentList from "./views/AgentList"; -import GroupList from "./views/GroupList"; +import AgentGroupCount from "./views/AgentGroupCount"; +import AgentGroupList from "./views/AgentGroupList"; +import DestinationGroupCount from "./views/DestinationGroupCount"; +import DestinationGroupList from "./views/DestinationGroupList"; import Credit_card_bill from "./views/Credit_card_bill"; import exchange_rate from "./charts/ExchangeRate"; import Sale from "./views/Sale"; @@ -71,7 +73,8 @@ const App = () => { label: "客服", icon: , children: [ - { key: 61, label: 地接社接团 }, + { key: 61, label: 地接社接团 }, + { key: 62, label: 目的地接团 }, ], } ]; @@ -105,8 +108,10 @@ const App = () => { } /> } /> } /> - } /> - } /> + } /> + } /> + } /> + } /> }> } /> diff --git a/src/stores/CustomerServices.js b/src/stores/CustomerServices.js index ebaea7a..5689b40 100644 --- a/src/stores/CustomerServices.js +++ b/src/stores/CustomerServices.js @@ -3,6 +3,7 @@ import moment from "moment"; import { NavLink } from "react-router-dom"; import * as config from "../config"; import * as req from '../utils/request'; +import { prepareUrl } from '../utils/commons'; class CustomerServices { @@ -14,26 +15,53 @@ class CustomerServices { this.endDateString = this.endDate.format(config.DATE_FORMAT) + '%2023:59'; this.dateType = 'startDate'; this.inProgress = false; - this.selectedAgent = {VendorName: '请选择地接社'}; + this.selectedAgent = ''; + this.selectedTeam = ''; + this.selectedCountry = ''; makeAutoObservable(this); } - fetchAgentList() { + fetchAllAgent() { this.inProgress = true; - req.fetchJSON(config.HT_HOST + '/service-web/QueryData/GetAgentGroupInfoALL?DateType=' + this.dateType + '&Date1=' + this.startDateString + '&Date2=' + this.endDateString + '&OldDate1=' + this.startDateString + '&OldDate2=' + this.endDateString) + req.fetchJSON(config.HT_HOST + '/service-web/QueryData/GetVEIName') .then(json => { if (json.errcode === 0) { runInAction(() => { this.agentList = json.result1; + }); + } + }) + .then(() => { + this.inProgress = false; + }); + } + + fetchAgentGroupCount() { + this.inProgress = true; + const fetchUrl = prepareUrl(config.HT_HOST + '/service-web/QueryData/GetAgentGroupInfoALL') + .append('DateType', this.dateType) + .append('Date1', this.startDateString) + .append('Date2', this.endDateString) + .append('OldDate1', this.startDateString) + .append('OldDate2', this.endDateString) + .append('VEI_SN', this.selectedAgent) + .append('DepList', this.selectedTeam) + .append('Country', this.selectedCountry) + .build(); + req.fetchJSON(fetchUrl) + .then(json => { + if (json.errcode === 0) { + runInAction(() => { + this.agentGroupList = json.result1; const total1 = json.total1; - this.agentListColumns = [ + this.agentGroupListColumns = [ { title: '地接社名称', dataIndex: 'VendorName', children: [{ // title: this.startDate.format(config.DATE_FORMAT) + '~' + this.endDate.format(config.DATE_FORMAT), dataIndex: 'VendorName', - render: (text, record) => {record.VendorName} + render: (text, record) => {record.VendorName} } ] }, @@ -77,6 +105,16 @@ class CustomerServices { } ] }, + { + title: '前勤分', + dataIndex: 'qianqin', + sorter: (a, b) => a.qianqin - b.qianqin, + children: [{ + title: total1.qianqin, + dataIndex: 'qianqin' + } + ] + }, { title: '好评数', dataIndex: 'GoodCount', @@ -128,16 +166,25 @@ class CustomerServices { fetchGroupListByAgentId(agentId) { this.inProgress = true; - this.selectedAgent = {VendorName: '...'}; + this.agentCompany = '...'; this.groupList = []; this.groupListColumns = []; - req.fetchJSON(config.HT_HOST + '/service-web/QueryData/GetAgentGroupInfo?VEI_SN=' + agentId + '&DateType=' + this.dateType + '&Date1=' + this.startDateString + '&Date2=' + this.endDateString + '&OldDate1=' + this.startDateString + '&OldDate2=' + this.endDateString) + const fetchUrl = prepareUrl(config.HT_HOST + '/service-web/QueryData/GetAgentGroupInfo') + .append('VEI_SN', agentId) + .append('DateType', this.dateType) + .append('Date1', this.startDateString) + .append('Date2', this.endDateString) + .append('OldDate1', this.startDateString) + .append('OldDate2', this.endDateString) + .append('DepList', this.selectedTeam) + .build(); + req.fetchJSON(fetchUrl) .then(json => { if (json.errcode === 0) { runInAction(() => { this.groupList = json.result1; if (json.result1.length > 0) { - this.selectedAgent = {VendorName: json.result1[0].VendorName}; + this.agentCompany = json.result1[0].VendorName; } const total1 = json.total1; this.groupListColumns = [ @@ -181,20 +228,20 @@ class CustomerServices { ] }, { - title: '经过城市', - dataIndex: 'PassCity', + title: '导游', + dataIndex: 'GuideName', children: [{ title: '-', - dataIndex: 'PassCity' + dataIndex: 'GuideName' } ] }, { - title: '导游', - dataIndex: 'GuideName', + title: '前勤分', + dataIndex: 'qianqin', children: [{ - title: '-', - dataIndex: 'GuideName' + title: total1.qianqin, + dataIndex: 'qianqin' } ] }, @@ -217,13 +264,171 @@ class CustomerServices { dataIndex: 'Bad' } ] + } + ]; + }); + } + }) + .then(() => { + this.inProgress = false; + }); + } + + fetchDestinationGroupCount() { + this.inProgress = true; + const fetchUrl = prepareUrl(config.HT_HOST + '/service-web/QueryData/GetdistGroupInfoAll') + .append('DateType', this.dateType) + .append('Date1', this.startDateString) + .append('Date2', this.endDateString) + .append('OldDate1', this.startDateString) + .append('OldDate2', this.endDateString) + .append('DepList', this.selectedTeam) + .append('Country', this.selectedCountry) + .build(); + req.fetchJSON(fetchUrl) + .then(json => { + if (json.errcode === 0) { + runInAction(() => { + this.destinationGroupCount = json.result1; + const total1 = json.total1; + this.destinationGroupCountColumns = [ + { + title: '城市', + dataIndex: 'COLD_ServiceCityName', + children: [{ + dataIndex: 'COLD_ServiceCityName', + render: (text, record) => {record.COLD_ServiceCityName} + } + ] + }, + { + title: '团数', + dataIndex: 'GroupCount', + sorter: (a, b) => a.GroupCount - b.GroupCount, + children: [{ + title: total1.GroupCount, + dataIndex: 'GroupCount' + } + ] + }, + { + title: '人数', + dataIndex: 'PersonNum', + sorter: (a, b) => a.PersonNum - b.PersonNum, + children: [{ + title: total1.PersonNum, + dataIndex: 'PersonNum' + } + ] }, { - title: '评论内容', - dataIndex: 'ECI_Content', + title: '团天数', + dataIndex: 'GroupDays', + sorter: (a, b) => a.GroupDays - b.GroupDays, + children: [{ + title: total1.GroupDays, + dataIndex: 'GroupDays' + } + ] + }, + { + title: '交易额', + dataIndex: 'TotalCost', + sorter: (a, b) => a.TotalCost - b.TotalCost, + children: [{ + title: total1.totalcost, + dataIndex: 'TotalCost' + } + ] + } + ]; + }); + } + }) + .then(() => { + this.inProgress = false; + }); + } + + fetchGroupListByDestinationId(destinationId) { + this.inProgress = true; + this.destinationName = '...'; + this.destinationGroupList = []; + this.destinationGroupListColumns = []; + const fetchUrl = prepareUrl(config.HT_HOST + '/service-web/QueryData/GetdistGroupInfo') + .append('city', destinationId) + .append('DateType', this.dateType) + .append('Date1', this.startDateString) + .append('Date2', this.endDateString) + .append('OldDate1', this.startDateString) + .append('OldDate2', this.endDateString) + .append('DepList', this.selectedTeam) + .append('Country', this.selectedCountry) + .build(); + req.fetchJSON(fetchUrl) + .then(json => { + if (json.errcode === 0) { + runInAction(() => { + this.destinationGroupList = json.result1; + if (json.result1.length > 0) { + // this.destinationName = json.result1[0].VendorName; + } + const total1 = json.total1; + this.destinationGroupListColumns = [ + { + title: '团名', + dataIndex: 'GRI_Name', + children: [{ + title: '', + dataIndex: 'GRI_Name' + } + ] + }, + { + title: '人数', + dataIndex: 'COLI_PersonNum', + sorter: (a, b) => a.COLI_PersonNum - b.COLI_PersonNum, + children: [{ + title: total1.COLI_PersonNum, + dataIndex: 'COLI_PersonNum' + } + ] + }, + { + title: '天数', + dataIndex: 'COLI_Days', + sorter: (a, b) => a.COLI_Days - b.COLI_Days, + children: [{ + title: total1.COLI_Days, + dataIndex: 'COLI_Days' + } + ] + }, + { + title: '交易额', + dataIndex: 'COLD_TotalCost', + sorter: (a, b) => a.COLD_TotalCost - b.COLD_TotalCost, + children: [{ + title: total1.COLD_TotalCost, + dataIndex: 'COLD_TotalCost' + } + ] + }, + { + title: '确认日期', + dataIndex: 'COLI_ConfirmDate', children: [{ title: '-', - dataIndex: 'ECI_Content' + dataIndex: 'COLI_ConfirmDate' + } + ] + }, + { + title: '出发日期', + dataIndex: 'COLI_OrderStartDate', + children: [{ + title: '-', + dataIndex: 'COLI_OrderStartDate' } ] } @@ -249,7 +454,14 @@ class CustomerServices { selectAgent(agent) { this.selectedAgent = agent; - this.fetchGroupListByAgent(); + } + + selectTeam(team) { + this.selectedTeam = team; + } + + selectCountry(country) { + this.selectedCountry = country; } startDate; @@ -258,13 +470,20 @@ class CustomerServices { endDateString; dateType; selectedAgent; + selectedTeam; + selectedCountry; inProgress; + + agentList = []; groupList = []; groupListColumns = []; - agentList = [{ + destinationGroupCount = []; + destinationGroupCountColumns =[]; + + agentGroupList = [{ EOI_ObjSN: 1, VendorName: '---', GroupCount: 0, @@ -278,7 +497,7 @@ class CustomerServices { key: 1 }]; - agentListColumns = [ + agentGroupListColumns = [ { title: '地接社名称', dataIndex: 'VendorName', diff --git a/src/views/AgentGroupCount.js b/src/views/AgentGroupCount.js new file mode 100644 index 0000000..a45a90c --- /dev/null +++ b/src/views/AgentGroupCount.js @@ -0,0 +1,167 @@ +import React, {useContext, useEffect} from 'react'; +import { Row, Col, Typography, Space, DatePicker, Button, Select, Table, Divider } from 'antd'; +import { + SearchOutlined, +} from '@ant-design/icons'; +import { stores_Context } from '../config' +import * as config from "../config"; +import { observer } from 'mobx-react'; +import 'moment/locale/zh-cn'; +import moment from "moment"; +import zhCNlocale from 'antd/es/date-picker/locale/zh_CN'; +import { utils, writeFileXLSX } from "xlsx"; + +const AgentGroupCount = () => { + + const {customerServicesStore} = useContext(stores_Context); + const agentList = customerServicesStore.agentList; + const agentGroupList = customerServicesStore.agentGroupList; + const agentGroupListColumns = customerServicesStore.agentGroupListColumns; + const {startDate, endDate, dateType, inProgress} = customerServicesStore; + + useEffect(() => { + customerServicesStore.fetchAllAgent(); + }, []); + + const handleSearchClick = () => { + customerServicesStore.fetchAgentGroupCount(); + } + + const renderAgentItem = (agent) => { + return ( + + {agent.VEI2_CompanyBN} + + ); + } + + return ( + <> + + + + + + + + + + + + + + + + { customerServicesStore.selectDateRange(dates[0], dates[1]) }} + ranges={{ + '本周': [moment().startOf('week'), moment().endOf('week')], + '上周': [moment().startOf('week').subtract(7, 'days'), moment().endOf('week').subtract(7, 'days')], + '本月': [moment().startOf('month'), moment().endOf('month')], + '上个月': [moment().subtract(1, 'months').startOf('month'), moment(new Date()).subtract(1, 'months').endOf('month')], + '近30天': [moment().subtract(30, 'days'), moment()], + '近三个月': [moment().subtract(2, 'month').startOf('month'), moment().endOf('month')], + '今年': [moment().startOf('year').subtract(1, 'month'), moment().endOf('year').subtract(1, 'month')], + '去年': [moment().subtract(1, 'year').startOf('year').subtract(1, 'month'), moment().subtract(1, 'year').endOf('year').subtract(1, 'month')], + }} + /> + + + + + + + + 地接社团信息 + record.key} + loading={inProgress} + pagination={false} + scroll={{ x: "100%" }} + /> + + { + const wb = utils.table_to_book(document.getElementById("agentGroupList").getElementsByTagName("table")[0]); + writeFileXLSX(wb, "地接社团信息.xlsx"); + }}> + 导出excel + + + + + + + ); +} + +export default observer(AgentGroupCount); \ No newline at end of file diff --git a/src/views/GroupList.js b/src/views/AgentGroupList.js similarity index 52% rename from src/views/GroupList.js rename to src/views/AgentGroupList.js index beaf307..c1ad2c4 100644 --- a/src/views/GroupList.js +++ b/src/views/AgentGroupList.js @@ -1,5 +1,5 @@ import React, {useContext, useEffect} from 'react'; -import {Row, Col, Typography, Space, DatePicker, Button, Select, Table} from 'antd'; +import {Row, Col, Typography, Space, DatePicker, Button, Select, Table, List} from 'antd'; import { SearchOutlined, } from '@ant-design/icons'; @@ -11,7 +11,7 @@ import 'moment/locale/zh-cn'; import moment from "moment"; import zhCNlocale from 'antd/es/date-picker/locale/zh_CN'; -const GroupList = () => { +const AgentGroupList = () => { const {agentId} = useParams(); const { customerServicesStore } = useContext(stores_Context); @@ -28,8 +28,35 @@ const GroupList = () => { <> - - 返回 + + 返回 + + +
record.key} loading={inProgress} pagination={false} scroll={{ x: "100%" }} /> + {customerServicesStore.agentCompany} +
record.key} + loading={inProgress} + pagination={false} + scroll={{ x: "100%" }} + expandable={{ + expandedRowRender: (record) => ( + + + + + + + + + + ), + }} + /> @@ -83,4 +139,4 @@ const GroupList = () => { ); } -export default observer(GroupList); +export default observer(AgentGroupList); diff --git a/src/views/AgentList.js b/src/views/AgentList.js deleted file mode 100644 index 70d26da..0000000 --- a/src/views/AgentList.js +++ /dev/null @@ -1,87 +0,0 @@ -import React, {useContext} from 'react'; -import { Row, Col, Typography, Space, DatePicker, Button, Select, Table } from 'antd'; -import { - SearchOutlined, -} from '@ant-design/icons'; -import { stores_Context } from '../config' -import * as config from "../config"; -import { observer } from 'mobx-react'; -import 'moment/locale/zh-cn'; -import moment from "moment"; -import zhCNlocale from 'antd/es/date-picker/locale/zh_CN'; - -const AgentList = () => { - - const {customerServicesStore} = useContext(stores_Context); - const agentList = customerServicesStore.agentList; - const agentListColumns = customerServicesStore.agentListColumns; - const {startDate, endDate, dateType, inProgress} = customerServicesStore; - - const handleSearchClick = () => { - customerServicesStore.fetchAgentList(); - } - - return ( - <> - - - - - - - { customerServicesStore.selectDateRange(dates[0], dates[1]) }} - ranges={{ - '本周': [moment().startOf('week'), moment().endOf('week')], - '上周': [moment().startOf('week').subtract(7, 'days'), moment().endOf('week').subtract(7, 'days')], - '本月': [moment().startOf('month'), moment().endOf('month')], - '上个月': [moment().subtract(1, 'months').startOf('month'), moment(new Date()).subtract(1, 'months').endOf('month')], - '近30天': [moment().subtract(30, 'days'), moment()], - '近三个月': [moment().subtract(2, 'month').startOf('month'), moment().endOf('month')], - '今年': [moment().startOf('year').subtract(1, 'month'), moment().endOf('year').subtract(1, 'month')], - '去年': [moment().subtract(1, 'year').startOf('year').subtract(1, 'month'), moment().subtract(1, 'year').endOf('year').subtract(1, 'month')], - }} - /> - - - - - - - - 地接社团信息 -
record.key} - loading={inProgress} - pagination={false} - scroll={{ x: "100%" }} - /> - - - - - ); -} - -export default observer(AgentList); \ No newline at end of file diff --git a/src/views/DestinationGroupCount.js b/src/views/DestinationGroupCount.js new file mode 100644 index 0000000..160c832 --- /dev/null +++ b/src/views/DestinationGroupCount.js @@ -0,0 +1,139 @@ +import React, {useContext, useEffect} from 'react'; +import { Row, Col, Typography, Space, DatePicker, Button, Select, Table, Divider } from 'antd'; +import { + SearchOutlined, +} from '@ant-design/icons'; +import { stores_Context } from '../config' +import * as config from "../config"; +import { observer } from 'mobx-react'; +import 'moment/locale/zh-cn'; +import moment from "moment"; +import zhCNlocale from 'antd/es/date-picker/locale/zh_CN'; +import { utils, writeFileXLSX } from "xlsx"; + +const DestinationGroupCount = () => { + + const {customerServicesStore} = useContext(stores_Context); + const destinationGroupCount = customerServicesStore.destinationGroupCount; + const destinationGroupCountColumns = customerServicesStore.destinationGroupCountColumns; + const {startDate, endDate, dateType, inProgress} = customerServicesStore; + + useEffect(() => { + customerServicesStore.selectCountry('china'); + }, []); + + const handleSearchClick = () => { + customerServicesStore.fetchDestinationGroupCount(); + } + + return ( + <> + + + + + + + + + + + + + { customerServicesStore.selectDateRange(dates[0], dates[1]) }} + ranges={{ + '本周': [moment().startOf('week'), moment().endOf('week')], + '上周': [moment().startOf('week').subtract(7, 'days'), moment().endOf('week').subtract(7, 'days')], + '本月': [moment().startOf('month'), moment().endOf('month')], + '上个月': [moment().subtract(1, 'months').startOf('month'), moment(new Date()).subtract(1, 'months').endOf('month')], + '近30天': [moment().subtract(30, 'days'), moment()], + '近三个月': [moment().subtract(2, 'month').startOf('month'), moment().endOf('month')], + '今年': [moment().startOf('year').subtract(1, 'month'), moment().endOf('year').subtract(1, 'month')], + '去年': [moment().subtract(1, 'year').startOf('year').subtract(1, 'month'), moment().subtract(1, 'year').endOf('year').subtract(1, 'month')], + }} + /> + + + + + + + + 目的地团信息 +
record.key} + loading={inProgress} + pagination={false} + scroll={{ x: "100%" }} + /> + + { + const wb = utils.table_to_book(document.getElementById("destinationGroupCount").getElementsByTagName("table")[0]); + writeFileXLSX(wb, "目的地团信息.xlsx"); + }}> + 导出excel + + + + + + + ); +} + +export default observer(DestinationGroupCount); \ No newline at end of file diff --git a/src/views/DestinationGroupList.js b/src/views/DestinationGroupList.js new file mode 100644 index 0000000..2077b78 --- /dev/null +++ b/src/views/DestinationGroupList.js @@ -0,0 +1,141 @@ +import React, {useContext, useEffect} from 'react'; +import {Row, Col, Typography, Space, DatePicker, Button, Select, Table, List} from 'antd'; +import { + SearchOutlined, +} from '@ant-design/icons'; +import {stores_Context} from '../config' +import * as config from "../config"; +import {observer} from 'mobx-react'; +import { NavLink, useParams } from "react-router-dom"; +import 'moment/locale/zh-cn'; +import moment from "moment"; +import zhCNlocale from 'antd/es/date-picker/locale/zh_CN'; + +const DestinationGroupList = () => { + + const {destinationId} = useParams(); + const { customerServicesStore } = useContext(stores_Context); + + useEffect(() => { + customerServicesStore.fetchGroupListByDestinationId(destinationId); + }, []); + + const destinationGroupList = customerServicesStore.destinationGroupList; + const destinationGroupListColumns = customerServicesStore.destinationGroupListColumns; + const {startDate, endDate, dateType, inProgress} = customerServicesStore; + + return ( + <> + + + + 返回 + + + + + + + + + {customerServicesStore.selectDateRange(dates[0], dates[1])}} + ranges={{ + '本周': [moment().startOf('week'), moment().endOf('week')], + '上周': [moment().startOf('week').subtract(7, 'days'), moment().endOf('week').subtract(7, 'days')], + '本月': [moment().startOf('month'), moment().endOf('month')], + '上个月': [moment().subtract(1, 'months').startOf('month'), moment(new Date()).subtract(1, 'months').endOf('month')], + '近30天': [moment().subtract(30, 'days'), moment()], + '近三个月': [moment().subtract(2, 'month').startOf('month'), moment().endOf('month')], + '今年': [moment().startOf('year').subtract(1, 'month'), moment().endOf('year').subtract(1, 'month')], + '去年': [moment().subtract(1, 'year').startOf('year').subtract(1, 'month'), moment().subtract(1, 'year').endOf('year').subtract(1, 'month')], + }} + /> + + + + + + + +
record.key} + loading={inProgress} + pagination={false} + scroll={{ x: "100%" }} + expandable={{ + expandedRowRender: (record) => ( + + + + + + + + + + ), + }} + /> + + + + + ); +} + +export default observer(DestinationGroupList);