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

perf:老客户:添加数据对比、对比折线

Browse Source
main
ZJYHX 2 months ago
parent 5551b2e362
commit be31c3983d
2 changed files with 124 additions and 36 deletions
Show Stats Download Patch File Download Diff File

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

@ -27,13 +27,23 @@ const Customer_care_regular = () => {
fieldProps: { fieldProps: {
DepartmentList: { show_all: false, mode: 'multiple' }, DepartmentList: { show_all: false, mode: 'multiple' },
WebCode: { show_all: false, mode: 'multiple' }, WebCode: { show_all: false, mode: 'multiple' },
dates: { hide_vs: true }, years: { hide_vs: true },
}, },
}} }}
onSubmit={(_err, obj, form, str) => { onSubmit={async (_err, obj, form, str) => {
customer_store.setSearchValues(obj, form, 'regular_data'); customer_store.setSearchValues(obj, form, 'regular_data');
customer_store.regular_customer_order(); regular_data.data_compare=[];
customer_store.regular_customer_order(true); regular_data.isRenderCount=0;
if (obj.DateDiff1 && obj.DateDiff2){
await customer_store.regular_customer_order();
customer_store.regular_customer_order(false,true);
customer_store.regular_customer_order(true,false,true);
customer_store.regular_customer_order(true,true,true);
}
else{
customer_store.regular_customer_order();
customer_store.regular_customer_order(true);
}
}} }}
/> />
</Col> </Col>
@ -81,7 +91,7 @@ const Customer_care_regular = () => {
title: '成行率', title: '成行率',
dataIndex: 'SUCRate', dataIndex: 'SUCRate',
key: 'SUCRate', key: 'SUCRate',
render: (text, record) => <span>{Math.round(text * 100)}%</span>, render: (text) => typeof text === 'number'?<span>{Math.round(text * 100)}%</span>:text,
}, },
{ {
title: '毛利', title: '毛利',

140
src/stores/CustomerStore.js
Unescape Escape View File

@ -2,7 +2,7 @@ import {makeAutoObservable, runInAction} from "mobx";
import { fetchJSON } from '../utils/request'; import { fetchJSON } from '../utils/request';
import * as config from "../config"; import * as config from "../config";
import { groupsMappedByKey, sitesMappedByCode, pivotBy } from './../libs/ht'; import { groupsMappedByKey, sitesMappedByCode, pivotBy } from './../libs/ht';
import { sortBy } from "../utils/commons"; import { sortBy, show_vs_tag, formatPercent } from "../utils/commons";
import moment from 'moment'; import moment from 'moment';
/** /**
@ -101,7 +101,7 @@ class CustomerStore {
// 老客户 beign // 老客户 beign
regular_customer_order(get_detail = false) { regular_customer_order(get_detail = false, isCompare = false, isRender=false) {
let pivotByOrder = 'SumOrder'; let pivotByOrder = 'SumOrder';
let pivotByDate = 'applyDate'; let pivotByDate = 'applyDate';
this.regular_data.loading = true; this.regular_data.loading = true;
@ -120,55 +120,131 @@ class CustomerStore {
pivotByOrder = 'ConfirmOrder'; pivotByOrder = 'ConfirmOrder';
pivotByDate = 'startDate'; pivotByDate = 'startDate';
} }
url += '&ApplydateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&ApplydateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT); if (isCompare){
url += '&EntrancedateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&EntrancedateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT); url += '&ApplydateStart=' + date_picker_store.start_date_cp.format(config.DATE_FORMAT) + '&ApplydateEnd=' + date_picker_store.end_date_cp.format(config.SMALL_DATETIME_FORMAT);
url += '&ConfirmdateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&ConfirmdateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT); url += '&EntrancedateStart=' + date_picker_store.start_date_cp.format(config.DATE_FORMAT) + '&EntrancedateEnd=' + date_picker_store.end_date_cp.format(config.SMALL_DATETIME_FORMAT);
url += '&ConfirmdateStart=' + date_picker_store.start_date_cp.format(config.DATE_FORMAT) + '&ConfirmdateEnd=' + date_picker_store.end_date_cp.format(config.SMALL_DATETIME_FORMAT);
}
else{
url += '&ApplydateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&ApplydateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
url += '&EntrancedateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&EntrancedateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
url += '&ConfirmdateStart=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&ConfirmdateEnd=' + date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT);
}
if (get_detail) { if (get_detail) {
url += '&IsDetail=1'; url += '&IsDetail=1';
} else { } else {
url += '&IsDetail=0'; url += '&IsDetail=0';
} }
url += `&IncludeTickets=${this.regular_data.include_tickets}`; url += `&IncludeTickets=${this.regular_data.include_tickets}`;
return new Promise((resolve, reject) => {
fetch(config.HT_HOST + url) fetch(config.HT_HOST + url)
.then((response) => response.json()) .then((response) => response.json())
.then((json) => { .then((json) => {
runInAction(() => { runInAction(() => {
if (get_detail) { if (get_detail) {
this.regular_data.detail_loading = false; if (!isCompare){
this.regular_data.data_detail = json; this.regular_data.data_detail = json;
const dump_l = (json || []).filter(ele => ele.COLI_IsOld !== '' && ele.COLI_IsCusCommend !== '').length; }
this.regular_data.total_data_tips = dump_l > 0 ? `包含 ${dump_l} 条同时勾选的数据` : ''; if (this.regular_data.data_compare.length===0){
/** 使用明细数据画图 */ this.regular_data.data_compare = json;
const data_detail = (json || []).map((ele) => ({ }
...ele, else{
key: ele.COLI_ID, const fistCompareDetail = this.regular_data.data_compare;
orderState: ele.OrderState, json.push(...fistCompareDetail);
applyDate: moment(ele.COLI_ApplyDate).format('YYYY-MM-DD'), }
startDate: ele.COLI_OrderStartDate, if (isRender){
confirmDate: moment(ele.COLI_ConfirmDate).format('YYYY-MM-DD'), if (this.regular_data.isRenderCount===0){
})); this.regular_data.isRenderCount=1;
const { data: IsOldData, } = pivotBy(data_detail.filter(ele => ele.COLI_IsOld === '是'), [['COLI_IsOld', ], [], pivotByDate]); }
const { data: isCusCommendData, } = pivotBy(data_detail.filter(ele => ele.COLI_IsCusCommend === '是'), [['COLI_IsCusCommend', ], [], pivotByDate]); else{
// console.log('IsOldData====', IsOldData, '\nisCusCommend', isCusCommendData); this.regular_data.detail_loading = false;
// 合并成两个系列 const dump_l = (json || []).filter(ele => ele.COLI_IsOld !== '' && ele.COLI_IsCusCommend !== '').length;
const seriesData = [].concat(IsOldData.map(ele => ({...ele, _ylabel: '老客户'})), isCusCommendData.map(ele => ({...ele, _ylabel: '老客户推荐'})),).sort(sortBy(pivotByDate)); this.regular_data.total_data_tips = dump_l > 0 ? `包含 ${dump_l} 条同时勾选的数据` : '';
// console.log('seriesData====', seriesData); /** 使用明细数据画图 */
const data_detail = (json || []).map((ele) => ({
this.regular_data.pivotData = seriesData; // { IsOldData, isCusCommendData, }; ...ele,
this.regular_data.pivotY = pivotByOrder; key: ele.COLI_ID,
this.regular_data.pivotX = pivotByDate; orderState: ele.OrderState,
applyDate: moment(ele.COLI_ApplyDate).format('YYYY-MM-DD'),
startDate: ele.COLI_OrderStartDate,
confirmDate: moment(ele.COLI_ConfirmDate).format('YYYY-MM-DD'),
}));
const { data: IsOldData, } = pivotBy(data_detail.filter(ele => ele.COLI_IsOld === '是'), [['COLI_IsOld', ], [], pivotByDate]);
const { data: isCusCommendData, } = pivotBy(data_detail.filter(ele => ele.COLI_IsCusCommend === '是'), [['COLI_IsCusCommend', ], [], pivotByDate]);
// console.log('IsOldData====', IsOldData, '\nisCusCommend', isCusCommendData);
// 合并成两个系列
const seriesData = [].concat(IsOldData.map(ele => ({...ele, _ylabel: '老客户'})), isCusCommendData.map(ele => ({...ele, _ylabel: '老客户推荐'})),).sort(sortBy(pivotByDate));
// console.log('seriesData====', seriesData);
this.regular_data.pivotData = seriesData; // { IsOldData, isCusCommendData, };
this.regular_data.pivotY = pivotByOrder;
this.regular_data.pivotX = pivotByDate;
}
}
else{
this.regular_data.detail_loading = false;
const dump_l = (json || []).filter(ele => ele.COLI_IsOld !== '' && ele.COLI_IsCusCommend !== '').length;
this.regular_data.total_data_tips = dump_l > 0 ? `包含 ${dump_l} 条同时勾选的数据` : '';
/** 使用明细数据画图 */
const data_detail = (json || []).map((ele) => ({
...ele,
key: ele.COLI_ID,
orderState: ele.OrderState,
applyDate: moment(ele.COLI_ApplyDate).format('YYYY-MM-DD'),
startDate: ele.COLI_OrderStartDate,
confirmDate: moment(ele.COLI_ConfirmDate).format('YYYY-MM-DD'),
}));
const { data: IsOldData, } = pivotBy(data_detail.filter(ele => ele.COLI_IsOld === '是'), [['COLI_IsOld', ], [], pivotByDate]);
const { data: isCusCommendData, } = pivotBy(data_detail.filter(ele => ele.COLI_IsCusCommend === '是'), [['COLI_IsCusCommend', ], [], pivotByDate]);
// console.log('IsOldData====', IsOldData, '\nisCusCommend', isCusCommendData);
// 合并成两个系列
const seriesData = [].concat(IsOldData.map(ele => ({...ele, _ylabel: '老客户'})), isCusCommendData.map(ele => ({...ele, _ylabel: '老客户推荐'})),).sort(sortBy(pivotByDate));
// console.log('seriesData====', seriesData);
this.regular_data.pivotData = seriesData; // { IsOldData, isCusCommendData, };
this.regular_data.pivotY = pivotByOrder;
this.regular_data.pivotX = pivotByDate;
}
} else { } else {
this.regular_data.data = json; if (isCompare){
const result = [];
const firstCompareData = this.regular_data.data;
for (const item1 of firstCompareData) {
for (const item2 of json) {
if (item1.ItemName === item2.ItemName) {
result.push({
ItemName: item1.ItemName,
OrderNum: show_vs_tag(formatPercent((item1.OrderNum-item2.OrderNum)/(item2.OrderNum===0?1:item2.OrderNum)),
item1.OrderNum-item2.OrderNum,item1.OrderNum,item2.OrderNum),
SUCOrderNum: show_vs_tag(formatPercent((item1.SUCOrderNum-item2.SUCOrderNum)/(item2.SUCOrderNum===0?1:item2.SUCOrderNum)),
item1.SUCOrderNum-item2.SUCOrderNum,item1.SUCOrderNum,item2.SUCOrderNum),
SUCRate: show_vs_tag(formatPercent((item1.SUCRate-item2.SUCRate)/(item2.SUCRate===0?1:item2.SUCRate)),
formatPercent(item1.SUCRate-item2.SUCRate),formatPercent(item1.SUCRate),formatPercent(item2.SUCRate)),
ML: show_vs_tag(formatPercent((item1.ML-item2.ML)/(item2.ML===0?1:item2.ML)),
(item1.ML-item2.ML).toFixed(2),item1.ML,item2.ML),
PersonNum: show_vs_tag(formatPercent((item1.PersonNum-item2.PersonNum)/(item2.PersonNum===0?1:item2.PersonNum)),
item1.PersonNum-item2.PersonNum,item1.PersonNum,item2.PersonNum),
});
}
}
};
this.regular_data.data = result;
}
else{
this.regular_data.data = json;
}
} }
this.regular_data.loading = false; this.regular_data.loading = false;
resolve();
}); });
}) })
.catch((error) => { .catch((error) => {
this.regular_data.loading = false; this.regular_data.loading = false;
console.log('fetch data failed', error); console.log('fetch data failed', error);
}); });
});
} }
handleChange_webcode_regular = (value) => { handleChange_webcode_regular = (value) => {
@ -192,6 +268,8 @@ class CustomerStore {
detail_loading: false, detail_loading: false,
data: [], data: [],
data_detail: [], data_detail: [],
data_compare: [],
isRenderCount:0,
total_data_tips: '', total_data_tips: '',
webcode: 'ALL', webcode: 'ALL',
site_select_mode: 'multiple',// 站点是否多选 site_select_mode: 'multiple',// 站点是否多选

Write Preview
Loading…
Cancel
Save