完善数字人

wujingjing

2025-04-09 28706df7da34b8854cdce96ad89c035eaded6ea9

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

@@ -5,7 +5,7 @@
         <template v-if="visibleParams && visibleParams.length > 0 && showFilter">
            <component
               class="flex-0 m-2 first-of-type:ml-0"
               :class="{ invisible: isMap && showMode2 === DisplayModeType2.Map }"
               :class="{ hidden: isMap && showMode2 === DisplayModeType2.Map }"
               v-model="visibleParams[index].value"
               v-for="(item, index) in visibleParams as any"
               :key="item.id"
@@ -17,16 +17,15 @@
               :disabled="disabled"
            ></component>
         </template>
         <div v-if="isTotalTable" class="ml-auto space-x-2 flex-items-center">
            <el-button v-if="showMode === DisplayModeType.List" @click="exportExcel">导出Excel</el-button>

         <DisplayMode
            v-if="isTotalTable"
            class="ml-auto"
            :order="modeChangeOrder"
            v-model="showMode"
            :modeTypeMap="displayModeTypeMap"
            @change="displayModeChange"
         />
            <DisplayMode :order="modeChangeOrder" v-model="showMode" :modeTypeMap="displayModeTypeMap" @change="displayModeChange" />
         </div>

         <div class="ml-auto space-x-2 flex-items-center" v-if="isMap || !isTotalTable">
            <el-button v-if="showMode2 === DisplayModeType2.List" @click="exportExcel">导出Excel</el-button>

            <ColFilter
               v-if="(!isMap && !isTotalTable) || (isMap && showMode2 === DisplayModeType2.List && !isTotalTable)"
               :columnList="colList"
@@ -122,18 +121,8 @@
      <div class="flex-auto" v-resize="debounceResizeChart" v-show="showMode === DisplayModeType.Chart">
         <div ref="chartRef" style="height: 25rem"></div>
      </div>
      <div class="mt-5 relative" v-if="chartDlgIsShow && metricsList.length > 0">
         <span
            class="absolute right-[10px] top-[5px] ywifont ywicon-guanbi text-[#528abe] font-bold cursor-pointer"
            style="z-index: 2"
            @click="closeChartDlg"
         ></span>
         <el-tabs v-model="activeTab" type="border-card">
            <el-tab-pane lazy v-for="(item, index) in metricsList" :key="`${chartDlgKey}_${index}`" :label="item.title" :name="index"
               ><RecordSetDialog :modelValue="true" :isDialog="false" height="20rem" :metrics="item"
            /></el-tab-pane>
         </el-tabs>
      </div>

      <EquipCurve v-model:isShow="chartDlgIsShow" class="mt-5" :data="equipCurveMapRow" :quotaChartCol="data?.quota_chart?.col" />

      <InfoDetail class="text-base" v-model="infoDetailIsShow" :item="detailMapRow" :colList="colList" />
   </div>
@@ -144,6 +133,7 @@
import * as echarts from 'echarts';
import type { TableInstance } from 'element-plus';
import { chunk, sortBy } from 'lodash-es';
import EquipCurve from './components/EquipCurve.vue';
import type { CSSProperties } from 'vue';
import { computed, nextTick, onMounted, reactive, ref, shallowRef, watchEffect, type PropType } from 'vue';
import { PATH_ICON } from '../../../common';
@@ -151,7 +141,6 @@
import { BORDER_COLOR, COL_HEADER_CELL_BG_COLOR, THICK_BORDER_WIDTH } from '../deviceLastValue/constants';
import DisplayMode from '../recordSet/components/DisplayMode.vue';
import { DisplayModeType, DisplayModeType2, displayModeTypeMap, displayModeTypeMap2 } from '../recordSet/components/types';
import RecordSetDialog from '../recordSet/RecordSetDialog.vue';
import { RecordSetParamsType, recordSetMapCom } from '../recordSet/types';
import InfoDetail from './infoDetail/InfoDetail.vue';
import MapView from './map/Map.vue';
@@ -160,7 +149,8 @@
import type { TableCol } from '/@/components/table/colFilter/types';
import { axisLabelFormatter } from '/@/utils/chart';
import { LocalPlus } from '/@/utils/storage';
import { debounce, getTextWidth, toPercent } from '/@/utils/util';
import { debounce, downloadExcel, getTextWidth, toPercent } from '/@/utils/util';
import { isSharePage } from '/@/stores/chatRoom';

const props = defineProps({
   data: {
@@ -210,10 +200,13 @@

const isTotalTable = computed(() => checkIsTotalTable(props.data));

const checkHasAddRateCol = (current) => {
   return current.find((item) => item.title === '比例' && item.type === 'text');
};
const getTableCols = (propsData) => {
   const current = propsData?.cols ?? [];

   if (checkIsTotalTable(propsData)) {
   if (checkIsTotalTable(propsData) && !checkHasAddRateCol(current)) {
      current.push({
         title: '比例',
         type: 'text',
@@ -234,39 +227,43 @@
const getTableValues = (propsData) => {
   const agg_count_col = propsData?.agg_count_col;
   const current = (propsData?.values ?? []) as Array<any[]>;

   if (checkIsTotalTable(propsData)) {
      const last = current[current.length - 1];
      const lastItemIndex = last?.length > 0 ? last.length - 1 : 0;
      valueColIndex = agg_count_col ?? lastItemIndex;

      rateColIndex = valueColIndex + 1;

      // 计算总数
      sumValue = current.reduce((pre, cur) => {
         const value = Number(cur[valueColIndex] ?? 0);
         pre += value;
         return pre;
      }, 0);
      // 计算比例，并放到比例行
      current.forEach((rowValue) => {
         const value = rowValue[valueColIndex];
         const rate = sumValue === 0 ? 0 : (value ?? 0) / sumValue;
         const percent = toPercent(rate, true, 2);

         rowValue.splice(rateColIndex, 0, percent);
      });
      // 添加合计行
      if (last?.length > 0) {
         const totalRow = new Array(last.length);
      if (!current.find((item) => item[0] === '合计')) {
         // 计算比例，并放到比例行
         current.forEach((rowValue) => {
            const value = rowValue[valueColIndex];
            const rate = sumValue === 0 ? 0 : (value ?? 0) / sumValue;
            const percent = toPercent(rate, true, 2);

         let lastGroupIndex = tableCols.value.findLastIndex((item, index) => index !== rateColIndex && index !== valueColIndex);
         lastGroupIndex = lastGroupIndex === -1 ? 0 : lastGroupIndex;
         totalRow[lastGroupIndex] = '合计';
         // 比例列
         totalRow[rateColIndex] = '100%';
         // 合计总数
         totalRow[valueColIndex] = sumValue + '';
         (totalRow as any).isTotal = true;
         current.push(totalRow);
            rowValue.splice(rateColIndex, 0, percent);
         });
         // 添加合计行
         if (last?.length > 0) {
            const totalRow = new Array(last.length);

            let lastGroupIndex = tableCols.value.findLastIndex((item, index) => index !== rateColIndex && index !== valueColIndex);
            lastGroupIndex = lastGroupIndex === -1 ? 0 : lastGroupIndex;
            totalRow[lastGroupIndex] = '合计';
            // 比例列
            totalRow[rateColIndex] = '100%';
            // 合计总数
            totalRow[valueColIndex] = sumValue + '';
            (totalRow as any).isTotal = true;
            current.push(totalRow);
         }
      }
   }
   return current;
@@ -576,7 +573,7 @@
const pager = reactive({
   index: 1,
   size: 10,
   total: tableValues.value.length ?? 0,
   total: tableValues.value?.length ?? 0,
});

const calcCellHeight = (count, cellHeight) => {
@@ -1162,30 +1159,19 @@
};

const chartDlgIsShow = ref(false);
const chartDlgKey = ref('');
const activeTab = ref(0);
const metricsList = ref([]);
const resetTab = () => {
   activeTab.value = 0;
};
const equipCurveMapRow = ref(null);
const showCurve = (row) => {
   resetTab();
   if (isSharePage.value) return;
   if (!row) return;
   equipCurveMapRow.value = row;
   chartDlgIsShow.value = true;
   const quotaChartCol = props.data?.quota_chart?.col;
   if (!quotaChartCol) {
      chartDlgKey.value = '';
      metricsList.value = [];
   } else {
      const str = row[quotaChartCol] ?? '[]';
      chartDlgKey.value = str;
      metricsList.value = JSON.parse(str);
   }
};
const closeInfoWindow = () => {
   closeChartDlg();
};
const closeChartDlg = () => {
   chartDlgIsShow.value = false;
   equipCurveMapRow.value = null;
};

const tableRowClick = (row) => {
@@ -1202,6 +1188,22 @@
   showInfoDetail(row);
};

const exportExcel = () => {
   const data = tableValues.value;
   const keyLabelMap = new Map(colList.value.map((item) => [item.prop, item.label]));
   const excelData = data.map((item) => {
      const excelItem = {};

      item.forEach((item, index) => {
         const label = keyLabelMap.get(index + '');
         if (!label) return;
         excelItem[label] = item;
      });
      return excelItem;
   });
   downloadExcel(excelData, props.data.title);
};

defineExpose({
   updateAll,
   updateCurrent,