Haina
/
dashboard
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: RenderVSDataCell 组件

Browse Source
main
Lei OT 3 months ago
parent 259afa80f1
commit 3da72b3287
4 changed files with 46 additions and 60 deletions
Show Stats Download Patch File Download Diff File

2
src/charts/Customer_care_regular.jsx
Unescape Escape View File

@ -7,7 +7,7 @@ import { observer } from 'mobx-react';
import SearchForm from './../components/search/SearchForm';
import LineWithAvg from '../components/LineWithAvg';
import { toJS } from 'mobx';
import { TableExportBtn, VSDataTag, RenderVSDataCell } from '../components/Data';
import { TableExportBtn, RenderVSDataCell } from '../components/Data';
import useCustomerRelationsStore from '../zustand/CustomerRelations';
import { useShallow } from 'zustand/shallow';

2
src/utils/commons.js
Unescape Escape View File

@ -4,7 +4,7 @@ import { CaretUpOutlined, CaretDownOutlined } from "@ant-design/icons";
/**
* 显示对比标签
* @deprecated
* 使用 VSTag 或 VSDataTag 组件
* 使用组件: VSTag VSDataTag RenderVSDataCell
*/
export function show_vs_tag(vs, vs_diff, data1, data2) {
let tag = "-";

69
src/views/AgentGroupCount.jsx
Unescape Escape View File

@ -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 <td {...restProps} />;
};
const DataRenderCell = ({ data1, data2, dataSuffix = '', showDiffData }) => {
if (showDiffData) {
return <VSDataTag data1={data1} data2={data2} dataSuffix={dataSuffix} />;
}
return <div>{data1}{dataSuffix}</div>;
};
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: <DataRenderCell data1={total1.GroupCount} data2={total1.diff?.GroupCount} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.GroupCount,
title: <RenderVSDataCell data1={total1.GroupCount} data2={total1.diff?.GroupCount} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.GroupCount,
dataIndex: 'GroupCount',
render: (text, r) => <DataRenderCell data1={r.GroupCount} data2={r.diff?.GroupCount} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.GroupCount} data2={r.diff?.GroupCount} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -65,9 +58,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'PersonNum'),
children: [
{
title: <DataRenderCell data1={total1.PersonNum} data2={total1.diff?.PersonNum} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.PersonNum,
title: <RenderVSDataCell data1={total1.PersonNum} data2={total1.diff?.PersonNum} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.PersonNum,
dataIndex: 'PersonNum',
render: (text, r) => <DataRenderCell data1={r.PersonNum} data2={r.diff?.PersonNum} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.PersonNum} data2={r.diff?.PersonNum} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -77,9 +70,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'GroupDays'),
children: [
{
title: <DataRenderCell data1={total1.GroupDays} data2={total1.diff?.GroupDays} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.GroupDays,
title: <RenderVSDataCell data1={total1.GroupDays} data2={total1.diff?.GroupDays} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.GroupDays,
dataIndex: 'GroupDays',
render: (text, r) => <DataRenderCell data1={r.GroupDays} data2={r.diff?.GroupDays} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.GroupDays} data2={r.diff?.GroupDays} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -89,9 +82,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'totalcost'),
children: [
{
title: <DataRenderCell data1={total1.totalcost} data2={total1.diff?.totalcost} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.totalcost,
title: <RenderVSDataCell data1={total1.totalcost} data2={total1.diff?.totalcost} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.totalcost,
dataIndex: 'totalcost',
render: (text, r) => <DataRenderCell data1={r.totalcost} data2={r.diff?.totalcost} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.totalcost} data2={r.diff?.totalcost} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -101,9 +94,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'FKBTS'),
children: [
{
title: <DataRenderCell data1={total1.FKBTS} data2={total1.diff?.FKBTS} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.FKBTS,
title: <RenderVSDataCell data1={total1.FKBTS} data2={total1.diff?.FKBTS} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.FKBTS,
dataIndex: 'FKBTS',
render: (text, r) => <DataRenderCell data1={r.FKBTS} data2={r.diff?.FKBTS} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.FKBTS} data2={r.diff?.FKBTS} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -113,9 +106,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'DDZTS'),
children: [
{
title: <DataRenderCell data1={total1.DDZTS} data2={total1.diff?.DDZTS} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.DDZTS,
title: <RenderVSDataCell data1={total1.DDZTS} data2={total1.diff?.DDZTS} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.DDZTS,
dataIndex: 'DDZTS',
render: (text, r) => <DataRenderCell data1={r.DDZTS} data2={r.diff?.DDZTS} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.DDZTS} data2={r.diff?.DDZTS} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -125,9 +118,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'DDZCases'),
children: [
{
title: <DataRenderCell data1={total1.DDZCases} data2={total1.diff?.DDZCases} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.DDZCases,
title: <RenderVSDataCell data1={total1.DDZCases} data2={total1.diff?.DDZCases} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.DDZCases,
dataIndex: 'DDZCases',
render: (text, r) => <DataRenderCell data1={r.DDZCases} data2={r.diff?.DDZCases} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.DDZCases} data2={r.diff?.DDZCases} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -137,9 +130,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'DDZRate'),
children: [
{
title: <DataRenderCell data1={fixTo2Decimals(total1.DDZRate*100)} data2={fixTo2Decimals(total1.diff?.DDZRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.DDZRate,
title: <RenderVSDataCell data1={fixTo2Decimals(total1.DDZRate*100)} data2={fixTo2Decimals(total1.diff?.DDZRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.DDZRate,
dataIndex: 'DDZRate',
render: (text, r) => <DataRenderCell data1={fixTo2Decimals(r.DDZRate*100)} data2={fixTo2Decimals(r.diff?.DDZRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={fixTo2Decimals(r.DDZRate*100)} data2={fixTo2Decimals(r.diff?.DDZRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -149,9 +142,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'ZWHP'),
children: [
{
title: <DataRenderCell data1={total1.ZWHP} data2={total1.diff?.ZWHP} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.ZWHP,
title: <RenderVSDataCell data1={total1.ZWHP} data2={total1.diff?.ZWHP} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.ZWHP,
dataIndex: 'ZWHP',
render: (text, r) => <DataRenderCell data1={r.ZWHP} data2={r.diff?.ZWHP} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.ZWHP} data2={r.diff?.ZWHP} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -161,9 +154,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'ZWHPCases'),
children: [
{
title: <DataRenderCell data1={total1.ZWHPCases} data2={total1.diff?.ZWHPCases} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.ZWHPCases,
title: <RenderVSDataCell data1={total1.ZWHPCases} data2={total1.diff?.ZWHPCases} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.ZWHPCases,
dataIndex: 'ZWHPCases',
render: (text, r) => <DataRenderCell data1={r.ZWHPCases} data2={r.diff?.ZWHPCases} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.ZWHPCases} data2={r.diff?.ZWHPCases} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -173,9 +166,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'ZWHPRate'), // parseInt(a.ZWHPRate) - parseInt(b.ZWHPRate),
children: [
{
title: <DataRenderCell data1={fixTo2Decimals(total1.ZWHPRate*100)} data2={fixTo2Decimals(total1.diff?.ZWHPRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.ZWHPRate,
title: <RenderVSDataCell data1={fixTo2Decimals(total1.ZWHPRate*100)} data2={fixTo2Decimals(total1.diff?.ZWHPRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.ZWHPRate,
dataIndex: 'ZWHPRate',
render: (text, r) => <DataRenderCell data1={fixTo2Decimals(r.ZWHPRate*100)} data2={fixTo2Decimals(r.diff?.ZWHPRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={fixTo2Decimals(r.ZWHPRate*100)} data2={fixTo2Decimals(r.diff?.ZWHPRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -185,9 +178,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'BMS'),
children: [
{
title: <DataRenderCell data1={total1.BMS} data2={total1.diff?.BMS} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.BMS,
title: <RenderVSDataCell data1={total1.BMS} data2={total1.diff?.BMS} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.BMS,
dataIndex: 'BMS',
render: (text, r) => <DataRenderCell data1={r.BMS} data2={r.diff?.BMS} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.BMS} data2={r.diff?.BMS} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -197,9 +190,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'BMRate'), // parseInt(a.BMRate) - parseInt(b.BMRate),
children: [
{
title: <DataRenderCell data1={fixTo2Decimals(total1.BMRate*100)} data2={fixTo2Decimals((total1.diff?.BMRate || 0)*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.BMRate,
title: <RenderVSDataCell data1={fixTo2Decimals(total1.BMRate*100)} data2={fixTo2Decimals((total1.diff?.BMRate || 0)*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.BMRate,
dataIndex: 'BMRate',
render: (text, r) => <DataRenderCell data1={fixTo2Decimals(r.BMRate*100)} data2={fixTo2Decimals(r.diff?.BMRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={fixTo2Decimals(r.BMRate*100)} data2={fixTo2Decimals(r.diff?.BMRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -209,9 +202,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'TS'),
children: [
{
title: <DataRenderCell data1={total1.TS} data2={total1.diff?.TS} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.TS,
title: <RenderVSDataCell data1={total1.TS} data2={total1.diff?.TS} showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.TS,
dataIndex: 'TS',
render: (text, r) => <DataRenderCell data1={r.TS} data2={r.diff?.TS} showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={r.TS} data2={r.diff?.TS} showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},
@ -221,9 +214,9 @@ const AgentGroupCount = () => {
sorter: (a, b) => sorter(a, b, 'TSRate'), // parseInt(a.TSRate) - parseInt(b.TSRate),
children: [
{
title: <DataRenderCell data1={fixTo2Decimals(total1.TSRate*100)} data2={fixTo2Decimals(total1.diff?.TSRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.TSRate,
title: <RenderVSDataCell data1={fixTo2Decimals(total1.TSRate*100)} data2={fixTo2Decimals(total1.diff?.TSRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />, // total1.TSRate,
dataIndex: 'TSRate',
render: (text, r) => <DataRenderCell data1={fixTo2Decimals(r.TSRate*100)} data2={fixTo2Decimals(r.diff?.TSRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />,
render: (text, r) => <RenderVSDataCell data1={fixTo2Decimals(r.TSRate*100)} data2={fixTo2Decimals(r.diff?.TSRate*100)} dataSuffix='%' showDiffData={!!searchValuesToSub.DateDiff1} />,
},
],
},

33
src/views/Orders.jsx
Unescape Escape View File

@ -9,17 +9,10 @@ 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, VSDataTag } from './../components/Data';
import { TableExportBtn, RenderVSDataCell } from './../components/Data';
import ParetoChart from "../components/Pareto";
import { toJS } from 'mobx';
const DataRenderCell = ({ data1, data2, dataSuffix = '', showDiffData, ...props }) => {
if (showDiffData) {
return <VSDataTag data1={data1} data2={data2} dataSuffix={dataSuffix} {...props} />;
}
return <div>{data1}{dataSuffix}</div>;
};
class Orders extends Component {
static contextType = stores_Context;
@ -92,7 +85,7 @@ class Orders extends Component {
children: [
{
title: (
<DataRenderCell
<RenderVSDataCell
showDiffData={showDiff}
data1={ordercountTotal1?.OrderCount}
data2={ordercountTotal2?.OrderCount}
@ -102,7 +95,7 @@ class Orders extends Component {
),
titleX: [ordercountTotal1.OrderCount, ordercountTotal2.OrderCount].join(' vs '),
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} />,
},
],
},
@ -111,7 +104,7 @@ class Orders extends Component {
children: [
{
title: (
<DataRenderCell
<RenderVSDataCell
showDiffData={showDiff}
data1={ordercountTotal1?.CJCount}
data2={ordercountTotal2?.CJCount}
@ -121,7 +114,7 @@ class Orders extends Component {
),
titleX: [ordercountTotal1.CJCount, ordercountTotal2.CJCount].join(' vs '),
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} />,
},
],
},
@ -130,7 +123,7 @@ class Orders extends Component {
children: [
{
title: (
<DataRenderCell
<RenderVSDataCell
showDiffData={showDiff}
data1={ordercountTotal1?.CJPersonNum}
data2={ordercountTotal2?.CJPersonNum}
@ -140,7 +133,7 @@ class Orders extends Component {
),
titleX: [ordercountTotal1.CJPersonNum, ordercountTotal2.CJPersonNum].join(' vs '),
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} />,
},
],
},
@ -149,7 +142,7 @@ class Orders extends Component {
children: [
{
title: (
<DataRenderCell
<RenderVSDataCell
showDiffData={showDiff}
data1={ordercountTotal1?.CJrate}
data2={ordercountTotal2?.CJrate}
@ -159,7 +152,7 @@ class Orders extends Component {
),
titleX: [ordercountTotal1.CJrate, ordercountTotal2.CJrate].join(' vs '),
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} />,
},
],
},
@ -168,7 +161,7 @@ class Orders extends Component {
children: [
{
title: (
<DataRenderCell
<RenderVSDataCell
showDiffData={showDiff}
data1={ordercountTotal1?.YJLY}
data2={ordercountTotal2?.YJLY}
@ -178,7 +171,7 @@ class Orders extends Component {
),
titleX: [ordercountTotal1.YJLY, ordercountTotal2.YJLY].join(' vs '),
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} />,
},
],
},
@ -188,7 +181,7 @@ class Orders extends Component {
children: [
{
title: (
<DataRenderCell
<RenderVSDataCell
showDiffData={showDiff}
data1={ordercountTotal1?.Ordervalue}
data2={ordercountTotal2?.Ordervalue}
@ -198,7 +191,7 @@ class Orders extends Component {
),
titleX: [ordercountTotal1.Ordervalue, ordercountTotal2.Ordervalue].join(' vs '),
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} />,
},
],
},

Write Preview
Loading…
Cancel
Save