refactor: RenderVSDataCell 组件

main
Lei OT 3 months ago
parent 9793f62b34
commit a2b920b313

@ -7,7 +7,7 @@ import * as comm from '@haina/utils-commons';
import DateGroupRadio from '../../components/DateGroupRadio'; import DateGroupRadio from '../../components/DateGroupRadio';
import SearchForm from '../../components/search/SearchForm'; import SearchForm from '../../components/search/SearchForm';
import { TableExportBtn } from '../../components/Data'; import { TableExportBtn } from '../../components/Data';
import { VSDataTag, } from './../../components/Data'; import { RenderVSDataCell } from './../../components/Data';
import { observer } from 'mobx-react'; import { observer } from 'mobx-react';
import { toJS } from 'mobx'; import { toJS } from 'mobx';
@ -15,13 +15,6 @@ import { stores_Context } from '../../config';
import { useShallow } from 'zustand/shallow'; import { useShallow } from 'zustand/shallow';
import useBizOrderStore, { orderCountDataMapper, orderCountDataFieldMapper } from '../../zustand/BizOrder'; import useBizOrderStore, { orderCountDataMapper, orderCountDataFieldMapper } from '../../zustand/BizOrder';
const DataRenderCell = ({ data1, data2, dataSuffix = '', showDiffData, ...props }) => {
if (showDiffData) {
return <VSDataTag data1={data1} data2={data2} dataSuffix={dataSuffix} {...props} />;
}
return <div>{data1}{dataSuffix}</div>;
};
const BizOrder = observer(() => { const BizOrder = observer(() => {
const { date_picker_store: searchFormStore } = useContext(stores_Context); const { date_picker_store: searchFormStore } = useContext(stores_Context);
@ -151,7 +144,7 @@ const BizOrder = observer(() => {
children: [ children: [
{ {
title: ( title: (
<DataRenderCell <RenderVSDataCell
showDiffData={showDiff} showDiffData={showDiff}
data1={result.ordercountTotal1?.OrderCount} data1={result.ordercountTotal1?.OrderCount}
data2={result.ordercountTotal2?.OrderCount} data2={result.ordercountTotal2?.OrderCount}
@ -161,7 +154,7 @@ const BizOrder = observer(() => {
), ),
titleX: [result.ordercountTotal1?.OrderCount, result.ordercountTotal2?.OrderCount].join(' vs '), titleX: [result.ordercountTotal1?.OrderCount, result.ordercountTotal2?.OrderCount].join(' vs '),
dataIndex: 'OrderCount', dataIndex: 'OrderCount',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.OrderCount} diffPercent={r.OrderCount_vs} diffData={r.OrderCount_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.OrderCount} diffPercent={r.OrderCount_vs} diffData={r.OrderCount_diff} />,
}, },
], ],
}, },
@ -170,7 +163,7 @@ const BizOrder = observer(() => {
children: [ children: [
{ {
title: ( title: (
<DataRenderCell <RenderVSDataCell
showDiffData={showDiff} showDiffData={showDiff}
data1={result.ordercountTotal1?.CJCount} data1={result.ordercountTotal1?.CJCount}
data2={result.ordercountTotal2?.CJCount} data2={result.ordercountTotal2?.CJCount}
@ -180,7 +173,7 @@ const BizOrder = observer(() => {
), ),
titleX: [result.ordercountTotal1?.CJCount, result.ordercountTotal2?.CJCount].join(' vs '), titleX: [result.ordercountTotal1?.CJCount, result.ordercountTotal2?.CJCount].join(' vs '),
dataIndex: 'CJCount', dataIndex: 'CJCount',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.CJCount} diffPercent={r.CJCount_vs} diffData={r.CJCount_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.CJCount} diffPercent={r.CJCount_vs} diffData={r.CJCount_diff} />,
}, },
], ],
}, },
@ -189,7 +182,7 @@ const BizOrder = observer(() => {
children: [ children: [
{ {
title: ( title: (
<DataRenderCell <RenderVSDataCell
showDiffData={showDiff} showDiffData={showDiff}
data1={result.ordercountTotal1?.CJPersonNum} data1={result.ordercountTotal1?.CJPersonNum}
data2={result.ordercountTotal2?.CJPersonNum} data2={result.ordercountTotal2?.CJPersonNum}
@ -199,7 +192,7 @@ const BizOrder = observer(() => {
), ),
titleX: [result.ordercountTotal1?.CJPersonNum, result.ordercountTotal2?.CJPersonNum].join(' vs '), titleX: [result.ordercountTotal1?.CJPersonNum, result.ordercountTotal2?.CJPersonNum].join(' vs '),
dataIndex: 'CJPersonNum', dataIndex: 'CJPersonNum',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.CJPersonNum} diffPercent={r.CJPersonNum_vs} diffData={r.CJPersonNum_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.CJPersonNum} diffPercent={r.CJPersonNum_vs} diffData={r.CJPersonNum_diff} />,
}, },
], ],
}, },
@ -208,7 +201,7 @@ const BizOrder = observer(() => {
children: [ children: [
{ {
title: ( title: (
<DataRenderCell <RenderVSDataCell
showDiffData={showDiff} showDiffData={showDiff}
data1={result.ordercountTotal1?.CJrate} data1={result.ordercountTotal1?.CJrate}
data2={result.ordercountTotal2?.CJrate} data2={result.ordercountTotal2?.CJrate}
@ -218,7 +211,7 @@ const BizOrder = observer(() => {
), ),
titleX: [result.ordercountTotal1?.CJrate, result.ordercountTotal2?.CJrate].join(' vs '), titleX: [result.ordercountTotal1?.CJrate, result.ordercountTotal2?.CJrate].join(' vs '),
dataIndex: 'CJrate', dataIndex: 'CJrate',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.CJrate} diffPercent={r.CJrate_vs} diffData={r.CJrate_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.CJrate} diffPercent={r.CJrate_vs} diffData={r.CJrate_diff} />,
}, },
], ],
}, },
@ -227,7 +220,7 @@ const BizOrder = observer(() => {
children: [ children: [
{ {
title: ( title: (
<DataRenderCell <RenderVSDataCell
showDiffData={showDiff} showDiffData={showDiff}
data1={result.ordercountTotal1?.YJLY} data1={result.ordercountTotal1?.YJLY}
data2={result.ordercountTotal2?.YJLY} data2={result.ordercountTotal2?.YJLY}
@ -237,7 +230,7 @@ const BizOrder = observer(() => {
), ),
titleX: [result.ordercountTotal1?.YJLY, result.ordercountTotal2?.YJLY].join(' vs '), titleX: [result.ordercountTotal1?.YJLY, result.ordercountTotal2?.YJLY].join(' vs '),
dataIndex: 'YJLY', dataIndex: 'YJLY',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.YJLY} diffPercent={r.YJLY_vs} diffData={r.YJLY_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.YJLY} diffPercent={r.YJLY_vs} diffData={r.YJLY_diff} />,
}, },
], ],
}, },
@ -247,7 +240,7 @@ const BizOrder = observer(() => {
children: [ children: [
{ {
title: ( title: (
<DataRenderCell <RenderVSDataCell
showDiffData={showDiff} showDiffData={showDiff}
data1={result.ordercountTotal1?.Ordervalue} data1={result.ordercountTotal1?.Ordervalue}
data2={result.ordercountTotal2?.Ordervalue} data2={result.ordercountTotal2?.Ordervalue}
@ -257,7 +250,7 @@ const BizOrder = observer(() => {
), ),
titleX: [result.ordercountTotal1?.Ordervalue, result.ordercountTotal2?.Ordervalue].join(' vs '), titleX: [result.ordercountTotal1?.Ordervalue, result.ordercountTotal2?.Ordervalue].join(' vs '),
dataIndex: 'Ordervalue', dataIndex: 'Ordervalue',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.Ordervalue} diffPercent={r.Ordervalue_vs} diffData={r.Ordervalue_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.Ordervalue} diffPercent={r.Ordervalue_vs} diffData={r.Ordervalue_diff} />,
}, },
], ],
}, },

@ -4,7 +4,7 @@ import { Funnel, Pie, Sunburst } from '@ant-design/charts';
import { isEmpty } from '@haina/utils-commons'; import { isEmpty } from '@haina/utils-commons';
import SearchForm from '../../../components/search/SearchForm'; import SearchForm from '../../../components/search/SearchForm';
import { VSDataTag, } from './../../../components/Data'; import { RenderVSDataCell } from './../../../components/Data';
import { observer } from 'mobx-react'; import { observer } from 'mobx-react';
import { toJS } from 'mobx'; import { toJS } from 'mobx';
@ -63,13 +63,6 @@ const buildPieData = (data1, data2) => {
return data01.concat(data02); return data01.concat(data02);
}; };
const DataRenderCell = ({ data1, data2, dataSuffix = '', showDiffData, ...props }) => {
if (showDiffData) {
return <VSDataTag data1={data1} data2={data2} dataSuffix={dataSuffix} {...props} />;
}
return <div>{data1}{dataSuffix}</div>;
};
const TrainsUpsell = observer(({ ...props }) => { const TrainsUpsell = observer(({ ...props }) => {
const { date_picker_store: searchFormStore } = useContext(stores_Context); const { date_picker_store: searchFormStore } = useContext(stores_Context);
const [searchValues, setSearchValues] = useTrainsStore(useShallow((state) => [state.searchValues, state.setSearchValues])); const [searchValues, setSearchValues] = useTrainsStore(useShallow((state) => [state.searchValues, state.setSearchValues]));
@ -175,33 +168,33 @@ const TrainsUpsell = observer(({ ...props }) => {
{ {
title: '数量', title: '数量',
dataIndex: 'OrderCount', dataIndex: 'OrderCount',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.OrderCount} diffPercent={r.OrderCount_vs} diffData={r.OrderCount_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.OrderCount} diffPercent={r.OrderCount_vs} diffData={r.OrderCount_diff} />,
}, },
{ {
title: '成交数', title: '成交数',
dataIndex: 'CJCount', dataIndex: 'CJCount',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.CJCount} diffPercent={r.CJCount_vs} diffData={r.CJCount_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.CJCount} diffPercent={r.CJCount_vs} diffData={r.CJCount_diff} />,
}, },
{ {
title: '成交人数', title: '成交人数',
dataIndex: 'CJPersonNum', dataIndex: 'CJPersonNum',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.CJPersonNum} diffPercent={r.CJPersonNum_vs} diffData={r.CJPersonNum_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.CJPersonNum} diffPercent={r.CJPersonNum_vs} diffData={r.CJPersonNum_diff} />,
}, },
{ {
title: '成交率', title: '成交率',
dataIndex: 'CJrate', dataIndex: 'CJrate',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.CJrate} diffPercent={r.CJrate_vs} diffData={r.CJrate_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.CJrate} diffPercent={r.CJrate_vs} diffData={r.CJrate_diff} />,
}, },
{ {
title: '成交毛利(预计)', title: '成交毛利(预计)',
dataIndex: 'YJLY', dataIndex: 'YJLY',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.YJLY} diffPercent={r.YJLY_vs} diffData={r.YJLY_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.YJLY} diffPercent={r.YJLY_vs} diffData={r.YJLY_diff} />,
}, },
{ {
title: '单个订单价值', title: '单个订单价值',
dataIndex: 'Ordervalue', dataIndex: 'Ordervalue',
render: (text, r) => <DataRenderCell showDiffData={showDiff} data1={text} data2={r.diff?.Ordervalue} diffPercent={r.Ordervalue_vs} diffData={r.Ordervalue_diff} />, render: (text, r) => <RenderVSDataCell showDiffData={showDiff} data1={text} data2={r.diff?.Ordervalue} diffPercent={r.Ordervalue_vs} diffData={r.Ordervalue_diff} />,
}, },
]; ];
return ( return (

Loading…
Cancel
Save