From 0bb7dffa90bfa3bd5ad04b75da9c31d21347c668 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期一, 13 一月 2025 17:06:02 +0800
Subject: [PATCH] 用户管理页面调整
---
src/views/project/yw/systemManage/metricAgentMgr/MetricAgentMgr.vue | 447 ++++++++++++++++++++++++++-----------------------------
1 files changed, 213 insertions(+), 234 deletions(-)
diff --git a/src/views/project/yw/systemManage/metricAgentMgr/MetricAgentMgr.vue b/src/views/project/yw/systemManage/metricAgentMgr/MetricAgentMgr.vue
index 24f3e17..896a93d 100644
--- a/src/views/project/yw/systemManage/metricAgentMgr/MetricAgentMgr.vue
+++ b/src/views/project/yw/systemManage/metricAgentMgr/MetricAgentMgr.vue
@@ -1,264 +1,233 @@
<template>
- <HMContainer type="card">
+ <AHMContainer type="card">
+ <template #aside>
+ <!-- 鐩綍鏍� -->
+ <LeftTreeByMgr
+ v-loading="treeLoading"
+ class="h100"
+ ref="leftTreeRef"
+ :defaultProps="{
+ id: 'group_id',
+ label: 'group_name',
+ children: 'children',
+ }"
+ defaultExpandAll
+ :treedata="listTreeData"
+ title-name="鍦烘櫙鍒楄〃"
+ :show-more-operate="false"
+ :show-add="false"
+ :current-node-key="currentListID"
+ :node-icon="() => 'ele-Document'"
+ @click="handleClickNode"
+ >
+ </LeftTreeByMgr>
+ </template>
<template #header>
- <el-form ref="queryFormRef" :inline="true" :model="queryParams">
+ <el-form ref="queryFormRef" :inline="true" :model="queryParams" class="relative">
<el-form-item label="鏍囬" prop="title">
- <el-input v-model="queryParams.title" style="width: 226.4px" placeholder="鏍囬" clearable />
+ <el-input
+ v-model="queryParams.title"
+ style="width: 226.4px"
+ placeholder="鏍囬"
+ clearable
+ @input="() => terminologyQuery()"
+ />
</el-form-item>
-
<el-form-item>
- <el-button type="primary" icon="ele-Search" @click="handleQueryTable"> 鏌ヨ </el-button>
<el-button icon="ele-Refresh" @click="resetQuery">閲嶇疆 </el-button>
- <!-- <el-button icon="ele-Plus" @click="openOptDlg()"> 娣诲姞 </el-button> -->
</el-form-item>
</el-form>
</template>
<template #main>
- <div class="h-full" ref="chatDragContainerRef">
- <el-table
- v-loading="tableLoading"
- ref="draggableTableRef"
- class="h100"
- border
- :row-class-name="isDragStatus ? 'cursor-move' : 'cursor-pointer'"
- :data="displayTableData"
- highlight-current-row
- >
- <el-table-column type="expand" fixed="left">
- <template #default="scope">
- <div class="ml-16">
- <h3>鎸囨爣椤甸潰</h3>
- <div v-if="scope.row.supervisor">
- <div class="py-3">
- 椤甸潰鎻愮ず璇嶏細<span class="">{{ scope.row.supervisor.prompt }}</span>
- </div>
- <el-table class="w-2/3" :data="scope.row.supervisor.args" border>
- <el-table-column prop="name" label="鍚嶇О" show-overflow-tooltip> </el-table-column>
- <el-table-column prop="prompt" label="鍙傛暟鎻愮ず璇�" show-overflow-tooltip> </el-table-column>
- <el-table-column prop="check" label="缂虹渷鍊�" show-overflow-tooltip> </el-table-column>
- </el-table>
+ <div class="w100 h100">
+ <div class="h-full">
+ <el-table
+ v-loading="tableLoading"
+ ref="draggableTableRef"
+ class="h100"
+ border
+ :row-class-name="isDragStatus ? 'cursor-move' : 'cursor-pointer'"
+ :data="displayTableData"
+ highlight-current-row
+ >
+ <el-table-column type="index" label="搴忓彿" width="55" fixed="left" align="center"></el-table-column>
+
+ <el-table-column prop="title" label="鍚嶇О" width="300" fixed="left" show-overflow-tooltip> </el-table-column>
+ <el-table-column label="璋冪敤鏂瑰紡" prop="inner_call" width="100" show-overflow-tooltip>
+ <template #default="scope">
+ {{ scope.row.inner_call === 'Y' ? '鍐呴儴' : '澶栭儴' }}
+ </template>
+ </el-table-column>
+
+ <el-table-column label="鍒涘缓浜�" prop="create_user" width="100" show-overflow-tooltip> </el-table-column>
+ <el-table-column label="鍒涘缓鏃堕棿" prop="create_time" width="105" show-overflow-tooltip> </el-table-column>
+ <el-table-column label="鍙戝竷鐘舵��" prop="published" width="85" show-overflow-tooltip>
+ <template #default="scope">
+ <el-tag :type="scope.row.published === SupervisorPublished.Y ? 'primary' : 'info'">{{
+ supervisorPublishedMap[scope.row.published]
+ }}</el-tag>
+ </template>
+ </el-table-column>
+
+ <el-table-column label="澶囨敞" prop="note" show-overflow-tooltip> </el-table-column>
+ <el-table-column label="鎿嶄綔" width="200" fixed="right" show-overflow-tooltip>
+ <template #default="scope">
+ <div class="space-x-3 items-center flex">
+ <el-tooltip effect="dark" content="鏌ョ湅鎻愮ず璇�" placement="top">
+ <i class="ywifont ywicon-tishici !text-[21px] text-blue-400 cursor-pointer" @click="openCopyPrompt(scope.row)"></i>
+ </el-tooltip>
+ <el-tooltip effect="dark" content="鏌ョ湅鎸囨爣鍚嶇О" placement="top">
+ <i
+ class="ywifont ywicon-zhibiao !text-[17px] text-blue-400 cursor-pointer"
+ @click="openMetricNameDlg(scope.row)"
+ ></i>
+ </el-tooltip>
+ <el-tooltip effect="dark" content="鎸囨爣鍥捐氨" placement="top">
+ <i
+ class="ywifont ywicon-duoweidu !text-[17px] text-blue-400 cursor-pointer"
+ @click="gotoAgentGraph(scope.row)"
+ ></i>
+ </el-tooltip>
+ <el-tooltip effect="dark" content="瀵硅瘽娴嬭瘯" placement="top">
+ <i class="ywifont ywicon-ceshi !text-[20px] text-blue-400 cursor-pointer" @click="openChatTest(scope.row)"></i>
+ </el-tooltip>
</div>
+ </template>
+ </el-table-column>
+ </el-table>
+ <div
+ v-if="chatTestIsShow"
+ ref="draggableChatRef"
+ :style="style"
+ class="fixed z-50 w-[700px] h-[800px] flex flex-col bg-[rgb(239,244,253)] right-0 bottom-0 rounded-lg"
+ >
+ <div ref="chatDragHandlerRef" class="flex-0">
+ <div class="flex items-center justify-between py-2 px-4">
+ <div class="font-bold cursor-move">
+ WI姘村姟鏅鸿兘绠″鈥斺�斻�恵{ chatTestMapRow?.title }}銆戞祴璇�
+ <!-- <img src="/static/images/logo/logo-mini.svg" width="10" height="10" /> -->
+ </div>
+ <i class="ywifont ywicon-guanbi font-[10px] font-bold cursor-pointer" @click="closeChatTest"></i>
</div>
- </template>
- </el-table-column>
- <el-table-column prop="agent_group" label="鍒嗙粍" width="100" fixed="left" show-overflow-tooltip> </el-table-column>
-
- <el-table-column prop="title" label="鍚嶇О" width="300" fixed="left" show-overflow-tooltip> </el-table-column>
-
- <el-table-column label="鍒涘缓浜�" prop="creator" width="100" show-overflow-tooltip> </el-table-column>
- <el-table-column label="鍒涘缓鏃堕棿" prop="create_time" width="105" show-overflow-tooltip> </el-table-column>
-
- <el-table-column label="鍙戝竷鐘舵��" prop="published" width="85" show-overflow-tooltip>
- <template #default="scope">
- <el-tag :type="scope.row.published === SupervisorPublished.Y ? 'primary' : 'info'">{{
- supervisorPublishedMap[scope.row.published]
- }}</el-tag>
- </template>
- </el-table-column>
-
- <el-table-column label="澶囨敞" prop="note" show-overflow-tooltip> </el-table-column>
- <el-table-column label="鎿嶄綔" width="200" fixed="right" show-overflow-tooltip>
- <template #default="scope">
- <div class="space-x-3 items-center flex">
- <el-tooltip effect="dark" content="鏌ョ湅鎻愮ず璇�" placement="top">
- <i class="ywifont ywicon-tishici !text-[21px] text-blue-400 cursor-pointer" @click="openCopyPrompt(scope.row)"></i>
- </el-tooltip>
- <el-tooltip effect="dark" content="鏌ョ湅鎸囨爣鍚嶇О" placement="top">
- <i
- class="ywifont ywicon-zhibiao !text-[17px] text-blue-400 cursor-pointer"
- @click="openMetricNameDlg(scope.row)"
- ></i>
- </el-tooltip>
-
- <el-tooltip effect="dark" content="瀵硅瘽娴嬭瘯" placement="top">
- <i class="ywifont ywicon-ceshi !text-[20px] text-blue-400 cursor-pointer" @click="openChatTest(scope.row)"></i>
- </el-tooltip>
-
- <!-- <el-tooltip
- effect="dark"
- :content="scope.row.published === SupervisorPublished.Y ? '鍙栨秷鍙戝竷' : '鍙戝竷'"
- placement="top"
- >
- <i
- class="ywifont !text-[20px] cursor-pointer"
- :class="[
- scope.row.published === SupervisorPublished.Y ? 'ywicon-quxiaofabu text-red-400' : 'ywicon-fabu text-blue-400',
- ]"
- @click="
- publishStatusChange(
- scope.row.published === SupervisorPublished.Y ? SupervisorPublished.N : SupervisorPublished.Y,
- scope.row.id,
- scope.$index
- )
- "
- ></i>
- </el-tooltip>
- <el-tooltip effect="dark" content="缂栬緫" placement="top">
- <i class="ywifont ywicon-bianji !text-[15px] text-blue-400 cursor-pointer" @click="openOptDlg(scope.row)"></i>
- </el-tooltip>
- <el-tooltip effect="dark" content="鍒犻櫎" placement="top">
- <i
- class="ywifont ywicon-shanchu !text-[17px] text-red-400 cursor-pointer"
- @click="
- () => {
- deleteCurrentRow(scope.row, '椤甸潰', metricApi.deleteSupervisor, () => {
- const foundIndex = tableData.findIndex((item) => item === scope.row);
- foundIndex > -1 && tableData.splice(foundIndex, 1);
- });
- }
- "
- ></i>
- </el-tooltip> -->
- </div>
- </template>
- </el-table-column>
- </el-table>
- <div
- v-if="chatTestIsShow"
- ref="draggableChatRef"
- :style="style"
- class="fixed z-50 w-[700px] h-[800px] flex flex-col bg-[rgb(239,244,253)] right-0 bottom-0 rounded-lg"
- >
- <div ref="chatDragHandlerRef" class="flex-0">
- <div class="flex items-center justify-between py-2 px-4">
- <div class="font-bold cursor-move">
- WI姘村姟鏅鸿兘绠″鈥斺�斻�恵{ chatTestMapRow?.title }}銆戞祴璇�
- <!-- <img src="/static/images/logo/logo-mini.svg" width="10" height="10" /> -->
- </div>
- <i class="ywifont ywicon-guanbi font-[10px] font-bold cursor-pointer" @click="closeChatTest"></i>
</div>
+ <Chat ref="chatRef" class="flex-auto px-2" :questionApi="questionAi"> </Chat>
</div>
- <Chat ref="chatRef" class="flex-auto px-2" :questionApi="questionAi"> </Chat>
</div>
</div>
</template>
-
<!-- <OptDlg v-model="optDlgIsShow" :item="optDlgMapRow" @insert="insertOpt" @update="updateOpt" :groupId="currentListID"></OptDlg> -->
<MetricPrompt v-model="infoDlgIsShow" :metricItem="infoDlgMapRow"></MetricPrompt>
<MetricName v-model="metricNameIsShow" :metricItem="metricNameMapRow"></MetricName>
- </HMContainer>
+ </AHMContainer>
</template>
<script setup lang="ts">
import { useDraggable } from '@vueuse/core';
-
-import { onMounted, ref } from 'vue';
-import { usePageDisplay } from '/@/hooks/usePageDisplay';
-import { useQueryTable } from '/@/hooks/useQueryTable';
-// import { useTableSort } from '/@/hooks/useTableSort';
-// import { useValidateUniqueness } from '/@/hooks/useValidateUniqueness';
-import { ElMessage } from 'element-plus';
-import { nextTick } from 'vue';
-import * as metricApi from '/@/api/metrics';
-import { updatePublishStatus } from '/@/api/supervisorAdmin';
-import Chat from '/@/components/chat/Chat.vue';
-import { useCompRef } from '/@/utils/types';
-
import axios, { CancelTokenSource } from 'axios';
+import { computed, nextTick, onMounted, ref, watch } from 'vue';
import { SupervisorPublished, supervisorPublishedMap } from '../../lowCode/sqlAmis/types';
import MetricName from './optDlg/MetricName.vue';
import MetricPrompt from './optDlg/MetricPrompt.vue';
-import HMContainer from '/@/components/layout/HMContainer.vue';
-
-//#region ====================== 琛ㄦ牸鏁版嵁锛宼able init ======================
+import * as agentGroupApi from '/@/api/ai/agentGroup';
+import * as metricApi from '/@/api/metrics';
+import Chat from '/@/components/chat/Chat.vue';
+import AHMContainer from '/@/components/layout/AHMContainer.vue';
+import LeftTreeByMgr from '/@/components/tree/leftTreeByMgr.vue';
+import { useQueryTable } from '/@/hooks/useQueryTable';
+import { useSearch } from '/@/hooks/useSearch';
+import { gotoRoute } from '/@/utils/route';
+import { useCompRef } from '/@/utils/types';
+import { convertListToTree, debounce, travelTree } from '/@/utils/util';
+import { OptClassificationMap, classificationEnum } from '/@/views/types/metrics';
+//#region ====================== 宸︿晶鏍戞暟鎹紝tree init ======================
+const leftTreeRef = useCompRef(LeftTreeByMgr);
+const treeLoading = ref(false);
+const listData = ref([]);
+const currentListID = computed(() => currentNode.value?.group_id);
+const currentNode = ref(null);
+const listTreeData = computed(() => {
+ const byParentData = convertListToTree(listData.value, {
+ ID: 'group_id',
+ ParentID: 'p_group_id',
+ Children: 'children',
+ });
+ const result = [];
+ byParentData.forEach((item) => {
+ if (
+ item.group_type != OptClassificationMap[classificationEnum.Office] &&
+ item.group_type != OptClassificationMap[classificationEnum.Knowledge]
+ ) {
+ result.push(item);
+ }
+ });
+ return result;
+});
+const handleClickNode = (data) => {
+ nextTick(() => {
+ leftTreeRef.value?.treeRef.setCurrentKey(data.id);
+ });
+ currentNode.value = data;
+ getTableData();
+};
+const getListTreeData = async () => {
+ const res = await agentGroupApi.getSceneGroupTreeByPost();
+ listData.value = res.groups || [];
+ const firstListTreeNode = listTreeData.value[0];
+ if (firstListTreeNode) {
+ handleClickNode(firstListTreeNode);
+ } else {
+ tableData.value = [];
+ currentNode.value = null;
+ }
+};
+//#endregion
+//#region ====================== 鎸囨爣绠＄悊琛ㄦ牸鏁版嵁锛宼able init ======================
const tableLoading = ref(false);
const tableData = ref([]);
const isDragStatus = ref(false);
+const metricStatus = ref(false);
const allTableData = ref(null);
+const getLenById = (data: any[], id: string, value: any) => {
+ return data.filter((item) => item.agent_group === id || value.children?.some((treeItem) => treeItem.group_id === item.agent_group))
+ .length;
+};
const getTableData = async () => {
- const res = await metricApi.getMetricAgentListByPost();
- allTableData.value = (res.values || []).map((item) => {
- item.create_time = item.create_time?.slice(0, 10);
-
- return item;
- });
- tableData.value = res?.values ?? [];
+ if (!allTableData.value) {
+ const res = await metricApi.getMetricAgentListByPost();
+ allTableData.value = (res.values || []).map((item) => {
+ item.create_time = item.create_time?.slice(0, 10);
+ return item;
+ });
+ travelTree(listTreeData.value, (value, index, array, parent) => {
+ const len = getLenById(allTableData.value, value.group_id, value);
+ value.group_name = `${value.group_name} (${len})`;
+ });
+ }
+ tableData.value = allTableData.value;
};
//#endregion
-
//#region ====================== 琛ㄦ牸鏌ヨ銆佹帓搴忥紝search form init ======================
-
const queryParams = ref({
title: '',
});
-const { resetQuery, handleQueryTable, displayTableData } = useQueryTable(tableData, queryParams, () => {
- displayTableData.value = tableData.value;
+const { query: queryTerminology, queryData: showQuotaList } = useSearch(tableData, queryParams);
+const displayTableData = computed(() => {
+ const result = showQuotaList.value.filter((item) => item.agent_group == currentListID.value);
+ return result ?? [];
});
-
-//#endregion
-
-//#region ====================== 鏌ヨ蹇嵎閿� ======================
-const queryFormRef = ref(null);
-const pressEnterSearch = (ev: KeyboardEvent) => {
- if (ev.key === 'Enter') {
- handleQueryTable();
- }
-};
-usePageDisplay(
- () => {
- queryFormRef.value?.$el?.addEventListener('keypress', pressEnterSearch);
- },
- () => {
- queryFormRef.value?.$el?.removeEventListener('keypress', pressEnterSearch);
+const terminologyQuery = debounce(queryTerminology);
+watch(
+ () => queryParams.value.title,
+ (val) => {
+ terminologyQuery();
}
);
-//#endregion
-
-//#region ====================== 娣诲姞淇敼鎿嶄綔 ======================
-const optDlgIsShow = ref(false);
-const optDlgMapRow = ref(null);
-const openOptDlg = (row?: any) => {
- optDlgMapRow.value = row;
- optDlgIsShow.value = true;
-};
-
-const updateOpt = (formValue) => {
- const foundIndex = tableData.value.findIndex((item) => item.id === formValue.id);
- if (foundIndex > -1) {
- tableData.value[foundIndex] = {
- ...tableData.value[foundIndex],
- ...formValue,
- };
- }
-};
-
-const insertOpt = (newData) => {
- tableData.value.unshift({ ...newData, published: SupervisorPublished.N });
-};
-//#endregion
-
-const updatePublishedById = (id: string, published: SupervisorPublished) => {
- const row = tableData.value.find((item) => item.id === id);
- if (row) {
- row.published = published;
- }
-};
-//#region ====================== 鏀瑰彉鍙戝竷鐘舵�� ======================
-const publishStatusChange = async (published: SupervisorPublished, id, index) => {
- const res = await updatePublishStatus(
- {
- id: id,
- publish: published,
- },
- {
- loading: false,
- }
- );
- const origin = published === SupervisorPublished.Y ? SupervisorPublished.N : SupervisorPublished.Y;
- const final = res.publish ?? origin;
- if (final === origin) {
- ElMessage.warning('鎿嶄綔澶辫触' + (res.fail_msg ? `锛�${res.fail_msg}` : ''));
- return;
- }
-
- tableData.value[index].published = final;
-
- published === SupervisorPublished.Y ? ElMessage.success('鍙戝竷鎴愬姛') : ElMessage.info('宸插彇娑堝彂甯�');
-};
+const { resetQuery } = useQueryTable(tableData, queryParams, () => {
+ showQuotaList.value = tableData.value;
+});
//#endregion
//#region ====================== Chat 娴嬭瘯 ======================
-
const chatRef = useCompRef(Chat);
const chatTestMapRow = ref(null);
const chatTestIsShow = ref(false);
@@ -267,9 +236,6 @@
chatTestIsShow.value = true;
nextTick(() => {
chatRef.value.clear();
- // setTimeout(() => {
- // chatRef.value.autoSend(row.title);
- // }, 30);
});
};
@@ -277,12 +243,8 @@
chatTestMapRow.value = null;
chatTestIsShow.value = false;
};
-
const draggableChatRef = ref<HTMLElement | null>(null);
const chatDragHandlerRef = ref<HTMLDivElement>(null);
-const chatDragContainerRef = ref<HTMLDivElement>(null);
-
-// `style` will be a helper computed for `left: ?px; top: ?px;`
const { x, y, style } = useDraggable(draggableChatRef, {
handle: chatDragHandlerRef,
initialValue: {
@@ -307,15 +269,6 @@
return res;
};
//#endregion
-
-//#region ====================== 鏇存柊鍙戝竷鐘舵�� ======================
-// useUpdateData({
-// event: 'supervisor.publish',
-// updateFun({ id, published }) {
-// updatePublishedById(id, published);
-// },
-// });
-//#endregion
//#region ====================== prompt鏌ョ湅 ======================
const infoDlgIsShow = ref(false);
const infoDlgMapRow = ref([]);
@@ -331,9 +284,35 @@
metricNameMapRow.value = row;
metricNameIsShow.value = true;
};
+
+const gotoAgentGraph = (row) => {
+ gotoRoute({
+ name: 'AgentGraph',
+ query: {
+ id: row.id,
+ },
+ });
+};
//#endregion
+
onMounted(() => {
- getTableData();
+ getListTreeData();
});
</script>
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+.set-permission {
+ padding-block: 16px;
+ padding-block-end: 0;
+}
+.set-form {
+ display: block;
+ box-sizing: border-box;
+ height: 100%;
+ padding-block: 16px;
+ .set-form-item {
+ font-weight: 500;
+ color: #667085;
+ font-size: 14px;
+ }
+}
+</style>
--
Gitblit v1.9.3