From 9a05763e64ebded4e10e26b821ca5c431e890137 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期四, 17 十月 2024 16:29:43 +0800
Subject: [PATCH] 表格查询
---
src/components/chat/chatComponents/summaryCom/components/recordSetTable/components/StringInput.vue | 24 ++++
src/components/chat/chatComponents/summaryCom/components/recordSetTable/types.ts | 8 +
vite.config.ts | 2
src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue | 203 +++++++++++++++++++++++++++++++++++++++-
src/components/table/colFilter/ColFilter.vue | 2
src/theme/app.scss | 10 ++
6 files changed, 242 insertions(+), 7 deletions(-)
diff --git a/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue b/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue
index 8911e4d..6aa4fa2 100644
--- a/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue
+++ b/src/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue
@@ -3,10 +3,25 @@
<div>
<!-- <span v-if="data?.title" class="text-base font-bold flex-center mb-5">{{ data?.title }}</span> -->
<div class="w-full flex-column">
- <div class="flex-0 flex">
+ <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">
+ <div class="flex-auto" ref="containerRef" v-resize="resizeHandler" v-loading="queryLoading">
<el-table
ref="tableRef"
:maxHeight="tableHeight"
@@ -85,14 +100,27 @@
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,
},
});
const [DefineColumns, ReuseColumns] = createReusableTemplate<{
cols: any[];
+}>();
+const emits = defineEmits<{
+ (event: 'updateQuery', res: any): void;
}>();
const colList = ref([]);
@@ -161,6 +189,7 @@
* @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) {
@@ -294,7 +323,7 @@
return;
}
- if (props.data?.cols?.length > 0 && props.data?.values?.length > 0) {
+ if (props.data?.cols?.length > 0 ) {
cellRowSpanMap.clear();
props.data.values = buildGroupData(props.data.values);
calcColWidth(width);
@@ -373,7 +402,6 @@
// 涓�椤垫湁 pager.size锛屾潯璁板綍
pager.size = Math.floor((limitHeight - headerHeight) / (cellHeight + THICK_BORDER_WIDTH));
-
const currentHeight = calcCellHeight(pager.size, cellHeight) + headerHeight;
tableHeight.value = currentHeight;
@@ -386,9 +414,14 @@
//#endregion
+const reloadTable = () => {
+ // 閲嶆柊璁＄畻瀹藉害
+
+ resizeEvent({ width: containerRef.value.clientWidth, height: containerRef.value.clientHeight });
+};
const colFilterChange = () => {
// 閲嶆柊璁＄畻瀹藉害
- resizeEvent({ width: containerRef.value.clientWidth, height: containerRef.value.clientHeight });
+ reloadTable();
};
const tableHeight = ref(0.7 * document.body.clientHeight);
@@ -411,6 +444,166 @@
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){
diff --git a/src/components/chat/chatComponents/summaryCom/components/recordSetTable/components/StringInput.vue b/src/components/chat/chatComponents/summaryCom/components/recordSetTable/components/StringInput.vue
new file mode 100644
index 0000000..b9dbe39
--- /dev/null
+++ b/src/components/chat/chatComponents/summaryCom/components/recordSetTable/components/StringInput.vue
@@ -0,0 +1,24 @@
+<template>
+ <div class="flex-items-center">
+ <span class="flex-0 mr-2" v-if="data?.title">{{ data?.title }}</span>
+ <el-input v-model="modelValue" @input="stringInputInput"></el-input>
+ </div>
+</template>
+
+<script setup lang="ts">
+
+defineOptions({
+ inheritAttrs:true
+})
+
+const emit = defineEmits(['change'])
+const props = defineProps(['data'])
+const modelValue = defineModel({
+ type:String,
+ default:''
+})
+const stringInputInput = (val) => {
+ emit('change',val)
+};
+</script>
+<style scoped lang="scss"></style>
diff --git a/src/components/chat/chatComponents/summaryCom/components/recordSetTable/types.ts b/src/components/chat/chatComponents/summaryCom/components/recordSetTable/types.ts
new file mode 100644
index 0000000..591b063
--- /dev/null
+++ b/src/components/chat/chatComponents/summaryCom/components/recordSetTable/types.ts
@@ -0,0 +1,8 @@
+import StringInput from './components/StringInput.vue'
+
+export const enum RecordSetTableType {
+ StringInput = 'string',
+}
+export const recordSetTableMap = {
+ [RecordSetTableType.StringInput]: StringInput,
+};
diff --git a/src/components/table/colFilter/ColFilter.vue b/src/components/table/colFilter/ColFilter.vue
index 5e48872..315b1ac 100644
--- a/src/components/table/colFilter/ColFilter.vue
+++ b/src/components/table/colFilter/ColFilter.vue
@@ -2,7 +2,7 @@
<el-dropdown trigger="click" placement="bottom-end" :hideOnClick="false">
<span
title="鐐瑰嚮閫夋嫨鏄剧ず鍒�"
- class="rounded-full p-1.5 border-[1.5px] hover:text-blue-400 border-gray-200 border-solid cursor-pointer ywifont ywicon-grid !text-[13px] mb-3"
+ class="rounded-full p-1.5 border-[1.5px] hover:text-blue-400 border-gray-200 border-solid cursor-pointer ywifont ywicon-grid !text-[13px] h-fit"
></span>
<template #dropdown>
diff --git a/src/theme/app.scss b/src/theme/app.scss
index 1bf6434..d31562b 100644
--- a/src/theme/app.scss
+++ b/src/theme/app.scss
@@ -253,6 +253,16 @@
justify-content: space-around;
}
+
+.flex-items-center {
+ display: flex;
+ align-items: center;
+}
+
+.flex-justify-center {
+ display: flex;
+ justify-content: center;
+}
.flex-start {
@extend .flex;
justify-content: start;
diff --git a/vite.config.ts b/vite.config.ts
index 3cdb41a..e9c23f4 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -35,7 +35,7 @@
host: '0.0.0.0',
port: env.VITE_PORT as unknown as number,
open: JSON.parse(env.VITE_OPEN),
- hmr: false,
+ hmr: true,
},
build: {
// outDir: 'dist/' + mode.mode,
--
Gitblit v1.9.3