perf:老客户:增加对比折线

src/charts/Customer_care_regular.jsx

@@ -33,14 +33,15 @@ const Customer_care_regular = () => {
             onSubmit={async (_err, obj, form, str) => {
               customer_store.setSearchValues(obj, form, 'regular_data');
               regular_data.data_compare=[];
-              regular_data.isRenderCount=0;
               if (obj.DateDiff1 && obj.DateDiff2){
+                regular_data.showSum=false;
                 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{
+                regular_data.showSum=true;
                 customer_store.regular_customer_order();
                 customer_store.regular_customer_order(true);
               }
@@ -111,7 +112,8 @@ const Customer_care_regular = () => {
         </Col>
 
         <Col span={24}>
-          <LineWithAvg dataSource={regular_data.pivotData} loading={regular_data.detail_loading} xField={regular_data.pivotX} yField={regular_data.pivotY} seriesField='_ylabel' showSUM={true} />
+          <LineWithAvg dataSource={regular_data.pivotData} loading={regular_data.detail_loading} xField={regular_data.pivotX} yField={regular_data.pivotY} 
+          seriesField='_ylabel' showSUM={regular_data.showSum} />
         </Col>
 
         <Col span={24}>

src/components/LineWithAvg.jsx

@@ -25,6 +25,10 @@ export default observer((props) => {
     // xAxis: {
     //   type: 'timeCat',
     // },
+    point: {
+      size: 4,
+      shape: "cicle",
+    },
     yAxis: {
       min: 0,
       maxTickInterval: 5,
@@ -79,12 +83,13 @@ export default observer((props) => {
     // 初始化`平均`线, `总计`线
     const byDays = groupBy(rawData, xField);
     const sumY = rawData.reduce((a, b) => a + b[yField], 0);
-    const avgVal = Math.round(sumY / (Object.keys(byDays).length));
+    // const avgVal = Math.round(sumY / (Object.keys(byDays).length));
-    const avgLine = [
+    // const avgLine = [
-      { type: 'text', position: ['start', avgVal], content: avgVal, offsetX: -15, style: { fill: '#F4664A', textBaseline: 'bottom' } },
+    //   { type: 'text', position: ['start', avgVal], content: avgVal, offsetX: -15, style: { fill: '#F4664A', textBaseline: 'bottom' } },
-      { type: 'line', start: [-10, avgVal], end: ['max', avgVal], style: { stroke: '#F4664A', lineDash: [2, 2] } },
+    //   { type: 'line', start: [-10, avgVal], end: ['max', avgVal], style: { stroke: '#F4664A', lineDash: [2, 2] } },
-    ];
+    // ];
-    setLineConfig({ ...lineConfig, yField, xField, annotations: avgLine });
+    // setLineConfig({ ...lineConfig, yField, xField, annotations: avgLine });
+    setLineConfig({ ...lineConfig, yField, xField,});
     if (showSUM) {
       const _sumLine = Object.keys(byDays).reduce((r, _d) => {
         const summaryVal = byDays[_d].reduce((rows, row) => rows + row[yField], 0);
@@ -94,6 +99,9 @@ export default observer((props) => {
       // console.log(_sumLine.map((ele) => ele[yField]));
       setSumSeries(_sumLine);
     }
+    else{
+      setSumSeries([]);
+    }
   };
 
   const onChangeXDateFieldGroup = (value, data, avg1) => {
@@ -129,6 +137,9 @@ export default observer((props) => {
     if (showSUM) {
       setSumSeries(_sumLine);
     }
+    else{
+      setSumSeries([]);
+    }
 
     // setAvgLine1(avg1);
     const avg1Int = Math.round(avg1);

src/stores/CustomerStore.js

@@ -145,18 +145,7 @@ class CustomerStore {
                         if (!isCompare){
                             this.regular_data.data_detail = json;
                         }
-                        if (this.regular_data.data_compare.length===0){
-                            this.regular_data.data_compare = json;
-                        }
-                        else{
-                            const fistCompareDetail = this.regular_data.data_compare;
-                            json.push(...fistCompareDetail);                             
-                        }
                         if (isRender){
-                            if (this.regular_data.isRenderCount===0){
-                                this.regular_data.isRenderCount=1;
-                            }
-                            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} 条同时勾选的数据` : '';
@@ -174,9 +163,42 @@ class CustomerStore {
                             // 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);
+                            const seriesNewData = seriesData.map(item => {
-                                
+                                if (isCompare){
-                                this.regular_data.pivotData = seriesData; // { IsOldData, isCusCommendData, };
+                                    return {
+                                        ...item,
+                                        _ylabel: date_picker_store.start_date_cp.format(config.DATE_FORMAT)+ '-' +date_picker_store.end_date_cp.format(config.SMALL_DATETIME_FORMAT) + item._ylabel 
+                                    };
+                                }
+                                else{
+                                    return {
+                                        ...item,
+                                        _ylabel: date_picker_store.start_date.format(config.DATE_FORMAT)+ '-' +date_picker_store.end_date.format(config.SMALL_DATETIME_FORMAT) + item._ylabel 
+                                    };
+                                }
+                            });
+                            // console.log('seriesData====', seriesNewData);
+                            if (this.regular_data.data_compare.length===0){
+                                this.regular_data.data_compare=seriesNewData;
+                            }
+                            else{
+                                let seriesCompareData = [];
+                                const fistCompareDetail = this.regular_data.data_compare;
+                                if (fistCompareDetail.length>seriesNewData.length){
+                                    seriesCompareData = fistCompareDetail;
+                                    for (let i = 0; i < seriesNewData.length; i++) {
+                                        seriesNewData[i].applyDate = fistCompareDetail[i].applyDate;
+                                    }
+                                    seriesCompareData.push(...seriesNewData);
+                                }
+                                else{
+                                    seriesCompareData=seriesNewData;
+                                    for (let i = 0; i < fistCompareDetail.length; i++) {
+                                        fistCompareDetail[i].applyDate = seriesNewData[i].applyDate;
+                                    }
+                                    seriesCompareData.push(...fistCompareDetail);
+                                }
+                                this.regular_data.pivotData = seriesCompareData; // { IsOldData, isCusCommendData, };
                                 this.regular_data.pivotY = pivotByOrder;
                                 this.regular_data.pivotX = pivotByDate;
                             }  
@@ -199,14 +221,10 @@ class CustomerStore {
                             // 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 {
                         if (isCompare){
                             const result = [];
@@ -269,7 +287,7 @@ class CustomerStore {
         data: [],
         data_detail: [],
         data_compare: [],
-        isRenderCount:0,
+        showSum:true,
         total_data_tips: '',
         webcode: 'ALL',
         site_select_mode: 'multiple',// 站点是否多选