feat: toolStoreDialog

Author: 1myuan

ui/src/api/tool/tool.ts

@@ -2,7 +2,7 @@ import { Result } from '@/request/Result'
 import { get, post, del, put, exportFile } from '@/request/index'
 import { type Ref } from 'vue'
 import type { pageRequest } from '@/api/type/common'
-import type { toolData } from '@/api/type/tool'
+import type { toolData,AddInternalToolParam } from '@/api/type/tool'
 
 
 import useStore from '@/stores'
@@ -84,16 +84,16 @@ const getToolById: (tool_id: string, loading?: Ref<boolean>) => Promise<Result<a
  * @param 参数 tool_id
  */
 const delTool: (
-  tool_id: String,
+  tool_id: string,
   loading?: Ref<boolean>
 ) => Promise<Result<boolean>> = (tool_id, loading) => {
   return del(`${prefix.value}/${tool_id}`, undefined, {}, loading)
 }
 
 const putToolIcon: (
-    id: string,
-    data: any,
-    loading?: Ref<boolean>
+  id: string,
+  data: any,
+  loading?: Ref<boolean>
 ) => Promise<Result<any>> = (id, data, loading) => {
   return put(`${prefix.value}/${id}/edit_icon`, data, undefined, loading)
 }
@@ -128,6 +128,26 @@ const postPylint: (code: string, loading?: Ref<boolean>) => Promise<Result<any>>
   return post(`${prefix.value}/pylint`, { code }, {}, loading)
 }
 
+/**
+ * 工具商店-系统内置列表
+ */
+const getInternalToolList: (
+  param?: any,
+  loading?: Ref<boolean>,
+) => Promise<Result<any>> = (param, loading) => {
+  return get('/workspace/internal/tool', param, loading)
+}
+
+/**
+ * 工具商店-添加系统内置
+ */
+const addInternalTool: (tool_id: string, param: AddInternalToolParam, loading?: Ref<boolean>) => Promise<Result<any>> = (
+  tool_id,
+  param,
+  loading,
+) => {
+  return post(`${prefix.value}/${tool_id}/add_internal_tool`, param, undefined, loading)
+}
 export default {
   getToolList,
   getToolListPage,
@@ -139,5 +159,7 @@ export default {
   postPylint,
   exportTool,
   putToolIcon,
-  delTool
+  delTool,
+  getInternalToolList,
+  addInternalTool
 }

ui/src/api/type/tool.ts

@@ -10,4 +10,9 @@ interface toolData {
   folder_id?: string
 }
 
-export type { toolData }
+interface AddInternalToolParam {
+  name: string,
+  folder_id: string
+}
+
+export type { toolData, AddInternalToolParam }

ui/src/locales/lang/en-US/common.ts

@@ -87,4 +87,5 @@ export default {
   otherSetting: 'Other Settings',
   username: 'username',
   importCreate: 'Import Create',
+  detail: 'Detail'
 }

ui/src/locales/lang/en-US/views/tool.ts

@@ -6,6 +6,17 @@ export default {
   editTool: 'Edit Tool',
   copyTool: 'Copy Tool',
   importTool: 'Import Tool',
+  toolStore: {
+    title: 'Tool Store',
+    createFromToolStore: 'Create from Tool Store',
+    recommend: 'Recommended',
+    webSearch: 'Web Search',
+    databaseQuery: 'Database Query',
+    image: 'Image',
+    developer: 'Developer',
+    communication: 'Communication',
+    searchResult: '{count} search results for'
+  },
   searchBar: {
     placeholder: 'Search by tool name',
   },

ui/src/locales/lang/zh-CN/common.ts

@@ -91,4 +91,5 @@ export default {
   otherSetting: '其他设置',
   username: '用户名',
   importCreate: '导入创建',
+  detail: '详情'
 }

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

@@ -4,6 +4,17 @@ export default {
   editTool: '编辑工具',
   copyTool: '复制函数',
   importTool: '导入函数',
+  toolStore: {
+    title: '工具商店',
+    createFromToolStore: '从工具商店创建',
+    recommend: '推荐',
+    webSearch: '联网搜索',
+    databaseQuery: '数据库查询',
+    image: '图像',
+    developer: '开发者',
+    communication: '通信',
+    searchResult: '的搜索结果 {count} 个'
+  },
   enabled: '启用',
   disabled: {
     confirmTitle: '是否禁用工具：',

ui/src/locales/lang/zh-Hant/common.ts

@@ -87,4 +87,5 @@ export default {
   otherSetting: '其他設定',
   username: '用戶名',
   importCreate: '導入創建',
+  detail: '详情'
 }

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

@@ -6,6 +6,17 @@ export default {
   editTool: '編輯工具',
   copyTool: '複製工具',
   importTool: '匯入工具',
+  toolStore: {
+    title: '工具商店',
+    createFromToolStore: '從工具商店創建',
+    recommend: '推薦',
+    webSearch: '聯網搜索',
+    databaseQuery: '數據庫查詢',
+    image: '圖像',
+    developer: '開發者',
+    communication: '通信',
+    searchResult: '的搜索結果 {count} 個'
+  },
   searchBar: {
     placeholder: '按工具名稱搜尋',
   },

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

@@ -0,0 +1,66 @@
+<template>
+  <CardBox :title="props.tool.name" :description="props.tool.desc" class="cursor">
+    <template #icon>
+      <!-- TODO -->
+      <LogoIcon style="width: 28px; height: 28px; display: block" />
+    </template>
+    <template #subTitle>
+      <el-text class="color-secondary" size="small">
+        {{ getSubTitle(props.tool) }}
+      </el-text>
+    </template>
+    <template #footer>
+      <span class="card-footer-left color-secondary">
+        {{ `${$t('common.author')}: MaxKB` }}
+      </span>
+      <div class="card-footer-operation" @click.stop>
+        <el-button>
+          {{ $t('common.detail') }}
+        </el-button>
+        <el-button type="primary" :loading="props.addLoading" @click="emit('handleAdd')">
+          {{ $t('common.add') }}
+        </el-button>
+      </div>
+    </template>
+  </CardBox>
+</template>
+
+<script setup lang="ts">
+const props = defineProps<{
+  tool: any,
+  getSubTitle: (v: any) => string
+  addLoading: boolean
+}>()
+
+const emit = defineEmits<{
+  (e: 'handleAdd'): void;
+}>();
+</script>
+
+<style lang="scss" scoped>
+.el-card {
+  :deep(.card-footer) {
+    &>div:first-of-type {
+      flex: 1;
+    }
+
+    .card-footer-operation {
+      display: none;
+    }
+  }
+
+  &:hover {
+    .card-footer-left {
+      display: none;
+    }
+
+    .card-footer-operation {
+      display: flex !important;
+
+      .el-button {
+        flex: 1;
+      }
+    }
+  }
+}
+</style>