diff --git a/src/stores/Distribution.js b/src/stores/Distribution.js index aa0b17a..0b6b256 100644 --- a/src/stores/Distribution.js +++ b/src/stores/Distribution.js @@ -89,7 +89,18 @@ class Distribution { this.curTab = v; } + setFormDates(param) { + // 环比的参数: 计算上一个时间段 + const [DateToQ1, DateToQ2] = [moment(param.Date1).subtract(moment(param.Date2).diff(param.Date1, 'days') + 1, 'days'), moment(param.Date1).subtract(1, 'days')]; + // 同比的参数: 去年同期 + const [DateToY1, DateToY2] = [moment(param.Date1).subtract(1, 'year'), moment(param.Date2).subtract(1, 'year')]; + this.dateStringY = `${DateToY1.format(DATE_FORMAT)}~${DateToY2.format(DATE_FORMAT)}`; + this.dateStringQ = `${DateToQ1.format(DATE_FORMAT)}~${DateToQ2.format(DATE_FORMAT)}`; + } + pageLoading = false; + dateStringY = ''; + dateStringQ = ''; detailData = { loading: false, dataSource: [] }; scatterDays = []; @@ -140,7 +151,7 @@ const calcDiff = ({ result, resultToY, resultToQ }) => { ConfirmOrderDiffY: resultMapped[row.key].ConfirmOrder - resultToYMapped[row.key].ConfirmOrder, ConfirmOrderDiffQ: resultMapped[row.key].ConfirmOrder - resultToQMapped[row.key].ConfirmOrder, }; - return { ...resultMapped[row.key], ...diff }; + return { ...resultMapped[row.key], ...diff, resultToY: resultToYMapped[row.key], resultToQ: resultToQMapped[row.key] }; }); // console.log(afterCalc, '=================='); return afterCalc; diff --git a/src/views/Distribution.jsx b/src/views/Distribution.jsx index faeb07d..4a527b7 100644 --- a/src/views/Distribution.jsx +++ b/src/views/Distribution.jsx @@ -26,7 +26,7 @@ const apartOptions = [ export default observer(() => { const { date_picker_store: searchFormStore, DistributionStore } = useContext(stores_Context); const { formValues, formValuesToSub } = searchFormStore; - const { curTab } = DistributionStore; + const { curTab, dateStringQ, dateStringY } = DistributionStore; const pageRefresh = (obj) => { DistributionStore.getApartData({ @@ -41,6 +41,7 @@ export default observer(() => { }, [curTab]); useEffect(() => { + DistributionStore.setFormDates(formValuesToSub); DistributionStore.resetData(); return () => {}; }, [formValuesToSub]); @@ -54,6 +55,19 @@ export default observer(() => { autoFit: false, color: ['#5B8FF9', '#E8EDF3'], }; + const RingProgressConfigY = { + height: 50, + width: 50, + autoFit: false, + // color: ['#f6bd16', '#E8EDF3'], + color: ['#61ddaa', '#E8EDF3'], // #7cb305 + }; + const RingProgressConfigQ = { + height: 50, + width: 50, + autoFit: false, + color: ['#f6bd16', '#E8EDF3'], + }; const columns = [ { title: '', dataIndex: 'label' }, { @@ -112,6 +126,42 @@ export default observer(() => { dataIndex: 'SumMLPercent', render: (v, r) => , }, + { + title: () => <>
去年同期
{dateStringY}
, + align: 'center', + children: [ + { + title: '团数占比', + width: 90, + dataIndex: 'ConfirmOrderPercent', + render: (v, r) => , + }, + { + title: '业绩占比', + width: 90, + dataIndex: 'SumMLPercent', + render: (v, r) => , + }, + ], + }, + { + title: () => <>
上个时间段
{dateStringQ}
, + align: 'center', + children: [ + { + title: '团数占比', + width: 90, + dataIndex: 'ConfirmOrderPercent', + render: (v, r) => , + }, + { + title: '业绩占比', + width: 90, + dataIndex: 'SumMLPercent', + render: (v, r) => , + }, + ], + }, ]; return ( <>