feat: tool

ui/src/api/tool/tool.ts

@@ -1,20 +1,19 @@
-import {Result} from '@/request/Result'
+import { Result } from '@/request/Result'
-import {get, post, del, put} from '@/request/index'
+import { get, post, del, put, exportFile } from '@/request/index'
-import {type Ref} from 'vue'
+import { type Ref } from 'vue'
-import type {pageRequest} from '@/api/type/common'
+import type { pageRequest } from '@/api/type/common'
-import type {toolData} from '@/api/type/tool'
+import type { toolData } from '@/api/type/tool'
 
 const prefix = '/workspace/' + localStorage.getItem('workspace_id')
 
-
 /**
  * 获得工具文件夹列表
  * @params 参数 {folder_id: string}
  */
-const getToolByFolder: (
+const getToolByFolder: (data?: any, loading?: Ref<boolean>) => Promise<Result<Array<any>>> = (
-  data?: any,
+  data,
-  loading?: Ref<boolean>,
+  loading,
-) => Promise<Result<Array<any>>> = (data, loading) => {
+) => {
   return get(`${prefix}/tool`, data, loading)
 }
 
@@ -32,21 +31,17 @@ const getToolList: (
   param?: any,
   loading?: Ref<boolean>,
 ) => Promise<Result<any>> = (page, param, loading) => {
-  return get(
+  return get(`${prefix}/tool/${page.current_page}/${page.page_size}`, param, loading)
-    `${prefix}/tool/${page.current_page}/${page.page_size}`,
-    param,
-    loading,
-  )
 }
 
 /**
  * 创建工具
  * @param 参数
  */
-const postTool: (
+const postTool: (data: toolData, loading?: Ref<boolean>) => Promise<Result<any>> = (
-  data: toolData,
+  data,
-  loading?: Ref<boolean>,
+  loading,
-) => Promise<Result<any>> = (data, loading) => {
+) => {
   return post(`${prefix}/tool`, data, undefined, loading)
 }
 
@@ -55,11 +50,11 @@ const postTool: (
  * @param 参数
 
  */
-const putTool: (
+const putTool: (tool_id: string, data: toolData, loading?: Ref<boolean>) => Promise<Result<any>> = (
-  tool_id: string,
+  tool_id,
-  data: toolData,
+  data,
-  loading?: Ref<boolean>,
+  loading,
-) => Promise<Result<any>> = (tool_id, data, loading) => {
+) => {
   return put(`${prefix}/tool/${tool_id}`, data, undefined, loading)
 }
 
@@ -69,18 +64,34 @@ const putTool: (
  * @param loading 加载器
  * @returns 函数详情
  */
-const getToolById: (
+const getToolById: (tool_id: string, loading?: Ref<boolean>) => Promise<Result<any>> = (
-  tool_id: string,
+  tool_id,
-  loading?: Ref<boolean>,
+  loading,
-) => Promise<Result<any>> = (tool_id, loading) => {
+) => {
   return get(`${prefix}/tool/${tool_id}`, undefined, loading)
 }
 
-const postPylint: (
+/**
-  code: string,
+ * 删除工具
-  loading?: Ref<boolean>,
+ * @param 参数 tool_id
-) => Promise<Result<any>> = (code, loading) => {
+ */
-  return post(`${prefix}/tool/pylint`, {code}, {}, loading)
+const delTool: (
+  tool_id: String,
+  loading?: Ref<boolean>
+) => Promise<Result<boolean>> = (tool_id, loading) => {
+  return del(`${prefix}/${tool_id}`, undefined, {}, loading)
+}
+
+const putToolIcon: (
+    id: string,
+    data: any,
+    loading?: Ref<boolean>
+) => Promise<Result<any>> = (id, data, loading) => {
+  return put(`${prefix}/${id}/edit_icon`, data, undefined, loading)
+}
+
+const exportTool = (id: string, name: string, loading?: Ref<boolean>) => {
+  return exportFile(name + '.fx', `${prefix}/${id}/export`, undefined, loading)
 }
 
 /**
@@ -88,12 +99,26 @@ const postPylint: (
  * @param 参数
 
  */
-// const postToolDebug: (data: any, loading?: Ref<boolean>) => Promise<Result<any>> = (
+const postToolDebug: (data: any, loading?: Ref<boolean>) => Promise<Result<any>> = (
-//   data: any,
+  data: any,
-//   loading
+  loading,
-// ) => {
+) => {
-//   return post(`${prefix}/debug`, data, undefined, loading)
+  return post(`${prefix}/debug`, data, undefined, loading)
-// }
+}
+
+const postImportTool: (data: any, loading?: Ref<boolean>) => Promise<Result<any>> = (
+  data,
+  loading,
+) => {
+  return post(`${prefix}/import`, data, undefined, loading)
+}
+
+const postPylint: (code: string, loading?: Ref<boolean>) => Promise<Result<any>> = (
+  code,
+  loading,
+) => {
+  return post(`${prefix}/tool/pylint`, { code }, {}, loading)
+}
 
 export default {
   getToolByFolder,
@@ -101,5 +126,10 @@ export default {
   putTool,
   getToolById,
   postTool,
-  postPylint
+  postToolDebug,
+  postImportTool,
+  postPylint,
+  exportTool,
+  putToolIcon,
+  delTool
 }

ui/src/locales/lang/zh-CN/views/tool.ts

@@ -2,14 +2,19 @@ export default {
   title: '工具',
   createTool: '创建工具',
   editTool: '编辑工具',
+  copyTool: '复制函数',
+  importTool: '导入函数',
   disabled: {
     confirmTitle: '是否禁用工具：',
     confirmMessage: '禁用后，引用了该工具的应用提问时会报错 ，请谨慎操作。',
   },
+  tip: {
+    saveMessage: '当前的更改尚未保存，确认退出吗?',
+  },
   form: {
     title: {
       copy: '副本',
-      baseInfo: '基础信息'
+      baseInfo: '基础信息',
     },
     toolName: {
       label: '名称',

ui/src/views/tool/ToolDebugDrawer.vue

@@ -148,7 +148,7 @@ watch(debugVisible, (bool) => {
 const submit = async (formEl: FormInstance | undefined) => {
   const validate = formEl ? formEl.validate() : Promise.resolve()
   Promise.all([dynamicsFormRef.value?.validate(), validate]).then(() => {
-    toolApi.postToolDebug(form.value, loading).then((res) => {
+    ToolApi.postToolDebug(form.value, loading).then((res) => {
       if (res.code === 500) {
         showResult.value = true
         isSuccess.value = false

ui/src/views/tool/ToolFormDrawer.vue

@@ -398,7 +398,7 @@ function refreshInitFieldList(data: any) {
   UserFieldFormDialogRef.value.close()
 }
 
-function refreshtool(data: any) {
+function refreshTool(data: any) {
   form.value.icon = data
 }
 

ui/src/views/tool/component/EditAvatarDialog.vue

@@ -9,14 +9,9 @@
     <el-radio-group v-model="radioType" class="radio-block mb-16">
       <el-radio value="default">
         <p>{{ $t('common.EditAvatarDialog.default') }}</p>
-        <el-avatar
+        <el-avatar class="avatar-green" shape="square" :size="32">
-          v-if="detail?.name"
+          <img src="@/assets/node/icon_tool.svg" style="width: 58%" alt="" />
-          :name="detail?.name"
+        </el-avatar>
-          pinyinColor
-          class="mt-8 mb-8"
-          shape="square"
-          :size="32"
-        />
       </el-radio>
 
       <el-radio value="custom">
@@ -122,6 +117,4 @@ function submit() {
 
 defineExpose({ open })
 </script>
-<style lang="scss" scoped>
+<style lang="scss" scoped></style>
-
-</style>

ui/src/views/tool/index.vue

@@ -19,9 +19,9 @@
               style="width: 120px"
               @change="search_type_change"
             >
-              <el-option :label="$t('common.creator')" value="create_user"/>
+              <el-option :label="$t('common.creator')" value="create_user" />
 
-              <el-option :label="$t('views.model.modelForm.modeName.label')" value="name"/>
+              <el-option :label="$t('views.model.modelForm.modeName.label')" value="name" />
             </el-select>
             <el-input
               v-if="search_type === 'name'"
@@ -38,7 +38,7 @@
               clearable
               style="width: 220px"
             >
-              <el-option v-for="u in user_options" :key="u.id" :value="u.id" :label="u.username"/>
+              <el-option v-for="u in user_options" :key="u.id" :value="u.id" :label="u.username" />
             </el-select>
           </div>
           <el-button class="ml-16" type="primary"> {{ $t('common.create') }}</el-button>
@@ -84,10 +84,10 @@
                     style="background: none"
                     class="mr-8"
                   >
-                    <img :src="item?.icon" alt=""/>
+                    <img :src="item?.icon" alt="" />
                   </el-avatar>
                   <el-avatar v-else class="avatar-green" shape="square" :size="32">
-                    <img src="@/assets/node/icon_tool.svg" style="width: 58%" alt=""/>
+                    <img src="@/assets/node/icon_tool.svg" style="width: 58%" alt="" />
                   </el-avatar>
                 </template>
                 <template #subTitle>
@@ -98,10 +98,8 @@
 
                 <template #footer>
                   <div v-if="item.is_active" class="flex align-center">
-                    <el-icon class="color-success mr-8" style="font-size: 16px"
+                    <el-icon class="color-success mr-8" style="font-size: 16px">
-                    >
+                      <SuccessFilled />
-                      <SuccessFilled
-                      />
                     </el-icon>
                     <span class="color-secondary">
                       {{ $t('common.status.enabled') }}
@@ -122,11 +120,11 @@
                       size="small"
                       class="mr-4"
                     />
-                    <el-divider direction="vertical"/>
+                    <el-divider direction="vertical" />
                     <el-dropdown trigger="click">
                       <el-button text @click.stop>
                         <el-icon>
-                          <MoreFilled/>
+                          <MoreFilled />
                         </el-icon>
                       </el-button>
                       <template #dropdown>
@@ -137,14 +135,14 @@
                             @click.stop="openCreateDialog(item)"
                           >
                             <el-icon>
-                              <EditPen/>
+                              <EditPen />
                             </el-icon>
                             {{ $t('common.edit') }}
                           </el-dropdown-item>
                           <el-dropdown-item
                             :disabled="!canEdit(item)"
                             v-if="!item.template_id"
-                            @click.stop="copytool(item)"
+                            @click.stop="copyTool(item)"
                           >
                             <AppIcon iconName="app-copy"></AppIcon>
                             {{ $t('common.copy') }}
@@ -160,7 +158,7 @@
                           <el-dropdown-item
                             v-if="!item.template_id"
                             :disabled="!canEdit(item)"
-                            @click.stop="exporttool(item)"
+                            @click.stop="exportTool(item)"
                           >
                             <AppIcon iconName="app-export"></AppIcon>
                             {{ $t('common.export') }}
@@ -168,7 +166,7 @@
                           <el-dropdown-item
                             :disabled="!canEdit(item)"
                             divided
-                            @click.stop="deletetool(item)"
+                            @click.stop="deleteTool(item)"
                           >
                             <el-icon><Delete /></el-icon>
                             {{ $t('common.delete') }}
@@ -182,25 +180,26 @@
             </el-col>
           </template>
         </el-row>
-        <el-empty :description="$t('common.noData')" v-else/>
+        <el-empty :description="$t('common.noData')" v-else />
       </div>
     </ContentContainer>
-    <InitParamDrawer ref="InitParamDrawerRef" @refresh="refresh"/>
+    <InitParamDrawer ref="InitParamDrawerRef" @refresh="refresh" />
-    <ToolFormDrawer ref="ToolFormDrawerRef" @refresh="refresh" :title="ToolDrawertitle"/>
+    <ToolFormDrawer ref="ToolFormDrawerRef" @refresh="refresh" :title="ToolDrawertitle" />
   </LayoutContainer>
 </template>
 
 <script lang="ts" setup>
-import {onMounted, ref, reactive, computed} from 'vue'
+import { onMounted, ref, reactive, computed } from 'vue'
+import { cloneDeep, get } from 'lodash'
 import ToolApi from '@/api/tool/tool'
 import useStore from '@/stores'
-import {MsgConfirm} from '@/utils/message'
 import InitParamDrawer from '@/views/tool/component/InitParamDrawer.vue'
 import ToolFormDrawer from './ToolFormDrawer.vue'
-import {t} from '@/locales'
+import { t } from '@/locales'
-import {isAppIcon} from '@/utils/common'
+import { isAppIcon } from '@/utils/common'
+import { MsgSuccess, MsgConfirm, MsgError } from '@/utils/message'
 
-const {folder, user} = useStore()
+const { folder, user } = useStore()
 
 const InitParamDrawerRef = ref()
 const search_type = ref('name')
@@ -226,7 +225,7 @@ const toolList = ref<any[]>([])
 const currentFolder = ref<any>({})
 
 const search_type_change = () => {
-  search_form.value = {name: '', create_user: ''}
+  search_form.value = { name: '', create_user: '' }
 }
 const canEdit = (row: any) => {
   return user.userInfo?.id === row?.user_id
@@ -340,6 +339,74 @@ function folderClickHandel(row: any) {
   getList()
 }
 
+function copyTool(row: any) {
+  ToolDrawertitle.value = t('views.tool.copyTool')
+  const obj = cloneDeep(row)
+  delete obj['id']
+  obj['name'] = obj['name'] + `  ${t('views.tool.form.title.copy')}`
+  ToolFormDrawerRef.value.open(obj)
+}
+
+function exportTool(row: any) {
+  ToolApi.exportTool(row.id, row.name, loading).catch((e: any) => {
+    if (e.response.status !== 403) {
+      e.response.data.text().then((res: string) => {
+        MsgError(`${t('views.application.tip.ExportError')}:${JSON.parse(res).message}`)
+      })
+    }
+  })
+}
+
+function deleteTool(row: any) {
+  MsgConfirm(
+    `${t('views.tool.delete.confirmTitle')}${row.name} ?`,
+    t('views.tool.delete.confirmMessage'),
+    {
+      confirmButtonText: t('common.confirm'),
+      cancelButtonText: t('common.cancel'),
+      confirmButtonClass: 'danger'
+    }
+  )
+    .then(() => {
+      ToolApi.delTool(row.id, loading).then(() => {
+        const index = toolList.value.findIndex((v) => v.id === row.id)
+        toolList.value.splice(index, 1)
+        MsgSuccess(t('common.deleteSuccess'))
+      })
+    })
+    .catch(() => {})
+}
+
+function configInitParams(item: any) {
+  ToolApi.getToolById(item?.id, changeStateloading).then((res) => {
+    InitParamDrawerRef.value.open(res.data)
+  })
+}
+
+
+// function importTool(file: any) {
+//   const formData = new FormData()
+//   formData.append('file', file.raw, file.name)
+//   elUploadRef.value.clearFiles()
+//   ToolApi
+//     .postImportTool(formData, loading)
+//     .then(async (res: any) => {
+//       if (res?.data) {
+//         searchHandle()
+//       }
+//     })
+//     .catch((e: any) => {
+//       if (e.code === 400) {
+//         MsgConfirm(t('common.tip'), t('views.application.tip.professionalMessage'), {
+//           cancelButtonText: t('common.confirm'),
+//           confirmButtonText: t('common.professional')
+//         }).then(() => {
+//           window.open('https://maxkb.cn/pricing.html', '_blank')
+//         })
+//       }
+//     })
+// }
+
 onMounted(() => {
   getFolder()
 })