11<template >
22 <div v-show =" show" class =" workflow-dropdown-menu border border-r-6 white-bg" >
3- <el-tabs v-model =" activeName" class =" workflow-dropdown-tabs" >
4- <div v-show =" activeName === 'base'" style =" display : flex ; width : 100% ; justify-content : center " class =" mb-12 mt-12" >
5- <el-input v-model =" search_text" class =" mr-12 ml-12"
6- :placeholder =" $t('views.applicationWorkflow.searchBar.placeholder')" >
3+ <el-tabs v-model =" activeName" class =" workflow-dropdown-tabs" @tab-change =" handleClick" >
4+ <div
5+ v-show =" activeName === 'base'"
6+ style =" display : flex ; width : 100% ; justify-content : center "
7+ class =" mb-12 mt-12"
8+ >
9+ <el-input
10+ v-model =" search_text"
11+ class =" mr-12 ml-12"
12+ :placeholder =" $t('views.applicationWorkflow.searchBar.placeholder')"
13+ >
714 <template #suffix >
815 <el-icon class =" el-input__icon" >
916 <search />
1825 <template v-for =" (node , index ) in filter_menu_nodes " :key =" index " >
1926 <el-text type =" info" size =" small" class =" color-secondary ml-12" >{{
2027 node.label
21- }}</el-text >
22- <div class =" flex-wrap" style =" gap : 12px ; padding : 12px ; " >
28+ }}</el-text >
29+ <div class =" flex-wrap" style =" gap : 12px ; padding : 12px " >
2330 <template v-for =" (item , index ) in node .list " :key =" index " >
2431 <el-popover placement =" right" :width =" 280" :show-after =" 500" >
2532 <template #reference >
26- <div class =" list-item flex align-center border border-r-6 p-8-12 cursor"
27- style =" width : calc (50% - 6px )" @click.stop =" clickNodes(item)" @mousedown.stop =" onmousedown(item)" >
28- <component :is =" iconComponent(`${item.type}-icon`)" class =" mr-8" :size =" 32" />
33+ <div
34+ class =" list-item flex align-center border border-r-6 p-8-12 cursor"
35+ style =" width : calc (50% - 6px )"
36+ @click.stop =" clickNodes(item)"
37+ @mousedown.stop =" onmousedown(item)"
38+ >
39+ <component
40+ :is =" iconComponent(`${item.type}-icon`)"
41+ class =" mr-8"
42+ :size =" 32"
43+ />
2944 <div class =" lighter" >{{ item.label }}</div >
3045 </div >
3146 </template >
3247 <template #default >
3348 <div class =" flex align-center mb-8" >
34- <component :is =" iconComponent(`${item.type}-icon`)" class =" mr-8" :size =" 32" />
49+ <component
50+ :is =" iconComponent(`${item.type}-icon`)"
51+ class =" mr-8"
52+ :size =" 32"
53+ />
3554 <div class =" lighter color-text-primary" >{{ item.label }}</div >
3655 </div >
3756 <el-text type =" info" size =" small" class =" color-secondary lighter" >{{
3857 item.text
39- }}</el-text >
58+ }}</el-text >
4059 </template >
4160 </el-popover >
4261 </template >
5271 <el-tab-pane :label =" $t('views.tool.title')" name =" tool" >
5372 <LayoutContainer >
5473 <template #left >
55- <folder-tree :source =" SourceTypeEnum.TOOL" :data =" toolTreeData" :currentNodeKey =" folder.currentFolder?.id"
56- @handleNodeClick =" folderClickHandle" :shareTitle =" $t('views.shared.shared_tool')"
57- :showShared =" user.isEE()" class =" p-8" :canOperation =" false" />
74+ <folder-tree
75+ :source =" SourceTypeEnum.TOOL"
76+ :data =" toolTreeData"
77+ :currentNodeKey =" folder.currentFolder?.id"
78+ @handleNodeClick =" folderClickHandle"
79+ :shareTitle =" $t('views.shared.shared_tool')"
80+ :showShared =" user.isEE()"
81+ class =" p-8"
82+ :canOperation =" false"
83+ />
5884 </template >
5985 <el-scrollbar height =" 450" >
60- <NodeContent :list =" toolList" @clickNodes =" (val: any) => clickNodes(toolLibNode, val, 'tool')"
61- @onmousedown =" (val: any) => onmousedown(toolLibNode, val, 'tool')" />
86+ <NodeContent
87+ :list =" toolList"
88+ @clickNodes =" (val: any) => clickNodes(toolLibNode, val, 'tool')"
89+ @onmousedown =" (val: any) => onmousedown(toolLibNode, val, 'tool')"
90+ />
6291 </el-scrollbar >
6392 </LayoutContainer >
6493 </el-tab-pane >
6594 <!-- 应用 -->
6695 <el-tab-pane :label =" $t('views.application.title')" name =" application" >
6796 <LayoutContainer >
6897 <template #left >
69- <folder-tree :source =" SourceTypeEnum.APPLICATION" :data =" applicationTreeData"
70- :currentNodeKey =" folder.currentFolder?.id" @handleNodeClick =" folderClickHandle" class =" p-8"
71- :canOperation =" false" />
98+ <folder-tree
99+ :source =" SourceTypeEnum.APPLICATION"
100+ :data =" applicationTreeData"
101+ :currentNodeKey =" folder.currentFolder?.id"
102+ @handleNodeClick =" folderClickHandle"
103+ class =" p-8"
104+ :canOperation =" false"
105+ />
72106 </template >
73107 <el-scrollbar height =" 450" >
74- <NodeContent :list =" applicationList"
108+ <NodeContent
109+ :list =" applicationList"
75110 @clickNodes =" (val: any) => clickNodes(applicationNode, val, 'application')"
76- @onmousedown =" (val: any) => onmousedown(applicationNode, val, 'application')" />
111+ @onmousedown =" (val: any) => onmousedown(applicationNode, val, 'application')"
112+ />
77113 </el-scrollbar >
78114 </LayoutContainer >
79115 </el-tab-pane >
@@ -90,7 +126,6 @@ import useStore from '@/stores'
90126import NodeContent from ' ./NodeContent.vue'
91127import { SourceTypeEnum } from ' @/enums/common'
92128import sharedWorkspaceApi from ' @/api/shared-workspace'
93- import { CaretRight } from ' @element-plus/icons-vue'
94129import ApplicationApi from ' @/api/application/application'
95130const { user } = useStore ()
96131const search_text = ref <string >(' ' )
@@ -209,10 +244,12 @@ async function getShareTool() {
209244}
210245
211246async function getToolList() {
212- if (folder .currentFolder .id === " share" ) {
247+ if (folder .currentFolder .id === ' share' ) {
213248 toolList .value = sharedToolList .value
214249 } else {
215- const res = await ToolApi .getToolList ({ folder_id: folder .currentFolder ?.id || user .getWorkspaceId () })
250+ const res = await ToolApi .getToolList ({
251+ folder_id: folder .currentFolder ?.id || user .getWorkspaceId (),
252+ })
216253 toolList .value = res .data .tools
217254 }
218255}
@@ -223,33 +260,41 @@ const applicationList = ref<any[]>([])
223260function getApplicationFolder() {
224261 folder .asyncGetFolder (SourceTypeEnum .APPLICATION , {}, loading ).then ((res : any ) => {
225262 applicationTreeData .value = res .data
226- folder .setCurrentFolder (res .data ?.[0 ] || {})
263+ folder .setCurrentFolder (res .data ?.[0 ] || {})
227264 })
228265}
229266
230267async function getApplicationList() {
231- const res = await ApplicationApi .getAllApplication ({ folder_id: folder .currentFolder ?.id || user .getWorkspaceId () })
268+ const res = await ApplicationApi .getAllApplication ({
269+ folder_id: folder .currentFolder ?.id || user .getWorkspaceId (),
270+ })
232271 applicationList .value = res .data .filter ((item ) => item .resource_type === ' application' )
233272}
234273
235274function folderClickHandle(row : any ) {
236275 folder .setCurrentFolder (row )
237276 if (activeName .value === ' tool' ) {
238- getToolList ();
277+ getToolList ()
239278 } else {
240279 getApplicationList ()
241280 }
242281}
243282
244- onMounted (async () => {
245- if (user .isEE ()) {
246- await getShareTool ()
283+ async function handleClick(val : string ) {
284+ console .log (val )
285+ if (val === ' tool' ) {
286+ if (user .isEE ()) {
287+ await getShareTool ()
288+ }
289+ await getToolFolder ()
290+ getToolList ()
291+ } else if (val === ' application' ) {
292+ getApplicationFolder ()
293+ getApplicationList ()
247294 }
248- await getToolFolder ()
249- getToolList ()
250- getApplicationFolder ()
251- getApplicationList ()
252- })
295+ }
296+
297+ onMounted (() => {})
253298 </script >
254299<style lang="scss" scoped>
255300.workflow-dropdown-menu {
0 commit comments