优化 列表->图表

wujingjing

2024-10-23 b70c8e7689a1ddc6e684cbf6a796440d950ba5ba

 src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue

@@ -28,10 +28,10 @@
               :header-cell-style="tableHeaderCellStyle"
               :data="chunkTableData[pager.index - 1]"
               @row-click="recordSelectChange"
               rowClassName="cursor-pointer"
               :spanMethod="objectSpanMethod"
               class="w-full h-full"
               highlightCurrentRow
               :rowClassName="tableRowClassName"
               cellClassName="text-sm"
               headerCellClassName="text-sm"
            >
@@ -197,11 +197,20 @@
         totalRow[rateColIndex] = '100%';
         // 合计总数
         totalRow[valueColIndex] = sumValue + '';

         (totalRow as any).isTotal = true;
         current.push(totalRow);
      }
   }
   return current;
};

const tableRowClassName = ({ row, rowIndex }) => {
   let className = 'cursor-pointer';
   if (row.isTotal) {
      const bgColor = '!bg-[#c5d9f1]';
      className += ` font-bold ${bgColor} hover:${bgColor} active:${bgColor}`;
   }
   return className;
};
// 统计表格，需要增加累计值行，以及比例列
const tableValues = ref(getTableValues(props.data));
@@ -768,7 +777,7 @@
   groupTitle = groupCols[groupCols.length - 1].title;

   const data = groupValues.map((item) => {
      const groupName = item.filter((item, index) => !excludeIndex.includes(index) && index !== valueColIndex).join(',');
      const groupName = item.filter((item, index) => !excludeIndex.includes(index) && index !== valueColIndex).join('_');
      const value = item[valueColIndex];
      return {
         value,
@@ -779,12 +788,6 @@
   return data;
};

const getTooltip = () => {
   return {
      trigger: 'item',
      valueFormatter: (value) => `${value} / ${toPercent(sumValue === 0 ? 0 : (value as number) / sumValue, true, 2)}`,
   } as any;
};

const getCommonOption = () => {
   return {
@@ -801,6 +804,10 @@
         // orient:'vertical',
         top: 33,
         left: 'center',
      },
      tooltip: {
         trigger: 'item',
         valueFormatter: (value) => `${value} / ${toPercent(sumValue === 0 ? 0 : (value as number) / sumValue, true, 2)}`,
      },
   } as echarts.EChartsOption;
};
@@ -867,8 +874,8 @@
            //       return value;
            //    }
            // },
            width:86,
            overflow:'truncate',
            width: 86,
            overflow: 'truncate',
            // nameTruncate: {
            //    maxWidth: 52,
            // },
@@ -919,8 +926,8 @@
   }

   const option: echarts.EChartsOption = {
      ...getCommonOption,
      tooltip: getTooltip(),
      ...getCommonOption(),

      toolbox: {
         show: true,
         feature: {
@@ -932,8 +939,7 @@
                  activeChartType = ChartTypeEnum.Bar;
                  chartInstance.value.setOption(
                     {
                        ...getCommonOption,
                        tooltip: getTooltip(),
                        ...getCommonOption(),

                        toolbox: option.toolbox,
                        ...getBarOption(chartData),
@@ -953,8 +959,7 @@
                  activeChartType = ChartTypeEnum.Pie;
                  chartInstance.value.setOption(
                     {
                        ...getCommonOption,
                        tooltip: getTooltip(),
                        ...getCommonOption(),
                        toolbox: option.toolbox,
                        ...getPieOption(chartData),
                     },