perf: 老客户-分析: 排序

This reverts commit 16b08311fa.

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "haina-dashboard",
-  "version": "2.10.0",
+  "version": "2.11.12",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "haina-dashboard",
-      "version": "2.10.0",
+      "version": "2.11.12",
       "dependencies": {
         "@ant-design/charts": "^1.4.2",
         "@ant-design/pro-components": "^2.6.16",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "haina-dashboard",
-  "version": "2.10.0",
+  "version": "2.11.12",
   "private": true,
   "dependencies": {
     "@ant-design/charts": "^1.4.2",

src/App.jsx

@@ -27,6 +27,7 @@ import ProtectedRoute from './views/ProtectedRoute';
 import Customer_care_inchina from './charts/Customer_care_inchina';
 import Customer_care_potential from './charts/Customer_care_potential';
 import Customer_care_regular from './charts/Customer_care_regular';
+import Customer_care_regular_pivot from './charts/Customer_care_regular_pivot';
 import Wechat_session from './charts/Wechat_session';
 import WhatsApp_session from './charts/WhatsApp_session';
 import AgentGroupCount from './views/AgentGroupCount';
@@ -48,15 +49,15 @@ import DataPivot from './views/DataPivot';
 import Welcome from './views/Welcome';
 import Meeting2024GH from './views/Meeting2024-GH';
 import Meeting2025GH from './views/Meeting2025-GH';
-import SalesCustomerCareRegular from './views/SalesCustomerCareRegular';
 import { stores_Context, APP_VERSION } from './config';
 import { WaterMark } from '@ant-design/pro-components';
 import CooperationIcon from './components/icons/CooperationIcon';
-import OPDashboard from './views/OPDashboard';
-import OPActivity from './views/OPActivity';
-import OPRisk from './views/OPRisk';
+import OPDashboard from './views/sales-crm/Dashboard';
+import OPProcess from './views/sales-crm/Process';
+import OPRisk from './views/sales-crm/Risk';
 import Cruise from './views/Cruise';
 import Hotel from './views/Hotel';
+import HostCaseCount from './views/HostCaseCount';
 
 const App = () => {
   const { Content, Footer, Sider, } = Layout;
@@ -127,7 +128,7 @@ const App = () => {
           key: 32,
           label: <NavLink to="/customer_care_regular">老客户</NavLink>,
         },
-        { key: 'customer_care_regular_sales', label: <NavLink to="/customer_care_regular_sales">销售-老客户</NavLink> },
+        { key: 'customer_care_regular_pivot', label: <NavLink to="/customer_care_regular_pivot">老客户-分析</NavLink> },
         {
           key: 33,
           label: <NavLink to="/customer_care_inchina">在华客户</NavLink>,
@@ -162,6 +163,7 @@ const App = () => {
         },
         { key: 'cruise', label: <NavLink to="/cruise">三峡游船</NavLink> },
         { key: 'hotel', label: <NavLink to="/hotel">酒店</NavLink> },
+        { key: 'hostcase', label: <NavLink to="/hostcase/count">东道主项目</NavLink> },
       ],
     },
     {
@@ -170,8 +172,8 @@ const App = () => {
       icon: <WhatsAppOutlined />,
       children: [
         // { key: 'xx', type: 'divider' },
-        { key: 'op_dashboard', label: <NavLink to="/op_dashboard">结果</NavLink> },
-        // { key: 'op_activity', label: <NavLink to="/op_activity">过程</NavLink> },
+        { key: 'op_dashboard', label: <NavLink to="/sales-crm/dashboard">结果</NavLink> },
+        { key: 'op_process', label: <NavLink to="/sales-crm/process">过程</NavLink> },
         // { key: 'op_risk', label: <NavLink to="/op_risk">提升</NavLink> },
       ],
     },
@@ -255,7 +257,7 @@ const App = () => {
                   <Route element={<ProtectedRoute auth={['admin', 'director_bu', 'customer_care']} />}>
                     <Route path="/customer_care_inchina" element={<Customer_care_inchina />} />
                     <Route path="/customer_care_regular" element={<Customer_care_regular />} />
-                    <Route path="/customer_care_regular_sales" element={<SalesCustomerCareRegular />} />
+                    <Route path="/customer_care_regular_pivot" element={<Customer_care_regular_pivot />} />
                     <Route path="/customer_care_potential" element={<Customer_care_potential />} />
                     <Route path="/whatsapp_session" element={<WhatsApp_session />} />
                     <Route path="/wechat_session" element={<Wechat_session />} />
@@ -265,6 +267,7 @@ const App = () => {
                     <Route path="/destination/:destinationId/group/list" element={<DestinationGroupList />} />
                     <Route path="/cruise" element={<Cruise />} />
                     <Route path="/hotel" element={<Hotel />} />
+                    <Route path="/hostcase/count" element={<HostCaseCount />} />
                     </Route>
                   <Route element={<ProtectedRoute auth={['admin', 'director_bu', 'financial']} />}>
                     <Route path="/credit_card_bill" element={<Credit_card_bill />} />
@@ -277,9 +280,10 @@ const App = () => {
                     <Route path="/sale_kpi" element={<Sale_KPI />} />
                     <Route path="/distribution" element={<Distribution />} />
                     <Route path="/:page/pivot" element={<DataPivot />} />
-                    <Route path="/op_dashboard" element={<OPDashboard />} />
-                    <Route path="/op_activity" element={<OPActivity />} />
-                    <Route path="/op_risk" element={<OPRisk />} />
+                    <Route path="/sales-crm/dashboard" element={<OPDashboard />} />
+                    <Route path="/sales-crm/process" element={<OPProcess />} />
+                    <Route path="/sales-crm/risk" element={<OPRisk />} />
+                    <Route path="/sales-crm/risk/sales/:opisn" element={<OPRisk />} />
                   </Route>
                 </Routes>
               </Content>

src/charts/Customer_care_regular.jsx

@@ -1,16 +1,209 @@
-import React, { useContext, useEffect } from 'react';
+import React, { useContext, useState } from 'react';
 import { Row, Col, Divider, Table, Tooltip } from 'antd';
 import { InfoCircleOutlined } from '@ant-design/icons';
 import { utils, writeFileXLSX } from 'xlsx';
 import { stores_Context } from '../config';
 import { observer } from 'mobx-react';
 import SearchForm from './../components/search/SearchForm';
+import LineWithAvg from '../components/LineWithAvg';
+import { flow } from 'mobx';
+import { TableExportBtn } from '../components/Data';
 
 const Customer_care_regular = () => {
   const { orders_store, date_picker_store, customer_store } = useContext(stores_Context);
   const regular_data = customer_store.regular_data;
 
-  useEffect(() => {}, []);
+  // useEffect(() => {}, []);
+
+  const columns = [
+    {
+      title: '订单号',
+      dataIndex: 'COLI_ID',
+      key: 'COLI_ID',
+    },
+    {
+      title: '预定日期',
+      dataIndex: 'COLI_ApplyDate',
+      key: 'COLI_ApplyDate',
+    },
+    {
+      title: '订单状态',
+      width: '4rem',
+      dataIndex: 'OrderState1',
+      key: 'OrderState1',
+      render: (text, record) => record.OrderState === 1 ? '成行' : '未成行',
+      sorter: (a, b) => b.OrderState - a.OrderState,
+    },
+    {
+      title: '毛利',
+      dataIndex: 'ML',
+      key: 'ML',
+    },
+    {
+      title: '人数',
+      dataIndex: 'PersonNum',
+      key: 'PersonNum',
+    },
+    {
+      title: '天数',
+      dataIndex: 'COLI_Days',
+      key: 'COLI_Days',
+    },
+    {
+      title: '人天数',
+      dataIndex: 'CGI_PersonDays',
+      key: 'CGI_PersonDays',
+    },
+    {
+      title: '走团日期',
+      dataIndex: 'COLI_OrderStartDate',
+      key: 'COLI_OrderStartDate',
+    },
+    {
+      title: '走团国家',
+      dataIndex: 'recommend_country',
+      key: 'recommend_country',
+      width: '4em',
+    },
+    {
+      title: '小组',
+      dataIndex: 'Department',
+      key: 'Department',
+    },
+    {
+      title: '老客户',
+      dataIndex: 'COLI_IsOld',
+      key: 'COLI_IsOld',
+    },
+    {
+      title: '老客户推荐',
+      dataIndex: 'COLI_IsCusCommend',
+      key: 'COLI_IsCusCommend',
+    },
+    {
+      title: '国籍',
+      dataIndex: 'MEI_Country',
+      key: 'MEI_Country',
+    },
+    {
+      title: '网站',
+      dataIndex: 'COLI_WebCode',
+      key: 'COLI_WebCode',
+    },
+    {
+      title: '来源',
+      dataIndex: 'SourceType',
+      key: 'SourceType',
+    },
+    {
+      title: '页面类型',
+      dataIndex: 'COLI_LineClass',
+      key: 'COLI_LineClass',
+    },
+    {
+      title: '券额',
+      dataIndex: 'Voucher_amount',
+      key: 'Voucher_amount',
+      width: '4em',
+    },
+    {
+      title: '券类别',
+      dataIndex: 'Voucher_type',
+      key: 'Voucher_type',
+      width: '5em',
+    },
+    {
+      title: '上次 订单号',
+      dataIndex: 'coli_id_Last',
+      key: 'coli_id_Last',
+      width: '5em',
+      onCell: (r) => ({
+        style: { backgroundColor: '#5B8FF9' + '1A' },
+      }),
+    },
+    {
+      title: '上次 走团日期',
+      dataIndex: 'COLI_OrderStartDate_Last',
+      key: 'COLI_OrderStartDate_Last',
+      width: '4em',
+      onCell: (_, r) => ({
+        style: { backgroundColor: '#5B8FF9' + '1A' } ,
+      }),
+    },
+    {
+      title: '上次 小组',
+      dataIndex: 'Department_Last',
+      key: 'Department_Last',
+      width: '4em',
+      onCell: (_, r) => ({
+        style: { backgroundColor: '#5B8FF9' + '1A' } ,
+      }),
+    },
+  ];
+  const export_columns = [].concat(columns, [
+    {
+      title: '上次经过国家',
+      dataIndex: 'last_country',
+      key: 'last_country',
+      onCell: (r) => ({
+        style: { backgroundColor: '#5B8FF9' + '1A' },
+      }),
+    },
+    {
+      title: '复购周期',
+      dataIndex: 'Repurchase_cycle',
+      key: 'Repurchase_cycle',
+      width: '4em',
+      onCell: (_, r) => ({
+        style: { backgroundColor: '#5B8FF9' + '1A' },
+      }),
+    },
+    {
+      title: '下单次数',
+      dataIndex: 'Orders_number',
+      key: 'Orders_number',
+      width: '4em',
+      onCell: (_, r) => ({
+        style: { backgroundColor: '#5B8FF9' + '1A' },
+      }),
+    },
+    {
+      title: '推荐次数',
+      dataIndex: 'recommend_time',
+      key: 'recommend_time',
+      width: '4em',
+      onCell: (_, r) => ({
+        style: { backgroundColor: '#5B8FF9' + '1A' },
+      }),
+    },
+    {
+      title: '历史成行次数',
+      dataIndex: 'Travel_count',
+      key: 'Travel_count',
+      width: '4em',
+      onCell: (_, r) => ({
+        style: { backgroundColor: '#5B8FF9' + '1A' },
+      }),
+    },
+    {
+      title: '旅行周期',
+      dataIndex: 'Travel_cycle',
+      key: 'Travel_cycle',
+      width: '4em',
+      onCell: (_, r) => ({
+        style: { backgroundColor: '#5B8FF9' + '1A' },
+      }),
+    },
+    {
+      title: '第1次走团日期',
+      dataIndex: 'firstStartdate',
+      key: 'firstStartdate',
+      width: '4em',
+      onCell: (_, r) => ({
+        style: { backgroundColor: '#5B8FF9' + '1A' },
+      }),
+    },
+  ]);
 
   return (
     <div>
@@ -26,13 +219,26 @@ const Customer_care_regular = () => {
               fieldProps: {
                 DepartmentList: { show_all: false, mode: 'multiple' },
                 WebCode: { show_all: false, mode: 'multiple' },
-                dates: { hide_vs: true },
+                years: { hide_vs: true },
               },
             }}
-            onSubmit={(_err, obj, form, str) => {
+            onSubmit={async (_err, obj, form, str) => {
               customer_store.setSearchValues(obj, form, 'regular_data');
-              customer_store.regular_customer_order();
-              customer_store.regular_customer_order(true);
+              regular_data.data_compare=[];
+              if (obj.DateDiff1 && obj.DateDiff2){
+                regular_data.isCompareLine=true;
+                regular_data.showCompareSum=true;
+                await customer_store.regular_customer_order();
+                customer_store.regular_customer_order(false,true);
+                customer_store.regular_customer_order(true,false,true);
+                customer_store.regular_customer_order(true,true,true);
+              }
+              else{
+                regular_data.isCompareLine=false;
+                regular_data.showCompareSum=false;
+                customer_store.regular_customer_order();
+                customer_store.regular_customer_order(true);
+              }
             }}
           />
         </Col>
@@ -66,11 +272,17 @@ const Customer_care_regular = () => {
                   <>
                     <span>{text}</span>&nbsp;&nbsp;
                     {<Tooltip key='total_data_tips' title={regular_data.total_data_tips}>
-                      {index === 0 && regular_data.total_data_tips!=='' && <InfoCircleOutlined />}
+                      {index === 0 && regular_data.total_data_tips!=='' && <InfoCircleOutlined className='ant-tag-gold' />}
                     </Tooltip>}
                   </>
                 ),
               },
+              {
+                title: '订单数占比',
+                dataIndex: 'OrderRate',
+                key: 'OrderRate',
+                render: (text) => typeof text === 'number'?<span>{parseFloat((text * 100).toFixed(2))}%</span>:text,
+              },
               {
                 title: '成行数',
                 dataIndex: 'SUCOrderNum',
@@ -80,13 +292,19 @@ const Customer_care_regular = () => {
                 title: '成行率',
                 dataIndex: 'SUCRate',
                 key: 'SUCRate',
-                render: (text, record) => <span>{Math.round(text * 100)}%</span>,
+                render: (text) => typeof text === 'number'?<span>{Math.round(text * 100)}%</span>:text,
               },
               {
                 title: '毛利',
                 dataIndex: 'ML',
                 key: 'ML',
               },
+              {
+                title: '毛利占比',
+                dataIndex: 'OrderMLRate',
+                key: 'OrderMLRate',
+                render: (text) => typeof text === 'number'?<span>{parseFloat((text * 100).toFixed(2))}%</span>:text,
+              },
               {
                 title: '人数（含成人+儿童）',
                 dataIndex: 'PersonNum',
@@ -98,6 +316,13 @@ const Customer_care_regular = () => {
             rowKey={(record) => record.ItemName}
           />
         </Col>
+
+        <Col span={24}>
+          <LineWithAvg dataSource={regular_data.pivotData} loading={regular_data.detail_loading} xField={regular_data.pivotX} yField={regular_data.pivotY}
+          seriesField='_ylabel' showCompareSum={regular_data.showCompareSum} solidLineTime={regular_data.solidLineTime} solidLineCompareTime={regular_data.solidLineCompareTime}
+          solidLineDash={regular_data.solidLineDash} isCompareLine={regular_data.isCompareLine}/>
+        </Col>
+
         <Col span={24}>
           <Divider orientation="right" plain>
             <a
@@ -106,89 +331,17 @@ const Customer_care_regular = () => {
                 writeFileXLSX(wb, '老客户.xlsx');
               }}
             >
-              导出excel
+              导出下表
             </a>
+            <TableExportBtn btnTxt='导出详情' label={'老客户-详情'} columns={export_columns} dataSource={regular_data.data_detail} style={{ marginLeft: '10px' }} />
           </Divider>
           <Table
             id="table_to_xlsx"
             pagination={false}
-            loading={regular_data.loading}
+            loading={regular_data.detail_loading}
             dataSource={regular_data.data_detail}
             scroll={{ x: 1200 }}
-            columns={[
-              {
-                title: '订单号',
-                dataIndex: 'COLI_ID',
-                key: 'COLI_ID',
-              },
-              {
-                title: '预定日期',
-                dataIndex: 'COLI_ApplyDate',
-                key: 'COLI_ApplyDate',
-              },
-              {
-                title: '订单状态',
-                dataIndex: 'OrderState',
-                key: 'OrderState',
-                render: (text, record) => <span>{text == 1 ? '成行' : '未成行'}</span>,
-                sorter: (a, b) => b.OrderState - a.OrderState,
-              },
-              {
-                title: '毛利',
-                dataIndex: 'ML',
-                key: 'ML',
-              },
-              {
-                title: '人数',
-                dataIndex: 'PersonNum',
-                key: 'PersonNum',
-              },
-              {
-                title: '天数',
-                dataIndex: 'COLI_Days',
-                key: 'COLI_Days',
-              },
-              {
-                title: '人天数',
-                dataIndex: 'CGI_PersonDays',
-                key: 'CGI_PersonDays',
-              },
-              {
-                title: '走团日期',
-                dataIndex: 'COLI_OrderStartDate',
-                key: 'COLI_OrderStartDate',
-              },
-              {
-                title: '小组',
-                dataIndex: 'Department',
-                key: 'Department',
-              },
-              {
-                title: '老客户',
-                dataIndex: 'COLI_IsOld',
-                key: 'COLI_IsOld',
-              },
-              {
-                title: '老客户推荐',
-                dataIndex: 'COLI_IsCusCommend',
-                key: 'COLI_IsCusCommend',
-              },
-              {
-                title: '网站',
-                dataIndex: 'COLI_WebCode',
-                key: 'COLI_WebCode',
-              },
-              {
-                title: '来源',
-                dataIndex: 'SourceType',
-                key: 'SourceType',
-              },
-              {
-                title: '页面类型',
-                dataIndex: 'COLI_LineClass',
-                key: 'COLI_LineClass',
-              },
-            ]}
+            columns={columns}
             size="small"
             rowKey={(record) => record.COLI_ID}
           />

src/charts/Customer_care_regular_pivot.jsx

@@ -0,0 +1,231 @@
+import { useContext, useEffect, useState } from 'react';
+import { observer } from 'mobx-react';
+import { stores_Context } from '../config';
+import { Table, Row, Col, Divider, Switch, Space, Tabs } from 'antd';
+import SearchForm from '../components/search/SearchForm';
+import { TableExportBtn, VSTag } from '../components/Data';
+import { fixTo2Decimals, isEmpty } from '../utils/commons';
+
+// 注意TdCell要提到DataTable作用域外声明
+const TdCell = (tdprops) => {
+  // onMouseEnter, onMouseLeave在数据量多的时候，会严重阻塞表格单元格渲染，严重影响性能
+  const { onMouseEnter, onMouseLeave, ...restProps } = tdprops;
+  return <td {...restProps} />;
+};
+
+const pivotOptions = [
+  { key: 'operatorName', label: '顾问' },
+  { key: 'country', label: '国籍' },
+];
+const pivotColOptions = [
+  { key: 'hasOld', value: 'hasOld', label: '老客户+推荐' },
+  { key: 'IsOld_txt', value: 'IsOld_txt', label: '老客户' },
+  { key: 'isCusCommend_txt', value: 'isCusCommend_txt', label: '推荐' },
+];
+const CustomerCareRegularPivot = (props) => {
+  const { date_picker_store: searchFormStore, customer_store } = useContext(stores_Context);
+  const { formValues, formValuesToSub, siderBroken } = searchFormStore;
+  const { loading, pivotResult, filterColValues, rawData } = customer_store.sales_regular_data;
+
+  const [pivotRow, setPivotRow] = useState('operatorName');
+  const [pivotCol, setPivotCol] = useState('hasOld');
+  const [pivotColLabel, setPivotColLabel] = useState('老客户+推荐');
+
+  const onTabsChange = (key) => {
+    setPivotRow(key);
+    customer_store.regular_data_pivot(key, pivotCol);
+  };
+
+  const [dataSource, setDataSource] = useState([]);
+  const [ifmerge, setIfmerge] = useState(false);
+  const [dataForExport, setDataForExport] = useState([]);
+  const [dataForExportS, setDataForExportS] = useState([]);
+
+  useEffect(() => {
+    if ( ! ifmerge) {
+      // setDataSource(pageData[pivotRow].data);
+      setDataSource(pivotResult);
+      // setDataForExport(
+      //   // pageData[pivotRow].data.reduce(
+      //   pivotResult.reduce(
+      //     (r, c) =>
+      //       r.concat(
+      //         [{ ...c, children: undefined }],
+      //         (c?.children || [])
+      //           .reduce((rc, ele) => rc.concat([{ ...ele, [pivotRow]: ele.rowLabel }], [{ ...ele.vsData, [pivotRow]: ele.vsData.rowLabel, vsData: {} }]), [])
+      //           .filter((ele) => ele.SumOrder !== undefined)
+      //       ),
+      //     []
+      //   )
+      // );
+      setDataForExportS(pivotResult.reduce((r, c) => r.concat([{...c, children: undefined}], [{ ...c.vsData, vsData: {} }]), []).filter((ele) => ele.SumOrder !== undefined));
+    } else {
+      // setDataSource(pageData[pivotRow].mergedData);
+      // setDataForExport(
+      //   pageData[pivotRow].mergedData.reduce(
+      //     (r, c) =>
+      //       r.concat(
+      //         [{ ...c, children: undefined }],
+      //         c.children.reduce((rc, ele) => rc.concat([{ ...ele, operatorName: ele.rowLabel }], [{ ...ele.vsData, operatorName: ele.vsData.rowLabel, vsData: {} }]), [])
+      //         .filter((ele) => ele.SumOrder !== undefined)
+      //       ),
+      //     []
+      //   )
+      // );
+      // setDataForExportS(pageData[pivotRow].mergedData.reduce((r, c) => r.concat([{...c, children: undefined}], [{ ...c.vsData, vsData: {} }]), []).filter((ele) => ele.SumOrder !== undefined));
+    }
+
+    return () => {};
+  }, [ifmerge, pivotResult]);
+
+
+  const rowColumns = [
+    { title: '日期区间', dataIndex: 'seriesKey', key: 'seriesKey' },
+    { title: '顾问', dataIndex: 'operatorName', key: 'operatorName' },
+    { title: '订单号', dataIndex: 'o_id', key: 'o_id' },
+    { title: '预定日期', dataIndex: 'applyDate', key: 'applyDate' },
+    { title: '订单状态', key: 'orderState', render: (_, r) => r.orderState === '1' ? '成行' : '', },
+    { title: '毛利', dataIndex: 'ML', key: 'ML' },
+    { title: '人数', dataIndex: 'personNum', key: 'personNum' },
+    { title: '天数', dataIndex: 'tourdays', key: 'tourdays' },
+    // { title: '人天数', dataIndex: 'CGI_PersonDays', key: 'CGI_PersonDays' },
+    // { title: '走团日期', dataIndex: 'COLI_OrderStartDate', key: 'COLI_OrderStartDate' },
+    { title: '小组', dataIndex: 'dept', key: 'dept' },
+    { title: '老客户', key: 'IsOld', render: (_, r) => r.IsOld === '1' ? '是' : '' },
+    { title: '老客户推荐', key: 'IsCusCommend', render: (_, r) => r.isCusCommend === '1' ? '是' : '' },
+    { title: '网站', dataIndex: 'WebCode', key: 'WebCode' },
+    { title: '来源', dataIndex: 'SourceType', key: 'SourceType' },
+    { title: '页面类型', dataIndex: 'COLI_LineClass', key: 'COLI_LineClass' },
+  ];
+  const calcDelta = (r, key) => !isEmpty(Number(r?.vsData?.[key])) ? fixTo2Decimals((Number(r[key] || 0) - Number(r.vsData[key]))/Number(r.vsData[key]) *100) : null;
+  const renderVS = (v, r, key) => {
+    const delta = calcDelta(r, key);
+    return <>
+      <Space direction={'vertical'}>
+        <span>
+          {v || 0}
+          {r?.vsData?.[key] ? <span type="secondary"> VS {r.vsData[key]}</span> : null}
+        </span>
+        {delta && <VSTag diffPercent={delta} />}
+      </Space>
+    </>;
+  };
+  const columns = [
+    { key: 'SumOrder', title: '订单数', dataIndex: 'SumOrder', width: '5em', render: (v, r) => renderVS(v, r, 'SumOrder') },
+    { key: 'ConfirmOrder', title: '成交数', dataIndex: 'ConfirmOrder', width: '5em', render: (v, r) => renderVS(v, r, 'ConfirmOrder') },
+    { key: 'ConfirmPersonNum', title: '✔人数(SUM)', dataIndex: 'ConfirmPersonNum', width: '5em', render: (v, r) => renderVS(v, r, 'ConfirmPersonNum')  },
+    { key: 'confirmTourdays', title: '✔团天数(AVG)', dataIndex: 'confirmTourdays', width: '5em', render: (v, r) => renderVS(v, r, 'confirmTourdays')  },
+    { key: 'SumML', title: '预计毛利', dataIndex: 'SumML', width: '5em', render: (v, r) => renderVS(v, r, 'SumML')  }, // SumML_txt
+    { key: 'ConfirmRates', title: '成交率', dataIndex: 'ConfirmRates_txt', width: '5em', render: (v, r) => renderVS(v, r, 'ConfirmRates')  },
+    { key: 'SingleML', title: '单团毛利', dataIndex: 'SingleML', width: '5em', render: (v, r) => renderVS(v, r, 'SingleML')  },
+  ].map(c => ({...c, sorter: (a, b) => (a[c.key] - b[c.key])}));
+  return (
+    <>
+      <Row gutter={16} className={siderBroken ? '' : 'sticky-top'}>
+        <Col className="gutter-row" span={24}>
+          <SearchForm
+            defaultValue={{
+              initialValue: {
+                ...formValues,
+                ...customer_store.sales_regular_data.searchValues,
+              },
+              shows: ['DateType', 'DepartmentList', 'WebCode', 'dates', 'IncludeTickets'],
+              fieldProps: {
+                DepartmentList: { show_all: false, mode: 'multiple' },
+                WebCode: { show_all: false, mode: 'multiple' },
+                dates: { hide_vs: false },
+              },
+            }}
+            onSubmit={async (_err, obj, form, str) => {
+              customer_store.setSearchValues(obj, form, 'sales_regular_data');
+              await customer_store.get_sales_regular_data_vs(obj, pivotRow);
+              customer_store.regular_data_pivot(pivotRow, pivotCol);
+            }}
+          />
+        </Col>
+      </Row>
+      <Tabs tabBarExtraContent={{ left: (<div style={{ width: '6rem'}}></div>)}}
+        type={'card'}
+        activeKey={pivotRow}
+        onChange={onTabsChange}
+        items={pivotOptions.map((ele) => {
+          return {
+            ...ele,
+            children: (
+              <>
+                {/* <h2>{ele.label}-老客户, 含推荐</h2> */}
+                <>
+                  <Divider orientation={'right'} style={{backgroundColor: '#fff', margin: 0, padding: '10px 0'}} >
+                  {/* {dataSource.length > 0 && pivotRow === 'operatorName' && (
+                    <Switch
+                      unCheckedChildren="各账户"
+                      checkedChildren="合并"
+                      key={'openOrMerge'}
+                      checked={ifmerge}
+                      onChange={(e) => {
+                        setIfmerge(e);
+                      }}
+                    />
+                  )}
+                  <Divider type={'vertical'} /> */}
+                  <TableExportBtn
+                    btnTxt="导出明细"
+                    label={`${formValuesToSub.Date1}-老客户-明细`}
+                    {...{ columns: [{ title: ele.label, dataIndex: pivotRow, key: pivotRow }, ...rowColumns], dataSource: rawData }}
+                  />
+                  {/* <Divider type={'vertical'} />
+                  <TableExportBtn
+                    btnTxt="导出下表-展开"
+                    label={`${formValuesToSub.Date1}-${ele.label}.老客户`}
+                    {...{ columns: [{ title: ele.label, dataIndex: pivotRow, key: pivotRow }, ...columns], dataSource: dataForExport }}
+                  /> */}
+                  <Divider type={'vertical'} />
+                  <TableExportBtn
+                    btnTxt="导出下表"
+                    label={`${formValuesToSub.Date1}-${ele.label}.${pivotColLabel}`}
+                    {...{ columns: [{ title: ele.label, dataIndex: pivotRow, key: pivotRow }, ...columns], dataSource: dataForExportS }}
+                  />
+                  </Divider>
+                </>
+                <Tabs style={{ backgroundColor: '#fff' }}
+                  tabPosition={'left'} defaultActiveKey={'mix'} activeKey={pivotCol}
+                  onChange={(sub) => {
+                    setPivotCol(sub);
+                    setPivotColLabel(pivotColOptions.find((ele) => ele.key === sub).label);
+                    customer_store.regular_data_pivot(pivotRow, sub);
+                  }}
+                  items={pivotColOptions.map((col, i) => {
+                    // const SubjectTableComponent = subjectComponents[ele.key];
+                    return {
+                      ...col,
+                      children: (
+                        <Table
+                          sticky
+                          dataSource={dataSource}
+                          loading={loading}
+                          columns={[
+                            {
+                              key: ele.key,
+                              title: ele.label,
+                              dataIndex: ele.key,
+                              width: '6em',
+                              filters: filterColValues,
+                              onFilter: (value, record) => value.includes(record[ele.key]),
+                              filterSearch: true,
+                            },
+                            ...columns,
+                          ]}
+                          pagination={false}
+                        />)
+                    };
+                  })}
+                />
+              </>
+            ),
+          };
+        })}
+      />
+    </>
+  );
+};
+export default observer(CustomerCareRegularPivot);

src/components/Data.jsx

@@ -30,21 +30,25 @@ export const VSTag = (props) => {
 
 /**
  * 导出表格数据存为xlsx
+ * @property label 文件名字
+ * @property columns 表格列
+ * @property dataSource 表格数据
+ * @property btnTxt 按钮文字
  */
-export const TableExportBtn = (props) => {
-  const output_name = `${props.label}`;
+export const TableExportBtn = ({label, columns, dataSource, btnTxt, ...props}) => {
+  const output_name = `${label}`;
   const [columnsMap, setColumnsMap] = useState([]);
   const [summaryRow, setSummaryRow] = useState({});
   useEffect(() => {
-    const r1 = props.columns.reduce((r, v) => ({
+    const r1 = columns.reduce((r, v) => ({
       ...r,
       ...(v.children ? v.children.reduce((rc, vc, ci) => ({
         ...rc,
-        ...(vc?.titleX ? {[`${v?.titleX || v.title},${vc.titleX}`]: vc.titleX } : {[(v?.titleX || v.title) + (ci || '')]: `${vc?.titleX || vc?.title || ''}`}),
+        ...(vc?.titleX ? {[`${v?.titleX || v.title},${vc.titleX}`]: vc.titleX } : {[(v?.titleX || v.title) + (vc.key || ci || '')]: `${vc?.titleX || vc?.title || ''}`}),
       }), {}) : {})
     }), {});
-    const flatCols = props.columns.flatMap((v, k) =>
-      v.children ? v.children.map((vc, ci) => ({ ...vc, title: `${v?.titleX || v.title}` + (vc?.titleX ? `,${vc.titleX}` : (ci || '')) })) : {...v, title: `${v?.titleX || v.title}`}
+    const flatCols = columns.flatMap((v, k) =>
+      v.children ? v.children.map((vc, ci) => ({ ...vc, title: `${v?.titleX || v.title}` + (vc?.titleX ? `,${vc.titleX}` : (vc.key || ci || '')) })) : {...v, title: `${v?.titleX || v.title}`}
     );
       // .filter((c) => c.dataIndex)
       // !['string', 'number'].includes(typeof vc.title) ? `${v?.titleX || v.title}` : `${v?.titleX || v.title}-${vc.title || ''}`
@@ -56,20 +60,21 @@ export const TableExportBtn = (props) => {
     // console.log('summaryRow', r1);
 
     return () => {};
-  }, [props.columns]);
+  }, [columns]);
 
   const onExport = () => {
-    if (isEmpty(props.dataSource)) {
+    if (isEmpty(dataSource)) {
       message.warning('无结果.');
       return false;
     }
-    const data = props.dataSource.map((item) => {
+    const data = dataSource.map((item) => {
       const itemMapped = columnsMap.reduce((sv, kset) => {
+        const export_val = typeof kset?.dataExport === 'function' ? kset.dataExport('', item) : null;
         const render_val = typeof kset?.render === 'function' ? kset.render('', item) : null;
         const data_val = kset?.dataIndex ? (Array.isArray(kset.dataIndex) ? getNestedValue(item, kset.dataIndex) : item[kset.dataIndex]) : undefined;
         const x_val = item[`${kset.dataIndex}_X`];
         // const _title = kset.title.replace('-[object Object]', '');
-        const v = { [kset.title]: x_val || data_val || render_val };
+        const v = { [kset.title]: x_val || export_val || data_val || render_val };
         return { ...sv, ...v };
       }, {});
       return itemMapped;
@@ -88,7 +93,7 @@ export const TableExportBtn = (props) => {
       disabled={false}
       onClick={onExport}
     >
-      {props.btnTxt || '导出excel'}
+      {btnTxt || '导出excel'}
     </Button>
   );
 };

src/components/LineWithAvg.jsx

@@ -0,0 +1,240 @@
+import React, { useEffect, useState } from 'react';
+import { Row, Col, Spin } from 'antd';
+import { Line } from '@ant-design/plots';
+import { observer } from 'mobx-react';
+import { dataFieldAlias } from '../libs/ht';
+import DateGroupRadio from '../components/DateGroupRadio';
+import { cloneDeep, groupBy, sortBy } from '../utils/commons';
+
+export default observer((props) => {
+  const { dataSource: rawData, showAVG, showCompareSum, loading, solidLineTime, 
+    solidLineDash, isCompareLine,solidLineCompareTime, ...config } = props;
+  const { xField, yField, yFieldAlias, seriesField } = config;
+
+  const [dataBeforeXChange, setDataBeforeXChange] = useState([]);
+
+  const [dataSource, setDataSource] = useState([]);
+  const [sumSeries, setSumSeries] = useState([]);
+
+  const line_config = {
+    // data: dataSource,
+    padding: 'auto',
+    xField,
+    yField,
+    seriesField,
+    // seriesField: 'rowLabel',
+    // xAxis: {
+    //   type: 'timeCat',
+    // },
+    color: isCompareLine?['#17f485', '#1890ff','#17f485', '#1890ff',"#181414","#181414"]:undefined,
+    point: {
+      size: 4,
+      shape: "cicle",
+    },
+    lineStyle: (datum) => {
+        return {
+          stroke: isCompareLine?datum._ylabel.includes("总计")?"#181414":datum._ylabel.includes(solidLineDash) ? '#1890ff':'#17f485' : undefined, // 设置颜色
+          lineDash: isCompareLine?datum._ylabel.includes(solidLineTime) ? undefined:[4, 4] : undefined, // 设置虚线
+        };
+    },
+    yAxis: {
+      min: 0,
+      maxTickInterval: 5,
+    },
+    meta: {
+      ...cloneDeep(dataFieldAlias),
+    },
+    // smooth: true,
+    label: {}, // 显示标签
+    legend: {
+      position: 'right-top',
+      // title: {
+      //   text: '总合计 ' + dataSource.reduce((a, b) => a + b.SumOrder, 0),
+      // },
+      itemMarginBottom: 12, // 垂直间距
+    },
+    tooltip: {
+      customItems: (originalItems) => {
+        return originalItems
+          .map((ele) => ({ ...ele, valueR: ele.data[yField] }))
+          .sort(sortBy('valueR'))
+          .reverse();
+      },
+    },
+  };
+
+  const [lineConfig, setLineConfig] = useState(cloneDeep(line_config));
+
+  useEffect(() => {
+    resetX();
+
+    return () => {};
+  }, [rawData]);
+
+  useEffect(() => {
+    setLineConfig(cloneDeep(line_config));
+
+    return () => {};
+  }, [isCompareLine,solidLineTime]);
+
+  useEffect(() => {
+    if (lineChartX === 'day') {
+      setDataBeforeXChange(dataSource);
+    }
+
+    return () => {};
+  }, [dataSource]);
+
+  // 日月年切换
+  const [lineChartX, setLineChartX] = useState('day');
+  const orderCountDataMapper = { data1: 'data1', data2: undefined };
+  const orderCountDataFieldMapper = { 'dateKey': xField, 'valueKey': yField, 'seriesKey': seriesField, _f: 'sum' };
+  const resetX = () => {
+    setLineChartX('day');
+    setDataSource(rawData);
+    setDataBeforeXChange(rawData);
+    // 初始化`平均`线, `总计`线
+    const byDays = groupBy(rawData, xField);
+    const sumY = rawData.reduce((a, b) => a + b[yField], 0);
+    // const avgVal = Math.round(sumY / (Object.keys(byDays).length));
+    // const avgLine = [
+    //   { type: 'text', position: ['start', avgVal], content: avgVal, offsetX: -15, style: { fill: '#F4664A', textBaseline: 'bottom' } },
+    //   { type: 'line', start: [-10, avgVal], end: ['max', avgVal], style: { stroke: '#F4664A', lineDash: [2, 2] } },
+    // ];
+    // setLineConfig({ ...lineConfig, yField, xField, annotations: avgLine });
+    setLineConfig({ ...lineConfig, yField, xField,});
+    if (showCompareSum) {
+      const _sumLine = Object.keys(byDays).reduce((r, _d) => {
+        const summaryVal = byDays[_d].reduce((rows, row) => 
+          {
+            if (row[seriesField].includes(solidLineTime)){
+              return rows + row[yField];
+            }
+            else{
+              return rows;
+            }
+          }
+        , 0);
+        const summaryCompareVal = byDays[_d].reduce((rows, row) => 
+          {
+            if (row[seriesField].includes(solidLineCompareTime)){
+              return rows + row[yField];
+            }
+            else{
+              return rows;
+            }
+          }
+        , 0);
+        r.push({ ...byDays[_d][0], [yField]: summaryVal, [seriesField]: solidLineTime+'总计' });
+        r.push({ ...byDays[_d][0], [yField]: summaryCompareVal, [seriesField]: solidLineCompareTime+'总计' });
+        return r;
+      }, []);
+      setSumSeries(_sumLine);
+    }
+    else{
+      const _sumLine = Object.keys(byDays).reduce((r, _d) => {
+        const summaryVal = byDays[_d].reduce((rows, row) => rows + row[yField], 0);
+        r.push({ ...byDays[_d][0], [yField]: summaryVal, [seriesField]: '总计' });
+        return r;
+      }, []);
+      // console.log(_sumLine.map((ele) => ele[yField]));
+      setSumSeries(_sumLine);
+    }
+  };
+
+  const onChangeXDateFieldGroup = (value, data, avg1) => {
+    // console.log(value, data, avg1);
+    const _sumLine = [];
+    const { xField, yField, seriesField } = lineConfig;
+    const groupByDate = data.reduce((r, v) => {
+      (r[v[xField]] || (r[v[xField]] = [])).push(v);
+      return r;
+    }, {});
+    // console.log(groupByDate);
+    const _data = Object.keys(groupByDate).reduce((r, _d) => {
+      if (showCompareSum) {
+        const summaryVal = groupByDate[_d].reduce((rows, row) => 
+          {
+            if (row[seriesField].includes(solidLineTime)){
+              return rows + row[yField];
+            }
+            else{
+              return rows;
+            }
+          }
+        , 0);
+        const summaryCompareVal = groupByDate[_d].reduce((rows, row) => 
+          {
+            if (row[seriesField].includes(solidLineCompareTime)){
+              return rows + row[yField];
+            }
+            else{
+              return rows;
+            }
+          }
+        , 0);
+        _sumLine.push({ ...groupByDate[_d][0], [yField]: summaryVal, [seriesField]: solidLineTime+'总计' });
+        _sumLine.push({ ...groupByDate[_d][0], [yField]: summaryCompareVal, [seriesField]: solidLineCompareTime+'总计' });
+      }
+      else{
+        const summaryVal = groupByDate[_d].reduce((rows, row) => rows + row[yField], 0);
+        _sumLine.push({ ...groupByDate[_d][0], [yField]: summaryVal, [seriesField]: '总计' });
+      }
+      
+
+      const xAxisGroup = groupByDate[_d].reduce((a, v) => {
+        (a[v[seriesField]] || (a[v[seriesField]] = [])).push(v);
+        return a;
+      }, {});
+      // console.log(xAxisGroup);
+      Object.keys(xAxisGroup).map((_group) => {
+        const summaryVal = xAxisGroup[_group].reduce((rows, row) => rows + row[yField], 0);
+        r.push({ ...xAxisGroup[_group][0], [yField]: summaryVal, });
+        return _group;
+      });
+      return r;
+    }, []);
+    // const _sum = Object.values(groupBy(_data, 'dateGroup')).reduce((ac, b) => ({...b, [yField]: 0}), {});
+    // console.log(xField, avg1);
+    // console.log('date source=====', _data);
+    setLineChartX(value);
+    setDataSource(_data);
+    setSumSeries(_sumLine);
+
+    // setAvgLine1(avg1);
+    // const avg1Int = Math.round(avg1);
+    // const mergedConfig = { ...lineConfig,
+    //   annotations: [
+    //     { type: 'text', position: ['start', avg1Int], content: avg1Int, offsetX: -15, style: { fill: '#F4664A', textBaseline: 'bottom' } },
+    //     { type: 'line', start: [-10, avg1Int], end: ['max', avg1Int], style: { stroke: '#F4664A', lineDash: [2, 2] } },
+    //   ],
+    // };
+    // console.log(mergedConfig);
+    // setLineConfig(mergedConfig);
+    setLineConfig(cloneDeep(line_config));
+  };
+  return (
+    <section>
+      <Row gutter={16} justify={'space-between'} className="mb-1">
+        <Col flex={'auto'}>
+          <h3>
+            走势: <span style={{ fontSize: 'smaller' }}>{dataFieldAlias[lineConfig.yField].label}</span>
+          </h3>
+        </Col>
+        <Col style={{ textAlign: 'right' }} align={'end'}>
+          <DateGroupRadio
+            visible={true}
+            dataRaw={{ data1: dataBeforeXChange }}
+            onChange={onChangeXDateFieldGroup}
+            value={lineChartX}
+            dataMapper={orderCountDataMapper}
+            fieldMapper={orderCountDataFieldMapper}
+          />
+        </Col>
+      </Row>
+      <Spin spinning={loading}>
+        <Line {...lineConfig} data={[].concat(dataSource, sumSeries)} />
+      </Spin>
+    </section>
+  );
+});

src/components/kpi/SubjectTable/Count.jsx

@@ -228,7 +228,7 @@ export default observer((props) => {
     <>
       <Row gutter={16} className="mb-1 ">
         <Col className="gutter-row mb-n1 p-none" span={24}>
-          <EditableProTable sticky
+          <EditableProTable sticky pagination={{ pageSize: 10}}
             key={KPIStore.settingYear}
             // headerTitle={`毛利`}
             columns={columns}

src/components/kpi/SubjectTable/Profit.jsx

@@ -231,7 +231,7 @@ export default observer((props) => {
     <>
       <Row gutter={16} className="mb-1 ">
         <Col className="gutter-row mb-n1 p-none" span={24}>
-          <EditableProTable sticky
+          <EditableProTable sticky pagination={{ pageSize: 10}}
             key={KPIStore.settingYear}
             // headerTitle={`毛利`}
             columns={columns}

src/components/kpi/SubjectTable/Rates.jsx

@@ -226,7 +226,7 @@ export default observer((props) => {
     <>
       <Row gutter={16} className="mb-1 ">
         <Col className="gutter-row mb-n1 p-none" span={24}>
-          <EditableProTable sticky
+          <EditableProTable sticky pagination={{ pageSize: 10}}
             key={KPIStore.settingYear}
             // headerTitle={`毛利`}
             columns={columns}

src/components/search/SearchForm.jsx

@@ -3,7 +3,7 @@ import { toJS } from 'mobx';
 import { observer } from 'mobx-react';
 import { DATE_FORMAT, SMALL_DATETIME_FORMAT, stores_Context } from './../../config';
 import { SearchOutlined } from '@ant-design/icons';
-import { Form, Row, Col, Select, Button, Space, DatePicker, Input } from 'antd';
+import { Form, Row, Col, Select, Button, Space, DatePicker, Input, InputNumber } from 'antd';
 import moment from 'moment';
 // import locale from 'antd/es/date-picker/locale/zh_CN';
 import BusinessSelect from './BusinessSelect';
@@ -15,6 +15,7 @@ import DatePickerCharts from './DatePickerCharts';
 import YearPickerCharts from './YearPickerCharts';
 import SearchInput from './Input';
 import { objectMapper, at, empty, isEmpty } from './../../utils/commons';
+import { departureDateTypes } from './../../libs/ht';
 
 import './search.css';
 import HotelStarSelect from './HotelStarSelect';
@@ -53,6 +54,11 @@ export default observer((props) => {
         transform: (value) => value?.key || '',
         default: '',
       },
+      'departureDateType': {
+        key: 'DateType',
+        transform: (value) => value?.key || '',
+        default: '',
+      },
       'HTBusinessUnits': {
         key: 'HTBusinessUnits',
         transform: (value) => {
@@ -92,6 +98,11 @@ export default observer((props) => {
         transform: (value) => Array.isArray(value) ? value.map((ele) => ele.key).join(',') : value ? (!isNaN(parseInt(value.key), 10) ? value.key : '') : '',
         default: '',
       },
+      'date': {
+        key: 'date',
+        transform: (value) => (value ? moment(value).format(SMALL_DATETIME_FORMAT) : undefined),
+        default: '',
+      },
       'applyDate': [
         {
           key: 'Date1',
@@ -142,7 +153,7 @@ export default observer((props) => {
       ],
       'country': {
         key: 'country',
-        transform: (value) => value?.key || '',
+        transform: (value) => Array.isArray(value) ? value.map((ele) => ele.key).join(',') : value ? (!isNaN(parseInt(value.key), 10) ? value.key : '') : '',
         default: '',
       },
       'city': {
@@ -170,9 +181,34 @@ export default observer((props) => {
         transform: (value) => value?.value || value?.key || '',
         default: '',
       },
+      'cruiseDirection': {
+        key: 'cruiseDirection',
+        transform: (value) => value?.value || '',
+        default: '',
+      },
+      'cruiseBookType': {
+        key: 'cruiseBookType',
+        transform: (value) => value?.value || '',
+        default: '',
+      },
+      'hotelBookType': {
+        key: 'hotelBookType',
+        transform: (value) => value?.value || '',
+        default: '',
+      },
+      'hotelRecommandRate': {
+        key: 'hotelRecommandRate',
+        transform: (value) => value?.value || '',
+        default: '',
+      },
+      'hotelStar': {
+        key: 'hotelStar',
+        transform: (value) => value?.value || '',
+        default: '',
+      },
     };
     let dest = {};
-    const { applyDate, applyDate2, year, yearDiff, dates, months, ...omittedValue } = values;
+    const { departureDateType, applyDate, applyDate2, year, yearDiff, dates, months, date, ...omittedValue } = values;
     dest = { ...omittedValue, ...objectMapper(values, destinationObject) };
     for (const key in dest) {
       if (Object.prototype.hasOwnProperty.call(dest, key)) {
@@ -264,19 +300,19 @@ function getFields(props) {
   };
   let baseChildren = [];
   baseChildren = [
-		item(
-			"keyword", // 关键词搜索 {...fieldComProps.keyword}
-			99,
-			<Form.Item name="keyword" {...fieldProps.keyword}>
-				<Input allowClear {...fieldProps.keyword} />
-			</Form.Item>,
-			fieldProps?.keyword?.col || 6
-		),
+    item(
+      'keyword', // 关键词搜索 {...fieldComProps.keyword}
+      99,
+      <Form.Item name="keyword" {...fieldProps.keyword}>
+        <Input allowClear {...fieldProps.keyword} />
+      </Form.Item>,
+      fieldProps?.keyword?.col || 6
+    ),
     item(
       'agency',
       99,
       <Form.Item name={'agency'}>
-        <SearchInput autoGet url="/service-web/QueryData/GetVEIName" map={{ 'CAV_VEI_SN': 'key', 'VEI2_CompanyBN': 'label' }} resultkey={'result1'} placeholder="所有地接社" />
+        <SearchInput autoGet url="/service-web/QueryData/GetVEIName" map={{ 'CAV_VEI_SN': 'key', 'VEI2_CompanyBN': 'label' }} resultkey={'result1'} placeholder="所有地接社" {...fieldProps.agency} />
       </Form.Item>
     ),
     item(
@@ -346,11 +382,11 @@ function getFields(props) {
     item(
       'countryArea',
       99,
-      <Form.Item name={`countryArea`} initialValue={at(props, 'initialValue.countryArea')[0] || (fieldProps?.countryArea?.show_all ? { key: 'all', label: '所有国家' } : undefined)}>
-        <Select style={{ width: '100%' }} placeholder="所有国家" labelInValue>
+      <Form.Item name={`countryArea`} initialValue={at(props, 'initialValue.countryArea')[0] || (fieldProps?.countryArea?.show_all ? { key: 'all', label: '国内外' } : undefined)}>
+        <Select style={{ width: '100%' }} placeholder="国内外" labelInValue allowClear={fieldProps?.countryArea?.show_all || false}>
           {fieldProps?.countryArea?.show_all && (
-            <Option key="all" value="">
-              所有国家
+            <Option key="all" value="" disabled>
+              国内外
             </Option>
           )}
           <Option key="china" value="china">
@@ -366,11 +402,11 @@ function getFields(props) {
     item(
       'orderStatus',
       99,
-      <Form.Item name={`orderStatus`} initialValue={at(props, 'initialValue.orderStatus')[0] || (fieldProps?.orderStatus?.show_all ? { key: '-1', label: '所有' } : undefined)}>
-        <Select style={{ width: '100%' }} placeholder="所有状态" labelInValue>
+      <Form.Item name={`orderStatus`} initialValue={at(props, 'initialValue.orderStatus')[0] || (fieldProps?.orderStatus?.show_all ? { key: '-1', label: '成行状态' } : undefined)}>
+        <Select style={{ width: '100%' }} placeholder="成行状态" labelInValue allowClear>
           {fieldProps?.orderStatus?.show_all && (
-            <Select.Option key="所有" value="-1">
-              所有
+            <Select.Option key="-1" value="-1" disabled>
+              成行状态
             </Select.Option>
           )}
           <Select.Option key="已成行" value="1">
@@ -392,6 +428,20 @@ function getFields(props) {
       </Form.Item>,
       fieldProps?.DateType?.col || 3
     ),
+    item(
+      'departureDateType',
+      99,
+      <Form.Item name={`departureDateType`} initialValue={at(props, 'initialValue.departureDateType')[0] || { key: 'departureDate', label: '抵达日期' }}>
+        <Select labelInValue={true} style={{ width: '100%' }} placeholder="选择日期类型">
+          {departureDateTypes.map((ele) => (
+            <Select.Option key={ele.key} value={ele.key} disabled={fieldProps?.departureDateType?.disabledKeys.includes(ele.key)}>
+              {ele.label}
+            </Select.Option>
+          ))}
+        </Select>
+      </Form.Item>,
+      fieldProps?.departureDateType?.col || 3
+    ),
     item(
       'years',
       99,
@@ -417,6 +467,14 @@ function getFields(props) {
       </Form.Item>,
       fieldProps?.dates?.col || midCol
     ),
+    item(
+      'date',
+      99,
+      <Form.Item name={`date`} initialValue={at(props, 'initialValue.date')[0]}>
+        <DatePicker picker="date" placeholder="日期" />
+      </Form.Item>,
+      fieldProps?.date?.col || midCol
+    ),
     item(
       'operator',
       99,
@@ -448,7 +506,7 @@ function getFields(props) {
       'country',
       99,
       <Form.Item name={'country'}>
-        <SearchInput autoGet url="/service-Analyse2/GetCountryInfo" map={{ 'c_id': 'key', 'cn_name': 'label' }} resultkey={'result'} placeholder="输入搜索国籍: 中/英名字" />
+        <SearchInput {...fieldProps?.country || {}} autoGet url="/service-Analyse2/GetCountryInfo" map={{ 'c_id': 'key', 'cn_name': 'label' }} resultkey={'result'} placeholder="输入搜索国籍: 中/英名字" />
       </Form.Item>
     ),
     item(
@@ -466,42 +524,94 @@ function getFields(props) {
       </Form.Item>
     ),
     item(
-      'cruiseType',
+      'cruiseDirection',
       99,
-      <Form.Item name={`cruiseType`} initialValue={at(props, 'initialValue.cruiseType')[0] || (fieldProps?.cruiseType?.show_all ? { key: 'all', label: '所有行程' } : undefined)}>
-        <Select style={{ width: '100%' }} placeholder="所有行程" labelInValue>
-          {fieldProps?.cruiseType?.show_all && (
-            <Option key="all" value="">
-              所有
+      <Form.Item name={`cruiseDirection`} initialValue={at(props, 'initialValue.cruiseDirection')[0] || undefined}>
+        <Select style={{ width: '100%' }} placeholder="上下水" labelInValue allowClear>
+          {fieldProps?.cruiseDirection?.show_all && (
+            <Option key="all" value="" disabled>
+              上下水
             </Option>
           )}
-          <Option key="upstream" value="upstream">
+          <Option key="1" value="1">
             上水
           </Option>
-          <Option key="downstream" value="downstream">
+          <Option key="2" value="2">
             下水
           </Option>
-          <Option key="long" value="long">
+          {/* <Option key="long" value="long">
             长线
-          </Option>
+          </Option> */}
         </Select>
       </Form.Item>,
       3
     ),
     item(
-      'bookType',
+      'cruiseBookType',
       99,
-      <Form.Item name={`bookType`} initialValue={at(props, 'initialValue.bookType')[0] || (fieldProps?.bookType?.show_all ? { key: 'all', label: '预定类型' } : undefined)}>
+      <Form.Item name={`cruiseBookType`} initialValue={at(props, 'initialValue.cruiseBookType')[0] || (fieldProps?.cruiseBookType?.show_all ? { key: '-1', label: '预定类型' } : undefined)}>
         <Select style={{ width: '100%' }} placeholder="预定类型" labelInValue allowClear>
-          {fieldProps?.bookType?.show_all && (
-            <Option key="all" value="">
-              所有
+          {fieldProps?.cruiseBookType?.show_all && (
+            <Option key="-1" value="-1" disabled>
+              预定类型
             </Option>
           )}
-          <Option key="proxy" value="proxy">
+          <Option key="1" value="1">
+            单订三峡
+          </Option>
+          <Option key="0" value="0">
+            含行程
+          </Option>
+        </Select>
+      </Form.Item>,
+      3
+    ),
+    item(
+      'roomsRange',
+      99,
+      <Form.Item noStyle>
+        <Input.Group compact>
+          <Form.Item name={'RoomNumStart'} noStyle>
+            <InputNumber style={{ width: 'calc(50% - 15px)', textAlign: 'center' }} placeholder="房间数" />
+          </Form.Item>
+          <Input style={{ width: 30, borderLeft: 0, borderRight: 0, pointerEvents: 'none', }} placeholder="~" disabled />
+          <Form.Item name={'RoomNumEnd'} noStyle>
+            <InputNumber style={{ width: 'calc(50% - 15px)', textAlign: 'center', borderLeft: 0 }} placeholder="房间数" />
+          </Form.Item>
+        </Input.Group>
+      </Form.Item>,
+      fieldProps?.roomsRange?.col || 4
+    ),
+    item(
+      'personRange',
+      99,
+      <Form.Item noStyle>
+        <Input.Group compact>
+          <Form.Item name={'PersonNumStart'} noStyle>
+            <InputNumber style={{ width: 'calc(50% - 15px)', textAlign: 'center' }} placeholder="人数" />
+          </Form.Item>
+          <Input style={{ width: 30, borderLeft: 0, borderRight: 0, pointerEvents: 'none', }} placeholder="~" disabled />
+          <Form.Item name={'PersonNumEnd'} noStyle>
+            <InputNumber style={{ width: 'calc(50% - 15px)', textAlign: 'center', borderLeft: 0 }} placeholder="人数" />
+          </Form.Item>
+        </Input.Group>
+      </Form.Item>,
+      fieldProps?.personRange?.col || 4
+    ),
+    item(
+      'hotelBookType',
+      99,
+      <Form.Item name={`hotelBookType`} initialValue={at(props, 'initialValue.hotelBookType')[0] || (fieldProps?.hotelBookType?.show_all ? { key: 'all', label: '预定类型' } : undefined)}>
+        <Select style={{ width: '100%' }} placeholder="预定类型" labelInValue allowClear={fieldProps?.hotelBookType?.show_all || false}>
+          {fieldProps?.hotelBookType?.show_all && (
+            <Option key="all" value="" disabled>
+              预定类型
+            </Option>
+          )}
+          <Option key="1" value="1">
             代订
           </Option>
-          <Option key="direct" value="direct">
+          <Option key="0" value="0">
             自订
           </Option>
         </Select>
@@ -509,18 +619,21 @@ function getFields(props) {
       3
     ),
     item(
-      'recommandRate',
+      'hotelRecommandRate',
       99,
-      <Form.Item name={`recommandRate`} initialValue={at(props, 'initialValue.recommandRate')[0] || (fieldProps?.recommandRate?.show_all ? { key: 'all', label: '推荐' } : undefined)}>
-        <Select style={{ width: '100%' }} placeholder="推荐" labelInValue allowClear>
-          {fieldProps?.recommandRate?.show_all && (
-            <Option key="all" value="">
-              所有
+      <Form.Item name={`hotelRecommandRate`} initialValue={at(props, 'initialValue.hotelRecommandRate')[0] || (fieldProps?.hotelRecommandRate?.show_all ? { key: 'all', label: '推荐等级' } : undefined)}>
+        <Select style={{ width: '100%' }} placeholder="推荐等级" labelInValue allowClear={fieldProps?.hotelRecommandRate?.show_all || false}>
+          {fieldProps?.hotelRecommandRate?.show_all && (
+            <Option key="all" value="" disabled>
+              推荐等级
             </Option>
           )}
-          <Option key="proxy" value="proxy">
+          <Option key="1" value="1">
             主推
           </Option>
+          <Option key="0" value="0">
+            非主推
+          </Option>
         </Select>
       </Form.Item>,
       3

src/libs/ht.js

@@ -1,3 +1,4 @@
+import moment from 'moment';
 import { fixTo4Decimals, fixTo1Decimals, fixToInt, groupBy, sortBy, cloneDeep, pick, unique, flush, fixTo2Decimals, isEmpty } from '../utils/commons';
 
 /**
@@ -41,7 +42,7 @@ export const groups = [
   { value: '10,18,16,30', key: '10,18,16,30', label: '孵化学院', code: '', children: [10, 18, 16, 30] },
   { value: '1', key: '1', label: 'CH直销', code: '', children: [] },
   { value: '2', key: '2', label: 'CH大客户', code: '', children: [] },
-  { value: '28', key: '28', label: 'AH亚洲项目组', code: 'AH', children: [] },
+  { value: '28', key: '28', label: 'HT项目组(前AH)', code: 'HT', children: [] },
   { value: '33', key: '33', label: 'GH项目组', code: '', children: [] },
   { value: '7', key: '7', label: '市场推广', code: '', children: [] },
   { value: '8', key: '8', label: '德语', code: '', children: [] },
@@ -66,8 +67,11 @@ export const overviewGroup = groups.slice(0, 3); // todo: 花梨鹰 APP Trippest
 export const sites = [
   { value: '2', key: '2', label: 'CHT', code: 'CHT' },
   { value: '8', key: '8', label: 'AH', code: 'AH' },
+  { value: '187', key: '187', label: 'HTravel', code: 'HTravel' },
+  { value: '186', key: '186', label: 'JH', code: 'JH' },
   { value: '163', key: '163', label: 'GH', code: 'GH' },
-  { value: '184', key: '184', label: '站外渠道', code: 'ZWQD' },
+  { value: '184', key: '184', label: 'GH站外渠道 (中国)', code: 'ZWQD' },
+  { value: '185', key: '185', label: 'GH站外渠道 (海外)', code: 'GH_ZWQD_HW' },
   { value: '28', key: '28', label: '客运中国', code: 'GHKYZG' },
   { value: '7', key: '7', label: '客运海外', code: 'GHKYHW' },
   { value: '172', key: '172', label: 'GHToB 海外', code: 'GHTOBHW' },
@@ -102,6 +106,10 @@ export const dateTypes = [
   { key: 'confirmDate', value: 'confirmDate', label: '确认日期' },
   { key: 'startDate', value: 'startDate', label: '走团日期' },
 ];
+export const departureDateTypes = [
+  ...dateTypes,
+  { key: 'departureDate', value: 'departureDate', label: '抵达日期' },
+];
 
 /**
  * 结果字段
@@ -179,19 +187,27 @@ export const KPISubjects = [
 ];
 
 export const HotelStars = [
-  { key: '5', value: '5', label: '5星' },
-  { key: '4', value: '4', label: '4星' },
-  { key: '3', value: '3', label: '3星' },
-  { key: '2', value: '2', label: '2星' },
-  { key: 'intl', value: 'intl', label: '国际社' },
-  { key: 'internal', value: 'internal', label: '国内社' },
-  { key: 'other', value: 'other', label: '其它' },
-  { key: 'f5', value: 'f5', label: '准5星' },
-  { key: 'f4', value: 'f4', label: '准4星' },
-  { key: 'inn', value: 'inn', label: '客栈' },
-  { key: 'apartment', value: 'apartment', label: '公寓' },
-  { key: 'siheyuan', value: 'siheyuan', label: '四合院酒店' },
-  { key: 'luxury5', value: 'luxury5', label: '豪华五星' },
+  { key: '1', value: '1', label: '五星' },
+  { key: '2', value: '2', label: '四星' },
+  { key: '3', value: '3', label: '三星' },
+  { key: '4', value: '4', label: '二星' },
+  { key: '8', value: '8', label: '准五星 ' },
+  { key: '9', value: '9', label: '准四星' },
+  { key: '10', value: '10', label: '客栈' },
+  { key: '11', value: '11', label: '公寓' },
+  { key: '12', value: '12', label: '四合院酒店' },
+  { key: '13', value: '13', label: '豪华五星' },
+];
+
+export const CruiseAgency = [
+  { key: '14193', value: '14193', label: '长江海外游轮旅游有限公司' },
+  { key: '1067', value: '1067', label: '湖北东方皇家游船公司(待删除)' },
+  { key: '70', value: '70', label: '湖北皇家长江旅游船有限公司' },
+  { key: '159', value: '159', label: '文嘉船务' },
+  { key: '77', value: '77', label: '武汉扬子江' },
+  { key: '1337', value: '1337', label: '重庆薇灿' },
+  { key: '4378', value: '4378', label: '重庆新世纪国旅' },
+  { key: '-1', value: '-1', label: '自订' },
 ];
 
 /**
@@ -203,17 +219,70 @@ const calcPPPriceRange = (value) => {
   if (value < 0) {
       return '--';
   }
-
   const step = 30; // step = 30 USD
   const start = Math.floor(value / step) * step;
   const end = start + step;
-
   if (value >= 301) {
-      return `301-Infinity`;
+      return `≥301`;
   }
-
   return `${start === 0 ? start : (start+1)}-${end}`;
 };
+
+function calculateRangeScale(data, numScales = 36) {
+  if (!data || data.length === 0 || numScales <= 0) {
+    return [];
+  }
+  const sortedData = [...data].sort((a, b) => a - b);
+  const min = sortedData[0];
+  const max = sortedData[sortedData.length - 1];
+  if (min === max) {
+    return [roundToNice(min), roundToNice(min)];
+  }
+  const scales = [roundToNice(min)];
+  const scaleSize = sortedData.length / numScales;
+  for (let i = 1; i < numScales; i++) {
+    const index = Math.floor(i * scaleSize);
+    scales.push(roundToNice(sortedData[Math.min(index, sortedData.length - 1)]));
+  }
+  scales.push(roundToNice(max));
+  return [...new Set(scales)];
+}
+
+function roundToNice(value) {
+  if (value === 0) {
+    return 0;
+  }
+  const magnitude = Math.pow(10, Math.floor(Math.log10(Math.abs(value))));
+  const normalized = value / magnitude;
+  let rounded;
+  if (normalized < 1.5) {
+    rounded = Math.floor(normalized);
+  } else if (normalized < 3) {
+    rounded = Math.floor(normalized * 2) / 2; // round to 0.5
+  } else if (normalized < 5) {
+      rounded = Math.floor(normalized/2) * 2; // round to 2
+  } else if (normalized < 7.5) {
+    rounded = Math.floor(normalized / 5) * 5;
+  } else {
+    // rounded = Math.floor(normalized / 5) * 5;
+    rounded = Math.floor(normalized / 10) * 10;
+  }
+  return rounded * magnitude;
+};
+const findRange = (value, scale) => {
+  if (value < scale[0]) {
+    return `0-${scale[0]}`; // `Value ${value} is below the scale range.`;
+  }
+  for (let i = 1; i < scale.length; i++) {
+    if (value >= scale[i - 1] && value < scale[i]) {
+      return `${scale[i - 1]}-${scale[i]}`; // `Value ${value} is in the range [${scale[i - 1]}, ${scale[i]})`;
+    }
+  }
+  if (value >= scale[scale.length - 1]) {
+    return `≥${scale[scale.length - 1]}`; // `Value ${value} is in the range [${scale[scale.length - 1]}, Infinity)`;
+  }
+};
+const SumML_range = [1, 1.5, 2, 3, 4].map(v => v * 10000);
 /**
  * 数据透视计算
  * @param {object[]} data
@@ -227,27 +296,48 @@ export const pivotBy = (_data, [rows, columns, date]) => {
   // if (groupbyKeys.includes('PPPriceRange')) {
   // }
   // 补充计算的字段
+  const RTXF_WB_values = cloneDeep(_data).map(ele => ele.RTXF_WB); // 人天消费
+  // const max_RTXF_WB = Math.max(...RTXF_WB_values);
+  const RTXF_WB_range = calculateRangeScale(RTXF_WB_values);
   let data = cloneDeep(_data).map(ele => {
-    ele.PPPrice = (Number(ele.orderState) === 1 && ele.tourdays && ele.personNum)  ? fixToInt(ele.quotePrice / ele.tourdays / ele.personNum) : -1;
+    ele.startYearMonth = ele.startDate ? moment(ele.startDate).format('YYYY-MM') : '';
+    ele.startMonth = ele.startDate ? moment(ele.startDate).format('MM') : '';
+    ele.applyYearMonth = ele.applyDate ? moment(ele.applyDate).format('YYYY-MM') : '';
+    ele.applyMonth = ele.applyDate ? moment(ele.applyDate).format('MM') : '';
+    ele.PPPrice = (Number(ele.orderState) === 1 && ele.tourdays && ele.personNum)  ? fixToInt(ele.quotePrice / ele.tourdays / ele.personNum) : -1; // 报价: 人均天
     ele.PPPriceRange = calcPPPriceRange(ele.PPPrice);
+    ele.RTXF_WB_range = findRange(ele.RTXF_WB, RTXF_WB_range);
     ele.IsOld_txt = ele.IsOld === '1' ? '老客户' : '否';
     ele.isCusCommend_txt = ele.isCusCommend === '1' ? '老客户推荐' : '否';
     const hasOld = (ele.IsOld === '1' || ele.isCusCommend === '1') ? 1 : 0;
     ele.hasOld = hasOld;
     ele.hasOld_txt = hasOld === 1 ? '老客户(推荐)' : '';
-    ele.SumML_ctxt1 = ele.ML > 10000 ? '1W+' : '1W-';
-    ele.SumML_ctxt1_5 = ele.ML > 15000 ? '1.5W+' : '1.5W-';
-    ele.SumML_ctxt2 = ele.ML > 20000 ? '2W+' : '2W-';
-    ele.SumML_ctxt3 = ele.ML > 30000 ? '3W+' : '3W-';
-    ele.SumML_ctxt4 = ele.ML > 40000 ? '4W+' : '4W-';
+    // ele.SumML_ctxt1 = ele.ML > 10000 ? '1W+' : '1W-';
+    // ele.SumML_ctxt1_5 = ele.ML > 15000 ? '1.5W+' : '1.5W-';
+    // ele.SumML_ctxt2 = ele.ML > 20000 ? '2W+' : '2W-';
+    // ele.SumML_ctxt3 = ele.ML > 30000 ? '3W+' : '3W-';
+    // ele.SumML_ctxt4 = ele.ML > 40000 ? '4W+' : '4W-';
+    ele.SumML_ctxt = findRange(ele.ML, SumML_range);
     return ele;
   });
   // 数组的字段值, 拆分处理
-  if (groupbyKeys.includes('destinationCountry_AsJOSN')) {
-    data = _data.reduce((r, v, i) => {
-      const vjson = isEmpty(v.destinationCountry_AsJOSN) ? [] : v.destinationCountry_AsJOSN;
+  if (groupbyKeys.includes('destinationCountry')) {
+    data = data.reduce((r, v, i) => {
+      const vjson = isEmpty(v.destinationCountry) ? [] : v.destinationCountry;
+      const xv = (vjson).reduce((rv, cv, vi) => {
+        rv.push({...v, destinationCountry: cv, key: vi === 0 ? v.key : `${v.key}@${cv}`});
+        return rv;
+      }, []);
+
+      r = r.concat(xv);
+      return r;
+    }, []);
+  }
+  if (groupbyKeys.includes('destinations')) {
+    data = data.reduce((r, v, i) => {
+      const vjson = isEmpty(v.destinations) ? [] : v.destinations;
       const xv = (vjson).reduce((rv, cv, vi) => {
-        rv.push({...v, destinationCountry_AsJOSN: cv, key: vi === 0 ? v.key : `${v.key}@${cv}`});
+        rv.push({...v, destinations: cv, key: vi === 0 ? v.key : `${v.key}@${cv}`});
         return rv;
       }, []);
 

src/stores/CustomerServices.js

@@ -3,7 +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';
+import { groupBy, prepareUrl, isEmpty, show_vs_tag, formatPercent, percentToDecimal } from '../utils/commons';
 
 class CustomerServices {
 
@@ -13,7 +13,7 @@ class CustomerServices {
       this.endDate = moment().endOf('week').subtract(7, 'days');
       this.startDateString = this.startDate.format(config.DATE_FORMAT);
       this.endDateString = this.endDate.format(config.DATE_FORMAT) + '%2023:59';
-      this.dateType = 'startDate';
+      this.dateType = 'departureDate';
       this.inProgress = false;
       this.selectedAgent = '';
       this.selectedTeam = '';
@@ -43,8 +43,8 @@ class CustomerServices {
         .append('DateType', this.dateType)
         .append('Date1', this.startDateString)
         .append('Date2', this.endDateString)
-        .append('OldDate1', this.startDateString)
-        .append('OldDate2', this.endDateString)
+        .append('OldDate1', this.startDateDiffString)
+        .append('OldDate2', this.endDateDiffString)
         .append('VEI_SN', this.selectedAgent)
         .append('DepList', this.selectedTeam)
         .append('Country', this.selectedCountry)
@@ -53,112 +53,272 @@ class CustomerServices {
         .then(json => {
           if (json.errcode === 0) {
             runInAction(() => {
-              this.agentGroupList = json.result1;
-              const total1 = json.total1;
-              this.agentGroupListColumns = [
-                {
-                  title: '地接社名称',
-                  dataIndex: 'VendorName',
-                  fixed: 'left',
-                  children: [{
-                      // title: this.startDate.format(config.DATE_FORMAT) + '~' + this.endDate.format(config.DATE_FORMAT),
-                      dataIndex: 'VendorName',
-                      fixed: 'left',
-                      render: (text, record) => <NavLink to={`/agent/${record.EOI_ObjSN}/group/list`}>{record.VendorName}</NavLink>
-                    }
-                  ]
-                },
-                {
-                  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: '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'
-                    }
-                  ]
-                },
-                {
-                  title: '前勤分',
-                  dataIndex: 'qianqin',
-                  sorter: (a, b) => a.qianqin - b.qianqin,
-                  children: [{
-                      title: total1.qianqin,
-                      dataIndex: 'qianqin'
-                    }
-                  ]
-                },
-                {
-                  title: '好评数',
-                  dataIndex: 'GoodCount',
-                  sorter: (a, b) => a.GoodCount - b.GoodCount,
-                  children: [{
-                    title: total1.GoodCount,
-                      dataIndex: 'GoodCount'
-                    }
-                  ]
-                },
-                {
-                  title: '好评率',
-                  dataIndex: 'GoodRate',
-                  sorter: (a, b) => parseInt(a.GoodRate) - parseInt(b.GoodRate),
-                  children: [{
-                    title: total1.GoodRate,
-                      dataIndex: 'GoodRate'
-                    }
-                  ]
-                },
-                {
-                  title: '差评数',
-                  dataIndex: 'BadCount',
-                  sorter: (a, b) => a.BadCount - b.BadCount,
-                  children: [{
-                    title: total1.BadCount,
-                      dataIndex: 'BadCount'
-                    }
-                  ]
-                },
-                {
-                  title: '差评率',
-                  dataIndex: 'BadRate',
-                  sorter: (a, b) => parseInt(a.BadRate) - parseInt(b.BadRate),
-                  children: [{
-                    title: total1.BadRate,
-                      dataIndex: 'BadRate'
+              if (isEmpty(json.result2)){
+                const splitTotalList = groupBy(json.result1, row => row.EOI_ObjSN === -1 ? '0' : '1');
+                this.agentGroupList = splitTotalList['1'];
+                const total1 = splitTotalList['0']?.[0] || {}; // json.total1;
+                this.agentGroupListColumns = [
+                  {
+                    title: '地接社名称',
+                    dataIndex: 'VendorName',
+                    fixed: 'left',
+                    children: [{
+                        // title: this.startDate.format(config.DATE_FORMAT) + '~' + this.endDate.format(config.DATE_FORMAT),
+                        dataIndex: 'VendorName',
+                        fixed: 'left',
+                        render: (text, record) => <NavLink to={`/agent/${record.EOI_ObjSN}/group/list`}>{record.VendorName}</NavLink>
+                      }
+                    ]
+                  },
+                  {
+                    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: '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'
+                      }
+                    ]
+                  },
+                  {
+                    title: '前勤分',
+                    dataIndex: 'qianqin',
+                    sorter: (a, b) => a.qianqin - b.qianqin,
+                    children: [{
+                        title: total1.qianqin,
+                        dataIndex: 'qianqin'
+                      }
+                    ]
+                  },
+                  {
+                    title: '好评数',
+                    dataIndex: 'GoodCount',
+                    sorter: (a, b) => a.GoodCount - b.GoodCount,
+                    children: [{
+                      title: total1.GoodCount,
+                        dataIndex: 'GoodCount'
+                      }
+                    ]
+                  },
+                  {
+                    title: '好评率',
+                    dataIndex: 'GoodRate',
+                    sorter: (a, b) => parseInt(a.GoodRate) - parseInt(b.GoodRate),
+                    children: [{
+                      title: total1.GoodRate,
+                        dataIndex: 'GoodRate'
+                      }
+                    ]
+                  },
+                  {
+                    title: '差评数',
+                    dataIndex: 'BadCount',
+                    sorter: (a, b) => a.BadCount - b.BadCount,
+                    children: [{
+                      title: total1.BadCount,
+                        dataIndex: 'BadCount'
+                      }
+                    ]
+                  },
+                  {
+                    title: '差评率',
+                    dataIndex: 'BadRate',
+                    sorter: (a, b) => parseInt(a.BadRate) - parseInt(b.BadRate),
+                    children: [{
+                      title: total1.BadRate,
+                        dataIndex: 'BadRate'
+                      }
+                    ]
+                  }
+                ];
+
+              }
+              else{
+                const splitTotalList1 = groupBy(json.result1, row => row.EOI_ObjSN === -1 ? '0' : '1');
+                const splitTotalList2 = groupBy(json.result2, row => row.EOI_ObjSN === -1 ? '0' : '1');
+                const result = [];
+                for (const item1 of splitTotalList1['1']) {
+                  for (const item2 of splitTotalList2['1']) {
+                    if (item1.EOI_ObjSN === item2.EOI_ObjSN) {
+                        const goodRate1 = percentToDecimal(item1.GoodRate);
+                        const goodRate2 = percentToDecimal(item2.GoodRate);
+                        const badRate1 = percentToDecimal(item1.BadRate);
+                        const badRate2 = percentToDecimal(item2.BadRate);
+                        result.push({
+                          EOI_ObjSN: item1.EOI_ObjSN,
+                          VendorName: item1.VendorName,
+                          GroupCount: show_vs_tag(formatPercent((item1.GroupCount-item2.GroupCount)/(item2.GroupCount===0?1:item2.GroupCount)),
+                          item1.GroupCount-item2.GroupCount,item1.GroupCount,item2.GroupCount),
+                          PersonNum: show_vs_tag(formatPercent((item1.PersonNum-item2.PersonNum)/(item2.PersonNum===0?1:item2.PersonNum)),
+                          item1.PersonNum-item2.PersonNum,item1.PersonNum,item2.PersonNum),
+                          GroupDays: show_vs_tag(formatPercent((item1.GroupDays-item2.GroupDays)/(item2.GroupDays===0?1:item2.GroupDays)),
+                          item1.GroupDays-item2.GroupDays,item1.GroupDays,item2.GroupDays),
+                          totalcost: show_vs_tag(formatPercent((item1.totalcost-item2.totalcost)/(item2.totalcost===0?1:item2.totalcost)),
+                          (item1.totalcost-item2.totalcost).toFixed(2),item1.totalcost,item2.totalcost),
+                          GoodCount: show_vs_tag(formatPercent((item1.GoodCount-item2.GoodCount)/(item2.GoodCount===0?1:item2.GoodCount)),
+                          item1.GoodCount-item2.GoodCount,item1.GoodCount,item2.GoodCount),
+                          GoodRate: show_vs_tag(formatPercent((goodRate1-goodRate2)/(goodRate2===0?1:goodRate2)),
+                          formatPercent(goodRate1-goodRate2),item1.GoodRate,item2.GoodRate),
+                          BadCount: show_vs_tag(formatPercent((item1.BadCount-item2.BadCount)/(item2.BadCount===0?1:item2.BadCount)),
+                          item1.BadCount-item2.BadCount,item1.BadCount,item2.BadCount),
+                          BadRate: show_vs_tag(formatPercent((badRate1-badRate2)/(badRate2===0?1:badRate2)),
+                          formatPercent(badRate1-badRate2),item1.BadRate,item2.BadRate),
+                          qianqin: show_vs_tag(formatPercent((item1.qianqin-item2.qianqin)/(item2.qianqin===0?1:item2.qianqin)),
+                          (item1.qianqin-item2.qianqin).toFixed(2),item1.qianqin,item2.qianqin),
+                          key:item1.key,
+                        });
                     }
-                  ]
+                  }
                 }
-              ];
+                this.agentGroupList = result;
+                const total1 = splitTotalList1['0']?.[0] || {};
+                const total2 = splitTotalList2['0']?.[0] || {};
+                this.agentGroupListColumns = [
+                  {
+                    title: '地接社名称',
+                    dataIndex: 'VendorName',
+                    fixed: 'left',
+                    children: [{
+                        // title: this.startDate.format(config.DATE_FORMAT) + '~' + this.endDate.format(config.DATE_FORMAT),
+                        dataIndex: 'VendorName',
+                        fixed: 'left',
+                        render: (text, record) => <NavLink to={`/agent/${record.EOI_ObjSN}/group/list`}>{record.VendorName}</NavLink>
+                      }
+                    ]
+                  },
+                  {
+                    title: '团数',
+                    dataIndex: 'GroupCount',
+                    sorter: (a, b) => a.GroupCount - b.GroupCount,
+                    children: [{
+                        title: show_vs_tag(formatPercent((total1.GroupCount-total2.GroupCount)/total2.GroupCount),total1.GroupCount-total2.GroupCount,total1.GroupCount,total2.GroupCount),
+                        titleX: [total1.GroupCount, total2.GroupCount].join(' vs '),
+                        dataIndex: 'GroupCount'
+                      }
+                    ]
+                  },
+                  {
+                    title: '人数',
+                    dataIndex: 'PersonNum',
+                    sorter: (a, b) => a.PersonNum - b.PersonNum,
+                    children: [{
+                        title: show_vs_tag(formatPercent((total1.PersonNum-total2.PersonNum)/total2.PersonNum),total1.PersonNum-total2.PersonNum,total1.PersonNum,total2.PersonNum),
+                        titleX: [total1.PersonNum, total2.PersonNum].join(' vs '),
+                        dataIndex: 'PersonNum'
+                      }
+                    ]
+                  },
+                  {
+                    title: '团天数',
+                    dataIndex: 'GroupDays',
+                    sorter: (a, b) => a.GroupDays - b.GroupDays,
+                    children: [{
+                        title: show_vs_tag(formatPercent((total1.GroupDays-total2.GroupDays)/total2.GroupDays),total1.GroupDays-total2.GroupDays,total1.GroupDays,total2.GroupDays),
+                        titleX: [total1.GroupDays, total2.GroupDays].join(' vs '),
+                        dataIndex: 'GroupDays'
+                      }
+                    ]
+                  },
+                  {
+                    title: '交易额',
+                    dataIndex: 'totalcost',
+                    sorter: (a, b) => a.totalcost - b.totalcost,
+                    children: [{
+                        title: show_vs_tag(formatPercent((total1.totalcost-total2.totalcost)/total2.totalcost),(total1.totalcost-total2.totalcost).toFixed(2),total1.totalcost,total2.totalcost),
+                        titleX: [total1.totalcost, total2.totalcost].join(' vs '),
+                        dataIndex: 'totalcost'
+                      }
+                    ]
+                  },
+                  {
+                    title: '前勤分',
+                    dataIndex: 'qianqin',
+                    sorter: (a, b) => a.qianqin - b.qianqin,
+                    children: [{
+                        title: show_vs_tag(formatPercent((total1.qianqin-total2.qianqin)/total2.qianqin),(total1.qianqin-total2.qianqin).toFixed(2),total1.qianqin,total2.qianqin),
+                        titleX: [total1.qianqin, total2.qianqin].join(' vs '),
+                        dataIndex: 'qianqin'
+                      }
+                    ]
+                  },
+                  {
+                    title: '好评数',
+                    dataIndex: 'GoodCount',
+                    sorter: (a, b) => a.GoodCount - b.GoodCount,
+                    children: [{
+                      title: show_vs_tag(formatPercent((total1.GoodCount-total2.GoodCount)/total2.GoodCount),total1.GoodCount-total2.GoodCount,total1.GoodCount,total2.GoodCount),
+                      titleX: [total1.GoodCount, total2.GoodCount].join(' vs '),
+                        dataIndex: 'GoodCount'
+                      }
+                    ]
+                  },
+                  {
+                    title: '好评率',
+                    dataIndex: 'GoodRate',
+                    sorter: (a, b) => parseInt(a.GoodRate) - parseInt(b.GoodRate),
+                    children: [{
+                      title: show_vs_tag(formatPercent((percentToDecimal(total1.GoodRate)-percentToDecimal(total2.GoodRate))/percentToDecimal(total2.GoodRate)),
+                      formatPercent(percentToDecimal(total1.GoodRate)-percentToDecimal(total2.GoodRate)),total1.GoodRate,total2.GoodRate),
+                      titleX: [total1.GoodRate, total2.GoodRate].join(' vs '),
+                        dataIndex: 'GoodRate'
+                      }
+                    ]
+                  },
+                  {
+                    title: '差评数',
+                    dataIndex: 'BadCount',
+                    sorter: (a, b) => a.BadCount - b.BadCount,
+                    children: [{
+                      title: show_vs_tag(formatPercent((total1.BadCount-total2.BadCount)/total2.BadCount),total1.BadCount-total2.BadCount,total1.BadCount,total2.BadCount),
+                      titleX: [total1.BadCount, total2.BadCount].join(' vs '),
+                        dataIndex: 'BadCount'
+                      }
+                    ]
+                  },
+                  {
+                    title: '差评率',
+                    dataIndex: 'BadRate',
+                    sorter: (a, b) => parseInt(a.BadRate) - parseInt(b.BadRate),
+                    children: [{
+                      title: show_vs_tag(formatPercent((percentToDecimal(total1.BadRate)-percentToDecimal(total2.BadRate))/percentToDecimal(total2.GoodRate)),
+                      formatPercent(percentToDecimal(total1.BadRate)-percentToDecimal(total2.BadRate)),total1.BadRate,total2.BadRate),
+                      titleX: [total1.BadRate, total2.BadRate].join(' vs '),
+                        dataIndex: 'BadRate'
+                      }
+                    ]
+                  }
+                ];
+              }
             });
            }
         })
@@ -277,9 +437,10 @@ class CustomerServices {
         });
     }
 
-    fetchDestinationGroupCount() {
-      this.inProgress = true;
-      const fetchUrl = prepareUrl(config.HT_HOST + '/service-web/QueryData/GetdistGroupInfoAll')
+    fetchDistGroupInfoByCountry(destinationId) {
+      this.nationality_count_data.loading = true;
+      const fetchUrl = prepareUrl(config.HT_HOST + '/service-web/QueryData/GetDistGroupInfoALLByCountry')
+        .append('city', destinationId)
         .append('DateType', this.dateType)
         .append('Date1', this.startDateString)
         .append('Date2', this.endDateString)
@@ -290,20 +451,19 @@ class CustomerServices {
         .append('OrderStatus', this.selectedOrderStatus)
         .build();
       req.fetchJSON(fetchUrl)
-        .then(json => {
+      .then((json) => {
           if (json.errcode === 0) {
             runInAction(() => {
-              this.destinationGroupCount = json.result1;
-              const total1 = json.total1;
-              this.destinationGroupCountColumns = [
+              const splitTotalList = groupBy(json.result1, row => row.COLD_ServiceCity === -1 ? '0' : '1');
+              this.nationality_count_data.destinationGroupByCountryList = splitTotalList['1'];
+              const total1 = splitTotalList['0']?.[0] || {};
+              this.nationality_count_data.destinationGroupByCountryListColumns =[
                 {
-                  title: '城市',
+                  title: '国籍',
                   dataIndex: 'COLD_ServiceCityName',
-                  fixed: 'left',
                   children: [{
-                      dataIndex: 'COLD_ServiceCityName',
-                      fixed: 'left',
-                      render: (text, record) => <NavLink to={`/destination/${record.COLD_ServiceCity}/group/list`}>{record.COLD_ServiceCityName}</NavLink>
+                      title: total1.COLD_ServiceCityName,
+                      dataIndex: 'COLD_ServiceCityName'
                     }
                   ]
                 },
@@ -342,7 +502,7 @@ class CustomerServices {
                   dataIndex: 'TotalCost',
                   sorter: (a, b) => a.TotalCost - b.TotalCost,
                   children: [{
-                      title: total1.totalcost,
+                      title: total1.TotalCost,
                       dataIndex: 'TotalCost'
                     }
                   ]
@@ -352,13 +512,200 @@ class CustomerServices {
                   dataIndex: 'TotalPrice',
                   sorter: (a, b) => a.TotalPrice - b.TotalPrice,
                   children: [{
-                      title: total1.totalprice,
+                      title: total1.TotalPrice,
                       dataIndex: 'TotalPrice'
                     }
                   ]
                 }
               ];
             });
+          }
+        })
+      .then(() => {
+        this.nationality_count_data.loading = 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.startDateDiffString)
+        .append('OldDate2', this.endDateDiffString)
+        .append('DepList', this.selectedTeam)
+        .append('Country', this.selectedCountry)
+        .append('OrderStatus', this.selectedOrderStatus)
+        .build();
+      req.fetchJSON(fetchUrl)
+        .then(json => {
+          if (json.errcode === 0) {
+            runInAction(() => {
+              if (isEmpty(json.result2)){
+                const splitTotalList = groupBy(json.result1, row => row.COLD_ServiceCity === -1 ? '0' : '1');
+                this.agentGroupList = splitTotalList['1'];
+                const total1 = splitTotalList['0']?.[0] || {}; // json.total1;
+                this.destinationGroupCount = splitTotalList['1'];
+                this.destinationGroupCountColumns = [
+                  {
+                    title: '城市',
+                    dataIndex: 'COLD_ServiceCityName',
+                    fixed: 'left',
+                    children: [{
+                        dataIndex: 'COLD_ServiceCityName',
+                        fixed: 'left',
+                        render: (text, record) => <NavLink to={`/destination/${record.COLD_ServiceCity}/group/list`}>{record.COLD_ServiceCityName}</NavLink>
+                      }
+                    ]
+                  },
+                  {
+                    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: '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'
+                      }
+                    ]
+                  },
+                  {
+                    title: '报价',
+                    dataIndex: 'TotalPrice',
+                    sorter: (a, b) => a.TotalPrice - b.TotalPrice,
+                    children: [{
+                        title: total1.TotalPrice,
+                        dataIndex: 'TotalPrice'
+                      }
+                    ]
+                  }
+                ];
+              }
+              else{
+                const splitTotalList1 = groupBy(json.result1, row => row.COLD_ServiceCity === -1 ? '0' : '1');
+                const splitTotalList2 = groupBy(json.result2, row => row.COLD_ServiceCity === -1 ? '0' : '1');
+                const result = [];
+                for (const item1 of splitTotalList1['1']) {
+                  for (const item2 of splitTotalList2['1']) {
+                    if (item1.COLD_ServiceCity === item2.COLD_ServiceCity) {
+                        result.push({
+                          COLD_ServiceCity: item1.COLD_ServiceCity,
+                          COLD_ServiceCityName: item1.COLD_ServiceCityName,
+                          GroupCount: show_vs_tag(formatPercent((item1.GroupCount-item2.GroupCount)/(item2.GroupCount===0?1:item2.GroupCount)),
+                          item1.GroupCount-item2.GroupCount,item1.GroupCount,item2.GroupCount),
+                          PersonNum: show_vs_tag(formatPercent((item1.PersonNum-item2.PersonNum)/(item2.PersonNum===0?1:item2.PersonNum)),
+                          item1.PersonNum-item2.PersonNum,item1.PersonNum,item2.PersonNum),
+                          GroupDays: show_vs_tag(formatPercent((item1.GroupDays-item2.GroupDays)/(item2.GroupDays===0?1:item2.GroupDays)),
+                          item1.GroupDays-item2.GroupDays,item1.GroupDays,item2.GroupDays),
+                          TotalCost: show_vs_tag(formatPercent((item1.TotalCost-item2.TotalCost)/(item2.TotalCost===0?1:item2.TotalCost)),
+                          (item1.TotalCost-item2.TotalCost).toFixed(2),item1.TotalCost,item2.TotalCost),
+                          TotalPrice: show_vs_tag(formatPercent((item1.TotalPrice-item2.TotalPrice)/(item2.TotalPrice===0?1:item2.TotalPrice)),
+                          item1.TotalPrice-item2.TotalPrice,item1.TotalPrice,item2.TotalPrice),
+                          key:item1.key,
+                        });
+                    }
+                  }
+                }
+                this.destinationGroupCount = result;
+                const total1 = splitTotalList1['0']?.[0] || {};
+                const total2 = splitTotalList2['0']?.[0] || {};
+                this.destinationGroupCountColumns = [
+                  {
+                    title: '城市',
+                    dataIndex: 'COLD_ServiceCityName',
+                    fixed: 'left',
+                    children: [{
+                        dataIndex: 'COLD_ServiceCityName',
+                        fixed: 'left',
+                        render: (text, record) => <NavLink to={`/destination/${record.COLD_ServiceCity}/group/list`}>{record.COLD_ServiceCityName}</NavLink>
+                      }
+                    ]
+                  },
+                  {
+                    title: '团数',
+                    dataIndex: 'GroupCount',
+                    sorter: (a, b) => a.GroupCount - b.GroupCount,
+                    children: [{
+                        title: show_vs_tag(formatPercent((total1.GroupCount-total2.GroupCount)/total2.GroupCount),total1.GroupCount-total2.GroupCount,total1.GroupCount,total2.GroupCount),
+                        dataIndex: 'GroupCount'
+                      }
+                    ]
+                  },
+                  {
+                    title: '人数',
+                    dataIndex: 'PersonNum',
+                    sorter: (a, b) => a.PersonNum - b.PersonNum,
+                    children: [{
+                        title: show_vs_tag(formatPercent((total1.PersonNum-total2.PersonNum)/total2.PersonNum),total1.PersonNum-total2.PersonNum,total1.PersonNum,total2.PersonNum),
+                        dataIndex: 'PersonNum'
+                      }
+                    ]
+                  },
+                  {
+                    title: '团天数',
+                    dataIndex: 'GroupDays',
+                    sorter: (a, b) => a.GroupDays - b.GroupDays,
+                    children: [{
+                        title: show_vs_tag(formatPercent((total1.GroupDays-total2.GroupDays)/total2.GroupDays),total1.GroupDays-total2.GroupDays,total1.GroupDays,total2.GroupDays),
+                        dataIndex: 'GroupDays'
+                      }
+                    ]
+                  },
+                  {
+                    title: '交易额',
+                    dataIndex: 'TotalCost',
+                    sorter: (a, b) => a.TotalCost - b.TotalCost,
+                    children: [{
+                        title: show_vs_tag(formatPercent((total1.TotalCost-total2.TotalCost)/total2.TotalCost),
+                        (total1.TotalCost-total2.TotalCost).toFixed(2),total1.TotalCost,total2.TotalCost),
+                        dataIndex: 'TotalCost'
+                      }
+                    ]
+                  },
+                  {
+                    title: '报价',
+                    dataIndex: 'TotalPrice',
+                    sorter: (a, b) => a.TotalPrice - b.TotalPrice,
+                    children: [{
+                        title: show_vs_tag(formatPercent((total1.TotalPrice-total2.TotalPrice)/total2.TotalPrice),
+                        (total1.TotalPrice-total2.TotalPrice).toFixed(2),total1.TotalPrice,total2.TotalPrice),
+                        dataIndex: 'TotalPrice'
+                      }
+                    ]
+                  }
+                ];
+              }
+            });
            }
         })
         .then(() => {
@@ -369,8 +716,6 @@ class CustomerServices {
     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)
@@ -380,6 +725,7 @@ class CustomerServices {
         .append('OldDate2', this.endDateString)
         .append('DepList', this.selectedTeam)
         .append('Country', this.selectedCountry)
+        .append('OrderStatus', this.selectedOrderStatus)
         .build();
       req.fetchJSON(fetchUrl)
         .then(json => {
@@ -458,8 +804,8 @@ class CustomerServices {
     }
 
     searchValues = {
-      DateType: { key: 'startDate', label: '走团日期'},
-      countryArea: { key: 'china', label: '国内' },
+      DateType: { key: 'departureDate', label: '抵达日期'},
+      // departureDateType: { key: 'departureDate', label: '抵达日期'},
     };
 
     setSearchValues(obj, values) {
@@ -467,8 +813,10 @@ class CustomerServices {
       this.selectedAgent = obj.agency;
       this.startDateString = obj.Date1;
       this.endDateString = obj.Date2;
+      this.startDateDiffString = obj.DateDiff1;
+      this.endDateDiffString = obj.DateDiff2;
       this.selectedCountry = obj.countryArea;
-      this.selectedTeam = obj.DepartmentList.replace('ALL', '');
+      this.selectedTeam = (obj.DepartmentList || '').replace('ALL', '');
       this.selectedOrderStatus = obj.orderStatus;
     }
 
@@ -519,6 +867,15 @@ class CustomerServices {
     destinationGroupCount = [];
     destinationGroupCountColumns =[];
 
+    destinationGroupList = [];
+    destinationGroupListColumns = [];
+    // 国籍统计
+    nationality_count_data = {
+      loading: false,
+      destinationGroupByCountryList:[],
+      destinationGroupByCountryListColumns:[]
+    };
+
     agentGroupList = [{
       EOI_ObjSN: 1,
       VendorName: '---',

src/stores/CustomerStore.js

@@ -1,7 +1,9 @@
-import {makeAutoObservable, runInAction} from "mobx";
+import {makeAutoObservable, runInAction, toJS } from "mobx";
 import { fetchJSON } from '../utils/request';
 import * as config from "../config";
 import { groupsMappedByKey, sitesMappedByCode, pivotBy } from './../libs/ht';
+import { sortBy, show_vs_tag, formatPercent, groupBy, isEmpty, uniqWith, formatPercentToFloat } from "../utils/commons";
+import moment from 'moment';
 
 /**
  * 用于透视的数据
@@ -99,8 +101,12 @@ class CustomerStore {
 
 
     //  老客户 beign
-    regular_customer_order(get_detail = false) {
+    // isCompare对比数据boolean isCompareRender对比折线boolean
+    regular_customer_order(get_detail = false, isCompare = false, isCompareRender=false) {
+        let pivotByOrder = 'SumOrder';
+        let pivotByDate = 'applyDate';
         this.regular_data.loading = true;
+        this.regular_data.detail_loading = get_detail;
         const date_picker_store = this.rootStore.date_picker_store;
         let url = '/service-tourdesign/RegularCusOrder';
         url += '?Website=' + this.regular_data.webcode.toString() + '&DEI_SNList=' + this.regular_data.groups.toString();
@@ -108,37 +114,162 @@ class CustomerStore {
             url += '&ApplydateCheck=1&EntrancedateCheck=0&ConfirmDateCheck=0';
         } else if(String(this.regular_data.date_type).toLowerCase() === 'confirmdate'){
             url += '&ApplydateCheck=0&EntrancedateCheck=0&ConfirmDateCheck=1';
+            pivotByOrder = 'ConfirmOrder';
+            pivotByDate = 'confirmDate';
         }else {
             url += '&ApplydateCheck=0&EntrancedateCheck=1&ConfirmDateCheck=0';
+            pivotByOrder = 'ConfirmOrder';
+            pivotByDate = 'startDate';
+        }
+        if (isCompare){
+            url += '&ApplydateStart=' + date_picker_store.start_date_cp.format(config.DATE_FORMAT) + '&ApplydateEnd=' + date_picker_store.end_date_cp.format(config.SMALL_DATETIME_FORMAT);
+            url += '&EntrancedateStart=' + date_picker_store.start_date_cp.format(config.DATE_FORMAT) + '&EntrancedateEnd=' + date_picker_store.end_date_cp.format(config.SMALL_DATETIME_FORMAT);
+            url += '&ConfirmdateStart=' + date_picker_store.start_date_cp.format(config.DATE_FORMAT) + '&ConfirmdateEnd=' + date_picker_store.end_date_cp.format(config.SMALL_DATETIME_FORMAT);
+        }
+        else{
+            url += '&ApplydateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&ApplydateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
+            url += '&EntrancedateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&EntrancedateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
+            url += '&ConfirmdateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&ConfirmdateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
         }
-        url += '&ApplydateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&ApplydateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
-        url += '&EntrancedateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&EntrancedateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
-        url += '&ConfirmdateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&ConfirmdateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
         if (get_detail) {
             url += '&IsDetail=1';
         } else {
             url += '&IsDetail=0';
         }
         url += `&IncludeTickets=${this.regular_data.include_tickets}`;
-
+        return new Promise((resolve, reject) => {
         fetch(config.HT_HOST + url)
             .then((response) => response.json())
             .then((json) => {
                 runInAction(() => {
                     if (get_detail) {
-                        this.regular_data.data_detail = json;
-                        const dump_l = (json || []).filter(ele => ele.COLI_IsOld !== '' && ele.COLI_IsCusCommend !== '').length;
-                        this.regular_data.total_data_tips = dump_l > 0 ? `包含 ${dump_l} 条同时勾选的数据` : '';
+                        if (!isCompare){
+                            this.regular_data.data_detail = json;
+                        }
+                        if (isCompareRender){
+                            this.regular_data.solidLineTime=date_picker_store.start_date.format(config.DATE_FORMAT)+ '-' +date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
+                            this.regular_data.solidLineCompareTime=date_picker_store.start_date_cp.format(config.DATE_FORMAT)+ '-' +date_picker_store.end_date_cp.format(config.SMALL_DATETIME_FORMAT);
+                            const dump_l = (json || []).filter(ele => ele.COLI_IsOld !== '' && ele.COLI_IsCusCommend !== '').length;
+                            this.regular_data.total_data_tips = dump_l > 0 ? `包含 ${dump_l} 条同时勾选的数据` : '';
+                            /** 使用明细数据画图 */
+                            const data_detail = (json || []).map((ele) => ({
+                            ...ele,
+                            key: ele.COLI_ID,
+                            orderState: ele.OrderState,
+                            applyDate: moment(ele.COLI_ApplyDate).format('YYYY-MM-DD'),
+                            startDate: ele.COLI_OrderStartDate,
+                            confirmDate: moment(ele.COLI_ConfirmDate).format('YYYY-MM-DD'),
+                            }));
+                            const { data: IsOldData, } = pivotBy(data_detail.filter(ele => ele.COLI_IsOld === '是'), [['COLI_IsOld', ], [], pivotByDate]);
+                            const { data: isCusCommendData, } = pivotBy(data_detail.filter(ele => ele.COLI_IsCusCommend === '是'), [['COLI_IsCusCommend', ], [], pivotByDate]);
+                            // console.log('IsOldData====', IsOldData, '\nisCusCommend', isCusCommendData);
+                            // 合并成两个系列
+                            const seriesData = [].concat(IsOldData.map(ele => ({...ele, _ylabel: '老客户'})), isCusCommendData.map(ele => ({...ele, _ylabel: '老客户推荐'})),).sort(sortBy(pivotByDate));
+                            const seriesNewData = seriesData.map(item => {
+                                if (isCompare){
+                                    return {
+                                        ...item,
+                                        _ylabel: date_picker_store.start_date_cp.format(config.DATE_FORMAT)+ '-' +date_picker_store.end_date_cp.format(config.SMALL_DATETIME_FORMAT) + item._ylabel
+                                    };
+                                }
+                                else{
+                                    return {
+                                        ...item,
+                                        _ylabel: date_picker_store.start_date.format(config.DATE_FORMAT)+ '-' +date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT) + item._ylabel
+                                    };
+                                }
+                            });
+                            // console.log('seriesData====', seriesNewData);
+                            if (this.regular_data.data_compare.length===0){
+                                this.regular_data.data_compare=seriesNewData;
+                            }
+                            else{
+                                let seriesCompareData = [];
+                                const fistCompareDetail = this.regular_data.data_compare;
+                                if (fistCompareDetail.length>seriesNewData.length){
+                                    seriesCompareData = fistCompareDetail;
+                                    for (let i = 0; i < seriesNewData.length; i++) {
+                                        seriesNewData[i][pivotByDate] = fistCompareDetail[i][pivotByDate];
+                                    }
+                                    seriesCompareData.push(...seriesNewData);
+                                }
+                                else{
+                                    seriesCompareData=seriesNewData;
+                                    for (let i = 0; i < fistCompareDetail.length; i++) {
+                                        fistCompareDetail[i][pivotByDate] = seriesNewData[i][pivotByDate];
+                                    }
+                                    seriesCompareData.push(...fistCompareDetail);
+                                }
+                                this.regular_data.detail_loading = false;
+                                this.regular_data.pivotData = seriesCompareData; // { IsOldData, isCusCommendData, };
+                                this.regular_data.pivotY = pivotByOrder;
+                                this.regular_data.pivotX = pivotByDate;
+                            }
+                        }
+                        else{
+                            this.regular_data.detail_loading = false;
+                            const dump_l = (json || []).filter(ele => ele.COLI_IsOld !== '' && ele.COLI_IsCusCommend !== '').length;
+                            this.regular_data.total_data_tips = dump_l > 0 ? `包含 ${dump_l} 条同时勾选的数据` : '';
+                            /** 使用明细数据画图 */
+                            const data_detail = (json || []).map((ele) => ({
+                            ...ele,
+                            key: ele.COLI_ID,
+                            orderState: ele.OrderState,
+                            applyDate: moment(ele.COLI_ApplyDate).format('YYYY-MM-DD'),
+                            startDate: ele.COLI_OrderStartDate,
+                            confirmDate: moment(ele.COLI_ConfirmDate).format('YYYY-MM-DD'),
+                            }));
+                            const { data: IsOldData, } = pivotBy(data_detail.filter(ele => ele.COLI_IsOld === '是'), [['COLI_IsOld', ], [], pivotByDate]);
+                            const { data: isCusCommendData, } = pivotBy(data_detail.filter(ele => ele.COLI_IsCusCommend === '是'), [['COLI_IsCusCommend', ], [], pivotByDate]);
+                            // console.log('IsOldData====', IsOldData, '\nisCusCommend', isCusCommendData);
+                            // 合并成两个系列
+                            const seriesData = [].concat(IsOldData.map(ele => ({...ele, _ylabel: '老客户'})), isCusCommendData.map(ele => ({...ele, _ylabel: '老客户推荐'})),).sort(sortBy(pivotByDate));
+                            this.regular_data.pivotData = seriesData; // { IsOldData, isCusCommendData, };
+                            this.regular_data.pivotY = pivotByOrder;
+                            this.regular_data.pivotX = pivotByDate;
+                        }
                     } else {
-                        this.regular_data.data = json;
+                        if (isCompare){
+                            const result = [];
+                            const firstCompareData = this.regular_data.data;
+                            for (const item1 of firstCompareData) {
+                                for (const item2 of json) {
+                                    if (item1.ItemName === item2.ItemName) {
+                                        result.push({
+                                            ItemName: item1.ItemName,
+                                            OrderNum: show_vs_tag(formatPercent((item1.OrderNum-item2.OrderNum)/(item2.OrderNum===0?1:item2.OrderNum)),
+                                            item1.OrderNum-item2.OrderNum,item1.OrderNum,item2.OrderNum),
+                                            SUCOrderNum: show_vs_tag(formatPercent((item1.SUCOrderNum-item2.SUCOrderNum)/(item2.SUCOrderNum===0?1:item2.SUCOrderNum)),
+                                            item1.SUCOrderNum-item2.SUCOrderNum,item1.SUCOrderNum,item2.SUCOrderNum),
+                                            OrderRate: show_vs_tag(formatPercent((item1.OrderRate-item2.OrderRate)/item2.OrderRate),
+                                            formatPercentToFloat(item1.OrderRate-item2.OrderRate),formatPercentToFloat(item1.OrderRate),formatPercentToFloat(item2.OrderRate)),
+                                            SUCRate: show_vs_tag(formatPercent((item1.SUCRate-item2.SUCRate)/(item2.SUCRate===0?1:item2.SUCRate)),
+                                            formatPercent(item1.SUCRate-item2.SUCRate),formatPercent(item1.SUCRate),formatPercent(item2.SUCRate)),
+                                            ML: show_vs_tag(formatPercent((item1.ML-item2.ML)/(item2.ML===0?1:item2.ML)),
+                                            (item1.ML-item2.ML).toFixed(2),item1.ML,item2.ML),
+                                            OrderMLRate: show_vs_tag(formatPercent((item1.OrderMLRate-item2.OrderMLRate)/item2.OrderMLRate),
+                                            formatPercentToFloat(item1.OrderMLRate-item2.OrderMLRate),formatPercentToFloat(item1.OrderMLRate),formatPercentToFloat(item2.OrderMLRate)),
+                                            PersonNum: show_vs_tag(formatPercent((item1.PersonNum-item2.PersonNum)/(item2.PersonNum===0?1:item2.PersonNum)),
+                                            item1.PersonNum-item2.PersonNum,item1.PersonNum,item2.PersonNum),
+                                        });
+                                    }
+                                }
+                            };
+                            this.regular_data.data = result;
+                        }
+                        else{
+                            this.regular_data.data = json;
+                        }
                     }
                     this.regular_data.loading = false;
+                    resolve();
                 });
             })
             .catch((error) => {
                 this.regular_data.loading = false;
                 console.log('fetch data failed', error);
             });
+        });
     }
 
     handleChange_webcode_regular = (value) => {
@@ -159,8 +290,15 @@ class CustomerStore {
 
     regular_data = {
         loading: false,
+        detail_loading: false,
         data: [],
         data_detail: [],
+        data_compare: [],
+        showCompareSum:false,
+        solidLineTime:'',
+        solidLineCompareTime:'',
+        solidLineDash:'老客户推荐',
+        isCompareLine:false,
         total_data_tips: '',
         webcode: 'ALL',
         site_select_mode: 'multiple',// 站点是否多选
@@ -176,9 +314,14 @@ class CustomerStore {
 
         searchValues: {
           DepartmentList: ['1', '2', '28', '7'].map(kk => groupsMappedByKey[kk]),
-          WebCode: undefined, // ['ALL'].map(kk => sitesMappedByCode[kk]),
+          WebCode: ['CHT','AH','JH','GH','ZWQD','GH_ZWQD_HW','GHKYZG','GHKYHW'].map(kk => sitesMappedByCode[kk]),
           DateType: { key: 'applyDate', label: '提交日期'},
+          IncludeTickets: { key: '0', label: '不含门票' },
         },
+
+        pivotData: [],
+        pivotY: 'SumOrder',
+        pivotX: 'applyDate',
     };
 //  老客户 end
 
@@ -261,55 +404,186 @@ class CustomerStore {
     };
 //  在华客人 end
 
+//  东道主项目 begin
+
+    host_case_data = {
+        loading: false,
+        summaryData: [], // 汇总数据
+        groupData: [],  // 小组数据
+        counselorData: [],  // 顾问数据
+        singleDetailData:[], // 单团详细数据
+        group_select_mode: 'multiple',
+        groups: ['1', '2', '28', '7'],
+        searchValues: {
+          DepartmentList: ['1', '2', '28', '7'].map(kk => groupsMappedByKey[kk]),
+        },
+      };
+
+    getHostCaseData(groupBy) {
+        this.host_case_data.loading = true;
+        const date_picker_store = this.rootStore.date_picker_store;
+        let url = '/service-Analyse2/DDZCount';
+        url += '?DEI_SN=' + this.host_case_data.groups.toString();
+        url += '&ArriveDateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&ArriveDateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
+        url += '&GroupBy=' + groupBy;
+        fetch(config.HT_HOST + url)
+            .then((response) => response.json())
+            .then((json) => {
+                runInAction(() => {
+                    switch(groupBy){
+                        case "1":
+                            this.host_case_data.summaryData = json.result?json.result:[];
+                            break;
+                        case "2":
+                            this.host_case_data.counselorData = json.result?json.result:[];
+                            break;
+                        case "3":
+                            this.host_case_data.groupData = json.result?json.result:[];
+                            break;
+                        case "4":
+                            this.host_case_data.singleDetailData = json.result?json.result:[];
+                            this.host_case_data.loading = false;
+                            break;
+                    }
+                });
+            })
+            .catch((error) => {
+                this.host_case_data.loading = false;
+                console.log('fetch data failed', error);
+            });
+    };
+//  东道主项目 end
+
+    // 销售-老客户
     sales_regular_data = {
       loading: false,
-      data: [],
-      mergedData: [],
+      // data: [],
+      // mergedData: [],
       rawData: [],
       searchValues: {
         DepartmentList: ['1', '2', '28', '7'].map(kk => groupsMappedByKey[kk]),
-        WebCode: undefined, // ['ALL'].map(kk => sitesMappedByCode[kk]),
+        WebCode: ['CHT','AH','JH','GH','ZWQD','GH_ZWQD_HW','GHKYZG','GHKYHW'].map(kk => sitesMappedByCode[kk]),
         DateType: { key: 'applyDate', label: '提交日期'},
+        IncludeTickets: { key: '0', label: '不含门票' },
       },
+      // pivotData: {
+      //   operatorName: { loading: false, data: [], rawData: [], mergedData: [], filterColValues: [] },
+      //   country: { loading: false, data: [], rawData: [], mergedData: [], filterColValues: [] },
+      // },
+      pivotResult: [],
+      filterColValues: [],
+      rawDataArr: [],
     };
 
-    get_sales_regular_data = async (param) => {
+    get_sales_regular_data_vs = async (param, pivotRow = 'operatorName', pivotCol = 'hasOld') => {
       this.sales_regular_data.loading = true;
-      const rawData = await getDetailData({...param, IncludeTickets: 1});
-      const filterHasOld = rawData.filter(ele => (ele.IsOld === '1' || ele.isCusCommend === '1')).map(e => ({...e, operatorNameB: e.operatorName.replace(/\([^)]*\)/gi, '').toLowerCase()}));
-
-      const { data: hasOldData, } = pivotBy(filterHasOld, [['hasOld', 'operatorName'], [], []]);
-      const { data: IsOldData, } = pivotBy(filterHasOld.filter(ele => ele.IsOld === '1'), [['operatorName', 'IsOld_txt', ], [], []]);
-      const { data: isCusCommendData, } = pivotBy(filterHasOld.filter(ele => ele.isCusCommend === '1'), [['operatorName', 'isCusCommend_txt', ], [], []]);
-      // console.log('IsOldData====', IsOldData, '\nisCusCommend', isCusCommendData);
-      // console.log('data====', rawData, '\ncolumnValues', columnValues, '\nsummaryRows', summaryRows, '\nsummaryColumns', summaryColumns, '\nsummaryMix', summaryMix, '\nhasOld',filterHasOld);
-      const mergeDataBySales = hasOldData.map((ele) => ({
-        ...ele,
-        children: [].concat(
-          IsOldData.filter((ele1) => ele1.operatorName === ele.operatorName).map(o => ({...o, operatorName: o.IsOld_txt, key: o.rowLabel})),
-          isCusCommendData.filter((ele2) => ele2.operatorName === ele.operatorName).map(o => ({...o, operatorName: o.isCusCommend_txt, key: o.rowLabel}))
-        ),
-      }));
+      const hasCompare = !isEmpty(param.DateDiff1);
+      const [result1, result2] = await Promise.all([
+        this.get_sales_regular_data(param),
+        hasCompare ? this.get_sales_regular_data({...param, Date1: param.DateDiff1, Date2: param.DateDiff2}) : { filterHasOld: []},
+      ]);
 
       // 合并顾问的账户
-      const { data: hasOldDataSales, } = pivotBy(filterHasOld, [['hasOld', 'operatorNameB'], [], []]);
-      const { data: IsOldDataSales, } = pivotBy(filterHasOld.filter(ele => ele.IsOld === '1'), [['operatorNameB', 'IsOld_txt', ], [], []]);
-      const { data: isCusCommendDataSales, } = pivotBy(filterHasOld.filter(ele => ele.isCusCommend === '1'), [['operatorNameB', 'isCusCommend_txt', ], [], []]);
-      const mergeDataBySalesAccount = hasOldDataSales.map((ele) => ({
-        ...ele,
-        operatorName: ele.operatorNameB,
-        children: [].concat(
-          IsOldDataSales.filter((ele1) => ele1.operatorNameB === ele.operatorNameB).map(o => ({...o, operatorName: o.IsOld_txt, key: o.rowLabel})),
-          isCusCommendDataSales.filter((ele2) => ele2.operatorNameB === ele.operatorNameB).map(o => ({...o, operatorName: o.isCusCommend_txt, key: o.rowLabel}))
-        ),
+      // let mergeDataBySalesAccount = [];
+      // if (pivotRow === 'operatorName') {
+      //   const allSalesMerged = Array.from(new Set([...result1.mergeDataBySalesAccount.map(row=>row.operatorName), ...result2.mergeDataBySalesAccount.map(row=>row.operatorName)]));
+      //   const salesM1 = groupBy(result1.mergeDataBySalesAccount, 'operatorName');
+      //   const salesM2 = groupBy(result2.mergeDataBySalesAccount, 'operatorName');
+      //   mergeDataBySalesAccount = allSalesMerged.reduce((r, sale) => {
+      //     const _default = { operatorName: sale, rowLabel: salesM1?.[sale]?.rowLabel || salesM2?.[sale]?.rowLabel, children: salesM1?.[sale]?.children || [], key: sale};
+      //     const operatorRow = {...(salesM1?.[sale]?.[0] || _default), vsData: salesM2?.[sale]?.[0] || {}};
+      //     // 展开的两项: '老客户', '老客户推荐'
+      //     const series1Children = salesM1?.[sale]?.[0]?.children || [];
+      //     const series2Children = salesM2?.[sale]?.[0]?.children || [];
+      //     const children = allTypes.reduce((r, type) => {
+      //       const _default = { operatorName: type, rowLabel: type, key: type};
+      //       const _typeRow = series1Children.find(sc => sc.operatorName === type) || _default;
+      //       const _typeVSRow = series2Children.find(sc => sc.operatorName === type) || {};
+      //       return r.concat({..._typeRow, vsData: _typeVSRow});
+      //     }, []);
+      //     operatorRow.children = children;
+      //     return r.concat(operatorRow);
+      //   }, []);
+      // }
+
+
+      this.sales_regular_data.loading = false;
+      this.sales_regular_data.rawData = [].concat(result1.filterHasOld, result2.filterHasOld);
+      this.sales_regular_data.rawDataArr = [result1, result2];
+    };
+
+    get_sales_regular_data = async (param) => {
+      const seriesKey = `${param.Date1}至${param.Date2}`;
+      const rawData = await getDetailData({...param, });
+      const filterHasOld = rawData.filter(ele => (ele.IsOld === '1' || ele.isCusCommend === '1')).map(e => ({
+        ...e,
+        seriesKey,
+        operatorNameB: e.operatorName.replace(/\([^)]*\)/gi, '').toLowerCase(),
       }));
+
+      // 合并顾问的账户
+      // let mergeDataBySalesAccount = [];
+      // if (pivotRow === 'operatorName') {
+      //   const { data: hasOldDataSales, } = pivotBy(filterHasOld, [['hasOld', 'operatorNameB'], [], []]);
+      //   const { data: IsOldDataSales, } = pivotBy(filterHasOld.filter(ele => ele.IsOld === '1'), [['operatorNameB', 'IsOld_txt', ], [], []]);
+      //   const { data: isCusCommendDataSales, } = pivotBy(filterHasOld.filter(ele => ele.isCusCommend === '1'), [['operatorNameB', 'isCusCommend_txt', ], [], []]);
+      //   mergeDataBySalesAccount = hasOldDataSales.map((ele) => ({
+      //     ...ele,
+      //     operatorName: ele.operatorNameB,
+      //     seriesKey,
+      //     children: [].concat(
+      //       IsOldDataSales.filter((ele1) => ele1.operatorNameB === ele.operatorNameB).map(o => ({...o, operatorName: o.IsOld_txt, key: o.rowLabel, seriesKey,})),
+      //       isCusCommendDataSales.filter((ele2) => ele2.operatorNameB === ele.operatorNameB).map(o => ({...o, operatorName: o.isCusCommend_txt, key: o.rowLabel, seriesKey,}))
+      //     ),
+      //   }));
+      // }
       // console.log('IsOldDataSales====', IsOldDataSales, '\nisCusCommendDataSales', isCusCommendDataSales);
-      // console.log('mergeDataBySalesAccount====', mergeDataBySalesAccount);
+      // console.log('mergeDataByRow====\n', mergeDataByRow);
+      // return { mergeDataBySales, mergeDataBySalesAccount, filterHasOld };
+      return { filterHasOld };
+    };
 
-      this.sales_regular_data.loading = false;
-      this.sales_regular_data.data = mergeDataBySales;
-      this.sales_regular_data.mergedData = mergeDataBySalesAccount;
-      this.sales_regular_data.rawData = filterHasOld;
+    regular_data_pivot = (pivotRow, pivotCol) => {
+      // console.clear();
+      // this.sales_regular_data.rawData;
+      // console.log('regular_data_pivot -------------------------------------------------------------- rawData 000 ', toJS(this.sales_regular_data.rawData));
+      // console.log('regular_data_pivot ---- ', pivotRow, pivotCol);
+      const [result1, result2] = this.sales_regular_data.rawDataArr;
+      const allRows = Array.from(new Set([...result1.filterHasOld.map(row=>row[pivotRow]), ...result2.filterHasOld.map(row=>row[pivotRow])]));
+      // console.log(' ------ allRows', allRows);
+      const [pivot1, pivot2] = [result1, result2].map(_result => {
+        const dataColField = pivotCol.replace('_txt', '');
+        const rawData = pivotCol === 'hasOld' ? _result.filterHasOld : _result.filterHasOld.filter((ele) => ele[dataColField] === '1');
+        const { data: pivotResult } = pivotBy(rawData, [[pivotRow, pivotCol], [], []]);
+        return pivotResult;
+      });
+      const rows1 = groupBy(pivot1, pivotRow);
+      const rows2 = groupBy(pivot2, pivotRow);
+      const pivotResultWithCompare = isEmpty(pivot2) ? pivot1 : allRows.reduce((r, rowName) => {
+        const _default = { [pivotRow]: rowName, rowLabel: rows1?.[rowName]?.rowLabel || rows2?.[rowName]?.rowLabel, children: rows1?.[rowName], key: rowName};
+        const operatorRow = {...(rows1?.[rowName]?.[0] || _default), vsData: rows2?.[rowName]?.[0] || {}};
+        // 展开的两项: '老客户', '老客户推荐'
+        // const series1Children = rows1?.[rowName]?.[0]?.children || [];
+        // const series2Children = rows2?.[rowName]?.[0]?.children || [];
+        // const children = allTypes.reduce((r, type) => {
+        //   const _default = { [pivotRow]: type, rowLabel: type, key: type};
+        //   const _typeRow = series1Children.find(sc => sc[pivotRow] === type) || _default;
+        //   const _typeVSRow = series2Children.find(sc => sc[pivotRow] === type) || {};
+        //   return r.concat({..._typeRow, vsData: _typeVSRow});
+        // }, []);
+        // operatorRow.children = children;
+        return r.concat(operatorRow);
+      }, []);
+      // console.log(' ------ pivot1', pivot1, '\npivot2', pivot2, '\npivotResultWithCompare', pivotResultWithCompare);
+
+      const filterColValues = uniqWith(
+        allRows.map((rr) => ({ text: rr, value: rr })),
+        (a, b) => JSON.stringify(a) === JSON.stringify(b)
+      ).sort((a, b) => a.text.localeCompare(b.text, 'zh-CN'));
+
+
+      this.sales_regular_data.pivotResult = pivotResultWithCompare;
+      this.sales_regular_data.filterColValues = filterColValues;
     };
 
     setSearchValues(obj, values, target) {

src/stores/HotelCruise.js

@@ -0,0 +1,202 @@
+import { makeAutoObservable, runInAction, toJS } from 'mobx';
+import { fetchJSON } from '../utils/request';
+import { isEmpty, sortDescBy, objectMapper, groupBy, pick, unique, cloneDeep, omit, fixTo2Decimals } from '../utils/commons';
+import { groupsMappedByCode, dataFieldAlias } from './../libs/ht';
+import { DATE_FORMAT, SMALL_DATETIME_FORMAT } from './../config';
+import moment from 'moment';
+
+const fetchHotelData = async (param) => {
+  const defaultParam = {
+    DEI_SN: '',
+    City: '',
+    OrderState: '',
+    BookingType: '-1',
+    RecommendedLevel: '-1',
+    Star: '-1',
+    ArriveDateCheck: '0',
+    ArriveDateStart: '',
+    ArriveDateEnd: '',
+    ConfirmDateCheck: '0',
+    ConfirmDateStart: '',
+    ConfirmDateEnd: '',
+    Compare: '0',
+    CompareDateStart: '',
+    CompareDateEnd: '',
+    Area: '-1',
+  };
+  const json = await fetchJSON('/service-Analyse2/HotelReservation', { ...defaultParam, ...param });
+  return json.errcode === 0 ? json.result || [] : [];
+};
+
+const fetchCruiseData = async (param) => {
+  const defaultParam = {
+    DEI_SN: '',
+    OrderState: '', // 0: 不成行 1: 成行
+    ArriveDateStart: '',
+    ArriveDateEnd: '',
+    Compare: '',
+    CompareDateStart: '',
+    CompareDateEnd: '',
+    BookingType: '', // 0: 非单订三峡，1: 单订三峡
+    ProductName: '',
+    Direction: '', // 1: 上水 2: 下水
+    VEI_SN: '-1', // 只要列出常用游船供应商选择
+    RoomNumStart: '0',
+    RoomNumEnd: '',
+    PersonNumStart: '0',
+    PersonNumEnd: '',
+    Country: '-1',
+  };
+  const json = await fetchJSON('/service-Analyse2/CruiseReservation', { ...defaultParam, ...param });
+  return json.errcode === 0 ? json.result || [] : [];
+};
+
+const paramKeyMapped = {
+  'DateType': [
+    { key: 'ArriveDateCheck', transform: (val) => (val === 'startDate' ? '1' : '0') },
+    { key: 'ConfirmDateCheck', transform: (val) => (val === 'confirmDate' ? '1' : '0') },
+    // { key: 'ApplyDateCheck', transform: (val) => (val === 'applyDate' ? '1' : '0') },
+  ],
+  'DepartmentList': { key: 'DEI_SN' },
+  'orderStatus': { key: 'OrderState' },
+  'Date1': [{ key: 'ArriveDateStart' }, { key: 'ConfirmDateStart' }],
+  'Date2': [{ key: 'ArriveDateEnd' }, { key: 'ConfirmDateEnd' }],
+  'DateDiff1': { key: 'CompareDateStart' },
+  'DateDiff2': { key: 'CompareDateEnd' },
+  'keyword': { key: 'ProductName' },
+  'agency': { key: 'VEI_SN' },
+  'cruiseDirection': { key: 'Direction' },
+  'cruiseBookType': { key: 'BookingType' },
+  'hotelStar': { key: 'Star' },
+  'hotelRecommandRate': { key: 'RecommendedLevel' },
+  'hotelBookType': { key: 'BookingType' },
+  'country': { key: 'Country' },
+  'countryArea': { key: 'Area', transform: (val) => (val === 'china' ? '1' : val === 'foreign' ? '0' : '-1') },
+};
+
+class HotelCruise {
+  constructor(appStore) {
+    this.appStore = appStore;
+    makeAutoObservable(this);
+  }
+
+  async getCruiseData(param = {}) {
+    this.cruise.loading = true;
+    this.cruise.dataSource = [];
+    const _queryParam = objectMapper(param, paramKeyMapped);
+    const queryParam = omit({ ...this.searchValuesToSub, ..._queryParam }, Object.keys(paramKeyMapped));
+    queryParam.Compare = isEmpty(param.DateDiff1) ? '' : '1';
+    const res = await fetchCruiseData(queryParam);
+    const resCP =
+      queryParam.Compare === ''
+        ? res
+        : (res || []).map((ele) => ({
+            ...ele,
+            // 计算 增长率 = (当前值 - 上次值) / 上次值 * 100
+            TotalNumPercent: ele.CPTotalNum ? fixTo2Decimals(((ele.TotalNum - ele.CPTotalNum) / ele.CPTotalNum) * 100) : '-',
+            TotalPersonNumPercent: ele.CPTotalPersonNum ? fixTo2Decimals(((ele.TotalPersonNum - ele.CPTotalPersonNum) / ele.CPTotalPersonNum) * 100) : '-',
+            TotalProfitPercent: ele.CPTotalProfit ? fixTo2Decimals(((ele.TotalProfit - ele.CPTotalProfit) / ele.CPTotalProfit) * 100) : '-',
+          }));
+    const summaryRow = ['TotalNum', 'TotalPersonNum', 'TotalProfit', 'CPTotalNum', 'CPTotalPersonNum', 'CPTotalProfit'].reduce(
+      (r, skey) => ({
+        ...r,
+        [skey]: resCP.reduce((a, c) => a + c[skey], 0),
+      }),
+      { ProductName: '合计' }
+    );
+    const summaryDelta = ['TotalNum', 'TotalPersonNum', 'TotalProfit'].reduce(
+      (r, skey) => ({
+        ...r,
+        [`${skey}Percent`]: queryParam.Compare === '' ? null : fixTo2Decimals(((summaryRow[skey] - summaryRow[`CP${skey}`]) / summaryRow[`CP${skey}`]) * 100),
+      }),
+      {}
+    );
+    runInAction(() => {
+      this.cruise.loading = false;
+      this.cruise.dataSource = resCP;
+      this.cruise.summaryRow = { ...summaryRow, ...summaryDelta };
+    });
+    return this.cruise;
+  }
+
+  async getHotelData(param = {}) {
+    this.hotel.loading = true;
+    this.hotel.dataSource = [];
+    const _queryParam = objectMapper(param, paramKeyMapped);
+    const queryParam = omit({ ...this.searchValuesToSub, ..._queryParam }, Object.keys(paramKeyMapped));
+    queryParam.Compare = isEmpty(param.DateDiff1) ? '0' : '1';
+    const _res = await fetchHotelData(queryParam);
+    const res = (_res || []).map((ele) => ({ ...ele, RecommendRate_100: fixTo2Decimals(ele.RecommendRate * 100) + '%' }));
+    const resCP =
+      queryParam.Compare === '0'
+        ? res
+        : (res || []).map((ele) => ({
+            ...ele,
+            TotalNumPercent: ele.CPTotalNum ? fixTo2Decimals(((ele.TotalNum - ele.CPTotalNum) / ele.CPTotalNum) * 100) : '-',
+            RecomendNumPercent: ele.CPRecomendNum ? fixTo2Decimals(((ele.RecomendNum - ele.CPRecomendNum) / ele.CPRecomendNum) * 100) : '-',
+            RecommendRateDelta: fixTo2Decimals((ele.RecommendRate - (ele.CPRecommendRate || 0)) * 100),
+            CPRecommendRate_100: fixTo2Decimals(ele.CPRecommendRate * 100) + '%',
+          }));
+    const summaryRow = ['TotalNum', 'RecomendNum', ].reduce(
+      (r, skey) => ({
+        ...r,
+        [skey]: resCP.reduce((a, c) => a + c[skey], 0),
+        [`CP${skey}`]: resCP.reduce((a, c) => a + c[`CP${skey}`], 0),
+      }),
+      { CityName: '合计' }
+    );
+    summaryRow.RecommendRate = fixTo2Decimals(summaryRow.RecomendNum/summaryRow.TotalNum);
+    summaryRow.RecommendRate_100 = fixTo2Decimals(summaryRow.RecommendRate * 100) + '%';
+    summaryRow.CPRecommendRate = fixTo2Decimals(summaryRow.CPRecomendNum/summaryRow.CPTotalNum);
+    summaryRow.CPRecommendRate_100 = fixTo2Decimals(summaryRow.CPRecommendRate * 100) + '%';
+    const summaryDelta = ['TotalNum', 'RecomendNum', ].reduce(
+      (r, skey) => ({
+        ...r,
+        [`${skey}Percent`]: queryParam.Compare === '0' ? null : fixTo2Decimals(((summaryRow[skey] - summaryRow[`CP${skey}`]) / summaryRow[`CP${skey}`]) * 100),
+      }),
+      {}
+    );
+    summaryDelta.RecommendRateDelta = queryParam.Compare === '0' ? undefined : fixTo2Decimals((summaryRow.RecommendRate - (summaryRow.CPRecommendRate || 0)) * 100);
+    const resfilter = resCP.map(row => ({text: row.CityName, value: row.CityName})); // .sort((a, b) => a.text.localeCompare(b.text));
+    runInAction(() => {
+      this.hotel.loading = false;
+      this.hotel.dataSource = resCP;
+      this.hotel.filters = resfilter;
+      this.hotel.summaryRow = { ...summaryRow, ...summaryDelta };
+    });
+  }
+
+  searchValues = {
+    date: moment(),
+    DateType: { key: 'confirmDate', label: '确认日期' },
+    WebCode: { key: '', label: '所有来源' },
+    // IncludeTickets: { key: '1', label: '含门票'},
+    DepartmentList: [{ key: '', label: '所有小组' }],
+    operator: '-1',
+    opisn: '-1',
+  };
+
+  searchValuesToSub = {};
+
+  setSearchValues(obj, values) {
+    this.searchValues = { ...this.searchValues, ...values };
+    this.searchValuesToSub = obj;
+  }
+
+  cruise = { loading: false, dataSource: [], summaryRow: {}, filters: [] };
+  hotel = { loading: false, dataSource: [], summaryRow: {}, filters: [] };
+  resetData = () => {
+    this.results.loading = false;
+    for (const key of Object.keys(this.results)) {
+      if (key !== 'loading') {
+        this.results[key] = [];
+      }
+    }
+    for (const key of Object.keys(this.hotel)) {
+      if (key !== 'loading') {
+        this.hotel[key] = [];
+      }
+    }
+  };
+}
+export default HotelCruise;

src/stores/Index.js

@@ -18,6 +18,7 @@ import DataPivot from './DataPivot';
 import MeetingData from './MeetingData2024';
 import MeetingData2025 from './MeetingData2025';
 import SalesCRMData from './SalesCRMData';
+import HotelCruise from './HotelCruise';
 class Index {
     constructor() {
         this.dashboard_store = new DashboardStore(this);
@@ -39,6 +40,7 @@ class Index {
         this.MeetingDataStore = new MeetingData(this);
         this.MeetingData2025Store = new MeetingData2025(this);
         this.SalesCRMDataStore = new SalesCRMData(this);
+        this.HotelCruiseStore = new HotelCruise(this);
         makeAutoObservable(this);
     }
 

src/stores/MeetingData2024.js

@@ -33,8 +33,8 @@ const getAgentGroupInfoALL = async (param) => {
   const paramBody = objectMapper(param, {
     DateType: 'DateType',
     DepartmentList: 'DepList', // { key: 'DepartmentList', transform: (v) => v.join(',') },
-    Date1: 'OldDate1',
-    Date2: 'OldDate2',
+    // Date1: 'OldDate1',
+    // Date2: 'OldDate2',
   });
   const url = '/service-web/QueryData/GetAgentGroupInfoALL';
   const json = await fetchJSON(url, paramBody);
@@ -132,23 +132,23 @@ const dataSales = (tKey, rawData, yearData, yearData2) => {
   const exceptTargetList = Object.keys(GHCountryListSetting).reduce((r, c, i) => r.concat(i < tIndex ? GHCountryListSetting[c] : []), []);
   // console.log(tIndex, tKey, 'exceptTargetList', exceptTargetList, 'targetList', targetList);
 
-  const filterRaw1 = rawData.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
+  const filterRaw1 = rawData.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry.includes(item)));
   // console.log(tKey, 'filterRaw1', filterRaw1);
-  const filterDataC = filterRaw1.filter((ele) => targetList.some((item) => ele.destinationCountry_AsJOSN.includes(item)));
+  const filterDataC = filterRaw1.filter((ele) => targetList.some((item) => ele.destinationCountry.includes(item)));
   const filterDataT = tKey === 'se' ? filterRaw1.filter((ele) => ['泰国水灯节'].some((item) => ele.productType.toLocaleLowerCase().indexOf(item) !== -1)) : [];
   const filterData = filterDataC.concat(filterDataT);
   const CJCount = filterData.length; // filterData.reduce((r, c) => r + c.CJCount, 0);
   const YJLY = filterData.reduce((r, c) => r + price_to_number(c.ML), 0);
 
-  const filterRaw2 = yearData.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
-  const filterDataYearC = filterRaw2.filter((ele) => targetList.some((item) => ele.destinationCountry_AsJOSN.includes(item)));
+  const filterRaw2 = yearData.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry.includes(item)));
+  const filterDataYearC = filterRaw2.filter((ele) => targetList.some((item) => ele.destinationCountry.includes(item)));
   const filterDataYearT = tKey === 'se' ? filterRaw2.filter((ele) => ['泰国水灯节'].some((item) => ele.productType.toLocaleLowerCase().indexOf(item) !== -1)) : [];
   const filterDataYear = filterDataYearC.concat(filterDataYearT);
   const rowYearData = { CJCount: filterDataYear.length, YJLY: filterDataYear.reduce((r, c) => r + price_to_number(c.ML), 0) };
-  // console.log(tKey, filterDataYear.map(ee => ee.destinationCountry_AsJOSN), filterDataYear.map(ee => ee.productType), filterDataYear);
+  // console.log(tKey, filterDataYear.map(ee => ee.destinationCountry), filterDataYear.map(ee => ee.productType), filterDataYear);
 
-  const filterDataYearRaw2 = yearData2.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
-  const filterDataYear2C = filterDataYearRaw2.filter((ele) => targetList.some((item) => ele.destinationCountry_AsJOSN.includes(item)));
+  const filterDataYearRaw2 = yearData2.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry.includes(item)));
+  const filterDataYear2C = filterDataYearRaw2.filter((ele) => targetList.some((item) => ele.destinationCountry.includes(item)));
   const filterDataYear2T = tKey === 'se' ? filterDataYearRaw2.filter((ele) => ['泰国水灯节'].some((item) => ele.productType.toLocaleLowerCase().indexOf(item) !== -1)) : [];
   const filterDataYear2 = filterDataYear2C.concat(filterDataYear2T);
   const rowYearData2 = { CJCount: filterDataYear2.length, YJLY: filterDataYear2.reduce((r, c) => r + price_to_number(c.ML), 0) };
@@ -164,25 +164,25 @@ const dataSales = (tKey, rawData, yearData, yearData2) => {
 const dataSalesGHOther = (rawData, yearData, yearData2) => {
   const exceptContry = Object.values(GHCountryListSetting).reduce((r, c) => r.concat(c), []);
   // console.log('exceptContry', exceptContry);
-  // console.log('OOoo rawData', rawData.map(e => e.destinationCountry_AsJOSN));
+  // console.log('OOoo rawData', rawData.map(e => e.destinationCountry));
   const filterData = rawData
     .filter((ele) => ['泰国水灯节'].every((item) => ele.productType.toLocaleLowerCase().indexOf(item) === -1))
-    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
-  // console.log('OOoo', filterData.map(e => e.destinationCountry_AsJOSN), filterData.map(e => e.productType));
+    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry.includes(item)));
+  // console.log('OOoo', filterData.map(e => e.destinationCountry), filterData.map(e => e.productType));
   const CJCount = filterData.length; // filterData.reduce((r, c) => r + c.CJCount, 0);
   const YJLY = filterData.reduce((r, c) => r + price_to_number(c.ML), 0);
 
   const filterDataYear = yearData
     .filter((ele) => ['泰国水灯节'].every((item) => ele.productType.toLocaleLowerCase().indexOf(item) === -1))
-    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
+    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry.includes(item)));
   const rowYearData = { CJCount: filterDataYear.length, YJLY: filterDataYear.reduce((r, c) => r + price_to_number(c.ML), 0) };
-  // console.log('OOoo year', filterDataYear.map(e => e.destinationCountry_AsJOSN), filterDataYear.map(e => e.productType));
+  // console.log('OOoo year', filterDataYear.map(e => e.destinationCountry), filterDataYear.map(e => e.productType));
 
   const filterDataYear2 = yearData2
     .filter((ele) => ['泰国水灯节'].every((item) => ele.productType.toLocaleLowerCase().indexOf(item) === -1))
-    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
+    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry.includes(item)));
   const rowYearData2 = { CJCount: filterDataYear2.length, YJLY: filterDataYear2.reduce((r, c) => r + price_to_number(c.ML), 0) };
-  // console.log('Oo', filterDataYear2.map(e => e.destinationCountry_AsJOSN), filterDataYear2);
+  // console.log('Oo', filterDataYear2.map(e => e.destinationCountry), filterDataYear2);
   // console.log('Oo row', rowYearData2);
 
   const rowYear = {

src/stores/MeetingData2025.js

@@ -132,23 +132,23 @@ const dataSales = (tKey, rawData, yearData, yearData2) => {
   const exceptTargetList = Object.keys(GHCountryListSetting).reduce((r, c, i) => r.concat(i < tIndex ? GHCountryListSetting[c] : []), []);
   // console.log(tIndex, tKey, 'exceptTargetList', exceptTargetList, 'targetList', targetList);
 
-  const filterRaw1 = rawData.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
+  const filterRaw1 = rawData.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry.includes(item)));
   // console.log(tKey, 'filterRaw1', filterRaw1);
-  const filterDataC = filterRaw1.filter((ele) => targetList.some((item) => ele.destinationCountry_AsJOSN.includes(item)));
+  const filterDataC = filterRaw1.filter((ele) => targetList.some((item) => ele.destinationCountry.includes(item)));
   const filterDataT = tKey === 'se' ? filterRaw1.filter((ele) => ['泰国水灯节'].some((item) => ele.productType.toLocaleLowerCase().indexOf(item) !== -1)) : [];
   const filterData = filterDataC.concat(filterDataT);
   const CJCount = filterData.length; // filterData.reduce((r, c) => r + c.CJCount, 0);
   const YJLY = filterData.reduce((r, c) => r + price_to_number(c.ML), 0);
 
-  const filterRaw2 = yearData.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
-  const filterDataYearC = filterRaw2.filter((ele) => targetList.some((item) => ele.destinationCountry_AsJOSN.includes(item)));
+  const filterRaw2 = yearData.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry.includes(item)));
+  const filterDataYearC = filterRaw2.filter((ele) => targetList.some((item) => ele.destinationCountry.includes(item)));
   const filterDataYearT = tKey === 'se' ? filterRaw2.filter((ele) => ['泰国水灯节'].some((item) => ele.productType.toLocaleLowerCase().indexOf(item) !== -1)) : [];
   const filterDataYear = filterDataYearC.concat(filterDataYearT);
   const rowYearData = { CJCount: filterDataYear.length, YJLY: filterDataYear.reduce((r, c) => r + price_to_number(c.ML), 0) };
-  // console.log(tKey, filterDataYear.map(ee => ee.destinationCountry_AsJOSN), filterDataYear.map(ee => ee.productType), filterDataYear);
+  // console.log(tKey, filterDataYear.map(ee => ee.destinationCountry), filterDataYear.map(ee => ee.productType), filterDataYear);
 
-  const filterDataYearRaw2 = yearData2.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
-  const filterDataYear2C = filterDataYearRaw2.filter((ele) => targetList.some((item) => ele.destinationCountry_AsJOSN.includes(item)));
+  const filterDataYearRaw2 = yearData2.filter((ele) => exceptTargetList.every((item) => !ele.destinationCountry.includes(item)));
+  const filterDataYear2C = filterDataYearRaw2.filter((ele) => targetList.some((item) => ele.destinationCountry.includes(item)));
   const filterDataYear2T = tKey === 'se' ? filterDataYearRaw2.filter((ele) => ['泰国水灯节'].some((item) => ele.productType.toLocaleLowerCase().indexOf(item) !== -1)) : [];
   const filterDataYear2 = filterDataYear2C.concat(filterDataYear2T);
   const rowYearData2 = { CJCount: filterDataYear2.length, YJLY: filterDataYear2.reduce((r, c) => r + price_to_number(c.ML), 0) };
@@ -164,25 +164,25 @@ const dataSales = (tKey, rawData, yearData, yearData2) => {
 const dataSalesGHOther = (rawData, yearData, yearData2) => {
   const exceptContry = Object.values(GHCountryListSetting).reduce((r, c) => r.concat(c), []);
   // console.log('exceptContry', exceptContry);
-  // console.log('OOoo rawData', rawData.map(e => e.destinationCountry_AsJOSN));
+  // console.log('OOoo rawData', rawData.map(e => e.destinationCountry));
   const filterData = rawData
     .filter((ele) => ['泰国水灯节'].every((item) => ele.productType.toLocaleLowerCase().indexOf(item) === -1))
-    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
-  // console.log('OOoo', filterData.map(e => e.destinationCountry_AsJOSN), filterData.map(e => e.productType));
+    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry.includes(item)));
+  // console.log('OOoo', filterData.map(e => e.destinationCountry), filterData.map(e => e.productType));
   const CJCount = filterData.length; // filterData.reduce((r, c) => r + c.CJCount, 0);
   const YJLY = filterData.reduce((r, c) => r + price_to_number(c.ML), 0);
 
   const filterDataYear = yearData
     .filter((ele) => ['泰国水灯节'].every((item) => ele.productType.toLocaleLowerCase().indexOf(item) === -1))
-    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
+    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry.includes(item)));
   const rowYearData = { CJCount: filterDataYear.length, YJLY: filterDataYear.reduce((r, c) => r + price_to_number(c.ML), 0) };
-  // console.log('OOoo year', filterDataYear.map(e => e.destinationCountry_AsJOSN), filterDataYear.map(e => e.productType));
+  // console.log('OOoo year', filterDataYear.map(e => e.destinationCountry), filterDataYear.map(e => e.productType));
 
   const filterDataYear2 = yearData2
     .filter((ele) => ['泰国水灯节'].every((item) => ele.productType.toLocaleLowerCase().indexOf(item) === -1))
-    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry_AsJOSN.includes(item)));
+    .filter((ele) => exceptContry.every((item) => !ele.destinationCountry.includes(item)));
   const rowYearData2 = { CJCount: filterDataYear2.length, YJLY: filterDataYear2.reduce((r, c) => r + price_to_number(c.ML), 0) };
-  // console.log('Oo', filterDataYear2.map(e => e.destinationCountry_AsJOSN), filterDataYear2);
+  // console.log('Oo', filterDataYear2.map(e => e.destinationCountry), filterDataYear2);
   // console.log('Oo row', rowYearData2);
 
   const rowYear = {
@@ -285,78 +285,83 @@ class MeetingData {
    */
   dataGHSales = async (param) => {
     this.GHSalesLoading = true;
-    const salesParam = { ...param,  DateType: 'confirmDate', WebCode: 'CHT,AH,GH,GHKYZG,GHKYHW,ZWQD', OrderType:'ALL', }; // WebCode: 不含分销
+    const salesParam = { ...param,  DateType: 'confirmDate', WebCode: 'CHT,AH,GH,GHKYZG,GHKYHW,ZWQD,GH_ZWQD_HW,JH,HTravel', OrderType:'ALL', }; // WebCode: 不含分销, 这个参数值不直接使用, 不含分销=总数-分销
+    const partnerParam = { WebCode: 'GHTOBHW,GHTOBZG' };
     const [
-      { total1: CHSalesData }, // 不含分销
-      { total1: AHSalesData }, // 不含分销
-      { total1: GHSalesData }, // 不含分销
-      { total1: partnerSalesData },
-      { total1: totalSalesData },
+      { total1: CHSalesDataTotal },
+      { total1: CHPartnerSalesData },
+      { total1: AHSalesDataTotal },
+      { total1: AHpartnerSalesData },
+      { total1: GHSalesDataTotal },
+      { total1: GHpartnerSalesData },
     ] = await Promise.all([
-      getDepartmentOrderMLByType({...salesParam, DepartmentList: '1,2', }),
-      getDepartmentOrderMLByType({...salesParam, DepartmentList: '28', }),
-      getDepartmentOrderMLByType({...salesParam, DepartmentList: '33', }),
-      getDepartmentOrderMLByType({...salesParam, DepartmentList: '1,2,28,33',WebCode: 'GHTOBHW,GHTOBZG',}),
-      getDepartmentOrderMLByType({...salesParam, DepartmentList: '1,2,28,33',WebCode: 'ALL',})
+      getDepartmentOrderMLByType({...salesParam, DepartmentList: '1,2', WebCode: 'ALL', }),
+      getDepartmentOrderMLByType({...salesParam, DepartmentList: '1,2', ...partnerParam }),
+      getDepartmentOrderMLByType({...salesParam, DepartmentList: '28', WebCode: 'ALL', }),
+      getDepartmentOrderMLByType({...salesParam, DepartmentList: '28', ...partnerParam }),
+      getDepartmentOrderMLByType({...salesParam, DepartmentList: '33', WebCode: 'ALL', }),
+      getDepartmentOrderMLByType({...salesParam, DepartmentList: '33', ...partnerParam }),
     ]);
-    // const { total1: CHSalesDataTotal } = await getDepartmentOrderMLByType({...salesParam, DepartmentList: '1,2', WebCode: 'ALL',});
-    // const { total1: CHPartnerSalesData } = await getDepartmentOrderMLByType({...salesParam, DepartmentList: '1,2', WebCode: 'GHTOBHW,GHTOBZG', });
-    // const { total1: AHSalesDataTotal } = await getDepartmentOrderMLByType({...salesParam, DepartmentList: '28',WebCode: 'ALL',});
-    // const { total1: AHpartnerSalesData } = await getDepartmentOrderMLByType({...salesParam, DepartmentList: '28', WebCode: 'GHTOBHW,GHTOBZG', });
-    // const { total1: GHSalesDataTotal } = await getDepartmentOrderMLByType({...salesParam, DepartmentList: '33',WebCode: 'ALL',});
-    // const { total1: GHpartnerSalesData } = await getDepartmentOrderMLByType({...salesParam, DepartmentList: '33', WebCode: 'GHTOBHW,GHTOBZG', });
-    // 分销
-    // const CHSalesData0 = {'COLI_CJCount': CHSalesDataTotal.COLI_CJCount-CHPartnerSalesData.COLI_CJCount, 'COLI_ML2': CHSalesDataTotal.COLI_ML2-CHPartnerSalesData.COLI_ML2};
-    // const AHSalesData0 = {'COLI_CJCount': AHSalesDataTotal.COLI_CJCount-AHpartnerSalesData.COLI_CJCount, 'COLI_ML2': AHSalesDataTotal.COLI_ML2-AHpartnerSalesData.COLI_ML2};
-    // const GHSalesData0 = {'COLI_CJCount': GHSalesDataTotal.COLI_CJCount-GHpartnerSalesData.COLI_CJCount, 'COLI_ML2': GHSalesDataTotal.COLI_ML2-GHpartnerSalesData.COLI_ML2};
-    // const partnerSalesData0 = {'COLI_CJCount': CHPartnerSalesData.COLI_CJCount+AHpartnerSalesData.COLI_CJCount, 'COLI_ML2': CHPartnerSalesData.COLI_ML2+AHpartnerSalesData.COLI_ML2};
-    // const totalSalesData0 = {
-    //   'COLI_CJCount': CHSalesDataTotal.COLI_CJCount + AHSalesDataTotal.COLI_CJCount + GHSalesDataTotal.COLI_CJCount,
-    //   'COLI_ML2': CHSalesDataTotal.COLI_ML2 + AHSalesDataTotal.COLI_ML2 + GHSalesDataTotal.COLI_ML2,
-    // };
+    // 不含分销 = 总额 - 分销
+    const CHSalesData = {'COLI_CJCount': CHSalesDataTotal.COLI_CJCount-CHPartnerSalesData.COLI_CJCount, 'COLI_ML2': CHSalesDataTotal.COLI_ML2-CHPartnerSalesData.COLI_ML2};
+    const AHSalesData = {'COLI_CJCount': AHSalesDataTotal.COLI_CJCount-AHpartnerSalesData.COLI_CJCount, 'COLI_ML2': AHSalesDataTotal.COLI_ML2-AHpartnerSalesData.COLI_ML2};
+    const GHSalesData = {'COLI_CJCount': GHSalesDataTotal.COLI_CJCount-GHpartnerSalesData.COLI_CJCount, 'COLI_ML2': GHSalesDataTotal.COLI_ML2-GHpartnerSalesData.COLI_ML2};
+    const partnerSalesData = {'COLI_CJCount': CHPartnerSalesData.COLI_CJCount+AHpartnerSalesData.COLI_CJCount, 'COLI_ML2': CHPartnerSalesData.COLI_ML2+AHpartnerSalesData.COLI_ML2};
+    const totalSalesData = {
+      'COLI_CJCount': CHSalesDataTotal.COLI_CJCount + AHSalesDataTotal.COLI_CJCount + GHSalesDataTotal.COLI_CJCount,
+      'COLI_ML2': CHSalesDataTotal.COLI_ML2 + AHSalesDataTotal.COLI_ML2 + GHSalesDataTotal.COLI_ML2,
+    };
 
     const yearStart = moment().startOf("year").format(DATE_FORMAT);
     const yearEnd = moment().endOf("year").format(SMALL_DATETIME_FORMAT);
     /** 截至今年 - 成交 */
     const [
-      { total1: CHDataYear },
-      { total1: AHDataYear },
-      { total1: GHDataYear },
-      { total1: partnerDataYear },
-      { total1: totalDataYear },
+      { total1: CHSalesYearTotal },
+      { total1: CHPartnerSalesYear },
+      { total1: AHSalesYearTotal },
+      { total1: AHpartnerSalesYear },
+      { total1: GHSalesYearTotal },
+      { total1: GHpartnerSalesYear },
     ] = await Promise.all([
-      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '1,2', }),
-      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '28', }),
-      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '33', }),
-      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '1,2,28,7,33',WebCode: 'GHTOBHW,GHTOBZG',}),
-      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '1,2,28,7,33',WebCode: 'ALL',})
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '1,2', WebCode: 'ALL', }),
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '1,2', ...partnerParam }),
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '28', WebCode: 'ALL', }),
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '28', ...partnerParam }),
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '33', WebCode: 'ALL', }),
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, DepartmentList: '33', ...partnerParam }),
     ]);
-    // const { total1: CHDataYear } = await getDepartmentOrderMLByType({...salesParam, Date1: yearStart,  DepartmentList: '1,2', });
-    // const { total1: AHDataYear } = await getDepartmentOrderMLByType({...salesParam, Date1: yearStart,  DepartmentList: '28', });
-    // const { total1: GHDataYear } = await getDepartmentOrderMLByType({...salesParam, Date1: yearStart,  DepartmentList: '33', });
-    // const { total1: partnerDataYear } = await getDepartmentOrderMLByType({...salesParam, Date1: yearStart,  DepartmentList: '1,2,28,7,33', WebCode: 'GHTOBHW,GHTOBZG', });
-    // const { total1: totalDataYear } = await getDepartmentOrderMLByType({...salesParam, Date1: yearStart,  DepartmentList: '1,2,28,7,33', WebCode: 'ALL', });
+    const CHDataYear = {'COLI_CJCount': CHSalesYearTotal.COLI_CJCount-CHPartnerSalesYear.COLI_CJCount, 'COLI_ML2': CHSalesYearTotal.COLI_ML2-CHPartnerSalesYear.COLI_ML2};
+    const AHDataYear = {'COLI_CJCount': AHSalesYearTotal.COLI_CJCount-AHpartnerSalesYear.COLI_CJCount, 'COLI_ML2': AHSalesYearTotal.COLI_ML2-AHpartnerSalesYear.COLI_ML2};
+    const GHDataYear = {'COLI_CJCount': GHSalesYearTotal.COLI_CJCount-GHpartnerSalesYear.COLI_CJCount, 'COLI_ML2': GHSalesYearTotal.COLI_ML2-GHpartnerSalesYear.COLI_ML2};
+    const partnerDataYear = {'COLI_CJCount': CHPartnerSalesYear.COLI_CJCount+AHpartnerSalesYear.COLI_CJCount, 'COLI_ML2': CHPartnerSalesYear.COLI_ML2+AHpartnerSalesYear.COLI_ML2};
+    const totalDataYear = {
+      'COLI_CJCount': CHSalesYearTotal.COLI_CJCount + AHSalesYearTotal.COLI_CJCount + GHSalesYearTotal.COLI_CJCount,
+      'COLI_ML2': CHSalesYearTotal.COLI_ML2 + AHSalesYearTotal.COLI_ML2 + GHSalesYearTotal.COLI_ML2,
+    };
     /** 截至今年 - 走团 */
     const [
-      { total1: CHStartDataYear },
-      { total1: AHStartDataYear },
-      { total1: GHStartDataYear },
-      { total1:  partnerStartDataYear },
-      { total1:  totalStartDataYear },
+      { total1: CHStartDataYearTotal },
+      { total1: CHPartnerStartDataYear },
+      { total1: AHStartDataYearTotal },
+      { total1: AHpartnerStartDataYear },
+      { total1: GHStartDataYearTotal },
+      { total1: GHpartnerStartDataYear },
     ] = await Promise.all([
-      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd,  DepartmentList: '1,2', DateType: 'startDate' }),
-      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd,  DepartmentList: '28', DateType: 'startDate' }),
-      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd, DepartmentList: '33', DateType: 'startDate' }),
-      /** 截至今年 - 走团 - 分销 */
-      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd,  DepartmentList: '1,2,28,7,33',WebCode: 'GHTOBHW,GHTOBZG', DateType: 'startDate',}),
-      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd,  DepartmentList: '1,2,28,7,33',WebCode: 'ALL', DateType: 'startDate',})
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd, DateType: 'startDate', DepartmentList: '1,2', WebCode: 'ALL', }),
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd, DateType: 'startDate', DepartmentList: '1,2', ...partnerParam }),
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd, DateType: 'startDate', DepartmentList: '28', WebCode: 'ALL', }),
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd, DateType: 'startDate', DepartmentList: '28', ...partnerParam }),
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd, DateType: 'startDate', DepartmentList: '33', WebCode: 'ALL', }),
+      getDepartmentOrderMLByType({...salesParam, Date1: yearStart, Date2:yearEnd, DateType: 'startDate', DepartmentList: '33', ...partnerParam }),
     ]);
-    // const { total1: CHStartDataYear } = await getDepartmentOrderMLByType({...salesParam, Date1: yearStart,DepartmentList: '1,2', DateType: 'startDate' });
-    // const { total1: AHStartDataYear } = await getDepartmentOrderMLByType({...salesParam, Date1: yearStart,DepartmentList: '28', DateType: 'startDate' });
-    // const { total1: GHStartDataYear } = await getDepartmentOrderMLByType({...salesParam, Date1: yearStart,DepartmentList: '33', DateType: 'startDate' });
-    /** 截至今年 - 走团 - 分销 */
-    // const { total1:  partnerStartDataYear } = await getDepartmentOrderMLByType({...salesParam, Date1: yearStart,DepartmentList: '1,2,28,7,33', WebCode: 'GHTOBHW,GHTOBZG', DateType: 'startDate' });
-    // const { total1:  totalStartDataYear } = await getDepartmentOrderMLByType({...salesParam, Date1: yearStart,DepartmentList: '1,2,28,7,33', WebCode: 'ALL', DateType: 'startDate' });
+    const CHStartDataYear = {'COLI_CJCount': CHStartDataYearTotal.COLI_CJCount-CHPartnerStartDataYear.COLI_CJCount, 'COLI_ML2': CHStartDataYearTotal.COLI_ML2-CHPartnerStartDataYear.COLI_ML2};
+    const AHStartDataYear = {'COLI_CJCount': AHStartDataYearTotal.COLI_CJCount-AHpartnerStartDataYear.COLI_CJCount, 'COLI_ML2': AHStartDataYearTotal.COLI_ML2-AHpartnerStartDataYear.COLI_ML2};
+    const GHStartDataYear = {'COLI_CJCount': GHStartDataYearTotal.COLI_CJCount-GHpartnerStartDataYear.COLI_CJCount, 'COLI_ML2': GHStartDataYearTotal.COLI_ML2-GHpartnerStartDataYear.COLI_ML2};
+    const partnerStartDataYear = {'COLI_CJCount': CHPartnerStartDataYear.COLI_CJCount+AHpartnerStartDataYear.COLI_CJCount, 'COLI_ML2': CHPartnerStartDataYear.COLI_ML2+AHpartnerStartDataYear.COLI_ML2};
+    const totalStartDataYear = {
+      'COLI_CJCount': CHStartDataYearTotal.COLI_CJCount + AHStartDataYearTotal.COLI_CJCount + GHStartDataYearTotal.COLI_CJCount,
+      'COLI_ML2': CHStartDataYearTotal.COLI_ML2 + AHStartDataYearTotal.COLI_ML2 + GHStartDataYearTotal.COLI_ML2,
+    };
 
     const rows = [
       {
@@ -368,7 +373,7 @@ class MeetingData {
       },
       {
         key: 'ah',
-        label: 'AH(不含分销)',
+        label: 'HT(不含分销)',
         YJLY: price_to_number(AHSalesData.COLI_ML2),
         CJCount: (AHSalesData.COLI_CJCount),
         rowYear: { YJLY: price_to_number(AHDataYear.COLI_ML2), CJCount: AHDataYear.COLI_CJCount, YJLY2: price_to_number(AHStartDataYear.COLI_ML2) },
@@ -455,7 +460,7 @@ class MeetingData {
 
     const rows = [
       { key: 'ch', label: 'CH', GoodCount: CHGoodCount, GroupCount: CHGroupCount, rowYear: { GroupCount: CHGroupCountYear, GoodCount: CHGoodCountYear } },
-      { key: 'ah', label: 'AH', GoodCount: AHGoodCount, GroupCount: AHGroupCount, rowYear: { GroupCount: AHGroupCountYear, GoodCount: AHGoodCountYear } },
+      { key: 'ah', label: 'HT', GoodCount: AHGoodCount, GroupCount: AHGroupCount, rowYear: { GroupCount: AHGroupCountYear, GoodCount: AHGoodCountYear } },
       { key: 'Gh', label: 'GH', GoodCount: GHGoodCount, GroupCount: GHGroupCount, rowYear: { GroupCount: GHGroupCountYear, GoodCount: GHGoodCountYear } },
     ];
     // const GHRowWeek = { GoodCount: GHGoodCountWeek, GroupCount: 0 };

src/stores/SalesCRMData.js

@@ -1,7 +1,7 @@
-import { makeAutoObservable, runInAction, toJS } from 'mobx';
+import { makeAutoObservable, runInAction } from 'mobx';
 import { fetchJSON } from '../utils/request';
-import { isEmpty, sortDescBy, objectMapper, groupBy, pick, unique } from '../utils/commons';
-import { groupsMappedByCode, dataFieldAlias } from './../libs/ht';
+import { isEmpty, sortDescBy, groupBy, pick, unique } from '../utils/commons';
+import { groupsMappedByCode } from './../libs/ht';
 import { DATE_FORMAT, SMALL_DATETIME_FORMAT } from './../config';
 import moment from 'moment';
 
@@ -19,6 +19,34 @@ const fetchResultsData = async (param) => {
   return json.errcode === 0 ? json.result : [];
 };
 
+const fetchProcessData = async (param) => {
+  const defaultParam = {
+    WebCode: 'All',
+    DepartmentList: '',
+    opisn: -1,
+    Date1: '',
+    Date2: '',
+    groupType: '',
+    groupDateType: '',
+  };
+  const json = await fetchJSON('/service-Analyse2/sales_crm_process', { ...defaultParam, ...param });
+  return json.errcode === 0 ? json.result : [];
+};
+
+const fetchRiskDetailData = async (param) => {
+  const defaultParam = {
+    opisn: -1,
+    DateType: '',
+    WebCode: 'All',
+    DepartmentList: '',
+    Date1: '',
+    Date2: '',
+    IncludeTickets: '1',
+  };
+  const json = await fetchJSON('/service-Analyse2/sales_crm_process_detail', {...defaultParam, ...param});
+  return json.errcode === 0 ? json.result : [];
+};
+
 class SalesCRMData {
   constructor(appStore) {
     this.appStore = appStore;
@@ -28,19 +56,24 @@ class SalesCRMData {
   async get90n180Data(param = {}) {
     const retProps = param?.retLabel || '';
 
-    const retKey = param.groupDateType === '' ? (param.groupType === 'overview' ? 'dataSource' : 'details') : 'byDate';
+    let retKey = param.groupDateType === '' ? (param.groupType === 'overview' ? 'dataSource' : 'details') : 'byDate';
+    retKey = param.opisn ? `operator_${param.opisn}`: retKey;
+    if (param.opisn ) {
+      if (!isEmpty(this.results.details)) {
+        const _this_opi_row = this.results.details.filter(ele => ele.groupsKey === param.opisn);
+        this.results[retKey] = _this_opi_row;
+        return;
+      }
+      if (!isEmpty(this.results[retKey])) {
+        return;
+      }
+    }
     this.results.loading = true;
-    const date90={
-      Date1: moment().subtract(90, 'days').format(DATE_FORMAT),
-      Date2: moment().subtract(30, 'days').format(SMALL_DATETIME_FORMAT),
-    };
-    const date180={
-      Date1: moment().subtract(180, 'days').format(DATE_FORMAT),
-      Date2: moment().subtract(50, 'days').format(SMALL_DATETIME_FORMAT),
-    };
+    const date90=this.searchValues.date90;
+    const date180=this.searchValues.date180;
     const [result90, result180] = await Promise.all([
-      fetchResultsData({ ...this.searchValues, ...date90, ...param }),
-      fetchResultsData({ ...this.searchValues, ...date180, ...param }),
+      fetchResultsData({ ...this.searchValuesToSub, ...date90, ...param }),
+      fetchResultsData({ ...this.searchValuesToSub, ...date180, ...param }),
     ]);
     const _90O = groupBy(result90, 'groupsKey');
     const _180O = groupBy(result180, 'groupsKey');
@@ -54,21 +87,24 @@ class SalesCRMData {
       };
     });
     // console.log(result2, '+++++ +++', retKey);
-    // console.log(this.results[retKey].length);
+    // console.log(this.results[retKey]?.length);
 
     runInAction(() => {
       this.results.loading = false;
-      this.results[retKey] = [].concat(this.results[retKey], result2);
+      this.results[retKey] = [].concat((this.results[retKey] || []), result2);
     });
     return this.results;
   }
 
-
   async getResultData(param = {}) {
-    const retKey = param.groupDateType === '' ? 'byOperator' : 'byDate';
+    let retKey = param.groupDateType === '' ? 'byOperator' : 'byDate';
+    retKey = param.opisn ? `operator_byDate_${param.opisn}`: retKey;
+    if (!isEmpty(this.results[retKey])) {
+      return;
+    }
     this.results.loading = true;
     this.results[retKey] = [];
-    const res = await fetchResultsData({ ...this.searchValues, ...param });
+    const res = await fetchResultsData({ ...this.searchValuesToSub, ...param });
     runInAction(() => {
       this.results.loading = false;
       this.results[retKey] = retKey === 'byOperator' ? res.filter(ele => ele.SumML > 0).sort(sortDescBy('SumML')) : res;
@@ -76,28 +112,98 @@ class SalesCRMData {
     return this.results;
   };
 
+  async getProcessData(param = {}) {
+    // const retKey = param.groupDateType === '' ? 'byOperator' : 'byDate';
+    let retKey = param.groupDateType === '' ? (param.groupType !== 'operator' ? 'dataSource' : 'details') : 'byDate';
+    retKey = param.opisn ? `operator_${param.opisn}`: retKey;
+    if (param.opisn) {
+      if (!isEmpty(this.process.details)) {
+        const _this_opi_row = this.process.details.filter(ele => ele.groupsKey === param.opisn);
+        this.process[retKey] = _this_opi_row;
+        return;
+      }
+      if (!isEmpty(this.process[retKey])) {
+        return;
+      }
+    }
+    this.process.loading = true;
+    this.process[retKey] = [];
+    const res = await fetchProcessData({ ...this.searchValuesToSub, ...param });
+    runInAction(() => {
+      this.process.loading = false;
+      this.process[retKey] = [].concat(this.process[retKey], res);
+    });
+  }
+
+  async getRiskDetailData(param = {}) {
+    this.risk.loading = true;
+    this.risk.dataSource = [];
+    const res = await fetchRiskDetailData({ ...this.searchValuesToSub, ...param });
+    runInAction(() => {
+      this.risk.loading = false;
+      this.risk.dataSource = res;
+      this.risk.byLostType = groupBy(res, 'lost_type');
+    });
+  }
+
   searchValues = {
-    // DateType: { key: 'confirmDate', label: '确认日期'},
+    date: moment(),
+    Date1: moment().startOf("week").subtract(7, "days"),
+    Date2: moment().endOf("week").subtract(7, "days"),
+    DateType: { key: 'applyDate', label: '提交日期'},
     WebCode: { key: 'All', label: '所有来源' },
     // IncludeTickets: { key: '1', label: '含门票'},
-    DepartmentList: [groupsMappedByCode.GH], // test: GH
+    DepartmentList: [groupsMappedByCode.GH],
     operator: '-1',
+    IncludeTickets: { key: '0', value: '0', label: '不含门票' },
     opisn: '-1',
+    date90: {
+      Date1: moment().subtract(90, 'days').format(DATE_FORMAT),
+      Date2: moment().subtract(30, 'days').format(SMALL_DATETIME_FORMAT),
+    },
+    date180: {
+      Date1: moment().subtract(180, 'days').format(DATE_FORMAT),
+      Date2: moment().subtract(50, 'days').format(SMALL_DATETIME_FORMAT),
+    }
   };
 
-  searchValuesToSub = {};
+  searchValuesToSub = {
+    date: moment().format(DATE_FORMAT),
+    Date1: moment().startOf("week").subtract(7, "days").format(DATE_FORMAT),
+    Date2: moment().endOf("week").subtract(7, "days").format(SMALL_DATETIME_FORMAT),
+    DateType: 'applyDate',
+    DepartmentList: groupsMappedByCode.GH.value,
+    WebCode: 'All',
+    operator: '-1',
+    opisn: '-1',
+  };
 
   setSearchValues(obj, values) {
     this.searchValues = { ...this.searchValues, ...values };
-    this.searchValuesToSub = obj;
+    if (values.date) {
+      this.searchValues.date90 = {
+        Date1: (values.date.clone()).subtract(90, 'days').format(DATE_FORMAT),
+        Date2: (values.date.clone()).subtract(30, 'days').format(SMALL_DATETIME_FORMAT),
+      };
+      this.searchValues.date180 = {
+        Date1: (values.date.clone()).subtract(180, 'days').format(DATE_FORMAT),
+        Date2: (values.date.clone()).subtract(50, 'days').format(SMALL_DATETIME_FORMAT),
+      };
+    }
+    this.searchValuesToSub = {...this.searchValuesToSub, ...obj};
   }
 
   results = { loading: false, dataSource: [], details: [], byDate: [], byOperator: [] };
-  resetData = () => {
-    this.results.loading = false;
-    for (const key of Object.keys(this.results)) {
+  process = { loading: false, dataSource: [], details: [], byDate: [], byOperator: [] };
+  risk = { loading: false, dataSource: [], byLostType: {}, };
+  resetData = (rootKey = '') => {
+    if (rootKey === '') {
+      return false;
+    }
+    this[rootKey].loading = false;
+    for (const key of Object.keys(this[rootKey])) {
       if (key !== 'loading') {
-        this.results[key] = [];
+        this[rootKey][key] = [];
       }
     }
   };

src/utils/commons.js

@@ -72,6 +72,14 @@ export function formatPercent(number) {
 	return Math.round(number * 100) + "%";
 }
 
+export function formatPercentToFloat(number) {
+	return parseFloat((number * 100).toFixed(2)) + "%";
+}
+
+export function percentToDecimal(number) {
+	return parseFloat(number) / 100;
+}
+
 export function formatDate(date) {
 	if (isEmpty(date)) {
 		return "NaN";

src/views/AgentGroupCount.jsx

@@ -28,12 +28,12 @@ const AgentGroupCount = () => {
                   ...date_picker_store.formValues,
                   ...customerServicesStore.searchValues,
                 },
-                shows: ['agency', 'DateType', 'DepartmentList', 'countryArea', 'dates'],
+                shows: ['agency', 'departureDateType', 'DepartmentList', 'countryArea', 'dates'],
                 fieldProps: {
                   DepartmentList: { show_all: true, mode: 'multiple' },
                   WebCode: { show_all: false, mode: 'multiple' },
-                  dates: { hide_vs: true },
-                  DateType: { disabledKeys: ['applyDate'] },
+                  years: { hide_vs: true },
+                  departureDateType: { disabledKeys: ['applyDate'] },
                 },
               }}
               onSubmit={(_err, obj, form) => {
@@ -46,6 +46,9 @@ const AgentGroupCount = () => {
         <Row>
           <Col span={24}>
             <Typography.Title level={3}>地接社团信息</Typography.Title>
+            <Divider orientation="right" plain>
+              <TableExportBtn label={'地接社团信息'} {...{ columns: agentGroupListColumns, dataSource: agentGroupList }} />
+            </Divider>
             <Table
               sticky
               id="agentGroupList"
@@ -57,9 +60,6 @@ const AgentGroupCount = () => {
               pagination={false}
               scroll={{ x: 1000 }}
             />
-            <Divider orientation="right" plain>
-              <TableExportBtn label={'地接社团信息'} {...{ columns: agentGroupListColumns, dataSource: agentGroupList }} />
-            </Divider>
           </Col>
         </Row>
       </Space>

src/views/AgentGroupList.jsx

@@ -32,12 +32,12 @@ const AgentGroupList = () => {
                   ...date_picker_store.formValues,
                   ...customerServicesStore.searchValues,
                 },
-                shows: ['DateType', 'DepartmentList', 'dates'],
+                shows: ['departureDateType', 'DepartmentList', 'dates'],
                 fieldProps: {
                   DepartmentList: { show_all: true },
                   WebCode: { show_all: false, mode: 'multiple' },
                   dates: { hide_vs: true },
-                  DateType: { disabledKeys: ['applyDate'] },
+                  departureDateType: { disabledKeys: ['applyDate'] },
                 },
               }}
               onSubmit={(_err, obj, form, str) => {

src/views/Cruise.jsx

@@ -1,26 +1,134 @@
-import React, { Children, useContext, useState } from 'react';
+import React, { useContext } 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 { Row, Col, Table, Space, Typography, Divider } from 'antd';
 import SearchForm from './../components/search/SearchForm';
+import { VSTag, TableExportBtn } from './../components/Data';
+import { CruiseAgency } from './../libs/ht';
+
+const { Text } = Typography;
 
 export default observer((props) => {
-  const { sale_store, date_picker_store: searchFormStore } = useContext(stores_Context);
-  const { customerServicesStore, date_picker_store } = useContext(stores_Context);
+  const { date_picker_store: searchFormStore } = useContext(stores_Context);
+  const { HotelCruiseStore, date_picker_store } = useContext(stores_Context);
+  const { loading, dataSource, summaryRow } = HotelCruiseStore.cruise;
 
   const { formValues, siderBroken } = searchFormStore;
 
+  const tableSorter = (a, b, colName) => a[colName] - b[colName];
+  const tableExportDataRow = (col1, col2) => [col1, col2].filter((r) => r).join(' VS ');
   const tableProps = {
     size: 'small',
+    bordered: true,
+    pagination: false,
     columns: [
-      { title: '产品', dataIndex: 'op', key: 'op' },
-      { title: '房间数', dataIndex: 'action', key: 'action' },
-      { title: '人数', dataIndex: 'action', key: 'action' },
-      { title: '总利润', dataIndex: 'action', key: 'action' },
-      { title: '单订船', dataIndex: 'action', key: 'action' },
-      { title: '订单含行程', dataIndex: 'action', key: 'action' },
-      { title: '国籍', dataIndex: 'action', key: 'action' },
+      { title: '产品',
+        sorter: (a, b) => a.ProductName.localeCompare(b.ProductName, 'zh-CN'),children: [{ title: summaryRow.ProductName, dataIndex: 'ProductName', key: 'ProductName' }] },
+      {
+        title: '房间数',
+        sorter: (a, b) => tableSorter(a, b, 'TotalNum'),
+        children: [
+          {
+            title: (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {summaryRow.TotalNum}
+                    {summaryRow.TotalNumPercent ? <Text type="secondary"> VS {summaryRow.CPTotalNum}</Text> : null}
+                  </Text>
+                  {summaryRow.TotalNumPercent && <VSTag diffPercent={summaryRow.TotalNumPercent} />}
+                </Space>
+              </>
+            ),
+            titleX: tableExportDataRow(summaryRow.TotalNum, summaryRow.CPTotalNum),
+            dataExport: (v, r) => tableExportDataRow(r.TotalNum, r.CPTotalNum),
+            dataIndex: 'TotalNum',
+            key: 'TotalNum',
+            render: (v, r) => (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {v}
+                    {r.CPTotalNum ? <Text type="secondary"> VS {r.CPTotalNum}</Text> : null}
+                  </Text>
+                  {r.CPTotalNum && <VSTag diffPercent={r.TotalNumPercent} />}
+                </Space>
+              </>
+            ),
+          },
+        ],
+      },
+      {
+        title: '人数',
+        sorter: (a, b) => tableSorter(a, b, 'TotalPersonNum'),
+        children: [
+          {
+            title: (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {summaryRow.TotalPersonNum}
+                    {summaryRow.TotalPersonNumPercent ? <Text type="secondary"> VS {summaryRow.CPTotalPersonNum}</Text> : null}
+                  </Text>
+                  {summaryRow.TotalPersonNumPercent && <VSTag diffPercent={summaryRow.TotalPersonNumPercent} />}
+                </Space>
+              </>
+            ),
+            titleX: tableExportDataRow(summaryRow.TotalPersonNum, summaryRow.CPTotalPersonNum),
+            dataExport: (v, r) => tableExportDataRow(r.TotalPersonNum, r.CPTotalPersonNum),
+            dataIndex: 'TotalPersonNum',
+            key: 'TotalPersonNum',
+            render: (v, r) => (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {v}
+                    {r.CPTotalPersonNum ? <Text type="secondary"> VS {r.CPTotalPersonNum}</Text> : null}
+                  </Text>
+                  {r.CPTotalNum && <VSTag diffPercent={r.TotalPersonNumPercent} />}
+                </Space>
+              </>
+            ),
+          },
+        ],
+      },
+      {
+        title: '总利润',
+        sorter: (a, b) => tableSorter(a, b, 'TotalProfit'),
+        children: [
+          {
+            title: (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {summaryRow.TotalProfit}
+                    {summaryRow.TotalProfitPercent ? <Text type="secondary"> VS {summaryRow.CPTotalProfit}</Text> : null}
+                  </Text>
+                  {summaryRow.TotalProfitPercent && <VSTag diffPercent={summaryRow.TotalProfitPercent} />}
+                </Space>
+              </>
+            ),
+            titleX: tableExportDataRow(summaryRow.TotalProfit, summaryRow.CPTotalProfit),
+            dataExport: (v, r) => tableExportDataRow(r.TotalProfit, r.CPTotalProfit),
+            dataIndex: 'TotalProfit',
+            key: 'TotalProfit',
+            render: (v, r) => (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {v}
+                    {r.CPTotalProfit ? <Text type="secondary"> VS {r.CPTotalProfit}</Text> : null}
+                  </Text>
+                  {r.CPTotalNum && <VSTag diffPercent={r.TotalProfitPercent} />}
+                </Space>
+              </>
+            ),
+          },
+        ],
+      },
+      // { title: '单订船', dataIndex: '', key: '' },
+      // { title: '订单含行程', dataIndex: '', key: '' },
+      // { title: '国籍', dataIndex: '', key: '' },
     ],
   };
 
@@ -32,27 +140,41 @@ export default observer((props) => {
             defaultValue={{
               initialValue: {
                 ...date_picker_store.formValues,
-                ...customerServicesStore.searchValues,
+                ...HotelCruiseStore.searchValues,
               },
               // 'countryArea',
-              shows: ['DepartmentList',  'orderStatus', 'years', 'keyword', 'agency', 'cruiseType'],
-              sort: { keyword: 101, cruiseType: 102, agency: 103 },
+              shows: [
+                'DepartmentList',
+                'orderStatus',
+                'dates',
+                'keyword',
+                'cruiseDirection',
+                'agency',
+                'cruiseBookType',
+                'country', // 'roomsRange', 'personRange'
+              ],
+              sort: { keyword: 101, agency: 110, cruiseDirection: 102, country: 104 },
               fieldProps: {
                 keyword: { placeholder: '产品名', col: 4 },
                 DepartmentList: { show_all: true, mode: 'multiple' },
                 orderStatus: { show_all: true },
+                cruiseDirection: { show_all: true },
+                agency: { defaultOptions: CruiseAgency, autoGet: false },
                 // years: { hide_vs: false },
               },
             }}
             onSubmit={(_err, obj, form) => {
-              customerServicesStore.setSearchValues(obj, form);
-              // customerServicesStore.fetchDestinationGroupCount();
+              HotelCruiseStore.setSearchValues(obj, form);
+              HotelCruiseStore.getCruiseData(obj);
             }}
           />
         </Col>
       </Row>
       <section>
-        <Table {...tableProps} bordered />
+        <Divider orientation="right" >
+          <TableExportBtn label={'游船'} {...{ columns: tableProps.columns, dataSource }} />
+        </Divider>
+        <Table {...tableProps} {...{ loading, dataSource }} rowKey={(record) => record.ProductName} />
       </section>
     </>
   );

src/views/DataPivot.jsx

@@ -21,20 +21,27 @@ const filterFields = [
   { key: 'COLI_LineClass', label: '页面渠道' },
   { key: 'guestGroupType', label: '客群类别' },
   { key: 'travelMotivation', label: '出行目的' },
+  { key: 'startMonth', label: '出行日期-月份' },
+  { key: 'startYearMonth', label: '出行日期-年月' },
+  { key: 'applyMonth', label: '预订日期-月份' },
+  { key: 'applyYearMonth', label: '预订日期-年月' },
   { key: 'operatorName', label: '顾问' },
   { key: 'WebCode', label: '来源站点' },
   { key: 'IsOld_txt', label: '是否老客户' },
   { key: 'isCusCommend_txt', label: '是否老客户推荐' },
   { key: 'hasOld_txt', label: '老客户(推荐)' },
-  { key: 'destinationCountry_AsJOSN', label: '目的地国籍' },
-  { key: 'PPPriceRange', label: '人均天/单区间(外币)' },
+  { key: 'HotelStar', label: '酒店星级' },
+  { key: 'destinationCountry', label: '目的地国籍' },
+  { key: 'destinations', label: '目的地城市' },
+  { key: 'RTXF_WB_range', label: '人天消费(外币)' },
+  { key: 'PPPriceRange', label: '人均天/单(外币)' },
   // { key: 'unitPPPriceRange', label: '人均天(外币)' },
-  // todo: 目的地, 目的地国家,
-  { key: 'SumML_ctxt1', label: '毛利范围[1W]' },
-  { key: 'SumML_ctxt1_5', label: '毛利范围[1.5W]' },
-  { key: 'SumML_ctxt2', label: '毛利范围[2W]' },
-  { key: 'SumML_ctxt3', label: '毛利范围[3W]' },
-  { key: 'SumML_ctxt4', label: '毛利范围[4W]' },
+  // { key: 'SumML_ctxt1', label: '毛利范围[1W]' },
+  // { key: 'SumML_ctxt1_5', label: '毛利范围[1.5W]' },
+  // { key: 'SumML_ctxt2', label: '毛利范围[2W]' },
+  // { key: 'SumML_ctxt3', label: '毛利范围[3W]' },
+  // { key: 'SumML_ctxt4', label: '毛利范围[4W]' },
+  { key: 'SumML_ctxt', label: '毛利' },
 ];
 const filterFieldsMapped = filterFields.reduce((r, v) => ({ ...r, [v.key]: v }), {});
 
@@ -43,7 +50,7 @@ const quickOptions = [
   { label: ' 来源站点 ', fields: [['WebCode'], []] },
   { label: '[ 产品×客群 ]', fields: [['productType', 'guestGroupType'], []] },
   { label: '[ 国籍×客群 ]', fields: [['country', 'guestGroupType'], []] },
-  { label: '[ 客群×目的地国籍 ]', fields: [['guestGroupType', 'destinationCountry_AsJOSN'], []] },
+  { label: '[ 客群×目的地国籍 ]', fields: [['guestGroupType', 'destinationCountry'], []] },
   // { label: '[ 国籍×客群 ]×[ ]', fields: [['country', 'guestGroupType'], []] },
 ];
 
@@ -92,7 +99,7 @@ const pageSetting = {
       { key: 'SingleML', title: '单团毛利', dataIndex: 'SingleML', width: '5em' },
       { key: 'OrderValue', title: '单个订单价值', dataIndex: 'OrderValue', width: '5em' },
       { key: 'PPPriceRange', title: '人均天(外币)', dataIndex: 'PPPriceRange', width: '5em' },
-      { key: 'AvgPPPrice', title: '人均天/单(外币)', dataIndex: 'AvgPPPrice', width: '5em' },
+      { key: 'AvgPPPrice', title: '人均天/单(外币)-平均', dataIndex: 'AvgPPPrice', width: '5em' },
       // { key: 'unitPPPrice', title: '人均天(外币)', dataIndex: 'unitPPPrice', width: '5em' },
       // { key: 'unitPPPriceRange', title: '人均天区间(外币)', dataIndex: 'unitPPPriceRange', width: '5em' },
       { key: 'confirmDays', title: '成团周期(天)', dataIndex: 'confirmDays', width: '5em' },
@@ -176,7 +183,7 @@ export default observer((props) => {
     // console.log(';;;;;', pivotDateColumns);
     const { data, columnValues, summaryRows, summaryColumns, pivotKeys, summaryMix } = pivotBy(_rawData || rawData, [].concat(pivotDateColumns, [curXfield]));
     // console.log('data====', data, '\ncolumnValues', columnValues, '\nsummaryRows', summaryRows, '\nsummaryColumns', summaryColumns, '\nsummaryMix', summaryMix);
-    setShowPassCountryTips(pivotKeys.includes('destinationCountry_AsJOSN'));
+    setShowPassCountryTips(pivotKeys.includes('destinationCountry'));
     setDataBeforePick(data.sort(sortBy(curXfield)));
     // 折线图汇总数据, 排序
     // const sortMixData = cloneDeep(summaryMix).sort(sortBy(defaultValKey)).reverse();
@@ -192,7 +199,10 @@ export default observer((props) => {
     setPivotRow({});
     setPivotRowDataSource([]);
     // 列汇总
-    const sortColData = summaryColumns.sort(sortBy(defaultValKey)).reverse();
+    const _col1 = pivotDateColumns[1][0] || '';
+    const _sortByDateOrVal = (_col1.includes('Month') || _col1.includes('Date')) ? _col1 : defaultValKey;
+    let sortColData = summaryColumns.sort(sortBy(_sortByDateOrVal));
+    sortColData = _sortByDateOrVal === defaultValKey ? sortColData.reverse() : sortColData;
     const colDataMapped = isEmpty(pivotDateColumns[1]) ? sortColData[0] : sortColData.reduce((r, v) => ({...r, [v[pivotDateColumns[1][0]]]: v}), {});
     setPivotTableColumnSummary(colDataMapped);
     // 行列的选项值
@@ -456,11 +466,11 @@ export default observer((props) => {
         dataIndex: 'applyDate',
         key: 'applyDate',
       },
-      // {
-      //   title: '出发日期',
-      //   dataIndex: 'CGI_ArriveDate',
-      //   key: 'CGI_ArriveDate',
-      // },
+      {
+        title: '出发日期',
+        dataIndex: 'startDate',
+        key: 'startDate',
+      },
     ],
   };
 

src/views/DestinationGroupCount.jsx

@@ -25,13 +25,13 @@ const DestinationGroupCount = () => {
                   countryArea: { key: 'china', label: '国内' },
                   ...customerServicesStore.searchValues,
                 },
-                shows: ['DateType', 'DepartmentList', 'countryArea', 'orderStatus', 'dates'],
+                shows: ['departureDateType', 'DepartmentList', 'countryArea', 'orderStatus', 'dates'],
                 fieldProps: {
                   DepartmentList: { show_all: true, mode: 'multiple' },
                   orderStatus: { show_all: true },
                   countryArea: { show_all: false },
-                  dates: { hide_vs: true },
-                  DateType: { disabledKeys: ['applyDate'] },
+                  years: { hide_vs: true },
+                  departureDateType: { disabledKeys: ['applyDate'] },
                 },
               }}
               onSubmit={(_err, obj, form) => {
@@ -44,6 +44,9 @@ const DestinationGroupCount = () => {
         <Row>
           <Col span={24}>
             <Typography.Title level={3}>目的地团信息</Typography.Title>
+            <Divider orientation="right" plain>
+              <TableExportBtn label={'目的地团信息'} {...{ columns: destinationGroupCountColumns, dataSource: destinationGroupCount }} />
+            </Divider>
             <Table
               sticky
               id="destinationGroupCount"
@@ -55,9 +58,6 @@ const DestinationGroupCount = () => {
               pagination={false}
               scroll={{ x: 1000 }}
             />
-            <Divider orientation="right" plain>
-              <TableExportBtn label={'目的地团信息'} {...{ columns: destinationGroupCountColumns, dataSource: destinationGroupCount }} />
-            </Divider>
           </Col>
         </Row>
       </Space>

src/views/DestinationGroupList.jsx

@@ -1,21 +1,24 @@
 import { useContext, useEffect } from 'react';
-import { Row, Col, Space, Table, List } from 'antd';
+import { Row, Col, Space, Table, List, Typography, Divider } from 'antd';
 import { stores_Context } from '../config';
 import { observer } from 'mobx-react';
 import { NavLink, useParams } from 'react-router-dom';
 import 'moment/locale/zh-cn';
 import SearchForm from './../components/search/SearchForm';
+import { TableExportBtn } from './../components/Data';
 
 const DestinationGroupList = () => {
   const { destinationId } = useParams();
   const { customerServicesStore, date_picker_store } = useContext(stores_Context);
 
   useEffect(() => {
+    customerServicesStore.fetchDistGroupInfoByCountry(destinationId);
     customerServicesStore.fetchGroupListByDestinationId(destinationId);
   }, []);
 
   const destinationGroupList = customerServicesStore.destinationGroupList;
   const destinationGroupListColumns = customerServicesStore.destinationGroupListColumns;
+  const nationality_count_data = customerServicesStore.nationality_count_data;
   const { inProgress } = customerServicesStore;
 
   return (
@@ -33,23 +36,43 @@ const DestinationGroupList = () => {
                   countryArea: { key: 'china', label: '国内' },
                   ...customerServicesStore.searchValues,
                 },
-                shows: ['DateType', 'DepartmentList', 'dates'],
+                shows: ['departureDateType', 'DepartmentList', 'dates', 'orderStatus'],
                 fieldProps: {
                   DepartmentList: { show_all: true },
                   orderStatus: { show_all: true },
                   countryArea: { show_all: false },
                   dates: { hide_vs: true },
-                  DateType: { disabledKeys: ['applyDate'] },
+                  departureDateType: { disabledKeys: ['applyDate'] },
                 },
               }}
               onSubmit={(_err, obj, form) => {
                 customerServicesStore.setSearchValues(obj, form);
                 customerServicesStore.fetchGroupListByDestinationId(destinationId);
+                customerServicesStore.fetchDistGroupInfoByCountry(destinationId);
                 customerServicesStore.fetchDestinationGroupCount();
               }}
             />
           </Col>
         </Row>
+        <Row>
+          <Col span={24}>
+            <Typography.Title level={3}>国籍统计</Typography.Title>
+            <Divider orientation="right" plain>
+              <TableExportBtn label={'国籍统计'} {...{ columns: nationality_count_data.destinationGroupByCountryListColumns, dataSource: nationality_count_data.destinationGroupByCountryList }} />
+            </Divider>
+            <Table
+              sticky
+              id="destinationGroupByCountry"
+              dataSource={nationality_count_data.destinationGroupByCountryList}
+              columns={nationality_count_data.destinationGroupByCountryListColumns}
+              size="small"
+              rowKey={(record) => record.key}
+              loading={nationality_count_data.loading}
+              pagination={false}
+              scroll={{ x: 1000 }}
+            />
+          </Col>
+        </Row>
         <Row>
           <Col span={24}>
             <Table

src/views/Distribution.jsx

@@ -83,21 +83,15 @@ export default observer(() => {
       dataIndex: 'SumOrder',
       render: (v, r) => (
         <>
-          <Row align={'middle'}>
-            <Col flex={"100px"}>
-              <Text strong>{v}</Text>
-            </Col>
-            <Col flex={'auto'}>
               <Space direction={'vertical'}>
-                <span>
+              <Text strong>{v}</Text>
+              <span>
                   <span>同比: </span> <VSTag diffPercent={r.SumOrderToY} diffData={r.SumOrderDiffY} />
                 </span>
                 <span>
                   <span>环比: </span> <VSTag diffPercent={r.SumOrderToQ} diffData={r.SumOrderDiffQ} />
                 </span>
               </Space>
-            </Col>
-          </Row>
         </>
       ),
     },
@@ -106,21 +100,15 @@ export default observer(() => {
       dataIndex: 'ConfirmOrder',
       render: (v, r) => (
         <>
-          <Row align={'middle'}>
-            <Col flex={"100px"}>
-              <Text strong>{v}</Text>
-            </Col>
-            <Col flex={'auto'}>
               <Space direction={'vertical'}>
-                <span>
+              <Text strong>{v}</Text>
+              <span>
                   <span>同比: </span> <VSTag diffPercent={r.ConfirmOrderToY} diffData={r.ConfirmOrderDiffY} />
                 </span>
                 <span>
                   <span>环比: </span> <VSTag diffPercent={r.ConfirmOrderToQ} diffData={r.ConfirmOrderDiffQ} />
                 </span>
               </Space>
-            </Col>
-          </Row>
         </>
       ),
     },
@@ -129,21 +117,15 @@ export default observer(() => {
       dataIndex: 'SumML',
       render: (v, r) => (
         <>
-          <Row align={'middle'}>
-            <Col flex={"150px"}>
-              <Text strong>{dataFieldAlias.SumML.formatter(v)}</Text>
-            </Col>
-            <Col flex={'auto'}>
               <Space direction={'vertical'}>
-                <span>
+              <Text strong>{dataFieldAlias.SumML.formatter(v)}</Text>
+              <span>
                   <span>同比: </span> <VSTag diffPercent={r.SumMLToY} diffData={dataFieldAlias.SumML.formatter(r.SumMLDiffY)} />
                 </span>
                 <span>
                   <span>环比: </span> <VSTag diffPercent={r.SumMLToQ} diffData={dataFieldAlias.SumML.formatter(r.SumMLDiffQ)} />
                 </span>
               </Space>
-            </Col>
-          </Row>
         </>
       ),
     },

src/views/HostCaseCount.jsx

@@ -0,0 +1,147 @@
+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),
+    },
+  ];
+  // 筛选函数
+  const getFiltersData=(filterData,filterKey)=>{
+      return comm.uniqWith(filterData.map(rr => ({ text: rr[filterKey], value: rr[filterKey] })),
+            (a, b) => JSON.stringify(a) === JSON.stringify(b)).sort((a, b) => a.text.localeCompare(b.text));
+  };
+  // 小组筛选菜单项
+  const allOPIGroup = getFiltersData(host_case_data.summaryData,"GroupBy");
+  // 顾问筛选菜单项
+  const allOPIConsultant = getFiltersData(host_case_data.counselorData,"GroupBy");
+  // 明细表顾问名筛选菜单项
+  const allOPIDetailConsultant = getFiltersData(host_case_data.singleDetailData,"OPI_Name");
+  const summaryColumnsList = [{
+      title: '',
+      dataIndex: 'GroupBy',
+      key: 'GroupBy',
+    }, ...columnsList];
+  const groupColumnsList = [{
+    title: '组名',
+    dataIndex: 'GroupBy',
+    key: 'GroupBy',
+    filters: allOPIGroup,
+    onFilter: (value, record) => record.GroupBy === value,
+    filterSearch: true,
+  }, ...columnsList];
+  const counselorColumnsList = [{
+    title: '顾问名',
+    dataIndex: 'GroupBy',
+    key: 'GroupBy',
+    filters: allOPIConsultant,
+    onFilter: (value, record) => record.GroupBy === value,
+    filterSearch: true,
+  }, ...columnsList];
+  const singleDetailColumnsList = [{
+    title: '团名',
+    dataIndex: 'GroupBy',
+    key: 'GroupBy',
+  }, 
+  {
+    title: '顾问名',
+    dataIndex: 'OPI_Name',
+    key: 'OPI_Name',
+    filters: allOPIDetailConsultant,
+    onFilter: (value, record) => record.OPI_Name === value,
+    filterSearch: true,
+  },
+  ...columnsList.slice(1)];
+
+  const renderRow=(rowColumns,rowDataSource,title)=>{
+      return(
+        <Row>
+          <Col span={24}>
+            <Typography.Title level={3}>{title}</Typography.Title>
+            <Divider orientation="right" plain>
+              <TableExportBtn label={title} {...{ columns: rowColumns, dataSource: rowDataSource }} />
+            </Divider>
+            <Table
+              sticky
+              id={`${rowColumns}`}
+              dataSource={rowDataSource}
+              columns={rowColumns}
+              size="small"
+              rowKey={(record) => record.key}
+              loading={host_case_data.loading}
+              pagination={false}
+              scroll={{ x: 1000 }}
+            />
+          </Col>
+        </Row>
+      );
+  };
+
+  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");
+                customer_store.getHostCaseData("4");
+              }}
+            />
+          </Col>
+        </Row>
+        {renderRow(summaryColumnsList,host_case_data.summaryData,'东道主项目汇总')}
+        {renderRow(groupColumnsList,host_case_data.groupData,'东道主项目小组统计')}
+        {renderRow(counselorColumnsList,host_case_data.counselorData,'东道主项目顾问统计')}
+        {renderRow(singleDetailColumnsList,host_case_data.singleDetailData,'单团明细')}
+      </Space>
+    </>
+  );
+};
+
+export default observer(HostCaseCount);

src/views/Hotel.jsx

@@ -1,22 +1,135 @@
 import React, { useContext } from 'react';
 import { observer } from 'mobx-react';
 import { stores_Context } from '../config';
-import { Row, Col, Table } from 'antd';
+import { Row, Col, Table, Space, Typography, Divider } 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 } = useContext(stores_Context);
+  const { date_picker_store: searchFormStore } = useContext(stores_Context);
+  const { date_picker_store, HotelCruiseStore } = useContext(stores_Context);
+  const { loading, dataSource, summaryRow, filters } = HotelCruiseStore.hotel;
 
   const { formValues, siderBroken } = searchFormStore;
 
+  const tableSorter = (a, b, colName) => a[colName] - b[colName];
+  const tableExportDataRow = (col1, col2) => [col1, col2].filter((r) => r).join(' VS ');
+
   const tableProps = {
     size: 'small',
+    bordered: true,
+    pagination: false,
     columns: [
-      { title: '目的地', dataIndex: 'op', key: 'op' },
-      { title: '总间夜', dataIndex: 'action', key: 'action' },
-      { title: '主推', dataIndex: 'action', key: 'action' },
-      { title: '使用比例', dataIndex: 'action', key: 'action' },
+      {
+        title: '目的地',
+        sorter: (a, b) => a.CityName.localeCompare(b.CityName, 'zh-CN'),
+        children: [{ title: summaryRow.CityName, dataIndex: 'CityName', key: 'CityName' }],
+        filters: filters,
+        onFilter: (value, record) => record.CityName === value,
+        filterSearch: true,
+      },
+      {
+        title: '总间夜',
+        sorter: (a, b) => tableSorter(a, b, 'TotalNum'),
+        children: [
+          {
+            title: (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {summaryRow.TotalNum}
+                    {summaryRow.TotalNumPercent ? <Text type="secondary"> VS {summaryRow.CPTotalNum}</Text> : null}
+                  </Text>
+                  {summaryRow.TotalNumPercent && <VSTag diffPercent={summaryRow.TotalNumPercent} />}
+                </Space>
+              </>
+            ),
+            titleX: tableExportDataRow(summaryRow.TotalNum, summaryRow.CPTotalNum),
+            dataIndex: 'TotalNum',
+            key: 'TotalNum',
+            dataExport: (v, r) => tableExportDataRow(r.TotalNum, r.CPTotalNum),
+            render: (v, r) => (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {v}
+                    {r.CPTotalNum ? <Text type="secondary"> VS {r.CPTotalNum}</Text> : null}
+                  </Text>
+                  {r.CPTotalNum && <VSTag diffPercent={r.TotalNumPercent} />}
+                </Space>
+              </>
+            ),
+          },
+        ],
+      },
+      {
+        title: '主推',
+        sorter: (a, b) => tableSorter(a, b, 'RecomendNum'),
+        children: [
+          {
+            title: (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {summaryRow.RecomendNum}
+                    {summaryRow.RecomendNumPercent ? <Text type="secondary"> VS {summaryRow.CPRecomendNum}</Text> : null}
+                  </Text>
+                  {summaryRow.RecomendNumPercent && <VSTag diffPercent={summaryRow.RecomendNumPercent} />}
+                </Space>
+              </>
+            ),
+            titleX: tableExportDataRow(summaryRow.RecomendNum, summaryRow.CPRecomendNum),
+            dataIndex: 'RecomendNum',
+            key: 'RecomendNum',
+            dataExport: (v, r) => tableExportDataRow(r.RecomendNum, r.CPRecomendNum),
+            render: (v, r) => (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {v}
+                    {r.CPRecomendNum ? <Text type="secondary"> VS {r.CPRecomendNum}</Text> : null}
+                  </Text>
+                  {r.CPRecomendNum && <VSTag diffPercent={r.RecomendNumPercent} />}
+                </Space>
+              </>
+            ),
+          },
+        ],
+      },
+      {
+        title: '使用比例',
+        children: [
+          {
+            title: (
+              <>
+                <Space direction={'vertical'}>
+                  <Text strong>
+                    {summaryRow.RecommendRate_100}
+                    {summaryRow.RecommendRateDelta ? <Text type="secondary"> VS {summaryRow.CPRecommendRate_100}</Text> : null}
+                  </Text>
+                  {summaryRow.RecommendRateDelta && <VSTag diffPercent={summaryRow.RecommendRateDelta} />}
+                </Space>
+              </>
+            ),
+            titleX: tableExportDataRow(summaryRow.RecommendRate_100, summaryRow.CPRecommendRate_100),
+            dataIndex: 'RecommendRate_100',
+            key: 'RecommendRate_100',
+            dataExport: (v, r) => tableExportDataRow(r.RecommendRate_100, r.CPRecommendRate_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>
+              </>
+            ),
+          },
+        ],
+      },
     ],
   };
 
@@ -28,27 +141,33 @@ export default observer((props) => {
             defaultValue={{
               initialValue: {
                 ...date_picker_store.formValues,
-                ...customerServicesStore.searchValues,
+                ...HotelCruiseStore.searchValues,
               },
-              // 'countryArea', 'DateType', 'dates',
-              shows: ['DepartmentList', 'countryArea', 'orderStatus', 'bookType', 'recommandRate','hotelStar','DateType', 'dates',],
+              // 'countryArea', 'DateType', 'dates', 'hotelRecommandRate',
+              shows: ['DepartmentList', 'countryArea', 'orderStatus', 'hotelBookType', '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) => {
-              customerServicesStore.setSearchValues(obj, form);
-              // customerServicesStore.fetchDestinationGroupCount();
+              HotelCruiseStore.setSearchValues(obj, form);
+              HotelCruiseStore.getHotelData(obj);
             }}
           />
         </Col>
       </Row>
       <section>
-        <Table {...tableProps} bordered />
+        <Divider orientation="right" >
+          <TableExportBtn label={'酒店'} {...{ columns: tableProps.columns, dataSource }} />
+        </Divider>
+        <Table {...tableProps} bordered {...{ loading, dataSource }} rowKey={(record) => record.CityName} />
       </section>
     </>
   );

src/views/OPActivity.jsx

@@ -1,85 +0,0 @@
-import React, { Children, useContext, useState } from 'react';
-import { observer } from 'mobx-react';
-import { stores_Context } from '../config';
-import moment from 'moment';
-import { SlackOutlined, SketchOutlined, AntCloudOutlined, RedditOutlined, GithubOutlined } from '@ant-design/icons';
-import { Row, Col, Table, Select, Space, Typography, Progress, Spin, Divider, Button, Switch } from 'antd';
-import SearchForm from './../components/search/SearchForm';
-
-export default observer((props) => {
-  const { sale_store, date_picker_store: searchFormStore } = useContext(stores_Context);
-
-  const { formValues, siderBroken } = searchFormStore;
-
-  const activityTableProps = {
-    columns: [
-      { title: '', dataIndex: 'op', key: 'op' }, // 维度: 顾问
-      {
-        title: '顾问动作',
-        key: 'date',
-        children: [
-          { title: '首次响应率24H', dataIndex: 'action', key: 'action' },
-          { title: '48H内报价率', dataIndex: 'action', key: 'action' },
-          { title: '一次报价率', dataIndex: 'action', key: 'action' },
-          { title: '二次报价率', dataIndex: 'action', key: 'action' },
-          { title: '>50条会话', dataIndex: 'action', key: 'action' },
-          { title: '违规数', dataIndex: 'action', key: 'action' },
-        ],
-      },
-      {
-        title: '客人回复',
-        key: 'department',
-        children: [
-          { title: '首次回复率24H', dataIndex: 'action', key: 'action' },
-          { title: '48H内报价回复率', dataIndex: 'action', key: 'action' },
-          { title: '一次报价回复率', dataIndex: 'action', key: 'action' },
-          { title: '二次报价回复率', dataIndex: 'action', key: 'action' },
-        ],
-      },
-    ],
-  };
-
-  const riskTableProps = {
-    columns: [
-      { title: '', dataIndex: 'date', key: 'date' }, // 维度
-      { title: '>24H回复', dataIndex: 'action', key: 'action' },
-      { title: '首次报价周期>48h', dataIndex: 'action', key: 'action' },
-      { title: '报价次数<1次', dataIndex: 'action' },
-      { title: '报价次数<2次', dataIndex: 'action' },
-    ],
-  };
-
-  return (
-    <>
-      <Row gutter={16} className={siderBroken ? '' : 'sticky-top'}>
-        <Col md={24} lg={24} xxl={24}>
-          <SearchForm
-            defaultValue={{
-              initialValue: {
-                ...formValues,
-                ...sale_store.searchValues,
-              },
-              shows: ['DepartmentList', 'WebCode', 'dates'],
-              fieldProps: {
-                DepartmentList: { show_all: false, mode: 'multiple', col: 5 },
-                WebCode: { show_all: false, mode: 'multiple', col: 5 },
-                dates: { hide_vs: true },
-              },
-            }}
-            onSubmit={(_err, obj, form, str) => {
-              sale_store.setSearchValues(obj, form);
-              // pageRefresh(obj);
-            }}
-          />
-        </Col>
-      </Row>
-      <section>
-        <Table {...activityTableProps} bordered />
-      </section>
-      <section>
-        <h3>未成行订单</h3>
-        <Table {...riskTableProps} bordered />
-      </section>
-    </>
-  );
-});

src/views/OPRisk.jsx

@@ -1,69 +0,0 @@
-import React, { useContext, useState } from 'react';
-import { observer } from 'mobx-react';
-import { stores_Context } from '../config';
-import moment from 'moment';
-import { SlackOutlined, SketchOutlined, AntCloudOutlined, RedditOutlined, GithubOutlined } from '@ant-design/icons';
-import { Row, Col, Table, Select, Space, Typography, Progress, Spin, Divider, Button, Switch } from 'antd';
-import SearchForm from './../components/search/SearchForm';
-
-export default observer((props) => {
-  const { sale_store, date_picker_store: searchFormStore } = useContext(stores_Context);
-
-  const { formValues, siderBroken } = searchFormStore;
-
-  const riskTableProps = {
-    loading: false,
-    // sticky: true,
-    // scroll: { x: 1000, y: 400 },
-    pagination: false,
-    columns: [
-      { title: '客人姓名', dataIndex: 'WebCode', key: 'WebCode' },
-      { title: '团号', dataIndex: 'o_id', key: 'o_id' },
-      { title: '表单内容', dataIndex: 'COLI_LineClass', key: 'COLI_LineClass' },
-      { title: '顾问', dataIndex: 'SourceType', key: 'SourceType' },
-      { title: '预定时间', dataIndex: 'applyDate', key: 'applyDate' },
-    ],
-  };
-  return (
-    <>
-      <Row gutter={16} className={siderBroken ? '' : 'sticky-top'}>
-        <Col md={24} lg={24} xxl={24}>
-          <SearchForm
-            defaultValue={{
-              initialValue: {
-                ...formValues,
-                ...sale_store.searchValues,
-              },
-              shows: ['DepartmentList', 'WebCode', 'dates'],
-              fieldProps: {
-                DepartmentList: { show_all: false, mode: 'multiple', col: 5 },
-                WebCode: { show_all: false, mode: 'multiple', col: 5 },
-                dates: { hide_vs: true },
-              },
-            }}
-            onSubmit={(_err, obj, form, str) => {
-              sale_store.setSearchValues(obj, form);
-              // pageRefresh(obj);
-            }}
-          />
-        </Col>
-      </Row>
-      <section>
-        <h3>&gt;24H回复</h3>
-        <Table {...riskTableProps} bordered />
-      </section>
-      <section>
-        <h3>首次报价周期&gt;48h</h3>
-        <Table {...riskTableProps} bordered />
-      </section>
-      <section>
-        <h3>报价次数&lt;1</h3>
-        <Table {...riskTableProps} bordered />
-      </section>
-      <section>
-        <h3>报价次数&lt;2</h3>
-        <Table {...riskTableProps} bordered />
-      </section>
-    </>
-  );
-});

src/views/Orders.jsx

@@ -1,6 +1,6 @@
 import React, { Component } from "react";
 import { Row, Col, Tabs, Table, Divider, Spin } from "antd";
-import { ContainerOutlined, BlockOutlined, SmileOutlined, TagsOutlined, GlobalOutlined, FullscreenOutlined, DingtalkOutlined, CarryOutOutlined, CoffeeOutlined } from "@ant-design/icons";
+import { ContainerOutlined, BlockOutlined, SmileOutlined, TagsOutlined, GlobalOutlined, FullscreenOutlined, DingtalkOutlined, CarryOutOutlined, CoffeeOutlined, ClockCircleOutlined, HeartOutlined, IdcardOutlined, ContactsOutlined } from "@ant-design/icons";
 import { stores_Context } from "../config";
 import { Line, Pie } from "@ant-design/charts";
 import { observer } from "mobx-react";
@@ -48,7 +48,7 @@ class Orders extends Component {
                 )}~${date_picker_store.end_date_cp.format(config.DATE_FORMAT)}`,
                 dataIndex: 'OrderType',
                 fixed: 'left',
-                render: (text, record) => <NavLink to={`/orders_sub/${orders_store.active_tab_key}/${record.OrderTypeSN}/${record.OrderType}`}>{text}</NavLink>,
+                render: (text, record) => <NavLink to={`/orders_sub/${orders_store.active_tab_key}/${record.OrderTypeSN}/${encodeURIComponent(record.OrderType)}`}>{text}</NavLink>,
               },
             ],
           },
@@ -207,7 +207,7 @@ class Orders extends Component {
                 titleX: `${date_picker_store.start_date.format(config.DATE_FORMAT)}~${date_picker_store.end_date.format(config.DATE_FORMAT)}`,
                 fixed: 'left',
                 dataIndex: "OrderType",
-								render: (text, record) => <NavLink to={`/orders_sub/${orders_store.active_tab_key}/${record.OrderTypeSN}/${record.OrderType}`}>{text}</NavLink>,
+								render: (text, record) => <NavLink to={`/orders_sub/${orders_store.active_tab_key}/${record.OrderTypeSN}/${encodeURIComponent(record.OrderType)}`}>{text}</NavLink>,
 							},
 						],
 					},
@@ -472,11 +472,14 @@ class Orders extends Component {
                   key: 'ToB',
                   label: (
                     <span>
-                      <CoffeeOutlined />
+                      <ContactsOutlined />
                       客运类别
                     </span>
                   ),
                 },
+                {key: 'FoodRequirement',label: (<span><CoffeeOutlined />饮食要求</span>),},
+                {key: 'hobbies',label: (<span><HeartOutlined/>兴趣爱好</span>),},
+                {key: 'ages',label: (<span><IdcardOutlined/>年龄段</span>),},
               ].map((ele) => {
                 return {
                   ...ele,

src/views/Orders_sub.jsx

@@ -171,6 +171,12 @@ const Orders_sub = () => {
 		return result;
 	};
 
+	// 在逗号和分号处自动换行的函数
+	const addLineBreaksAtCommas = (text) => {
+		if (!text) return '';
+		return text.replace(/&/g, "&").replace(/，/g, '，\n').replace(/,/g, ',\n').replace(/；/g, '；\n').replace(/;/g, ';\n');
+	};
+
 	const table_data = format_data_detail(orders_store.orderCountData_Form_sub.ordercount1);
 	const table_data2 = format_data_detail(orders_store.orderCountData_Form_sub.ordercount2);
 	const table_data_p = format_data(orders_store.orderCountData_Form_sub.ordercount1);
@@ -192,7 +198,7 @@ const Orders_sub = () => {
             rowKey={record => record.key}
             expandable={{
               expandedRowRender: record => (
-                <pre>
+                <pre style={{ whiteSpace: 'pre-wrap', wordWrap: 'break-word', fontSize: '16px' }}>
                   <Divider orientation="left" plain>
                     客户需求
                   </Divider>
@@ -200,7 +206,7 @@ const Orders_sub = () => {
                   <Divider orientation="left" plain>
                     订单内容
                   </Divider>
-                  {record.COLI_OrderDetailText}
+                  {addLineBreaksAtCommas(record.COLI_OrderDetailText)}
                 </pre>
               ),
             }}
@@ -224,7 +230,7 @@ const Orders_sub = () => {
             size="small"
             rowKey={record => record.key}
             expandable={{
-              expandedRowRender: record => <pre>{record.COLI_OrderDetailText}</pre>,
+              expandedRowRender: record => <pre style={{ whiteSpace: 'pre-wrap', wordWrap: 'break-word', fontSize: '16px' }}>{record.COLI_OrderDetailText}</pre>,
             }}
           />
         </Col>

src/views/Sale_KPI.jsx

@@ -241,7 +241,7 @@ const Sale_KPI = () => {
               <TableExportBtn label={'sales kpi'} {...{ columns: columnsForExport, dataSource: dataForExport }} />
             </Divider>
             <Table
-              sticky
+              sticky={{ offsetHeader: 64 }}
               key={`salesTradeTable`}
               loading={loading}
               columns={columns}

src/views/SalesCustomerCareRegular.jsx

@@ -1,148 +0,0 @@
-import { createContext, useContext, useEffect, useState } from 'react';
-import { observer } from 'mobx-react';
-import { stores_Context } from '../config';
-import { Table, Row, Col, Divider, Button, Switch } from 'antd';
-import SearchForm from '../components/search/SearchForm';
-import { TableExportBtn } from './../components/Data';
-import { uniqWith, groupBy } from './../utils/commons';
-
-// 注意TdCell要提到DataTable作用域外声明
-const TdCell = (tdprops) => {
-  // onMouseEnter, onMouseLeave在数据量多的时候，会严重阻塞表格单元格渲染，严重影响性能
-  const { onMouseEnter, onMouseLeave, ...restProps } = tdprops;
-  return <td {...restProps} />;
-};
-
-const SalesCustomerCareRegular = (props) => {
-  const { date_picker_store: searchFormStore, customer_store } = useContext(stores_Context);
-  const { formValues, formValuesToSub, siderBroken } = searchFormStore;
-  const { sales_regular_data: pageData } = customer_store;
-
-  const allOPI1 = uniqWith(
-    pageData.data.map((rr) => ({ text: rr.operatorName, value: rr.operatorName })),
-    (a, b) => JSON.stringify(a) === JSON.stringify(b)
-  ).sort((a, b) => a.text.localeCompare(b.text));
-
-  const [OPIFilters, setOPIFilters] = useState([]);
-  const [dataSource, setDataSource] = useState([]);
-  const [ifmerge, setIfmerge] = useState(false);
-  const [dataForExport, setDataForExport] = useState([]);
-  const [dataForExportS, setDataForExportS] = useState([]);
-
-  useEffect(() => {
-    if ( ! ifmerge) {
-      // const allOPI1 = uniqWith(
-      //   pageData.data.map((rr) => ({ text: rr.operatorName, value: rr.operatorName })),
-      //   (a, b) => JSON.stringify(a) === JSON.stringify(b)
-      // ).sort((a, b) => a.text.localeCompare(b.text));
-      // setOPIFilters(allOPI1);
-      setDataSource(pageData.data);
-      setDataForExport(pageData.data.reduce((r, c) => r.concat([{...c, children: undefined}], c.children.map(ele => ({...ele, operatorName: ele.rowLabel}))), []));
-      setDataForExportS(pageData.data.reduce((r, c) => r.concat([{...c, children: undefined}]), []));
-    } else {
-      // const allOPI1 = uniqWith(
-      //   pageData.mergedData.map((rr) => ({ text: rr.operatorName, value: rr.operatorName })),
-      //   (a, b) => JSON.stringify(a) === JSON.stringify(b)
-      // ).sort((a, b) => a.text.localeCompare(b.text));
-      // setOPIFilters(allOPI1);
-      setDataSource(pageData.mergedData);
-      setDataForExport(pageData.mergedData.reduce((r, c) => r.concat([{...c, children: undefined}], c.children.map(ele => ({...ele, operatorName: ele.rowLabel}))), []));
-      setDataForExportS(pageData.mergedData.reduce((r, c) => r.concat([{...c, children: undefined}]), []));
-    }
-
-    return () => {
-
-    };
-  }, [ifmerge, pageData.data]);
-
-
-  const rowColumns = [
-    { title: '顾问', dataIndex: 'operatorName', key: 'operatorName' },
-    { title: '订单号', dataIndex: 'o_id', key: 'o_id' },
-    { title: '预定日期', dataIndex: 'applyDate', key: 'applyDate' },
-    { title: '订单状态', key: 'orderState', render: (_, r) => r.orderState === '1' ? '成行' : '', },
-    { title: '毛利', dataIndex: 'ML', key: 'ML' },
-    { title: '人数', dataIndex: 'personNum', key: 'personNum' },
-    { title: '天数', dataIndex: 'tourdays', key: 'tourdays' },
-    // { title: '人天数', dataIndex: 'CGI_PersonDays', key: 'CGI_PersonDays' },
-    // { title: '走团日期', dataIndex: 'COLI_OrderStartDate', key: 'COLI_OrderStartDate' },
-    { title: '小组', dataIndex: 'dept', key: 'dept' },
-    { title: '老客户', key: 'IsOld', render: (_, r) => r.IsOld === '1' ? '是' : '' },
-    { title: '老客户推荐', key: 'IsCusCommend', render: (_, r) => r.isCusCommend === '1' ? '是' : '' },
-    { title: '网站', dataIndex: 'WebCode', key: 'WebCode' },
-    { title: '来源', dataIndex: 'SourceType', key: 'SourceType' },
-    { title: '页面类型', dataIndex: 'COLI_LineClass', key: 'COLI_LineClass' },
-  ];
-  const columns = [
-    { key: 'operatorName', title: '顾问', dataIndex: 'operatorName', width: '6em', filters: allOPI1, onFilter: (value, record) => value.includes(record.operatorName), filterSearch: true },
-    { key: 'SumOrder', title: '订单数', dataIndex: 'SumOrder', width: '5em' },
-    { key: 'ConfirmOrder', title: '成交数', dataIndex: 'ConfirmOrder', width: '5em' },
-    { key: 'ConfirmPersonNum', title: '✔人数(SUM)', dataIndex: 'ConfirmPersonNum', width: '5em' },
-    { key: 'confirmTourdays', title: '✔团天数(AVG)', dataIndex: 'confirmTourdays', width: '5em' },
-    { key: 'SumML', title: '预计毛利', dataIndex: 'SumML', width: '5em' }, // SumML_txt
-    { key: 'ConfirmRates', title: '成交率', dataIndex: 'ConfirmRates_txt', width: '5em' },
-    { key: 'SingleML', title: '单团毛利', dataIndex: 'SingleML', width: '5em' },
-    { key: 'action', title: '', width: '5em', render: (_, r) => {
-      const rowChildren = pageData.rawData.filter(ele => ele.operatorName === r.operatorName);
-      return r.hasOld ? <TableExportBtn btnTxt='明细' label={`老客户明细-${r.operatorName}`} {...{ columns: rowColumns, dataSource: rowChildren }} /> : null;
-    } },
-  ];
-  return (
-    <>
-      <Row gutter={16} className={siderBroken ? '' : 'sticky-top'}>
-        <Col className="gutter-row" span={24}>
-          <SearchForm
-            defaultValue={{
-              initialValue: {
-                ...formValues,
-                ...pageData.searchValues,
-              },
-              shows: ['DateType', 'DepartmentList', 'WebCode', 'dates'],
-              fieldProps: {
-                DepartmentList: { show_all: false, mode: 'multiple' },
-                WebCode: { show_all: false, mode: 'multiple' },
-                dates: { hide_vs: true },
-              },
-            }}
-            onSubmit={(_err, obj, form, str) => {
-              customer_store.setSearchValues(obj, form, 'sales_regular_data');
-              customer_store.get_sales_regular_data(obj);
-              // MeetingDataStore.setSearchValues(form);
-              // dataRefresh(obj);
-            }}
-          />
-        </Col>
-      </Row>
-      <h2>销售-老客户, 含推荐</h2>
-      <Divider orientation="right" plain>
-        {pageData.data.length > 0 && (
-          <Switch
-            unCheckedChildren="各账户"
-            checkedChildren="合并"
-            key={'openOrMerge'}
-            checked={ifmerge}
-            onChange={(e) => {
-              setIfmerge(e);
-            }}
-          />
-        )}
-        <Divider type={'vertical'} />
-        <TableExportBtn btnTxt='导出明细' label={`${formValuesToSub.Date1}-销售.老客户-明细`} {...{ columns: rowColumns, dataSource: pageData.rawData }} />
-        <Divider type={'vertical'} />
-        <TableExportBtn btnTxt='导出下表-展开' label={`${formValuesToSub.Date1}-销售.老客户`} {...{ columns, dataSource: dataForExport }} />
-        <Divider type={'vertical'} />
-        <TableExportBtn btnTxt='导出下表-总' label={`${formValuesToSub.Date1}-销售.老客户`} {...{ columns, dataSource: dataForExportS }} />
-      </Divider>
-      <Table
-        sticky
-        dataSource={dataSource}
-        loading={pageData.loading}
-        columns={columns}
-        pagination={false}
-        // defaultExpandAllRows
-        // expandable={{ defaultExpandAllRows: true, expandedRowKeys: pageData.data.map((ele) => ele.key),  }}
-      />
-    </>
-  );
-};
-export default observer(SalesCustomerCareRegular);

src/views/sales-crm/Dashboard.jsx

@@ -1,14 +1,27 @@
 import React, { useContext, useState, useEffect } from 'react';
 import { observer } from 'mobx-react';
-import { stores_Context, DATE_FORMAT, SMALL_DATETIME_FORMAT } from '../config';
+import { Link } from 'react-router-dom';
+import { stores_Context, DATE_FORMAT, SMALL_DATETIME_FORMAT } from '../../config';
 import moment from 'moment';
-import { SlackOutlined, SketchOutlined, AntCloudOutlined, RedditOutlined, GithubOutlined } from '@ant-design/icons';
-import { Row, Col, Table, Select, Space, Typography, Progress, Spin, Divider, Button, Switch, Tag } from 'antd';
-import SearchForm from './../components/search/SearchForm';
-import MixFieldsDetail from '../components/MixFieldsDetail';
-import { cloneDeep, fixTo2Decimals, sortBy, isEmpty, pick } from '../utils/commons';
-import Column from '../components/Column';
-import { groupsMappedByKey } from './../libs/ht';
+import { Row, Col, Table, Select, Spin, Tag } from 'antd';
+import SearchForm from '../../components/search/SearchForm';
+import MixFieldsDetail from '../../components/MixFieldsDetail';
+import { fixTo2Decimals, isEmpty, pick } from '../../utils/commons';
+import Column from '../../components/Column';
+import { groupsMappedByKey } from '../../libs/ht';
+
+const COLOR_SETS = [
+  "#FFFFFF",
+  // "#5B8FF9",
+  // "#FF6B3B",
+  "#9FB40F",
+  "#76523B",
+  "#DAD5B5",
+  "#E19348",
+  "#F383A2",
+];
+
+const transparentHex = '1A';
 
 const numberConvert10K = (number, scale = 10) => {
   return fixTo2Decimals((number/(1000*scale)));
@@ -20,12 +33,12 @@ export default observer((props) => {
   const { formValues, formValuesToSub, siderBroken } = searchFormStore;
   const _formValuesToSub = pick(formValuesToSub, ['DepartmentList', 'WebCode']);
 
-  const { resetData, results } = SalesCRMDataStore;
+  const { searchValues, resetData, results } = SalesCRMDataStore;
   const operatorObjects = results.details.map((v) => ({ key: v.groupsKey, value: v.groupsKey, label: v.groupsLabel, text: v.groupsLabel }));
   // console.log(operatorObjects);
 
   const pageRefresh = async (obj) => {
-    resetData();
+    resetData('results');
     const deptList = obj.DepartmentList.split(',');
     const includeCH = ['1', '2', '7'].some(ele => deptList.includes(ele));
     const includeAH = ['28'].every(ele => deptList.includes(ele));
@@ -34,7 +47,7 @@ export default observer((props) => {
     const separateParam = [];
     if (includeCH) {
       const inCH = deptList.filter(k => ['1', '2', '7'].includes(k)).join(',');
-    separateParam.push({ DepartmentList: inCH, retLabel: 'CH'});
+      separateParam.push({ DepartmentList: inCH, retLabel: 'CH'});
     }
     if (includeAH) {
       separateParam.push({ DepartmentList: '28', retLabel: 'AH'});
@@ -74,8 +87,8 @@ export default observer((props) => {
     // console.log('formValuesToSub --- getFullYearDiagramData', formValuesToSub.DepartmentList);
     await SalesCRMDataStore.getResultData({
       ..._formValuesToSub,
-      Date1: moment().startOf('year').format(DATE_FORMAT),
-      Date2: moment().endOf('year').format(SMALL_DATETIME_FORMAT),
+      Date1: moment(obj.date).startOf('year').format(DATE_FORMAT),
+      Date2: moment(obj.date).endOf('year').format(SMALL_DATETIME_FORMAT),
       groupType: 'overview',
       // groupType: 'operator',
       groupDateType: 'month',
@@ -103,14 +116,17 @@ export default observer((props) => {
    * 业绩数据列
    * ! 成行率: CH个人成行率<12%, AH个人成行率<8%
    */
-  const dataFields = (suffix) => [
+  const dataFields = (suffix, colRootIndex) => [
     {
       key: 'ConfirmRates' + suffix,
       title: '成行率',
       dataIndex: [suffix, 'ConfirmRates'],
       width: '5em',
       // CH个人成行率<12%, AH个人成行率<8%刷红
-      render: (val, r) => ({ props: { style: { color: val < (retPropsMinRatesSet?.[r?.retProps || 'default'] || retPropsMinRatesSet.default) ? 'red' : 'green' } }, children: val ? `${val}%` : '' }),
+      render: (val, r) => ({
+        props: { style: { color: val < (retPropsMinRatesSet?.[r?.retProps || 'default'] || retPropsMinRatesSet.default) ? 'red' : 'green', backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: val ? `${val}%` : '',
+      }),
       sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].ConfirmRates - b[suffix].ConfirmRates),
     },
     {
@@ -118,7 +134,10 @@ export default observer((props) => {
       title: '业绩/万',
       dataIndex: [suffix, 'SumML'],
       width: '5em',
-      render: (_, r) => numberConvert10K(_),
+      render: (_, r) => ({
+        props: { style: { backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: numberConvert10K(_),
+      }),
       sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].SumML - b[suffix].SumML),
     },
     {
@@ -126,6 +145,10 @@ export default observer((props) => {
       title: '团数',
       dataIndex: [suffix, 'ConfirmOrder'],
       width: '5em',
+      render: (_, r) => ({
+        props: { style: { backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: _,
+      }),
       sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].ConfirmOrder - b[suffix].ConfirmOrder),
     },
     {
@@ -133,6 +156,10 @@ export default observer((props) => {
       title: '订单数',
       dataIndex: [suffix, 'SumOrder'],
       width: '5em',
+      render: (_, r) => ({
+        props: { style: { backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: _,
+      }),
       sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].SumOrder - b[suffix].SumOrder),
     },
     {
@@ -140,6 +167,10 @@ export default observer((props) => {
       title: '老客户团数',
       dataIndex: [suffix, 'ResumeOrder'],
       width: '5em',
+      render: (_, r) => ({
+        props: { style: { backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: _,
+      }),
       sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].ResumeOrder - b[suffix].ResumeOrder),
     },
     {
@@ -147,7 +178,10 @@ export default observer((props) => {
       title: '老客户成行率',
       dataIndex: [suffix, 'ResumeRates'],
       width: '5em',
-      render: (val, r) => ({ children: val ? `${val}%` : '' }),
+      render: (val, r) => ({
+        props: { style: { backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: val ? `${val}%` : ''
+      }),
       sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].ResumeRates - b[suffix].ResumeRates),
     },
   ];
@@ -155,6 +189,7 @@ export default observer((props) => {
   const dashboardTableProps = {
     pagination: false,
     size: 'small',
+    showSorterTooltip: false,
     columns: [
       {
         title: '',
@@ -164,16 +199,17 @@ export default observer((props) => {
         filterSearch: true,
         filters: operatorObjects.sort((a, b) => a.text.localeCompare(b.text)),
         onFilter: (value, record) => record.groupsKey === value || record.groupType === 'overview',
+        render: (text, record) => (record.groupType !== 'operator' ? text : <Link to={`/sales-crm/risk/sales/${record.groupsKey}`}>{text}</Link>),
       },
       {
-        title: '前90 -30天',
+        title: () => (<>前90 -30天<br/>{searchValues.date90.Date1} 至 {searchValues.date90.Date2}</>),
         key: 'date',
-        children: dataFields('result90'),
+        children: dataFields('result90', 0),
       },
       {
-        title: '前180 -50天',
+        title: () => (<>前180 -50天<br/>{searchValues.date180.Date1} 至 {searchValues.date180.Date2}</>),
         key: 'department',
-        children: dataFields('result180'),
+        children: dataFields('result180', 1),
       },
     ],
     rowClassName: (record, rowIndex) => {
@@ -231,7 +267,7 @@ export default observer((props) => {
                 ...formValues,
                 ...SalesCRMDataStore.searchValues,
               },
-              shows: ['DepartmentList', 'WebCode'],
+              shows: ['DepartmentList', 'WebCode', 'date'],
               fieldProps: {
                 DepartmentList: { show_all: false, mode: 'multiple', col: 5 },
                 WebCode: { show_all: false, mode: 'multiple', col: 5 },

src/views/sales-crm/Process.jsx

@@ -0,0 +1,259 @@
+import React, { useContext } from 'react';
+import { Link } from 'react-router-dom';
+import { observer } from 'mobx-react';
+import { stores_Context } from '../../config';
+import { InfoCircleOutlined } from '@ant-design/icons';
+import { Row, Col, Table, Tooltip } from 'antd';
+import SearchForm from '../../components/search/SearchForm';
+import { pick } from '../../utils/commons';
+
+const COLOR_SETS = [
+  "#FFFFFF",
+  // "#5B8FF9",
+  // "#FF6B3B",
+  "#9FB40F",
+  "#76523B",
+  "#DAD5B5",
+  "#E19348",
+  "#F383A2",
+];
+
+const transparentHex = '1A';
+
+export default observer((props) => {
+  const { SalesCRMDataStore, date_picker_store: searchFormStore } = useContext(stores_Context);
+
+  // const { formValues, siderBroken } = searchFormStore;
+  const { formValues, formValuesToSub, siderBroken } = searchFormStore;
+  const _formValuesToSub = pick(formValuesToSub, ['DepartmentList', 'WebCode']);
+  const { resetData, process } = SalesCRMDataStore;
+  const operatorObjects = process.details.map((v) => ({ key: v.groupsKey, value: v.groupsKey, label: v.groupsLabel, text: v.groupsLabel }));
+
+  const pageRefresh = async (obj) => {
+    resetData('process');
+    Promise.allSettled([
+      SalesCRMDataStore.getProcessData({
+        ...(obj || _formValuesToSub),
+        // ...subParam,
+        // groupType: 'overview',
+        groupType: 'dept',
+        groupDateType: '',
+      }),
+      SalesCRMDataStore.getProcessData({
+        ...(obj || _formValuesToSub),
+        // ...subParam,
+        groupType: 'operator',
+        groupDateType: '',
+      }),
+    ]);
+  };
+
+  const tableSorter = (a, b, colName) => (a.groupType !== 'operator' ? -1 : b.groupType !== 'operator' ? 0 : a[colName] - b[colName]);
+  const percentageRender = val => val ? `${val}%` : '';
+
+  const activityTableProps = {
+    rowKey: 'groupsKey',
+    pagination: { pageSize: 10, showSizeChanger: false },
+    size: 'small',
+    rowClassName: (record, rowIndex) => {
+      return record.groupType === 'operator' ? '': 'ant-tag-blue';
+    },
+    showSorterTooltip: false,
+    columns: [
+      { title: '', dataIndex: 'groupsLabel', key: 'groupsLabel', width: '6rem',
+        filterSearch: true,
+        filters: operatorObjects.sort((a, b) => a.text.localeCompare(b.text)),
+        onFilter: (value, record) => record.groupsKey === value || record.groupType !== 'operator',
+        render: (text, record) => (record.groupType !== 'operator' ? text : <Link to={`/sales-crm/risk/sales/${record.groupsKey}`}>{text}</Link>),
+      }, // 维度: 顾问
+      {
+        title: '顾问动作',
+        key: 'date',
+        children: [
+          { title: () => (
+            <>
+              首次响应率24H{' '}
+              <Tooltip title="达到24H内回复的订单数/总订单数">
+                <InfoCircleOutlined />
+              </Tooltip>
+            </>
+          ), dataIndex: 'firstTouch24', key: 'firstTouch24', render: percentageRender,
+            sorter: (a, b) => tableSorter(a, b, 'firstTouch24'),
+          },
+          { title: () => (
+            <>
+              48H内报价率{' '}
+              <Tooltip title="达到48H内报价的订单数/总订单数">
+                <InfoCircleOutlined />
+              </Tooltip>
+            </>
+          ), dataIndex: 'firstQuote48', key: 'firstQuote48',render: percentageRender ,
+            sorter: (a, b) => tableSorter(a, b, 'firstQuote48'), },
+          { title: () => (
+            <>
+              一次报价率{' '}
+              <Tooltip title="首次报价的订单数/总订单数">
+                <InfoCircleOutlined />
+              </Tooltip>
+            </>
+          ), dataIndex: 'quote1', key: 'quote1',render: percentageRender ,
+            sorter: (a, b) => tableSorter(a, b, 'quote1'), },
+          { title: () => (
+            <>
+              二次报价率{' '}
+              <Tooltip title="二次报价的订单数/一次报价后回复数">
+                <InfoCircleOutlined />
+              </Tooltip>
+            </>
+          ), dataIndex: 'quote2', key: 'quote2',render: percentageRender ,
+            sorter: (a, b) => tableSorter(a, b, 'quote2'), },
+          { title: () => (
+            <>
+              &gt;50条会话{' '}
+              <Tooltip title=">50条会话的订单数/总订单">
+                <InfoCircleOutlined />
+              </Tooltip>
+            </>
+          ), dataIndex: 'turnsGT50', key: 'turnsGT50', render: percentageRender ,
+            sorter: (a, b) => tableSorter(a, b, 'turnsGT50'), },
+          { title: () => (
+            <>
+              违规数{' '}
+              <Tooltip title="未遵循24H回复的订单数">
+                <InfoCircleOutlined />
+              </Tooltip>
+            </>
+          ), dataIndex: 'violations', key: 'violations',
+            sorter: (a, b) => tableSorter(a, b, 'violations'), },
+        ],
+      },
+      {
+        title: '客人回复',
+        key: 'department',
+        children: [
+          {
+            title: () => (
+            <>
+              首次回复率24H{' '}
+              <Tooltip title="达到24H内回复的订单数/总订单数">
+                <InfoCircleOutlined />
+              </Tooltip>
+            </>
+          ), dataIndex: 'firstReply24', key: 'firstReply24',
+            render: (_, r) => ({
+              props: { style: { backgroundColor: COLOR_SETS[1]+transparentHex } },
+              children: percentageRender(_),
+            }),
+            sorter: (a, b) => tableSorter(a, b, 'firstReply24'), },
+          {
+            title: () => (
+            <>
+              48H内报价回复率{' '}
+              <Tooltip title="48H内报价后的回复数/报价的订单数">
+                <InfoCircleOutlined />
+              </Tooltip>
+            </>
+          ), dataIndex: 'replyQuote48', key: 'replyQuote48',
+            render: (_, r) => ({
+              props: { style: { backgroundColor: COLOR_SETS[1]+transparentHex } },
+              children: percentageRender(_),
+            }),
+            sorter: (a, b) => tableSorter(a, b, 'replyQuote48'), },
+          {
+            title: () => (
+            <>
+              一次报价回复率{' '}
+              <Tooltip title="一次报价后回复率/订单总数">
+                <InfoCircleOutlined />
+              </Tooltip>
+            </>
+          ), dataIndex: 'replyQuote1', key: 'replyQuote1',
+            render: (_, r) => ({
+              props: { style: { backgroundColor: COLOR_SETS[1]+transparentHex } },
+              children: percentageRender(_),
+            }),
+            sorter: (a, b) => tableSorter(a, b, 'replyQuote1'), },
+          {
+            title: () => (
+            <>
+              二次报价回复率{' '}
+              <Tooltip title="二次报价后回复数/一次报价后回复数">
+                <InfoCircleOutlined />
+              </Tooltip>
+            </>
+          ), dataIndex: 'replyQuote2', key: 'replyQuote2',
+            render: (_, r) => ({
+              props: { style: { backgroundColor: COLOR_SETS[1]+transparentHex } },
+              children: percentageRender(_),
+            }),
+            sorter: (a, b) => tableSorter(a, b, 'replyQuote2'), },
+        ],
+      },
+    ],
+  };
+
+  const riskTableProps = {
+    rowKey: 'groupsKey',
+    pagination: { pageSize: 10, showSizeChanger: false },
+    size: 'small',
+    rowClassName: (record, rowIndex) => {
+      return record.groupType === 'operator' ? '': 'ant-tag-blue';
+    },
+    showSorterTooltip: false,
+    columns: [
+      { title: '', dataIndex: 'groupsLabel', key: 'groupsLabel', width: '6rem',
+        filterSearch: true,
+        filters: operatorObjects.sort((a, b) => a.text.localeCompare(b.text)),
+        onFilter: (value, record) => record.groupsKey === value || record.groupType !== 'operator',
+        render: (text, record) => (record.groupType !== 'operator' ? text : <Link to={`/sales-crm/risk/sales/${record.groupsKey}`}>{text}</Link>),
+      }, // 维度: 顾问
+      { title: '>24H回复', dataIndex: 'lostTouch24', key: 'lostTouch24',
+        sorter: (a, b) => tableSorter(a, b, 'lostTouch24'),
+       },
+      { title: '首次报价周期>48h', dataIndex: 'lostQuote48', key: 'lostQuote48',
+        sorter: (a, b) => tableSorter(a, b, 'lostQuote48'),
+       },
+      { title: '报价次数<1次', dataIndex: 'lostQuote1', key: 'lostQuote1',
+        sorter: (a, b) => tableSorter(a, b, 'lostQuote1'),
+       },
+      { title: '报价次数<2次', dataIndex: 'lostQuote2', key: 'lostQuote2',
+        sorter: (a, b) => tableSorter(a, b, 'lostQuote2'),
+       },
+    ],
+  };
+
+  return (
+    <>
+      <Row gutter={16} className={siderBroken ? '' : 'sticky-top'}>
+        <Col md={24} lg={24} xxl={24}>
+          <SearchForm
+            defaultValue={{
+              initialValue: {
+                ...formValues,
+                ...SalesCRMDataStore.searchValues,
+              },
+              shows: ['DepartmentList', 'WebCode', 'DateType', 'dates', 'IncludeTickets', 'country'],
+              fieldProps: {
+                DepartmentList: { show_all: false, mode: 'multiple', col: 5 },
+                WebCode: { show_all: false, mode: 'multiple', col: 5 },
+                dates: { hide_vs: true },
+                country: { show_all: false, mode: 'multiple', col: 5 },
+              },
+            }}
+            onSubmit={(_err, obj, form, str) => {
+              SalesCRMDataStore.setSearchValues(obj, form);
+              pageRefresh(obj);
+            }}
+          />
+        </Col>
+      </Row>
+      <section>
+        <Table {...activityTableProps} bordered dataSource={[...process.dataSource, ...process.details]} loading={process.loading} sticky />
+      </section>
+      <section>
+        <h3>未成行订单 数量</h3>
+        <Table {...riskTableProps} bordered dataSource={[...process.dataSource, ...process.details]} loading={process.loading} sticky />
+      </section>
+    </>
+  );
+});

src/views/sales-crm/Risk.jsx

@@ -0,0 +1,397 @@
+import React, { useContext, useEffect } from 'react';
+import { NavLink, useParams } from 'react-router-dom';
+import { observer } from 'mobx-react';
+import { stores_Context, DATE_FORMAT, SMALL_DATETIME_FORMAT } from '../../config';
+import { InfoCircleOutlined } from '@ant-design/icons';
+import { Row, Col, Table, Divider, Button, Popover, Tooltip } from 'antd';
+import { fixTo2Decimals } from '../../utils/commons';
+import MixFieldsDetail from '../../components/MixFieldsDetail';
+
+const COLOR_SETS = [
+  '#FFFFFF',
+  // "#5B8FF9",
+  // "#FF6B3B",
+  '#9FB40F',
+  '#76523B',
+  '#DAD5B5',
+  '#E19348',
+  '#F383A2',
+];
+const transparentHex = '1A';
+const percentageRender = (val) => (val ? `${val}%` : '');
+const numberConvert10K = (number, scale = 10) => {
+  return fixTo2Decimals((number/(1000*scale)));
+};
+const retPropsMinRatesSet = { 'CH': 12, 'AH': 8, 'default': 10 }; //
+
+export default observer((props) => {
+  const { opisn, opi_name } = useParams();
+
+  const { sale_store, SalesCRMDataStore, date_picker_store: searchFormStore } = useContext(stores_Context);
+
+  const { formValues, siderBroken } = searchFormStore;
+  const { searchValues, searchValuesToSub, resetData, results, process, risk } = SalesCRMDataStore;
+
+
+  useEffect(() => {
+    Promise.allSettled([
+      // 结果指标
+      SalesCRMDataStore.get90n180Data({ opisn, groupType: 'operator', groupDateType: '' }),
+      // 结果: 全年业绩
+      SalesCRMDataStore.getResultData({
+        opisn,
+        Date1: searchValues.date.clone().startOf('year').format(DATE_FORMAT),
+        Date2: searchValues.date.clone().endOf('year').format(SMALL_DATETIME_FORMAT),
+        groupType: 'overview',
+        // groupType: 'operator',
+        groupDateType: 'month',
+      }),
+      // 过程
+      SalesCRMDataStore.getProcessData({ opisn, groupType: 'operator', groupDateType: '' }),
+      // 违规明细
+      SalesCRMDataStore.getRiskDetailData({ opisn }),
+    ]);
+  }, [opisn]);
+
+  const dataFields = (suffix, colRootIndex) => [
+    {
+      key: 'ConfirmRates' + suffix,
+      title: '成行率',
+      dataIndex: [suffix, 'ConfirmRates'],
+      width: '5em',
+      // CH个人成行率<12%, AH个人成行率<8%刷红
+      render: (val, r) => ({
+        props: { style: { color: val < (retPropsMinRatesSet?.[r?.retProps || 'default'] || retPropsMinRatesSet.default) ? 'red' : 'green', backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: val ? `${val}%` : '',
+      }),
+      sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].ConfirmRates - b[suffix].ConfirmRates),
+    },
+    {
+      key: 'SumML' + suffix,
+      title: '业绩/万',
+      dataIndex: [suffix, 'SumML'],
+      width: '5em',
+      render: (_, r) => ({
+        props: { style: { backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: numberConvert10K(_),
+      }),
+      sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].SumML - b[suffix].SumML),
+    },
+    {
+      key: 'ConfirmOrder' + suffix,
+      title: '团数',
+      dataIndex: [suffix, 'ConfirmOrder'],
+      width: '5em',
+      render: (_, r) => ({
+        props: { style: { backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: _,
+      }),
+      sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].ConfirmOrder - b[suffix].ConfirmOrder),
+    },
+    {
+      key: 'SumOrder' + suffix,
+      title: '订单数',
+      dataIndex: [suffix, 'SumOrder'],
+      width: '5em',
+      render: (_, r) => ({
+        props: { style: { backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: _,
+      }),
+      sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].SumOrder - b[suffix].SumOrder),
+    },
+    {
+      key: 'ResumeOrder' + suffix,
+      title: '老客户团数',
+      dataIndex: [suffix, 'ResumeOrder'],
+      width: '5em',
+      render: (_, r) => ({
+        props: { style: { backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: _,
+      }),
+      sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].ResumeOrder - b[suffix].ResumeOrder),
+    },
+    {
+      key: 'ResumeRates' + suffix,
+      title: '老客户成行率',
+      dataIndex: [suffix, 'ResumeRates'],
+      width: '5em',
+      render: (val, r) => ({
+        props: { style: { backgroundColor: COLOR_SETS[colRootIndex]+transparentHex } },
+        children: val ? `${val}%` : ''
+      }),
+      sorter: (a, b) => (a.groupType === 'overview' ? -1 : b.groupType === 'overview' ? 0 : a[suffix].ResumeRates - b[suffix].ResumeRates),
+    },
+  ];
+  const dashboardTableProps = {
+    rowKey: 'groupsKey',
+    pagination: false,
+    size: 'small',
+    showSorterTooltip: false,
+    columns: [
+      {
+        title: '',
+        dataIndex: 'groupsLabel',
+        key: 'name',
+        width: '5em',
+      },
+      {
+        title: () => (<>前90 -30天<br/>{searchValues.date90.Date1} 至 {searchValues.date90.Date2}</>),
+        key: 'date',
+        children: dataFields('result90', 0),
+      },
+      {
+        title: () => (<>前180 -50天<br/>{searchValues.date180.Date1} 至 {searchValues.date180.Date2}</>),
+        key: 'department',
+        children: dataFields('result180', 1),
+      },
+    ],
+    rowClassName: (record, rowIndex) => {
+      return record.groupType === 'overview' ? 'ant-tag-blue' : '';
+    },
+  };
+  const activityTableProps = {
+    rowKey: 'groupsKey',
+    pagination: false,
+    size: 'small',
+    rowClassName: (record, rowIndex) => {
+      return record.groupType === 'operator' ? '' : 'ant-tag-blue';
+    },
+    showSorterTooltip: false,
+    columns: [
+      { title: '', dataIndex: 'groupsLabel', key: 'groupsLabel', width: '6rem' }, // 维度: 顾问
+      {
+        title: '顾问动作',
+        key: 'date',
+        children: [
+          {
+            title: () => (
+              <>
+                首次响应率24H{' '}
+                <Tooltip title="达到24H内回复的订单数/总订单数">
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </>
+            ),
+            dataIndex: 'firstTouch24',
+            key: 'firstTouch24',
+            render: percentageRender,
+          },
+          {
+            title: () => (
+              <>
+                48H内报价率{' '}
+                <Tooltip title="达到48H内报价的订单数/总订单数">
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </>
+            ),
+            dataIndex: 'firstQuote48',
+            key: 'firstQuote48',
+            render: percentageRender,
+          },
+          {
+            title: () => (
+              <>
+                一次报价率{' '}
+                <Tooltip title="首次报价的订单数/总订单数">
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </>
+            ),
+            dataIndex: 'quote1',
+            key: 'quote1',
+            render: percentageRender,
+          },
+          {
+            title: () => (
+              <>
+                二次报价率{' '}
+                <Tooltip title="二次报价的订单数/一次报价后回复数">
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </>
+            ),
+            dataIndex: 'quote2',
+            key: 'quote2',
+            render: percentageRender,
+          },
+          {
+            title: () => (
+              <>
+                &gt;50条会话{' '}
+                <Tooltip title=">50条会话的订单数/总订单">
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </>
+            ),
+            dataIndex: 'turnsGT50',
+            key: 'turnsGT50',
+            render: percentageRender,
+          },
+          {
+            title: () => (
+              <>
+                违规数{' '}
+                <Tooltip title="未遵循24H回复的订单数">
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </>
+            ),
+            dataIndex: 'violations',
+            key: 'violations',
+          },
+        ],
+      },
+      {
+        title: '客人回复',
+        key: 'department',
+        children: [
+          {
+            title: () => (
+              <>
+                首次回复率24H{' '}
+                <Tooltip title="达到24H内回复的订单数/总订单数">
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </>
+            ),
+            dataIndex: 'firstReply24',
+            key: 'firstReply24',
+            render: (_, r) => ({
+              props: { style: { backgroundColor: COLOR_SETS[1] + transparentHex } },
+              children: percentageRender(_),
+            }),
+          },
+          {
+            title: () => (
+              <>
+                48H内报价回复率{' '}
+                <Tooltip title="48H内报价后的回复数/报价的订单数">
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </>
+            ),
+            dataIndex: 'replyQuote48',
+            key: 'replyQuote48',
+            render: (_, r) => ({
+              props: { style: { backgroundColor: COLOR_SETS[1] + transparentHex } },
+              children: percentageRender(_),
+            }),
+          },
+          {
+            title: () => (
+              <>
+                一次报价回复率{' '}
+                <Tooltip title="一次报价后回复率/订单总数">
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </>
+            ),
+            dataIndex: 'replyQuote1',
+            key: 'replyQuote1',
+            render: (_, r) => ({
+              props: { style: { backgroundColor: COLOR_SETS[1] + transparentHex } },
+              children: percentageRender(_),
+            }),
+          },
+          {
+            title: () => (
+              <>
+                二次报价回复率{' '}
+                <Tooltip title="二次报价后回复数/一次报价后回复数">
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </>
+            ),
+            dataIndex: 'replyQuote2',
+            key: 'replyQuote2',
+            render: (_, r) => ({
+              props: { style: { backgroundColor: COLOR_SETS[1] + transparentHex } },
+              children: percentageRender(_),
+            }),
+          },
+        ],
+      },
+    ],
+  };
+  const riskTableProps = {
+    loading: risk.loading,
+    sticky: true,
+    // scroll: { x: 1000, y: 400 },
+    pagination: false,
+    rowKey: (row) => row.coli_id,
+    columns: [
+      { title: '客人姓名', dataIndex: 'guest_name', key: 'guest_name', width: '6rem' },
+      { title: '团号', dataIndex: 'coli_id', key: 'coli_id', width: '6rem' },
+      {
+        title: '表单内容',
+        dataIndex: 'coli_contents',
+        key: 'coli_contents',
+        width: '6rem',
+        render: (text, record) => (
+          <Popover
+            title={`${record.coli_id}  ${record.guest_name}`}
+            content={<pre dangerouslySetInnerHTML={{ __html: text }} style={{ whiteSpace: 'pre-wrap', wordWrap: 'break-word' }} />}
+            trigger={['click']}
+            placement="right"
+            overlayStyle={{ width: '500px', maxHeight: '500px' }}
+            autoAdjustOverflow={false}
+          >
+            <Button type="link" size="small">
+              表单内容
+            </Button>
+          </Popover>
+        ),
+      },
+      { title: '顾问', dataIndex: 'opi_name', key: 'opi_name', width: '6rem' },
+      { title: '预定时间', dataIndex: 'coli_applydate', key: 'coli_applydate', width: '6rem' },
+    ],
+  };
+
+  const chartsConfig = {
+    colFields: ['ConfirmOrder', 'SumOrder'],
+    lineFields: ['SumML', 'ConfirmRates'],
+    seriesField: null,
+    xField: 'groupDateVal',
+  };
+
+  return (
+    <>
+      <Row gutter={16} className={siderBroken ? '' : 'sticky-top'}>
+        <Col md={24} lg={12} xxl={14}>
+          <NavLink to={-1}>返回</NavLink>
+        </Col>
+      </Row>
+      <section>
+        <h2>结果指标 @ {searchValues.date.format(DATE_FORMAT)}</h2>
+        <Table {...dashboardTableProps} bordered dataSource={results[`operator_${opisn}`]} loading={results.loading} sticky />
+      </section>
+      <section>
+        <h3>全年每月业绩 @ {searchValues.date.format('YYYY')}</h3>
+        <MixFieldsDetail {...chartsConfig} dataSource={results[`operator_byDate_${opisn}`] || []} />
+      </section>
+      <Divider />
+      <section>
+        <h2>过程指标 @ {searchValuesToSub.Date1} 至 {searchValuesToSub.Date2}</h2>
+        <Table {...activityTableProps} bordered dataSource={process[`operator_${opisn}`]} loading={process.loading} sticky />
+      </section>
+      <section>
+        <h2>违规明细</h2>
+        <h3>&gt;24H回复</h3>
+        <Table {...riskTableProps} bordered dataSource={risk.byLostType?.lostTouch24 || []} />
+      </section>
+      <section>
+        <h3>首次报价周期&gt;48h</h3>
+        <Table {...riskTableProps} bordered dataSource={risk.byLostType?.lostQuote48 || []} />
+      </section>
+      <section>
+        <h3>报价次数&lt;1</h3>
+        <Table {...riskTableProps} bordered dataSource={risk.byLostType?.lostQuote1 || []} />
+      </section>
+      <section>
+        <h3>报价次数&lt;2</h3>
+        <Table {...riskTableProps} bordered dataSource={risk.byLostType?.lostQuote2 || []} />
+      </section>
+    </>
+  );
+});