recordSetTable group

wujingjing

2024-09-29 bfe893e818c75815b249fbfaed954458930d5600

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

@@ -9,6 +9,7 @@
            :cell-style="{ textAlign: 'center' }"
            :header-cell-style="{ textAlign: 'center' }"
            :data="data?.values"
            :spanMethod="objectSpanMethod"
            highlight-current-row
            class="w-full h-full"
            cellClassName="text-sm"
@@ -47,11 +48,48 @@
const tableRef = ref<TableInstance>(null);
const measureWidthOffset = 28;

const groupColIndex = [];
(props.data?.cols ?? []).map((item, index) => {
   if (item.group) {
      groupColIndex.push(index);
   }
});

const objectSpanMethod = ({ row, column, rowIndex, columnIndex }) => {
   if (groupColIndex.includes(columnIndex)) {
      return {
         rowspan: row.rowspan,
         colspan: 1,
      };
   }
};
const resizeEvent = ({ width, height }) => {
   if (width === 0 || height === 0) {
      return;
   }

   if (props.data?.cols?.length > 0 && props.data?.values?.length > 0) {
      const groupData = _.groupBy(props.data.values, (item, index) => {
         // 找出所有需要 group 的值，加起来
         const groupKey = item.reduce((preVal, curVal, index) => {
            const isGroup = props.data.cols[index].group;
            if (isGroup) {
               preVal += curVal;
            }
            return preVal;
         }, '');
         return groupKey;
      });

      // 重新排布一下位置，保证 group 相邻，同时打上 rowspan
      props.data.values = Object.values(groupData).reduce((preVal, curVal) => {
         curVal.map((item, index, array) => {
            item.rowspan = index === 0 ? array.length : undefined;
         });
         preVal = preVal.concat(curVal);
         return preVal;
      }, []);

      const maxStrList = props.data.cols.map((item) => item.title);
      const maxLenList = props.data.cols.map((item) => item.title.gblen());
      for (const item of props.data.values) {