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/flowApp/FlowApp.vue | 115 ++++++++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 92 insertions(+), 23 deletions(-) diff --git a/src/views/project/yw/systemManage/flowApp/FlowApp.vue b/src/views/project/yw/systemManage/flowApp/FlowApp.vue index b094c05..4072ea1 100644 --- a/src/views/project/yw/systemManage/flowApp/FlowApp.vue +++ b/src/views/project/yw/systemManage/flowApp/FlowApp.vue @@ -1,12 +1,17 @@ <template> - <div class="absolute bottom-0 left-0 right-0 top-0"> + <div class="absolute bottom-0 left-0 right-0 top-0 bg-page text-base"> <div class="relative flex h-full w-full flex-col"> - <Header /> + <Header :isViewMode="isViewMode" v-if="flowAgent" :flowAgent="flowAgent" :queryId="queryId" /> <main class="relative flex h-full w-full flex-1"> - - <Sidebar @dragstart="handleOnDragStart"/> - <div class="relative h-full flex-1 overflow-hidden"> - <MainCanvas /> + <Sidebar v-if="!isViewMode" class="w-52" @dragstart="handleOnDragStart" /> + <div class="relative h-full flex-1 overflow-hidden" v-if="flowJson"> + <MainCanvas + :isViewMode="isViewMode" + :flowJson="flowJson" + :agentNames="agentNames" + :funcNames="funcNames" + :llmInfoList="llmInfoList" + /> </div> </main> </div> @@ -18,13 +23,26 @@ import { useVueFlow } from '@vue-flow/core'; import { useClipboard } from '@vueuse/core'; // import MainCanvas from '@/components/vue-flow/MainCanvas.vue'; -import MainCanvas from '/@/components/vue-flow/MainCanvas.vue'; +import { computed, onMounted, ref } from 'vue'; import Header from './components/Header.vue'; import Sidebar from './components/Sidebar.vue'; - +import { + get_agent_names, + get_flow_func_names, + get_workflow_agent_list, + get_workflow_json_flow, + get_llm_info_list, +} from '/@/api/workflow'; +import MainCanvas from '/@/components/vue-flow/MainCanvas.vue'; +import router from '/@/router'; +const props = defineProps<{ + isViewMode: { + type: Boolean; + default: false; + }; +}>(); // import { Button } from '@/components/ui/button'; // import { Toaster, useToast } from '@/components/ui/toast'; - function handleOnDragStart(event: DragEvent, nodeType: any) { if (event.dataTransfer) { event.dataTransfer.setData('application/vueflow', nodeType); @@ -32,21 +50,72 @@ } } +const queryId = computed(() => router.currentRoute.value.query.id as string); + const { toObject } = useVueFlow(); const { copy } = useClipboard(); -// const { toast } = useToast(); -// function handleClickGetData() { -// copy(JSON.stringify(toObject())).then(() => { -// toast({ -// title: 'copied success', -// }); -// }); -// } -// function handleClickPublishBtn() { -// toast({ -// title: 'Save Data', -// description: '1.valid data 2.fetch backend api to save result', -// }); -// } +const flowJson = ref(null); + +const flowAgent = ref(null); + +const handleGetJSON = async (id: string) => { + const res = await get_workflow_json_flow({ + agent_id: id, + }); + flowJson.value = res.json_ok ? res.json_flow ?? {} : {}; +}; + +const getFlowAgent = async () => { + const res = await get_workflow_agent_list(); + const flowAgentList = res.values ?? []; + const currentFlowAgent = flowAgentList.find((item: any) => item.id === queryId.value); + flowAgent.value = currentFlowAgent; +}; + +const agentNames = ref([]); +const getAgentNames = async () => { + const res = await get_agent_names(); + agentNames.value = res.agents ?? []; +}; +const funcNames = ref([]); + +const getFuncNames = async () => { + const res = await get_flow_func_names(); + funcNames.value = res.funcs ?? []; +}; + +const llmInfoList = ref([]); +const getLlmInfoList = async () => { + const res = await get_llm_info_list(); + const factorys = res.factorys ?? []; + const connections = res.connections ?? []; + const logicTree = []; + factorys.forEach((factory: any) => { + logicTree.push({ + id: factory.factory_id, + name: factory.factory_name, + type: 'factory', + model: factory, + children: connections + .filter((connection: any) => connection.factory_id === factory.factory_id) + .map((item: any) => ({ + id: item.connect_id, + name: item.connect_title, + type: 'connection', + model: item, + })), + }); + }); + llmInfoList.value = logicTree; +}; + +onMounted(() => { + if (!queryId.value) return; + handleGetJSON(queryId.value); + getFlowAgent(); + getAgentNames(); + getFuncNames(); + getLlmInfoList(); +}); </script> -- Gitblit v1.9.3