| | |
| | | <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', |
| | | }" |
| | | :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-item label="标题" prop="title"> |
| | |
| | | </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> |
| | | |
| | |
| | | <!-- <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 { computed, onMounted, ref } from 'vue'; |
| | | import { usePageDisplay } from '/@/hooks/usePageDisplay'; |
| | | import { useQueryTable } from '/@/hooks/useQueryTable'; |
| | | // import { useTableSort } from '/@/hooks/useTableSort'; |
| | |
| | | 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'; |
| | | import AHMContainer from '/@/components/layout/AHMContainer.vue'; |
| | | import { convertListToTree } from '/@/utils/util'; |
| | | import LeftTreeByMgr from '/@/components/tree/leftTreeByMgr.vue'; |
| | | import * as agentGroupApi from '/@/api/ai/agentGroup'; |
| | | |
| | | //#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 result = convertListToTree(listData.value, { |
| | | ID: 'group_id', |
| | | ParentID: 'p_group_id', |
| | | Children: 'children', |
| | | }); |
| | | 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 ====================== 表格数据,table init ====================== |
| | | const tableLoading = ref(false); |
| | | const tableData = ref([]); |
| | | const isDragStatus = ref(false); |
| | | const allTableData = ref(null); |
| | | const getTableData = async () => { |
| | | const res = await metricApi.getMetricAgentListByPost(); |
| | | allTableData.value = (res.values || []).map((item) => { |
| | | item.create_time = item.create_time?.slice(0, 10); |
| | | 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; |
| | | }); |
| | | tableData.value = res?.values ?? []; |
| | | return item; |
| | | }); |
| | | } |
| | | |
| | | tableData.value = allTableData.value.filter((item) => item.agent_group === currentListID.value); |
| | | }; |
| | | //#endregion |
| | | |
| | |
| | | }; |
| | | //#endregion |
| | | onMounted(() => { |
| | | getTableData(); |
| | | getListTreeData(); |
| | | }); |
| | | </script> |
| | | <style scoped lang="scss"></style> |