From 5068f3409b44c38e7b09d62186eba8554115527c Mon Sep 17 00:00:00 2001 From: Lei OT Date: Thu, 16 Nov 2023 16:11:54 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E7=BB=BC=E5=90=88=E7=9C=8B=E6=9D=BF:?= =?UTF-8?q?=20=E5=8E=BB=E5=B9=B4=E6=80=BB=E6=95=B0=E6=8D=AE=E5=AF=B9?= =?UTF-8?q?=E6=AF=94?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/StatisticCard2.jsx | 18 +++++++++++---- src/stores/Trade.js | 38 +++++++++++++++++++++++++++---- 2 files changed, 46 insertions(+), 10 deletions(-) diff --git a/src/components/StatisticCard2.jsx b/src/components/StatisticCard2.jsx index 1216832..7ef05ba 100644 --- a/src/components/StatisticCard2.jsx +++ b/src/components/StatisticCard2.jsx @@ -5,15 +5,16 @@ import { RingProgress, Progress, Bullet } from '@ant-design/plots'; import RcResizeObserver from 'rc-resize-observer'; import { stores_Context } from '../config'; import { ArrowUpOutlined, ArrowDownOutlined } from '@ant-design/icons'; -import { Table } from 'antd'; +import { Table, Space } from 'antd'; const { Statistic, Divider } = StatisticCard; export default observer((props) => { - const { icon, traditional, biz, kpiVal, originVal, ...extProps } = props; + const { icon, traditional, biz, kpiVal, originVal, diff, ...extProps } = props; const ValueIcon = props.icon; - const valueStyle = { color: (props?.VSrate || -1) < 0 ? '#3f8600' : '#cf1322' }; - const VSIcon = () => ((props?.VSrate || -1) < 0 ? : ); + const valueStyle = { color: '#3f8600' }; + // const valueStyle = { color: (props?.VSrate || -1) < 0 ? '#3f8600' : '#cf1322' }; + // const VSIcon = () => ((props?.VSrate || -1) < 0 ? : ); // console.log(props, ';;;;'); const [responsive, setResponsive] = useState(false); const showMulti = traditional.value && biz.value; @@ -70,9 +71,16 @@ export default observer((props) => { valueStyle, ...extProps, value: props.valueSuffix ? `${props.value} ${props.valueSuffix}` : props.value, - prefix: , + prefix: , + description: ( + + + {diff.VSrate && 0 ? 'up' : 'down'} />} + + ), }} chart={showMulti ? : false} + footer={null} /> diff --git a/src/stores/Trade.js b/src/stores/Trade.js index 46108ed..48f5c96 100644 --- a/src/stores/Trade.js +++ b/src/stores/Trade.js @@ -1,7 +1,9 @@ import { makeAutoObservable, runInAction, toJS } from 'mobx'; import * as req from '../utils/request'; +import moment from 'moment'; import { isEmpty, sortBy, pick, merge, fixTo2Decimals, groupBy, sortKeys, fixToInt, cloneDeep } from '../utils/commons'; import { dataFieldAlias } from './../libs/ht'; +import { DATE_FORMAT, SMALL_DATETIME_FORMAT } from './../config'; class Trade { constructor(rootStore) { @@ -14,11 +16,15 @@ class Trade { */ async fetchSummaryData(queryData) { this.summaryData.loading = true; - queryData.groupType = queryData?.groupType || 'overview'; - queryData.groupDateType = 'year'; - const multiData = await this.fetchTradeDataAll(cloneDeep(queryData)); + const curQueryData = cloneDeep(queryData); + curQueryData.groupType = curQueryData?.groupType || 'overview'; + curQueryData.groupDateType = 'year'; + curQueryData.DateDiff1 = moment(curQueryData.Date1).subtract(1, 'year').format(DATE_FORMAT); + curQueryData.DateDiff2 = moment(curQueryData.Date2).subtract(1, 'year').format(SMALL_DATETIME_FORMAT); + const multiData = await this.fetchTradeDataAll((curQueryData)); const { summary, traditional, biz } = multiData.result1; - // console.log(JSON.stringify(summary), 'mmmmmmmmmmm'); + const { summary: summary2, traditional: traditional2, biz: biz2 } = multiData.result2; + // console.log(JSON.stringify(summary), 'mmmmmmmmmmm', multiData); const summaryData = { loading: false, dataSource: [ @@ -26,7 +32,8 @@ class Trade { title: '成团',col: 6, value: summary?.[0]?.ConfirmOrder, originVal: (summary?.[0]?.ConfirmOrder || 0), - valueSuffix: summary?.[0]?.ConfirmRates ? ` / ${summary?.[0]?.ConfirmRates} %` : undefined, + valueSuffix: undefined, + // valueSuffix: summary?.[0]?.ConfirmRates ? ` / ${summary?.[0]?.ConfirmRates} %` : undefined, // VSrate: summary?.[0]?.ConfirmOrderrate, KPIrate: summary?.[0]?.[dataFieldAlias.ConfirmOrder.nestkey.p], // hasKPI: !isEmpty(summary?.[0]?.[dataFieldAlias.ConfirmOrder.nestkey.p]), @@ -35,6 +42,11 @@ class Trade { kpiVal: summary?.[0]?.[dataFieldAlias.ConfirmOrder.nestkey.v], traditional: { title: '传统', value: traditional?.[0]?.ConfirmOrder }, biz: { title: '商务', value: biz?.[0]?.ConfirmOrder }, + diff: { + label: summary2?.[0]?.groupDateVal || '对比', + value: summary2?.[0]?.ConfirmOrder || 0, + VSrate: summary2?.[0]?.ConfirmOrder ? fixTo2Decimals((summary?.[0]?.ConfirmOrder - summary2?.[0]?.ConfirmOrder)/summary2?.[0]?.ConfirmOrder*100) : null , + }, }, { title: '毛利',col: 8, @@ -46,6 +58,11 @@ class Trade { kpiVal: summary?.[0]?.[dataFieldAlias.SumML.nestkey.v], traditional: { title: '传统', value: (traditional?.[0]?.SumML || 0) }, biz: { title: '商务', value: (biz?.[0]?.SumML || 0) }, + diff: { + label: summary2?.[0]?.groupDateVal || '对比', + value: dataFieldAlias.SumML.formatter(summary2?.[0]?.SumML || 0), + VSrate: summary2?.[0]?.SumML ? fixTo2Decimals((summary?.[0]?.SumML - summary2?.[0]?.SumML)/summary2?.[0]?.SumML*100) : null , + }, }, { title: '完成率',col: 5, @@ -56,6 +73,11 @@ class Trade { kpiVal: 0 , // summary?.[0]?.[dataFieldAlias.SumML.nestkey.p], traditional: { title: '传统', value: traditional?.[0]?.[dataFieldAlias.SumML.nestkey.p] || 0, }, biz: { title: '商务', value: biz?.[0]?.[dataFieldAlias.SumML.nestkey.p] || 0, }, + diff: { + label: summary2?.[0]?.groupDateVal || '对比', + value: `${summary2?.[0]?.[dataFieldAlias.SumML.nestkey.p] || '-'}%`, + VSrate: null , + }, }, { title: '人数', col: 5, @@ -68,6 +90,11 @@ class Trade { // kpiVal: summary?.[0]?.[dataFieldAlias.SumPersonNum.nestkey.v], traditional: { title: '传统', value: traditional?.[0]?.SumPersonNum, }, biz: { title: '商务', value: biz?.[0]?.SumPersonNum, }, + diff: { + label: summary2?.[0]?.groupDateVal || '对比', + value: summary2?.[0]?.SumPersonNum, + VSrate: summary2?.[0]?.SumPersonNum ? fixTo2Decimals((summary?.[0]?.SumPersonNum - summary2?.[0]?.SumPersonNum)/summary2?.[0]?.SumPersonNum*100) : null , + }, }, ], }; @@ -275,6 +302,7 @@ class Trade { {key: 'transactions', title: '营收', dataIndex: 'transactions', render: (v) => dataFieldAlias.transactions.formatter(v)}, ], dataSource: [] }; } + export const parseMergeItem = ({traditional, biz}) => { return ['result1', 'result2'].reduce((res, resKey) => { const mergeItem = {