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

feat: 综合看板: 去年总数据对比

Browse Source
feature/year-over-year
Lei OT 2 years ago
parent 230670e43a
commit 5068f3409b
2 changed files with 46 additions and 10 deletions
Show Stats Download Patch File Download Diff File

18
src/components/StatisticCard2.jsx
Unescape Escape View File

@ -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 ? <ArrowDownOutlined /> : <ArrowUpOutlined />);
const valueStyle = { color: '#3f8600' };
// const valueStyle = { color: (props?.VSrate || -1) < 0 ? '#3f8600' : '#cf1322' };
// const VSIcon = () => ((props?.VSrate || -1) < 0 ? <ArrowDownOutlined /> : <ArrowUpOutlined />);
// 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: <ValueIcon twoToneColor="#89B67F" />,
prefix: <ValueIcon twoToneColor={"#89B67F"} />,
description: (
<Space>
<Statistic title={diff.label} value={` ${diff.value}`} />
{diff.VSrate && <Statistic title="同比" value={`${diff.VSrate}%`} trend={diff.VSrate > 0 ? 'up' : 'down'} />}
</Space>
),
}}
chart={showMulti ? <Bullet data={bulletData} {...bulletConfig} layout={'horizontal'} />: false}
footer={null}
/>
</StatisticCard.Group>
</RcResizeObserver>

38
src/stores/Trade.js
Unescape Escape View File

@ -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 = {

Write Preview
Loading…
Cancel
Save