fix: 数据透视: 目的地国籍

src/libs/ht.js

@@ -200,8 +200,15 @@ export const pivotBy = (_data, [rows, columns, date]) => {
   console.time('pivot3----');
   console.log('pivotBy', [rows, columns, date]);
   const groupbyKeys = flush([].concat(rows, columns, [date]));
+  // if (groupbyKeys.includes('PPPriceRange')) {
+  // }
+  // 补充计算的字段
+  let data = cloneDeep(_data).map(ele => {
+    ele.PPPrice = (Number(ele.orderState) === 1 && ele.tourdays && ele.personNum)  ? fixToInt(ele.quotePrice / ele.tourdays / ele.personNum) : -1;
+    ele.PPPriceRange = calcPPPriceRange(ele.PPPrice);
+    return ele;
+  });
   // 数组的字段值, 拆分处理
-  let data = cloneDeep(_data);
   if (groupbyKeys.includes('destinationCountry_AsJOSN')) {
     data = _data.reduce((r, v, i) => {
       const vjson = isEmpty(v.destinationCountry_AsJOSN) ? [] : v.destinationCountry_AsJOSN;
@@ -214,14 +221,6 @@ export const pivotBy = (_data, [rows, columns, date]) => {
       return r;
     }, []);
   }
-  // if (groupbyKeys.includes('PPPriceRange')) {
-    // 补充计算的字段
-    data = _data.map(ele => {
-      ele.PPPrice = (Number(ele.orderState) === 1 && ele.tourdays && ele.personNum)  ? fixToInt(ele.quotePrice / ele.tourdays / ele.personNum) : -1;
-      ele.PPPriceRange = calcPPPriceRange(ele.PPPrice);
-      return ele;
-    });
-  // }
 
   const getKeys = (keys) => keys.map((keyField) => [...new Set(data.map((f) => f[keyField]))]);
   const [rowsKeys, columnsKeys, dateKeys] = [getKeys(rows), getKeys(columns), [getKeys([date])[0].filter(s => s)]];
@@ -326,10 +325,11 @@ export const pivotBy = (_data, [rows, columns, date]) => {
   const transposeData = (keys, dataProp, [dataKey, colKeys]=[]) =>
     Object.keys(dataProp)
       .map((rowKey) => {
+        const rowLabel = keys.length === 0 ? '总' : keys.map(ekey => dataProp[rowKey][0][ekey]).join('»');
         const _colKey = dataKey || 'dataKey';
         const _colData = groupBy(dataProp[rowKey], (crow) => (colKeys || keys).map((kk) => `${crow[kk]}`).join('=@='));
         const _columnsObj = calcTradeFields(_colData);
-        return { ...pick(dataProp[rowKey][0], keys), [_colKey]: _columnsObj.groupByKeys, key: _columnsObj.key };
+        return { ...pick(dataProp[rowKey][0], keys), [_colKey]: _columnsObj.groupByKeys, key: _columnsObj.key, rowLabel };
       })
       .map((everyR) => {
         const _colKey = dataKey || 'dataKey';
@@ -375,8 +375,12 @@ export const pivotBy = (_data, [rows, columns, date]) => {
   const columnsData = groupBy(data, (row) => columns.map((kk) => `${row[kk]}`).join('=@='));
   const summaryColumns = transposeData(columns, columnsData, ['rows', rows]);
 
+  const rowsMixcolumns = flush([].concat(rows, columns));
+  const rowsMixcolumnsData = groupBy(data, (row) => rowsMixcolumns.map((kk) => `${row[kk]}`).join('=@='));
+  const summaryMix = transposeData(rowsMixcolumns, rowsMixcolumnsData);
+
   console.timeEnd('pivot3----');
-  return { data: pivotResult, columnValues: [rowsKeys, columnsKeys, dateKeys], summaryRows, summaryColumns, pivotKeys: groupbyKeys };
+  return { data: pivotResult, columnValues: [rowsKeys, columnsKeys, dateKeys], summaryRows, summaryColumns, pivotKeys: groupbyKeys, summaryMix };
 };
 
 // todo: 优化 pivotBy 速度

src/views/DataPivot.jsx

@@ -101,6 +101,7 @@ export default observer((props) => {
   const [dataSource, setDataSource] = useState([]);
   // const [dataSourceMapped, setDataSourceMapped] = useState({});
 
+  const [pivotDataSource, setPivotDataSource] = useState([]);
   const [pivotTableDataSource, setPivotTableDataSource] = useState([]);
   const [pivotTableColumnSummary, setPivotTableColumnSummary] = useState({}); // 列单选, 只有一组结果
 
@@ -152,12 +153,18 @@ export default observer((props) => {
    */
   const calcDataByDate = (_rawData) => {
     // console.log(';;;;;', pivotDateColumns);
-    const { data, columnValues, summaryRows, summaryColumns, pivotKeys } = pivotBy(_rawData || rawData, [].concat(pivotDateColumns, [curXfield]));
+    const { data, columnValues, summaryRows, summaryColumns, pivotKeys, summaryMix } = pivotBy(_rawData || rawData, [].concat(pivotDateColumns, [curXfield]));
-    // console.log('data====', data, '\ncolumnValues', columnValues, '\nsummaryRows', summaryRows, '\nsummaryColumns', summaryColumns);
+    // console.log('data====', data, '\ncolumnValues', columnValues, '\nsummaryRows', summaryRows, '\nsummaryColumns', summaryColumns, '\nsummaryMix', summaryMix);
     setShowPassCountryTips(pivotKeys.includes('destinationCountry_AsJOSN'));
     setDataBeforePick(data.sort(sortBy(curXfield)));
+    // 折线图汇总数据, 排序
+    // const sortMixData = cloneDeep(summaryMix).sort(sortBy(defaultValKey)).reverse();
+    // setPivotDataSource(sortMixData);
+    // const sortRank = sortMixData.map(ele => ele.rowLabel);
     // 折线图数据
     setDataSource(data.sort(sortBy(curXfield)));
+    // 排名
+    // .map(ele => ({...ele, rowLabel: `${sortRank.indexOf(ele.rowLabel)+1}).${ele.rowLabel}`  }))
     // 表格数据
     const sortRowData = cloneDeep(summaryRows).sort(sortBy(defaultValKey)).reverse();
     setPivotTableDataSource(sortRowData);
@@ -197,6 +204,11 @@ export default observer((props) => {
       // },
       itemMarginBottom: 12, // 垂直间距
     },
+    tooltip: {
+      customItems: (originalItems) => {
+        return originalItems.map(ele => ({...ele, valueR: ele.data[defaultValKey]})).sort(sortBy('valueR')).reverse();
+      },
+    },
   };
   const [lineConfig, setLineConfig] = useState(cloneDeep(line_config));