From 9e9d666bbe57503bb0902bda0d23bf34ae75e832 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期一, 21 十月 2024 17:17:25 +0800
Subject: [PATCH] 表格和图表展示 ；同步 colFilter
---
src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue | 653 +++++++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 523 insertions(+), 130 deletions(-)
diff --git a/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue b/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue
index 2cccabb..17d4558 100644
--- a/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue
+++ b/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue
@@ -1,178 +1,349 @@
<!-- 鏌ヨ鏈�鏂拌鍛婁俊鎭� -->
<template>
- <div>
- <span v-if="data?.title" class="text-base font-bold flex-center mb-5">{{ data?.title }}</span>
- <div class="w-full" style="height: 70vh" ref="containerRef" v-resize="resizeHandler">
+ <div class="w-full flex-column">
+ <div class="flex-0 flex-items-center mb-1 h-[38px]">
+ <template v-if="visibleParams && visibleParams.length > 0">
+ <component
+ class="flex-0 m-2"
+ v-model="visibleParams[index].value"
+ v-for="(item, index) in visibleParams as any"
+ :key="item.id"
+ :id="item.id"
+ :is="recordSetTableMap[item.type]"
+ :data="item"
+ @change="(val) => handleQueryChange(val, item)"
+ :originData="originData"
+ ></component>
+ </template>
+
+ <ColFilter class="ml-auto" :columnList="colList" @change="colFilterChange" />
+ </div>
+ <div class="flex-auto" ref="containerRef" v-resize="resizeHandler" v-loading="queryLoading">
<el-table
ref="tableRef"
- border
+ :maxHeight="tableHeight"
:cell-style="tableCellStyle"
:header-cell-style="tableHeaderCellStyle"
- :data="data?.values"
+ :data="chunkTableData[pager.index - 1]"
+ @row-click="recordSelectChange"
+ rowClassName="cursor-pointer"
:spanMethod="objectSpanMethod"
-
class="w-full h-full"
+ highlightCurrentRow
cellClassName="text-sm"
headerCellClassName="text-sm"
>
- <template v-if="data?.cols?.length > 0">
- <el-table-column
- v-for="(item, index) in colList"
- :label="item.title"
- :width="item.width"
- :sortable="item.type === 'time'"
- :key="index"
- :prop="index + ''"
- show-overflow-tooltip
- />
+ <DefineColumns v-slot="{ cols }">
+ <template v-for="item in colList" :key="item.prop">
+ <el-table-column
+ v-if="item.isShow ?? true"
+ :type="item.type"
+ :label="item.label"
+ :width="item.width"
+ :sortable="item.sortable"
+ :key="item.prop"
+ :prop="item.prop"
+ show-overflow-tooltip
+ />
+ </template>
+ </DefineColumns>
+ <el-table-column v-if="data?.title" :label="data?.title" show-overflow-tooltip>
+ <template v-if="data?.cols?.length > 0">
+ <template v-for="item in colList" :key="item.prop">
+ <el-table-column
+ v-if="item.isShow ?? true"
+ :type="item.type"
+ :label="item.label"
+ :width="item.width"
+ :sortable="item.sortable"
+ :key="item.prop"
+ :prop="item.prop"
+ show-overflow-tooltip
+ />
+ </template>
+ </template>
+ </el-table-column>
+ <template v-else>
+ <template v-if="data?.cols?.length > 0">
+ <ReuseColumns :cols="colList" />
+ </template>
</template>
</el-table>
</div>
+
+ <el-pagination
+ class="flex-0"
+ style="margin-bottom: 0 !important; margin-left: auto !important; float: none !important"
+ small
+ hide-on-single-page
+ v-model:current-page="pager.index"
+ v-model:page-size="pager.size"
+ layout="total,prev,pager,next,jumper"
+ :total="pager.total"
+ />
+
+ <InfoDetail class="text-base" v-model="infoDetailIsShow" :item="detailMapRow" :colList="colList" />
</div>
</template>
<script setup lang="ts">
+import { createReusableTemplate } from '@vueuse/core';
import type { TableInstance } from 'element-plus';
import _ from 'lodash';
-import { CSSProperties, onMounted, ref, type PropType } from 'vue';
+import type { CSSProperties } from 'vue';
+import { computed, nextTick, onMounted, reactive, ref, type PropType, watchEffect } from 'vue';
import { BORDER_COLOR, COL_HEADER_CELL_BG_COLOR, THICK_BORDER_WIDTH } from '../deviceLastValue/constants';
+import ColFilter from '/@/components/table/colFilter/ColFilter.vue';
+import { TableCol } from '/@/components/table/colFilter/types';
import { debounce, getTextWidth } from '/@/utils/util';
+import InfoDetail from './infoDetail/InfoDetail.vue';
+import { RecordSetTableType, recordSetTableMap } from './types';
+import StringInput from './components/StringInput.vue';
+import { curveQuery } from '/@/api/ai/chat';
+
const props = defineProps({
data: {
type: Object as PropType<any>,
},
+ originData: {
+ type: Object as PropType<any>,
+ },
+ summaryIndex: {
+ type: Number,
+ },
+ tableLimitHeight:{
+ type:Number,
+ required:false
+ }
});
+const [DefineColumns, ReuseColumns] = createReusableTemplate<{
+ cols: any[];
+}>();
+const emits = defineEmits<{
+ (event: 'updateQuery', res: any): void;
+}>();
+
const colList = ref([]);
+watchEffect(() => {
+ colList.value =
+ props.data.cols?.map((item, index) => {
+ let isShow = true;
+ if (props.data.max_cols != null) {
+ isShow = index < props.data.max_cols;
+ }
+ return {
+ ...item,
+ width: 0,
+ label: item.title,
+ // sortable: item.type === 'time',
+ prop: index + '',
+ isShow: isShow,
+ } as TableCol;
+ }) ?? [];
+});
+
+// 鎵�鏈夋樉绀虹殑 prop
+const visibleColProp = computed(() => colList.value.filter((item) => item.isShow == null || item.isShow).map((item) => item.prop));
+
const containerRef = ref<HTMLDivElement>(null);
const tableRef = ref<TableInstance>(null);
const measureWidthOffset = 28;
-const groupColIndex = [];
-(props.data?.cols ?? []).map((item, index) => {
- if (item.group) {
- groupColIndex.push(index);
- }
+const filterGroupIndexList = computed(() => {
+ const groupIndexList = [];
+
+ (props.data?.cols ?? []).map((item, index) => {
+ // 鏄垎缁勶紝涓斿綋鍓嶅彲瑙�
+ if (item.group && visibleColProp.value.includes(index + '')) {
+ groupIndexList.push(index);
+ }
+ });
+
+ return groupIndexList;
});
+const chunkTableData = ref([props.data?.values]);
+// FIXME: 濡傛灉鍏ㄩ儴 group 閮戒负 true锛屾伆濂芥渶鍚庡鏉¤褰曚篃鍙互褰掍负涓�缁勶紝寰堝彲鑳芥樉绀轰笉瀵癸紝灏戜簡鍑犳潯閲嶅鐨勬暟鎹�
const objectSpanMethod = ({ row, column, rowIndex, columnIndex }) => {
- if (groupColIndex.includes(columnIndex)) {
+ const key = `${rowIndex},${columnIndex}`;
+ const rowspan = cellRowSpanMap.get(key);
+ if (rowspan !== undefined) {
return {
- rowspan: row.rowspan,
+ rowspan,
+ colspan: 1,
+ };
+ } else {
+ return {
+ rowspan: 1,
colspan: 1,
};
}
+};
+
+// 鍗曞厓鏍艰鍚堝苟鎯呭喌
+const cellRowSpanMap = new Map<string, number | undefined>();
+
+/**
+ * 鏋勫缓鍒嗙粍缁撴瀯锛屼竴缁勪竴缁勬寜灞傛鏋勫缓
+ * @param i 褰撳墠鍒嗙粍鐨勭储寮曚綅缃�
+ * @param j 褰撳墠璁板綍鎵�鍦ㄨ浣嶇疆
+ */
+const buildGroupData = (values, i = 0, j = 0) => {
+ if (!values || values.length === 0) return [];
+ const curGroupIndex = filterGroupIndexList.value[i];
+ // 涓嶅彲浠ュ垎缁勶紝鐩存帴 return;
+ if (curGroupIndex == undefined || values.length === 1) {
+ return values;
+ }
+
+ const groupData = _.groupBy(values, (item, index) => {
+ const groupValue = item[curGroupIndex];
+ return groupValue;
+ });
+ // 椤哄欢涓嬩竴涓垎缁�
+ i++;
+ // 閲嶆柊鎺掑竷涓�涓嬩綅缃紝淇濊瘉 group 鐩搁偦锛屽悓鏃舵墦涓� rowspan
+ const result = Object.values(groupData).reduce((preVal, curVal) => {
+ curVal.map((item, index) => {
+ // 琛屽垪浣滀负 key
+ const key = `${j + index},${curGroupIndex}`;
+ cellRowSpanMap.set(key, index === 0 ? curVal.length : 0);
+ });
+
+ preVal = preVal.concat(buildGroupData(curVal, i, j));
+ j += curVal.length;
+ return preVal;
+ }, []);
+ return result;
+};
+
+/**
+ * 璁＄畻姣忎竴鍒楃殑瀹藉害
+ * 1锛夋�诲灏忎簬瀹瑰櫒瀹斤細鐩存帴鎸夋瘮渚嬪垎
+ * 2锛夋�诲澶т簬瀹瑰櫒瀹斤細鍏堝畬鍏ㄦ弧瓒虫渶灏忕殑瀹藉害锛岀洿鍒板埌涓嶆弧瓒冲搴︾殑鍦版柟锛岀劧鍚庡墿浣欏搴︼紝鎸夊搴︽瘮渚嬪垎閰�
+ * 3锛夎绠楀畬鐨勫搴︽斁鍦� colList.value 鐨� width 灞炴�т笂
+ * @param width
+ */
+const calcColWidth = (width) => {
+ // 杩斿洖鎵�鏈夋爣棰樺瓧绗︿覆
+ const maxStrList = props.data.cols.map((item, index) => {
+ if (visibleColProp.value.includes(index + '')) {
+ return item.title;
+ } else {
+ return '';
+ }
+ });
+ // 杩斿洖鎵�鏈夋爣棰樺瓧绗︿覆闀垮害
+ const maxLenList = props.data.cols.map((item, index) => {
+ if (visibleColProp.value.includes(index + '')) {
+ return item.title.gblen();
+ } else {
+ return 0;
+ }
+ });
+ // 璁＄畻姣忎竴鍒楁渶闀跨殑鏍囬瀛楃涓插拰鏍囬瀛楃涓查暱搴�
+ for (const item of props.data.values) {
+ item.map((subItem, index) => {
+ const subItemLen = subItem?.gblen();
+ if (maxLenList[index] < subItemLen) {
+ maxLenList[index] = subItemLen;
+ maxStrList[index] = subItem;
+ }
+ });
+ }
+ // 鎬诲
+ let sumWidth = 0;
+ // 璁＄畻鎵�鏈夊垪瀹為檯鍒楀
+ let maxWidthList = maxStrList.map((item, index) => {
+ // 涓嶅彲瑙佸垪瀹藉害涓� 0
+ const width = !visibleColProp.value.includes(index + '')
+ ? 0
+ : getTextWidth(item, {
+ size: '0.875rem',
+ }) + measureWidthOffset;
+ sumWidth += width;
+ return {
+ index,
+ maxWidth: width,
+ };
+ });
+ // 鎬诲灏忎簬瀹瑰櫒瀹藉害
+ if (sumWidth <= width) {
+ // 鎸夋瘮渚嬪垎閰嶅搴�
+ maxWidthList = maxWidthList.map((item) => ({
+ ...item,
+ width: (item.maxWidth / sumWidth) * width,
+ }));
+ // 鍏堟弧瓒冲皬鐨勶紝鍓╀綑绌洪棿鎸夋瘮渚嬪潎鍒�
+ } else {
+ // 褰撳墠宸叉弧瓒冲搴�
+ let curWidth = 0;
+ // 鎺掑ソ搴忕殑瀹藉害鍒楄〃
+ const sortedWidthList = _.sortBy(maxWidthList, 'maxWidth');
+ // 鍓╀綑瀹藉害
+ let restWidth = width;
+ let notFitStartIndex = 1;
+ for (let index = 0; index < sortedWidthList.length; index++) {
+ const item = sortedWidthList[index];
+ // 鍔犱笂褰撳墠瀹藉害
+ curWidth += item.maxWidth;
+ // 娌″崰婊″鍣紝鎴栨槸鏈�灏忕殑閭ｄ釜锛岀洿鎺ュ彇瀹冪殑鏈�澶у搴�
+ if (curWidth <= width || index === 0) {
+ maxWidthList[item.index].width = item.maxWidth;
+ continue;
+ }
+ // 鍔犱笂褰撳墠瀹藉害瓒呭嚭褰撳墠瀹瑰櫒锛屽氨涓嶅姞锛岃绠椾笉鍔犳椂鐨勫墿浣欏搴�
+ restWidth = width - (curWidth - item.maxWidth);
+ // 褰撳姞涓� index 绱㈠紩澶勭殑瀹藉害鏃讹紝姝ｅソ瀹藉害瓒呭嚭瀹瑰櫒
+ notFitStartIndex = index;
+ break;
+ }
+ // 鍓╀綑瀹藉害
+ let sumRestMaxWidth = 0;
+ // 鍓╀綑鍔犱笂浼氳秴鍑哄鍣ㄥ搴︾殑绱㈠紩
+ const notFitIndexList = sortedWidthList.slice(notFitStartIndex).map((item) => {
+ sumRestMaxWidth += item.maxWidth;
+ return item.index;
+ });
+
+ // 鎸� maxWidth 姣斾緥鍒嗛厤鍓╀綑绌洪棿
+ for (const item of notFitIndexList) {
+ maxWidthList[item].width = restWidth * (maxWidthList[item].maxWidth / sumRestMaxWidth);
+ // if (maxWidthList[item].maxWidth <= restWidth) {
+ // maxWidthList[item].width = restWidth;
+ // }
+ }
+ }
+ colList.value.map((item, index) => {
+ item.width = maxWidthList[index].width;
+ });
};
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;
+ if (props.data?.cols?.length > 0) {
+ cellRowSpanMap.clear();
+ props.data.values = buildGroupData(props.data.values);
+ calcColWidth(width);
+ nextTick(() => {
+ calcPagerHeight();
});
-
- // 閲嶆柊鎺掑竷涓�涓嬩綅缃紝淇濊瘉 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) {
- item.map((subItem, index) => {
- const subItemLen = subItem?.gblen();
- if (maxLenList[index] < subItemLen) {
- maxLenList[index] = subItemLen;
- maxStrList[index] = subItem;
- }
- });
- }
- // 鎬诲
- let sumWidth = 0;
- let maxWidthList = maxStrList.map((item, index) => {
- const width =
- getTextWidth(item, {
- size: '0.875rem',
- }) + measureWidthOffset;
- sumWidth += width;
- return {
- index,
- maxWidth: width,
- };
- });
- if (sumWidth <= width) {
- maxWidthList = maxWidthList.map((item) => ({
- ...item,
- width: (item.maxWidth / sumWidth) * width,
- }));
- // 鍏堟弧瓒冲皬鐨勶紝鍓╀綑绌洪棿鎸夋瘮渚嬪潎鍒�
- } else {
- let curWidth = 0;
- const sortedWidthList = _.sortBy(maxWidthList, 'maxWidth');
- let restWidth = width;
- let notFitStartIndex = 1;
- for (let index = 0; index < sortedWidthList.length; index++) {
- const item = sortedWidthList[index];
- curWidth += item.maxWidth;
- if (curWidth < width || index === 0) {
- maxWidthList[item.index].width = item.maxWidth;
- continue;
- }
- restWidth = width - (curWidth - item.maxWidth);
- notFitStartIndex = index;
- break;
- }
- let sumRestMaxWidth = 0;
- const notFitIndexList = sortedWidthList.slice(notFitStartIndex).map((item) => {
- sumRestMaxWidth += item.maxWidth;
- return item.index;
- });
-
- // 骞冲潎鍒嗛厤鍓╀綑绌洪棿
- for (const item of notFitIndexList) {
- maxWidthList[item].width = restWidth * (maxWidthList[item].maxWidth / sumRestMaxWidth);
- if (maxWidthList[item].maxWidth <= restWidth) {
- maxWidthList[item].width = restWidth;
- }
-
- // maxWidthList[item].width = undefined;
- }
- }
- colList.value = props.data.cols.map((item, index) => ({
- ...item,
- width: maxWidthList[index].width,
- }));
- } else {
- colList.value = [];
}
- tableRef.value.doLayout();
+
+ setTimeout(() => {
+ tableRef.value?.doLayout();
+ }, 300);
};
const resizeHandler = debounce(resizeEvent);
//#region ====================== 鏍峰紡 ======================
const tableCellStyle = ({ row, rowIndex, column, columnIndex }): CSSProperties => {
- const extraStyle =
- columnIndex === 0
- ? {
- borderLeft: `${THICK_BORDER_WIDTH}px solid ${BORDER_COLOR}`,
- }
- : {};
- if (columnIndex === 0) {
- }
+ const extraStyle = {
+ ...(columnIndex === 0 ? { borderLeft: `${THICK_BORDER_WIDTH}px solid ${BORDER_COLOR}` } : {}),
+ };
+
return {
textAlign: 'center',
borderColor: BORDER_COLOR,
@@ -184,12 +355,12 @@
};
const tableHeaderCellStyle = ({ row, rowIndex, column, columnIndex }): CSSProperties => {
- const extraStyle =
- columnIndex === 0
- ? {
- borderLeft: `${THICK_BORDER_WIDTH}px solid ${BORDER_COLOR}`,
- }
- : {};
+ const extraStyle = {
+ ...(columnIndex === 0 ? { borderLeft: `${THICK_BORDER_WIDTH}px solid ${BORDER_COLOR}` } : {}),
+ ...(rowIndex === 0
+ ? { borderTop: `${THICK_BORDER_WIDTH}px solid ${BORDER_COLOR}`, backgroundColor: '#8db4e2', fontSize: '1rem' }
+ : {}),
+ };
return {
textAlign: 'center',
@@ -203,15 +374,237 @@
};
}; //#endregion
+//#region ====================== 鍒嗛〉 ======================
+const pager = reactive({
+ index: 1,
+ size: 10,
+ total: props.data?.values?.length ?? 0,
+});
+
+const calcCellHeight = (count, cellHeight) => {
+ return count * cellHeight + count * THICK_BORDER_WIDTH;
+};
+
+/**
+ * 璁＄畻鍒嗛〉琛ㄦ牸瀹藉害
+ */
+const calcPagerHeight = () => {
+ // 琛ㄦ牸鍐呭鍗曞厓鏍奸珮搴�
+ const cellHeight = tableRef.value.$el.querySelector('.el-table__body .el-table__cell[rowspan="1"]')?.clientHeight ?? 39;
+ const headerHeight = tableRef.value.$el.querySelector('.el-table__header-wrapper').clientHeight;
+
+ // 闄愬埗楂樺害
+ const limitHeight =props.tableLimitHeight ??containerRef.value.clientHeight;
+
+ // 姹� size
+ // size*cellHeight + size*THICK_BORDER_WIDTH + headerHeight <= limitHeight;
+ // size <= (limitHeight - headerHeight)/(cellHeight+THICK_BORDER_WIDTH);
+
+ // 涓�椤垫湁 pager.size锛屾潯璁板綍
+ pager.size = Math.floor((limitHeight - headerHeight) / (cellHeight + THICK_BORDER_WIDTH));
+ const currentHeight = calcCellHeight(pager.size, cellHeight) + headerHeight;
+
+ tableHeight.value = currentHeight;
+
+ tableRef.value.doLayout();
+
+ // pager.index = 1;
+ chunkTableData.value = _.chunk(props.data.values ?? [], pager.size);
+};
+
+//#endregion
+
+const reloadTable = () => {
+ // 閲嶆柊璁＄畻瀹藉害
+
+ resizeEvent({ width: containerRef.value.clientWidth, height: containerRef.value.clientHeight });
+};
+const colFilterChange = () => {
+ // 閲嶆柊璁＄畻瀹藉害
+ reloadTable();
+};
+
+const tableHeight = ref(0.7 * document.body.clientHeight);
+//#region ====================== ======================
+const infoDetailIsShow = ref(false);
+const detailMapRow = ref(null);
+
+// 鏄惁宸茬粡鏄剧ず鎵�鏈夊垪浜�
+const haveShowAll = computed(() => visibleColProp.value.length === colList.value.length);
+const recordSelectChange = (row) => {
+ if (haveShowAll.value) return;
+ detailMapRow.value = row;
+ infoDetailIsShow.value = true;
+};
+//#endregion
onMounted(() => {
resizeEvent({
width: containerRef.value.clientWidth,
height: 0.7 * document.body.clientHeight,
});
});
+
+//#region ====================== 琛ㄦ牸杩囨护鍙傛暟 ======================
+
+const queryLoading = ref(false);
+const queryUpdate = async (val: any, item: any) => {
+ const historyId = (props as any).originData.historyId;
+ const curAgentKey = props.data.agent_key;
+ let res = null;
+
+ // 鏀瑰彉鍘熷鍊�
+ if (item.type === RecordSetTableType.StringInput) {
+ item.origin.value = val;
+ }
+ try {
+ // 鐩稿悓 agent_key 涓嬫墍鏈� filter 璇锋眰鍙傛暟
+ const filterList = ((props as any).originData?.content?.origin?.summary ?? []).reduce((preVal, curVal) => {
+ if (curVal.agent_key !== curAgentKey) return preVal;
+
+ const filter = (curVal.filter ?? []).reduce((subPreVal, subCurVal) => {
+ if (subCurVal.type === RecordSetTableType.StringInput) {
+ subPreVal.push({
+ update: subCurVal.update,
+ value: subCurVal.value,
+ path: subCurVal.path,
+ });
+ }
+
+ return subPreVal;
+ }, []);
+
+ preVal = preVal.concat(filter);
+
+ return preVal;
+ }, []);
+ const params = {
+ history_id: historyId,
+ // 鏌ヨ鍓嶅悗 agent_key 涓嶄細鍙�
+ agent_key: props.data.agent_key,
+ filter_json: JSON.stringify(filterList),
+ };
+ res = await curveQuery(params);
+ queryLoading.value = true;
+ } finally {
+ queryLoading.value = false;
+ }
+
+ emits('updateQuery', res);
+};
+
+const debounceQueryUpdate = debounce(queryUpdate, 600);
+
+const handleQueryChange = async (val: any, item: any) => {
+ if (item.type === RecordSetTableType.StringInput) {
+ debounceQueryUpdate(val, item);
+ }
+
+ // queryUpdate(val,item)
+
+ return;
+};
+
+//#endregion
+
+const getVisibleParams = (data) => {
+ // const visibleList = props.data?.params?.filter((item) => !item?.hide) ?? [];
+ // index 浣滀负 id
+ const visibleList = (data?.filter ?? []).map((item, index) => {
+ // 涓嶄慨鏀瑰師濮嬪湴鍧�
+ item.id = index + '';
+
+ return item;
+ });
+ const newList: any[] = [];
+ for (let index = 0; index < visibleList.length; index++) {
+ const current = visibleList[index];
+ switch (current.type) {
+ case RecordSetTableType.StringInput:
+ newList.push({
+ id: current.id,
+ type: RecordSetTableType.StringInput,
+ origin: current,
+ value: current?.value ?? '',
+ title: current.title,
+ });
+ break;
+
+ default:
+ break;
+ }
+ Reflect.deleteProperty(current, 'id');
+ }
+
+ return newList;
+};
+const visibleParams = ref(getVisibleParams(props.data));
+
+const updateFilterValue = (data) => {
+ const filter = data?.filter ?? [];
+
+ filter.map((newItem, index) => {
+ const currentItem = visibleParams.value.find((item) => item.id === index + '');
+
+ if (currentItem) {
+ if (newItem.type === RecordSetTableType.StringInput) {
+ currentItem.value = newItem.value;
+ }
+ }
+ });
+};
+
+const resetPager = (data) => {
+ pager.index = 1;
+ pager.total = data?.values?.length ?? 0;
+};
+const updateCurrent = (res) => {
+ const title = res?.title;
+ const values = res?.values ?? [];
+ props.data.title = title;
+ props.data.values = values;
+ // 涓嶆洿鏂帮紝鍚庣鍘嬫牴娌¤繑鍥�
+ // updateFilterValue(res);
+ resetPager(res);
+
+ reloadTable();
+};
+// 鏌ヨ
+const updateAll = (triggerIndex, res) => {
+ // 褰撳墠 agent_key
+ const curAgentKey = props.data.agent_key;
+ const triggerAgentKey = (props as any).originData?.content?.origin?.summary?.[triggerIndex]?.agent_key;
+ if (curAgentKey !== triggerAgentKey) {
+ return;
+ }
+ if (!curAgentKey) {
+ return;
+ }
+
+ // 褰撳墠椤规墍鍦ㄧ储寮�
+ let currentIndex = -1;
+ for (let index = 0; index < (props as any).originData.content.origin.summary.length; index++) {
+ const item = (props as any).originData.content.origin.summary[index];
+ if (item.agent_key === curAgentKey) {
+ currentIndex++;
+ if (index === props.summaryIndex) {
+ break;
+ }
+ }
+ }
+ // 琛ㄦ牸 summary 鍙兘鏁翠釜杩斿洖涓虹┖锛屼负绌烘椂锛寁alues 璁剧疆涓虹┖
+ const newSummary = res?.summary?.[currentIndex] ?? {
+ title: props.data.title,
+ values: [],
+ };
+
+ updateCurrent(newSummary);
+};
+
+defineExpose({
+ updateAll,
+});
</script>
<style scoped lang="scss">
-
// :deep(.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell){
// background-color: v-bind(stripedBgColor);
// }
--
Gitblit v1.9.3