record.COLI_ID} />
+
+
diff --git a/src/components/Data.jsx b/src/components/Data.jsx
index bfd2d52..00c446c 100644
--- a/src/components/Data.jsx
+++ b/src/components/Data.jsx
@@ -36,8 +36,9 @@ export const VSTag = (props) => {
* @property {string} dataSuffix
*/
export const VSDataTag = ({ diffPercent=0, diffData=0, data1=0, data2=0, dataSuffix='' }) => {
- const _diffPercent = diffPercent || (data2) ? fixTo2Decimals((data1-data2)/data2*100) : 100;
- const _diffData = diffData || isNaN(data2) ? fixTo2Decimals(data1-0) : (fixTo2Decimals(data1-data2));
+ const _diffPercent = diffPercent || ((data2) ? fixTo2Decimals((data1-data2)/data2*100) : 100);
+ const _diffPercentSuffix = String(_diffPercent).includes('%') ? '' : '%';
+ const _diffData = diffData || (isNaN(data2) ? fixTo2Decimals(data1-0) : (fixTo2Decimals(data1-data2)));
const CaretIcon = parseInt(_diffPercent) < 0 ? CaretDownOutlined : CaretUpOutlined;
const tagColor = parseInt(_diffPercent) < 0 ? 'gold' : 'lime';
// parseInt(_diffPercent) === 0 ? (
@@ -50,14 +51,30 @@ export const VSDataTag = ({ diffPercent=0, diffData=0, data1=0, data2=0, dataSuf
{_diffData !== 0 && (
} color={tagColor}>
- {_diffPercent}
- % {_diffData}{dataSuffix}
+ {_diffPercent}{_diffPercentSuffix} {_diffData}{dataSuffix}
)}
);
};
+/**
+ * 表格中显示数据对比
+ *
+ * @property {boolean | undefined} [showDiffData=false]
+ * @property {number} [diffPercent=0]
+ * @property {number} diffData
+ * @property {number} data1
+ * @property {number} data2
+ * @property {string} dataSuffix
+ */
+export const RenderVSDataCell = ({ showDiffData=false, data1, data2, dataSuffix = '', ...props }) => {
+ if (showDiffData) {
+ return ;
+ }
+ return {data1}{dataSuffix}
;
+};
+
/**
* 导出表格数据存为xlsx
* @property label 文件名字
diff --git a/src/components/Pareto.jsx b/src/components/Pareto.jsx
index febd65b..628d03d 100644
--- a/src/components/Pareto.jsx
+++ b/src/components/Pareto.jsx
@@ -58,7 +58,7 @@ const ParetoChart = ({ data, xField, yField, thresholds = { A: 80, B: 90 }, titl
Cumulative: {
// min: 0,
label: {
- formatter: (val) => `${val}%`,
+ formatter: (val) => `${val}`,
},
},
},
diff --git a/src/utils/commons.js b/src/utils/commons.js
index 7c5fffa..cb48e64 100644
--- a/src/utils/commons.js
+++ b/src/utils/commons.js
@@ -1,6 +1,11 @@
import { Tag } from "antd";
import { CaretUpOutlined, CaretDownOutlined } from "@ant-design/icons";
+/**
+ * 显示对比标签
+ * @deprecated
+ * 使用组件: VSTag VSDataTag RenderVSDataCell
+ */
export function show_vs_tag(vs, vs_diff, data1, data2) {
let tag = "-";
if (parseInt(vs) < 0) {
diff --git a/src/views/AgentGroupCount.jsx b/src/views/AgentGroupCount.jsx
index 999e297..2074f94 100644
--- a/src/views/AgentGroupCount.jsx
+++ b/src/views/AgentGroupCount.jsx
@@ -6,7 +6,7 @@ import { observer } from 'mobx-react';
import { toJS } from 'mobx';
import 'moment/locale/zh-cn';
import SearchForm from './../components/search/SearchForm';
-import { TableExportBtn, VSDataTag } from './../components/Data';
+import { TableExportBtn, RenderVSDataCell } from './../components/Data';
import useCustomerServicesStore from '../zustand/CustomerServices';
import { useShallow } from 'zustand/shallow';
import { fixTo2Decimals } from "@haina/utils-commons";
@@ -19,13 +19,6 @@ const TdCell = (tdprops) => {
return | ;
};
-const DataRenderCell = ({ data1, data2, dataSuffix = '', showDiffData }) => {
- if (showDiffData) {
- return ;
- }
- return {data1}{dataSuffix}
;
-};
-
const AgentGroupCount = () => {
const { customerServicesStore, date_picker_store } = useContext(stores_Context);
const [loading, searchValues, setSearchValues, searchValuesToSub] = useCustomerServicesStore(useShallow((state) => [state.loading, state.searchValues, state.setSearchValues, state.searchValuesToSub]));
@@ -53,9 +46,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'GroupCount'),
children: [
{
- title: , // total1.GroupCount,
+ title: , // total1.GroupCount,
dataIndex: 'GroupCount',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -65,9 +58,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'PersonNum'),
children: [
{
- title: , // total1.PersonNum,
+ title: , // total1.PersonNum,
dataIndex: 'PersonNum',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -77,9 +70,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'GroupDays'),
children: [
{
- title: , // total1.GroupDays,
+ title: , // total1.GroupDays,
dataIndex: 'GroupDays',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -89,9 +82,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'totalcost'),
children: [
{
- title: , // total1.totalcost,
+ title: , // total1.totalcost,
dataIndex: 'totalcost',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -101,9 +94,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'FKBTS'),
children: [
{
- title: , // total1.FKBTS,
+ title: , // total1.FKBTS,
dataIndex: 'FKBTS',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -113,9 +106,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'DDZTS'),
children: [
{
- title: , // total1.DDZTS,
+ title: , // total1.DDZTS,
dataIndex: 'DDZTS',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -125,9 +118,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'DDZCases'),
children: [
{
- title: , // total1.DDZCases,
+ title: , // total1.DDZCases,
dataIndex: 'DDZCases',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -137,9 +130,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'DDZRate'),
children: [
{
- title: , // total1.DDZRate,
+ title: , // total1.DDZRate,
dataIndex: 'DDZRate',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -149,9 +142,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'ZWHP'),
children: [
{
- title: , // total1.ZWHP,
+ title: , // total1.ZWHP,
dataIndex: 'ZWHP',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -161,9 +154,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'ZWHPCases'),
children: [
{
- title: , // total1.ZWHPCases,
+ title: , // total1.ZWHPCases,
dataIndex: 'ZWHPCases',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -173,9 +166,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'ZWHPRate'), // parseInt(a.ZWHPRate) - parseInt(b.ZWHPRate),
children: [
{
- title: , // total1.ZWHPRate,
+ title: , // total1.ZWHPRate,
dataIndex: 'ZWHPRate',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -185,9 +178,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'BMS'),
children: [
{
- title: , // total1.BMS,
+ title: , // total1.BMS,
dataIndex: 'BMS',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -197,9 +190,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'BMRate'), // parseInt(a.BMRate) - parseInt(b.BMRate),
children: [
{
- title: , // total1.BMRate,
+ title: , // total1.BMRate,
dataIndex: 'BMRate',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -209,9 +202,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'TS'),
children: [
{
- title: , // total1.TS,
+ title: , // total1.TS,
dataIndex: 'TS',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
@@ -221,9 +214,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'TSRate'), // parseInt(a.TSRate) - parseInt(b.TSRate),
children: [
{
- title: , // total1.TSRate,
+ title: , // total1.TSRate,
dataIndex: 'TSRate',
- render: (text, r) => ,
+ render: (text, r) => ,
},
],
},
diff --git a/src/views/Orders.jsx b/src/views/Orders.jsx
index 9224ce0..ed84861 100644
--- a/src/views/Orders.jsx
+++ b/src/views/Orders.jsx
@@ -7,12 +7,11 @@ import { observer } from "mobx-react";
import * as config from "../config";
import { NavLink } from "react-router-dom";
import * as comm from '@haina/utils-commons';
-import { show_vs_tag } from './../utils/commons';
-import { utils, writeFileXLSX } from "xlsx";
import DateGroupRadio from '../components/DateGroupRadio';
import SearchForm from './../components/search/SearchForm';
-import { TableExportBtn } from './../components/Data';
+import { TableExportBtn, RenderVSDataCell } from './../components/Data';
import ParetoChart from "../components/Pareto";
+import { toJS } from 'mobx';
class Orders extends Component {
static contextType = stores_Context;
@@ -24,229 +23,181 @@ class Orders extends Component {
format_data(data) {
const { date_picker_store, orders_store } = this.context;
const result = { dataSource: [], columns: [] };
- if (!comm.emptyValue(data)) {
- const ordercountTotal1 = data.ordercountTotal1;
- const ordercountTotal2 = data.ordercountTotal2;
- if (date_picker_store.start_date_cp && date_picker_store.end_date_cp) {
- // 有比较的数据
- result.columns = [
- {
- title: '#',
- fixed: 'left',
- children: [
- {
- title: (
-
-
- {date_picker_store.start_date.format(config.DATE_FORMAT)}~{date_picker_store.end_date.format(config.DATE_FORMAT)}
-
-
- {date_picker_store.start_date_cp.format(config.DATE_FORMAT)}~{date_picker_store.end_date_cp.format(config.DATE_FORMAT)}
-
-
- ),
- titleX: `${date_picker_store.start_date.format(config.DATE_FORMAT)}~${date_picker_store.end_date.format(config.DATE_FORMAT)} vs ${date_picker_store.start_date_cp.format(
- config.DATE_FORMAT
- )}~${date_picker_store.end_date_cp.format(config.DATE_FORMAT)}`,
- dataIndex: 'OrderType',
- fixed: 'left',
- render: (text, record) => {text},
- },
- ],
- },
- {
- title: '数量',
- children: [
- {
- title: show_vs_tag(ordercountTotal1.OrderCount_vs, ordercountTotal1.OrderCount_diff, ordercountTotal1.OrderCount, ordercountTotal2.OrderCount),
- titleX: [ordercountTotal1.OrderCount, ordercountTotal2.OrderCount].join(' vs '),
- dataIndex: 'OrderCount',
- },
- ],
- },
- {
- title: '成交数',
- children: [
- {
- title: show_vs_tag(ordercountTotal1.CJCount_vs, ordercountTotal1.CJCount_diff, ordercountTotal1.CJCount, ordercountTotal2.CJCount),
- titleX: [ordercountTotal1.CJCount, ordercountTotal2.CJCount].join(' vs '),
- dataIndex: 'CJCount',
- },
- ],
- },
- {
- title: '成交人数',
- children: [
- {
- title: show_vs_tag(ordercountTotal1.CJPersonNum_vs, ordercountTotal1.CJPersonNum_diff, ordercountTotal1.CJPersonNum, ordercountTotal2.CJPersonNum),
- titleX: [ordercountTotal1.CJPersonNum, ordercountTotal2.CJPersonNum].join(' vs '),
- dataIndex: 'CJPersonNum',
- },
- ],
- },
- {
- title: '成交率',
- children: [
- {
- title: show_vs_tag(ordercountTotal1.CJrate_vs, ordercountTotal1.CJrate_diff, ordercountTotal1.CJrate, ordercountTotal2.CJrate),
- titleX: [ordercountTotal1.CJrate, ordercountTotal2.CJrate].join(' vs '),
- dataIndex: 'CJrate',
- },
- ],
- },
- {
- title: '成交毛利（预计）',
- children: [
- {
- title: show_vs_tag(ordercountTotal1.YJLY_vs, ordercountTotal1.YJLY_diff, ordercountTotal1.YJLY, ordercountTotal2.YJLY),
- titleX: [ordercountTotal1.YJLY, ordercountTotal2.YJLY].join(' vs '),
- dataIndex: 'YJLY',
- },
- ],
- },
+ if (!comm.isEmpty(data)) {
+ const rows1Map = data.ordercount1.reduce((a, row1) => ({ ...a, [row1.OrderTypeSN]: row1 }), {});
+ const rows2Map = data.ordercount2.reduce((a, row2) => ({ ...a, [row2.OrderTypeSN]: row2 }), {});
+ // Diff: elements in rows2 but not in rows1
+ const diffKey = [...new Set(Object.keys(rows2Map).filter((x) => !new Set(Object.keys(rows1Map)).has(x)))];
+ const withDiff1 = (structuredClone(toJS(data.ordercount1)) || []).map((r1) => ({ ...r1, diff: rows2Map[r1.OrderTypeSN] }));
+ withDiff1.push(
+ ...diffKey.map((key) => ({
+ diff: rows2Map[key],
+ EOI_ObjSN: rows2Map[key].EOI_ObjSN,
+ OrderType: rows2Map[key].OrderType,
+ CJrate: 0,
+ CJCount_vs: -100,
+ CJPersonNum_vs: -100,
+ CJrate_vs: -100,
+ YJLY_vs: -100,
+ OrderCount_vs: -100,
+ CJCount_diff: -rows2Map[key].CJCount,
+ CJPersonNum_diff: -rows2Map[key].CJPersonNum,
+ CJrate_diff: -rows2Map[key].CJrate,
+ YJLY_diff: -rows2Map[key].YJLY,
+ OrderCount_diff: -rows2Map[key].OrderCount,
+ Ordervalue: 0,
+ Ordervalue_diff: -rows2Map[key].Ordervalue,
+ Ordervalue_vs: -100,
+ }))
+ );
+ const showDiff = date_picker_store.start_date_cp && date_picker_store.end_date_cp;
+ result.dataSource = withDiff1;
- {
- title: '单个订单价值',
- children: [
- {
- title: show_vs_tag(ordercountTotal1.Ordervalue_vs, ordercountTotal1.Ordervalue_diff, ordercountTotal1.Ordervalue, ordercountTotal2.Ordervalue),
- titleX: [ordercountTotal1.Ordervalue, ordercountTotal2.Ordervalue].join(' vs '),
- dataIndex: 'Ordervalue',
- },
- ],
- },
- ];
- // 1.找出两个数组OrderType相同的数据做比较显示 2.找出两组数据OrderType都不相同的数据做显示
- let has_same_type = false; // 数组1在数组2中是否找到相同的类型
- for (const item of data.ordercount1) {
- has_same_type = false;
- // 数组1在数组2中相同的类型
- for (const item2 of data.ordercount2) {
- if (item.OrderType === item2.OrderType) {
- has_same_type = true;
- result.dataSource.push({
- key: item.key,
- OrderType: item.OrderType,
- OrderTypeSN: item.OrderTypeSN,
- OrderCount: show_vs_tag(item.OrderCount_vs, item.OrderCount_diff, item.OrderCount, item2.OrderCount),
- OrderCount_X: ([item.OrderCount, item2.OrderCount].join(' vs ')),
- CJCount: show_vs_tag(item.CJCount_vs, item.CJCount_diff, item.CJCount, item2.CJCount),
- CJCount_X: ([item.CJCount, item2.CJCount].join(' vs ')),
- CJPersonNum: show_vs_tag(item.CJPersonNum_vs, item.CJPersonNum_diff, item.CJPersonNum, item2.CJPersonNum),
- CJPersonNum_X: ([item.CJPersonNum, item2.CJPersonNum].join(' vs ')),
- CJrate: show_vs_tag(item.CJrate_vs, item.CJrate_diff, item.CJrate, item2.CJrate),
- CJrate_X: ([item.CJrate, item2.CJrate].join(' vs ')),
- YJLY: show_vs_tag(item.YJLY_vs, item.YJLY_diff, item.YJLY, item2.YJLY),
- YJLY_X: ([item.YJLY, item2.YJLY].join(' vs ')),
- Ordervalue: show_vs_tag(item.Ordervalue_vs, item.Ordervalue_diff, item.Ordervalue, item2.Ordervalue),
- Ordervalue_X: ([item.Ordervalue, item2.Ordervalue].join(' vs ')),
- });
- }
- }
- // 数组1中不在数组2的类型
- if (has_same_type === false) {
- result.dataSource.push({
- key: item.key,
- OrderType: item.OrderType,
- OrderTypeSN: item.OrderTypeSN,
- OrderCount: show_vs_tag(comm.formatPercent(item.OrderCount), item.OrderCount, item.OrderCount, 0),
- OrderCount_X: ([item.OrderCount, 0].join(' vs ')),
- CJCount: show_vs_tag(comm.formatPercent(item.CJCount), item.CJCount, item.CJCount, 0),
- CJCount_X: ([item.CJCount, 0].join(' vs ')),
- CJPersonNum: show_vs_tag(comm.formatPercent(item.CJPersonNum), item.CJPersonNum, item.CJPersonNum, 0),
- CJPersonNum_X: ([item.CJPersonNum, 0].join(' vs ')),
- CJrate: show_vs_tag(item.CJrate, item.CJrate, item.CJrate, 0),
- CJrate_X: ([item.CJrate, 0].join(' vs ')),
- YJLY: show_vs_tag(comm.formatPercent(item.YJLY), item.YJLY, item.YJLY, 0),
- YJLY_X: ([item.YJLY, 0].join(' vs ')),
- Ordervalue: show_vs_tag(comm.formatPercent(item.Ordervalue), item.Ordervalue, item.Ordervalue, 0),
- Ordervalue_X: ([item.Ordervalue, 0].join(' vs ')),
- });
- }
- }
- // 数组2中不在数组1的类型
- for (const item2 of data.ordercount2) {
- has_same_type = false;
- for (const item of data.ordercount1) {
- if (item.OrderType === item2.OrderType) {
- has_same_type = true;
- }
- }
- if (has_same_type === false) {
- result.dataSource.push({
- key: item2.key,
- OrderType: item2.OrderType,
- OrderTypeSN: item2.OrderTypeSN,
- OrderCount: show_vs_tag(comm.formatPercent(-item2.OrderCount), -item2.OrderCount, 0, item2.OrderCount),
- OrderCount_X: ([ 0, item2.OrderCount].join(' vs ')),
- CJCount: show_vs_tag(comm.formatPercent(-item2.CJCount), -item2.CJCount, 0, item2.CJCount),
- CJCount_X: ([ 0, item2.CJCount].join(' vs ')),
- CJPersonNum: show_vs_tag(comm.formatPercent(-item2.CJPersonNum), -item2.CJPersonNum, 0, item2.CJPersonNum),
- CJPersonNum_X: ([0, item2.CJPersonNum].join(' vs ')),
- CJrate: show_vs_tag(-item2.CJrate, -item2.CJrate, 0, item2.CJrate),
- CJrate_X: ([ 0, item2.CJrate].join(' vs ')),
- YJLY: show_vs_tag(comm.formatPercent(-item2.YJLY), -item2.YJLY, 0, item2.YJLY),
- YJLY_X: ([0, item2.YJLY].join(' vs ')),
- Ordervalue: show_vs_tag(comm.formatPercent(-item2.Ordervalue), -item2.Ordervalue, 0, item2.Ordervalue),
- Ordervalue_X: ([ 0, item2.Ordervalue].join(' vs ')),
- });
- }
- }
- } else {
- result.columns = [
- {
- title: "#",
- fixed: 'left',
- children: [
- {
- title: (
-
-
- {date_picker_store.start_date.format(config.DATE_FORMAT)}~{date_picker_store.end_date.format(config.DATE_FORMAT)}
-
-
- ),
- 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) => {text},
- },
- ],
- },
- {
- title: "数量",
- children: [{ title: ordercountTotal1.OrderCount, dataIndex: "OrderCount" }],
- sorter: (a, b) => b.OrderCount - a.OrderCount,
- },
- {
- title: "成交数",
- children: [{ title: ordercountTotal1.CJCount, dataIndex: "CJCount" }],
- sorter: (a, b) => b.CJCount - a.CJCount,
- },
- {
- title: "成交人数",
- children: [{ title: ordercountTotal1.CJPersonNum, dataIndex: "CJPersonNum" }],
- sorter: (a, b) => b.CJPersonNum - a.CJPersonNum,
- },
- {
- title: "成交率",
- children: [{ title: ordercountTotal1.CJrate, dataIndex: "CJrate" }],
- sorter: (a, b) => parseInt(b.CJrate) - parseInt(a.CJrate),
- },
- {
- title: "成交毛利（预计）",
- children: [{ title: ordercountTotal1.YJLY, dataIndex: "YJLY" }],
- sorter: (a, b) => parseFloat(b.YJLY.replace(/,/g, "")) - parseFloat(a.YJLY.replace(/,/g, "")),
- },
+ const ordercountTotal1 = data.ordercountTotal1;
+ const ordercountTotal2 = data.ordercountTotal2;
+ result.columns = [
+ {
+ title: '#',
+ fixed: 'left',
+ children: [
+ {
+ title: (
+
+
+ {date_picker_store.start_date.format(config.DATE_FORMAT)}~{date_picker_store.end_date.format(config.DATE_FORMAT)}
+
+ {showDiff ?
+ {date_picker_store.start_date_cp.format(config.DATE_FORMAT)}~{date_picker_store.end_date_cp.format(config.DATE_FORMAT)}
+
: null}
+
+ ),
+ titleX: showDiff ? `${date_picker_store.start_date.format(config.DATE_FORMAT)}~${date_picker_store.end_date.format(config.DATE_FORMAT)} vs ${date_picker_store.start_date_cp.format(
+ config.DATE_FORMAT
+ )}~${date_picker_store.end_date_cp.format(config.DATE_FORMAT)}` : `${date_picker_store.start_date.format(config.DATE_FORMAT)}~${date_picker_store.end_date.format(config.DATE_FORMAT)}`,
+ dataIndex: 'OrderType',
+ fixed: 'left',
+ render: (text, record) => {text},
+ },
+ ],
+ },
+ {
+ title: '数量',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [ordercountTotal1.OrderCount, ordercountTotal2.OrderCount].join(' vs '),
+ dataIndex: 'OrderCount',
+ render: (text, r) => ,
+ },
+ ],
+ },
+ {
+ title: '成交数',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [ordercountTotal1.CJCount, ordercountTotal2.CJCount].join(' vs '),
+ dataIndex: 'CJCount',
+ render: (text, r) => ,
+ },
+ ],
+ },
+ {
+ title: '成交人数',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [ordercountTotal1.CJPersonNum, ordercountTotal2.CJPersonNum].join(' vs '),
+ dataIndex: 'CJPersonNum',
+ render: (text, r) => ,
+ },
+ ],
+ },
+ {
+ title: '成交率',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [ordercountTotal1.CJrate, ordercountTotal2.CJrate].join(' vs '),
+ dataIndex: 'CJrate',
+ render: (text, r) => ,
+ },
+ ],
+ },
+ {
+ title: '成交毛利（预计）',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [ordercountTotal1.YJLY, ordercountTotal2.YJLY].join(' vs '),
+ dataIndex: 'YJLY',
+ render: (text, r) => ,
+ },
+ ],
+ },
+
+ {
+ title: '单个订单价值',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [ordercountTotal1.Ordervalue, ordercountTotal2.Ordervalue].join(' vs '),
+ dataIndex: 'Ordervalue',
+ render: (text, r) => ,
+ },
+ ],
+ },
+ ];
+ return result;
- {
- title: "单个订单价值",
- children: [{ title: ordercountTotal1.Ordervalue, dataIndex: "Ordervalue" }],
- sorter: (a, b) => parseFloat(b.Ordervalue.replace(/,/g, "")) - parseFloat(a.Ordervalue.replace(/,/g, "")),
- },
- ];
- result.dataSource = data.ordercount1;
- }
}
return result;
}
@@ -256,10 +207,10 @@ class Orders extends Component {
const table_data = orders_store.orderCountData_Form ? this.format_data(orders_store.orderCountData_Form) : [];
const data_source = orders_store.orderCountData ? orders_store.orderCountData : [];
const avg_line_y = Math.round(orders_store.avgLine1);
- const pie_data = comm.emptyValue(orders_store.orderCountData_Form)
+ const pie_data = comm.isEmpty(orders_store.orderCountData_Form)
? []
: orders_store.orderCountData_Form.ordercount1.map((ele) => ({ ...ele, YJLYx: comm.price_to_number(ele.YJLY) })); // 饼图的显示
- const pie_data2 = comm.emptyValue(orders_store.orderCountData_Form)
+ const pie_data2 = comm.isEmpty(orders_store.orderCountData_Form)
? []
: orders_store.orderCountData_Form.ordercount2.map((ele) => ({ ...ele, YJLYx: comm.price_to_number(ele.YJLY) }));
diff --git a/src/views/biz/BizOrder.jsx b/src/views/biz/BizOrder.jsx
index 4edaaee..adfcf95 100644
--- a/src/views/biz/BizOrder.jsx
+++ b/src/views/biz/BizOrder.jsx
@@ -4,10 +4,10 @@ import { ContainerOutlined, BlockOutlined, SmileOutlined, MobileOutlined, Custom
import { Line, Pie } from '@ant-design/charts';
import { NavLink } from 'react-router-dom';
import * as comm from '@haina/utils-commons';
-import { show_vs_tag } from './../../utils/commons';
import DateGroupRadio from '../../components/DateGroupRadio';
import SearchForm from '../../components/search/SearchForm';
import { TableExportBtn } from '../../components/Data';
+import { RenderVSDataCell } from './../../components/Data';
import { observer } from 'mobx-react';
import { toJS } from 'mobx';
@@ -143,12 +143,18 @@ const BizOrder = observer(() => {
title: '数量',
children: [
{
- title: !showDiff
- ? result.ordercountTotal1?.OrderCount
- : show_vs_tag(result.ordercountTotal1?.OrderCount_vs, result.ordercountTotal1?.OrderCount_diff, result.ordercountTotal1?.OrderCount, result.ordercountTotal2?.OrderCount),
+ title: (
+
+ ),
titleX: [result.ordercountTotal1?.OrderCount, result.ordercountTotal2?.OrderCount].join(' vs '),
dataIndex: 'OrderCount',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.OrderCount_vs, r.OrderCount_diff, r.OrderCount, r.diff?.OrderCount)),
+ render: (text, r) => ,
},
],
},
@@ -156,12 +162,18 @@ const BizOrder = observer(() => {
title: '成交数',
children: [
{
- title: !showDiff
- ? result.ordercountTotal1?.CJCount
- : show_vs_tag(result.ordercountTotal1?.CJCount_vs, result.ordercountTotal1?.CJCount_diff, result.ordercountTotal1?.CJCount, result.ordercountTotal2?.CJCount),
+ title: (
+
+ ),
titleX: [result.ordercountTotal1?.CJCount, result.ordercountTotal2?.CJCount].join(' vs '),
dataIndex: 'CJCount',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.CJCount_vs, r.CJCount_diff, r.CJCount, r.diff?.CJCount)),
+ render: (text, r) => ,
},
],
},
@@ -169,12 +181,18 @@ const BizOrder = observer(() => {
title: '成交人数',
children: [
{
- title: !showDiff
- ? result.ordercountTotal1?.CJPersonNum
- : show_vs_tag(result.ordercountTotal1?.CJPersonNum_vs, result.ordercountTotal1?.CJPersonNum_diff, result.ordercountTotal1?.CJPersonNum, result.ordercountTotal2?.CJPersonNum),
+ title: (
+
+ ),
titleX: [result.ordercountTotal1?.CJPersonNum, result.ordercountTotal2?.CJPersonNum].join(' vs '),
dataIndex: 'CJPersonNum',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.CJPersonNum_vs, r.CJPersonNum_diff, r.CJPersonNum, r.diff?.CJPersonNum)),
+ render: (text, r) => ,
},
],
},
@@ -182,12 +200,18 @@ const BizOrder = observer(() => {
title: '成交率',
children: [
{
- title: !showDiff
- ? result.ordercountTotal1?.CJrate
- : show_vs_tag(result.ordercountTotal1?.CJrate_vs, result.ordercountTotal1?.CJrate_diff, result.ordercountTotal1?.CJrate, result.ordercountTotal2?.CJrate),
+ title: (
+
+ ),
titleX: [result.ordercountTotal1?.CJrate, result.ordercountTotal2?.CJrate].join(' vs '),
dataIndex: 'CJrate',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.CJrate_vs, r.CJrate_diff, r.CJrate, r.diff?.CJrate)),
+ render: (text, r) => ,
},
],
},
@@ -195,12 +219,18 @@ const BizOrder = observer(() => {
title: '成交毛利（预计）',
children: [
{
- title: !showDiff
- ? result.ordercountTotal1?.YJLY
- : show_vs_tag(result.ordercountTotal1?.YJLY_vs, result.ordercountTotal1?.YJLY_diff, result.ordercountTotal1?.YJLY, result.ordercountTotal2?.YJLY),
+ title: (
+
+ ),
titleX: [result.ordercountTotal1?.YJLY, result.ordercountTotal2?.YJLY].join(' vs '),
dataIndex: 'YJLY',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.YJLY_vs, r.YJLY_diff, r.YJLY, r.diff?.YJLY)),
+ render: (text, r) => ,
},
],
},
@@ -209,12 +239,18 @@ const BizOrder = observer(() => {
title: '单个订单价值',
children: [
{
- title: !showDiff
- ? result.ordercountTotal1?.Ordervalue
- : show_vs_tag(result.ordercountTotal1?.Ordervalue_vs, result.ordercountTotal1?.Ordervalue_diff, result.ordercountTotal1?.Ordervalue, result.ordercountTotal2?.Ordervalue),
+ title: (
+
+ ),
titleX: [result.ordercountTotal1?.Ordervalue, result.ordercountTotal2?.Ordervalue].join(' vs '),
dataIndex: 'Ordervalue',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.Ordervalue_vs, r.Ordervalue_diff, r.Ordervalue, r.diff?.Ordervalue)),
+ render: (text, r) => ,
},
],
},
diff --git a/src/views/biz/reports/TrainsUpsell.jsx b/src/views/biz/reports/TrainsUpsell.jsx
index 13e7ac4..235a2a9 100644
--- a/src/views/biz/reports/TrainsUpsell.jsx
+++ b/src/views/biz/reports/TrainsUpsell.jsx
@@ -3,8 +3,8 @@ import { Row, Col, Table, Spin, Space, Divider } from 'antd';
import { Funnel, Pie, Sunburst } from '@ant-design/charts';
import { isEmpty } from '@haina/utils-commons';
-import { show_vs_tag } from '../../../utils/commons';
import SearchForm from '../../../components/search/SearchForm';
+import { RenderVSDataCell } from './../../../components/Data';
import { observer } from 'mobx-react';
import { toJS } from 'mobx';
@@ -168,33 +168,33 @@ const TrainsUpsell = observer(({ ...props }) => {
{
title: '数量',
dataIndex: 'OrderCount',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.OrderCount_vs, r.OrderCount_diff, r.OrderCount, r.diff?.OrderCount)),
+ render: (text, r) => ,
},
{
title: '成交数',
dataIndex: 'CJCount',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.CJCount_vs, r.CJCount_diff, r.CJCount, r.diff?.CJCount)),
+ render: (text, r) => ,
},
{
title: '成交人数',
dataIndex: 'CJPersonNum',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.CJPersonNum_vs, r.CJPersonNum_diff, r.CJPersonNum, r.diff?.CJPersonNum)),
+ render: (text, r) => ,
},
{
title: '成交率',
dataIndex: 'CJrate',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.CJrate_vs, r.CJrate_diff, r.CJrate, r.diff?.CJrate)),
+ render: (text, r) => ,
},
{
title: '成交毛利（预计）',
dataIndex: 'YJLY',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.YJLY_vs, r.YJLY_diff, r.YJLY, r.diff?.YJLY)),
+ render: (text, r) => ,
},
{
title: '单个订单价值',
dataIndex: 'Ordervalue',
- render: (text, r) => (!showDiff ? text : show_vs_tag(r.Ordervalue_vs, r.Ordervalue_diff, r.Ordervalue, r.diff?.Ordervalue)),
+ render: (text, r) => ,
},
];
return (
diff --git a/src/views/toB/ToBOrder.jsx b/src/views/toB/ToBOrder.jsx
new file mode 100644
index 0000000..27fcaf4
--- /dev/null
+++ b/src/views/toB/ToBOrder.jsx
@@ -0,0 +1,366 @@
+import { useContext } from 'react';
+import { Row, Col, Tabs, Table, Divider, Spin, Checkbox, Space } from 'antd';
+import { ContainerOutlined, BlockOutlined, SmileOutlined, MobileOutlined, CustomerServiceOutlined, IeOutlined } from '@ant-design/icons';
+import { Line, Pie } from '@ant-design/charts';
+import { NavLink } from 'react-router-dom';
+import * as comm from '@haina/utils-commons';
+import DateGroupRadio from '../../components/DateGroupRadio';
+import SearchForm from '../../components/search/SearchForm';
+import { TableExportBtn } from '../../components/Data';
+import { RenderVSDataCell } from './../../components/Data';
+
+import { observer } from 'mobx-react';
+import { toJS } from 'mobx';
+import { stores_Context } from '../../config';
+import { useShallow } from 'zustand/shallow';
+import useToBOrderStore, { orderCountDataMapper, orderCountDataFieldMapper } from '../../zustand/ToBOrder';
+
+
+const ToBOrder = observer(() => {
+ const { date_picker_store: searchFormStore } = useContext(stores_Context);
+
+ const [searchValues, setSearchValues] = useToBOrderStore(useShallow((state) => [state.searchValues, state.setSearchValues]));
+ const [activeTab, setActiveTab] = useToBOrderStore(useShallow((state) => [state.activeTab, state.setActiveTab]));
+ const [loading, typeLoading, onTabChange] = useToBOrderStore(useShallow((state) => [state.loading, state.typeLoading,state.onTabChange]));
+
+ const orderCountDataRaw = useToBOrderStore((state) => state.orderCountDataRaw);
+ const [orderCountDataLines, avgLineValue] = useToBOrderStore(useShallow((state) => [state.orderCountDataLines, state.avgLineValue]));
+ const [onChangeDateGroup, activeDateGroupRadio] = useToBOrderStore(useShallow((state) => [state.onChangeDateGroup, state.activeDateGroupRadio]));
+
+ const orderCountDataByType = useToBOrderStore((state) => state.orderCountDataByType);
+ const result = orderCountDataByType[activeTab] || {};
+
+ const getToBOrderCount = useToBOrderStore((state) => state.getToBOrderCount);
+
+ const showDiff = !comm.isEmpty(searchFormStore.start_date_cp);
+
+ const avg_line_y = Math.round(avgLineValue);
+ const lineConfig = {
+ data: orderCountDataLines,
+ padding: 'auto',
+ xField: 'xField',
+ yField: 'yField',
+ seriesField: 'seriesField',
+ // xAxis: {
+ // type: "timeCat",
+ // },
+ point: {
+ size: 4,
+ shape: 'cicle',
+ },
+ annotations: [
+ {
+ type: 'text',
+ position: ['start', avg_line_y],
+ content: avg_line_y,
+ offsetX: -15,
+ style: {
+ fill: '#F4664A',
+ textBaseline: 'bottom',
+ },
+ },
+ {
+ type: 'line',
+ start: [-10, avg_line_y],
+ end: ['max', avg_line_y],
+ style: {
+ stroke: '#F4664A',
+ lineDash: [2, 2],
+ },
+ },
+ ],
+ label: {}, // 显示标签
+ legend: {
+ itemValue: {
+ formatter: (text, item) => {
+ const items = orderCountDataLines.filter((d) => d.seriesField === item.value); // 按站点筛选
+ return items.length ? items.reduce((a, b) => a + b.yField, 0) : ''; // 计算总数
+ },
+ },
+ },
+ tooltip: {
+ customItems: (originalItems) => {
+ // process originalItems,
+ return originalItems.map((ele) => ({ ...ele, name: ele.data?.seriesField || ele.data?.xField }));
+ },
+ title: (title, datum) => {
+ let ret = title;
+ switch (activeDateGroupRadio) {
+ case 'day':
+ ret = `${title} ${comm.getWeek(datum.xField)}`; // 显示周几
+ break;
+
+ default:
+ break;
+ }
+ return ret;
+ },
+ },
+ // smooth: true,
+ };
+ const pieConfig = {
+ appendPadding: 10,
+ data: [],
+ angleField: 'OrderCount',
+ colorField: 'OrderType',
+ radius: 0.8,
+ label: {
+ type: 'outer',
+ content: '{name} {value} \t {percentage}',
+ },
+ legend: false, // 不显示图例
+ interactions: [
+ {
+ type: 'element-selected',
+ },
+ {
+ type: 'element-active',
+ },
+ ],
+ };
+
+ const tableProps = {
+ dataSource: result?.ordercount1 || [], // table_data.dataSource,
+ columns: [
+ {
+ title: '#',
+ fixed: 'left',
+ children: [
+ {
+ title: (
+
+ {result.ordercountTotal1?.groups}
+ {showDiff ? {result.ordercountTotal2?.groups}
: null}
+
+ ),
+ titleX: `${result.ordercountTotal1?.groups}` + (showDiff ? ` vs ${result.ordercountTotal2?.groups}` : ''),
+ dataIndex: 'OrderType',
+ fixed: 'left',
+ render: (text, record) => {text},
+ },
+ ],
+ },
+ {
+ title: '数量',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [result.ordercountTotal1?.OrderCount, result.ordercountTotal2?.OrderCount].join(' vs '),
+ dataIndex: 'OrderCount',
+ render: (text, r) => ,
+ },
+ ],
+ },
+ {
+ title: '成交数',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [result.ordercountTotal1?.CJCount, result.ordercountTotal2?.CJCount].join(' vs '),
+ dataIndex: 'CJCount',
+ render: (text, r) => ,
+ },
+ ],
+ },
+ {
+ title: '成交人数',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [result.ordercountTotal1?.CJPersonNum, result.ordercountTotal2?.CJPersonNum].join(' vs '),
+ dataIndex: 'CJPersonNum',
+ render: (text, r) => ,
+ },
+ ],
+ },
+ {
+ title: '成交率',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [result.ordercountTotal1?.CJrate, result.ordercountTotal2?.CJrate].join(' vs '),
+ dataIndex: 'CJrate',
+ render: (text, r) => ,
+ },
+ ],
+ },
+ {
+ title: '成交毛利（预计）',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [result.ordercountTotal1?.YJLY, result.ordercountTotal2?.YJLY].join(' vs '),
+ dataIndex: 'YJLY',
+ render: (text, r) => ,
+ },
+ ],
+ },
+
+ {
+ title: '单个订单价值',
+ children: [
+ {
+ title: (
+
+ ),
+ titleX: [result.ordercountTotal1?.Ordervalue, result.ordercountTotal2?.Ordervalue].join(' vs '),
+ dataIndex: 'Ordervalue',
+ render: (text, r) => ,
+ },
+ ],
+ },
+ ],
+ size: 'small',
+ pagination: false,
+ scroll: { x: 100 * 7 },
+ loading,
+ };
+
+ return (
+ <>
+
+
+
+ {
+ setSearchValues(obj, form);
+ getToBOrderCount(obj);
+ onTabChange(activeTab);
+ }}
+ />
+
+
+
+
+
+
+
+
+
+
+
+
+
+ onTabChange(active_key)}
+ items={[
+ {
+ key: 'customer_types',
+ label: (
+
+
+ 分销客户
+
+ ),
+ },
+ ].map((ele) => {
+ return {
+ ...ele,
+ children: (
+ <>
+
+
+
+
+
+ ),
+ };
+ })}
+ />
+
+
+
+
+
各项占比
+ {/* setIsShowEmpty(e.target.checked)}
+ >
+ 包含空值
+ */}
+
+
+
+
+
+
+
+
+ {showDiff &&
+
+
+ }
+
+
+