<template>
|
<AHMContainer type="card">
|
<template #aside>
|
<!-- 目录树 -->
|
<LeftTreeByMgr
|
v-loading="treeLoading"
|
class="h100"
|
ref="leftTreeRef"
|
:defaultProps="{
|
id: 'id',
|
label: '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" class="relative">
|
<el-form-item label="问题" prop="title">
|
<el-input
|
v-model="queryParams.question"
|
style="width: 226.4px"
|
placeholder="问题"
|
clearable
|
@input="debounceQueryTable"
|
/>
|
</el-form-item>
|
<el-form-item>
|
<el-button icon="ele-Refresh" @click="resetQuery">重置 </el-button>
|
</el-form-item>
|
</el-form>
|
</template>
|
<template #main>
|
<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="question" label="问题" fixed="left" show-overflow-tooltip> </el-table-column>
|
<el-table-column prop="replace" label="替换词" show-overflow-tooltip> </el-table-column>
|
<el-table-column prop="order" label="排序" width="100" show-overflow-tooltip> </el-table-column>
|
<el-table-column prop="state" label="状态" width="100" show-overflow-tooltip>
|
<template #default="scope">
|
{{ scope.row.state === 'Y' ? '启用' : '禁用' }}
|
</template>
|
</el-table-column>
|
<!-- <el-table-column prop="group" label="分组" width="100" show-overflow-tooltip> </el-table-column> -->
|
<el-table-column prop="create_time" label="创建时间" width="180" 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-bianji !text-[21px] text-blue-400 cursor-pointer"></i>
|
</el-tooltip>
|
<el-tooltip effect="dark" content="删除" placement="top">
|
<i class="ywifont ywicon-shanchu !text-[17px] text-red-400 cursor-pointer"></i>
|
</el-tooltip>
|
</div>
|
</template>
|
</el-table-column> -->
|
</el-table>
|
</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> -->
|
</AHMContainer>
|
</template>
|
|
<script setup lang="ts">
|
import { useDraggable } from '@vueuse/core';
|
import type { CancelTokenSource } from 'axios';
|
import axios 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 * as agentGroupApi from '/@/api/ai/agentGroup';
|
import * as metricApi from '/@/api/metrics';
|
import * as systemApi from '/@/api/admin/system';
|
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';
|
import { groupBy } from 'lodash';
|
//#region ====================== 左侧树数据，tree init ======================
|
const leftTreeRef = useCompRef(LeftTreeByMgr);
|
const treeLoading = ref(false);
|
const currentListID = computed(() => currentNode.value?.id);
|
const currentNode = ref(null);
|
|
const handleClickNode = (data) => {
|
nextTick(() => {
|
leftTreeRef.value?.treeRef.setCurrentKey(data.id);
|
});
|
currentNode.value = data;
|
getTableData();
|
};
|
const groupValues = ref({});
|
const listTreeData = computed(() => {
|
return Object.keys(groupValues.value).map((key) => {
|
return {
|
id: key,
|
name: groupValues.value[key]?.length ? `${key} (${groupValues.value[key]?.length ?? 0})` : key,
|
};
|
});
|
});
|
const getListTreeData = async () => {
|
const res = await systemApi.GetQuestionReplaceList();
|
groupValues.value = groupBy(res.values, 'group');
|
|
const firstListTreeNode = listTreeData.value[0];
|
if (firstListTreeNode) {
|
handleClickNode(firstListTreeNode);
|
} else {
|
tableData.value = [];
|
currentNode.value = null;
|
}
|
};
|
//#endregion
|
//#region ====================== 指标管理表格数据，table init ======================
|
const tableLoading = ref(false);
|
const tableData = ref([]);
|
const isDragStatus = ref(false);
|
|
const getTableData = async () => {
|
tableData.value = groupValues.value[currentListID.value] || [];
|
};
|
//#endregion
|
//#region ====================== 表格查询、排序，search form init ======================
|
const queryParams = ref({
|
question: '',
|
});
|
const { resetQuery, handleQueryTable, displayTableData } = useQueryTable(tableData, queryParams, () => {
|
displayTableData.value = tableData.value;
|
});
|
const debounceQueryTable = debounce(handleQueryTable, 400);
|
|
//#endregion
|
|
//#region ====================== prompt查看 ======================
|
const infoDlgIsShow = ref(false);
|
const infoDlgMapRow = ref([]);
|
const openCopyPrompt = (row) => {
|
infoDlgMapRow.value = row;
|
infoDlgIsShow.value = true;
|
};
|
//#endregion
|
//#region ====================== 指标名称列表查看 ======================
|
const metricNameIsShow = ref(false);
|
const metricNameMapRow = ref([]);
|
const openMetricNameDlg = (row) => {
|
metricNameMapRow.value = row;
|
metricNameIsShow.value = true;
|
};
|
|
const gotoAgentGraph = (row) => {
|
gotoRoute({
|
name: 'AgentGraph',
|
query: {
|
id: row.id,
|
},
|
});
|
};
|
//#endregion
|
|
onMounted(() => {
|
getListTreeData();
|
});
|
</script>
|
<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>
|
