feat: knowledge

ui/src/api/folder.ts

@@ -5,10 +5,10 @@ import type { pageRequest } from '@/api/type/common'
 const prefix = '/workspace'
 
 /**
- * 获得知识库文件夹列表
+ * 获得文件夹列表
  * @params 参数
  *  source : APPLICATION, KNOWLEDGE, TOOL
- * {name: string}
+ *  data : {name: string}
  */
 const getFolder: (
   wordspace_id: string,
@@ -19,6 +19,26 @@ const getFolder: (
   return get(`${prefix}/${wordspace_id}/${source}/folder`, data, loading)
 }
 
+/**
+ * 添加文件夹
+ * @params 参数
+ *  source : APPLICATION, KNOWLEDGE, TOOL
+{
+  "name": "string",
+  "desc": "string",
+  "parent_id": "root"
+}
+ */
+const postFolder: (
+  wordspace_id: string,
+  source: string,
+  data?: any,
+  loading?: Ref<boolean>,
+) => Promise<Result<Array<any>>> = (wordspace_id, source, data, loading) => {
+  return post(`${prefix}/${wordspace_id}/${source}/folder`, data, loading)
+}
+
 export default {
   getFolder,
+  postFolder,
 }

ui/src/components/folder-tree/CreateFolderDialog.vue

@@ -0,0 +1,110 @@
+<template>
+  <el-dialog
+    :title="$t('components.folder.addFolder')"
+    v-model="dialogVisible"
+    width="720"
+    append-to-body
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+  >
+    <el-form
+      ref="FolderFormRef"
+      :rules="rules"
+      :model="folderForm"
+      label-position="top"
+      require-asterisk-position="right"
+    >
+      <el-form-item :label="$t('common.name')" prop="name">
+        <el-input
+          v-model="folderForm.name"
+          :placeholder="$t('components.folder.folderNamePlaceholder')"
+          maxlength="64"
+          show-word-limit
+          @blur="folderForm.name = folderForm.name.trim()"
+        />
+      </el-form-item>
+      <el-form-item :label="$t('components.folder.description')" prop="desc">
+        <el-input
+          v-model="folderForm.desc"
+          type="textarea"
+          :placeholder="$t('components.folder.descriptionPlaceholder')"
+          maxlength="256"
+          show-word-limit
+          :autosize="{ minRows: 3 }"
+          @blur="folderForm.desc = folderForm.desc.trim()"
+        />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click.prevent="dialogVisible = false" :loading="loading">
+          {{ $t('common.cancel') }}
+        </el-button>
+        <el-button type="primary" @click="submitHandle" :loading="loading">
+          {{ $t('common.add') }}
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+<script setup lang="ts">
+import { ref, watch, reactive } from 'vue'
+import folderApi from '@/api/folder'
+import { MsgSuccess, MsgAlert } from '@/utils/message'
+import { t } from '@/locales'
+const emit = defineEmits(['refresh'])
+
+const FolderFormRef = ref()
+
+const loading = ref(false)
+const dialogVisible = ref<boolean>(false)
+const sourceType = ref<any>('')
+
+const folderForm = ref<any>({
+  name: '',
+  desc: '',
+  parent_id: '',
+})
+
+const rules = reactive({
+  name: [
+    {
+      required: true,
+      message: t('components.folder.folderNamePlaceholder'),
+      trigger: 'blur',
+    },
+  ],
+})
+
+watch(dialogVisible, (bool) => {
+  if (!bool) {
+    sourceType.value = ''
+    folderForm.value = {
+      name: '',
+      desc: '',
+      parent_id: '',
+    }
+  }
+})
+
+const open = (source: string, id: string) => {
+  sourceType.value = source
+  folderForm.value.parent_id = id
+  dialogVisible.value = true
+}
+
+const submitHandle = async () => {
+  await FolderFormRef.value.validate((valid: any) => {
+    if (valid) {
+      folderApi.postFolder('default', sourceType.value, folderForm.value, loading).then((res) => {
+        MsgSuccess(t('common.createSuccess'))
+        emit('refresh')
+        dialogVisible.value = false
+      })
+    }
+  })
+}
+
+defineExpose({ open })
+</script>
+<style lang="scss" scoped></style>

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

@@ -10,6 +10,9 @@ export default {
     all: 'All Segments'
   },
   folder: {
-    addFolder:'Add Folder'
+    addFolder: 'Add Folder',
+    folderNamePlaceholder: 'Please enter a name',
+    description: 'Description',
+    descriptionPlaceholder: 'Please enter a description',
   }
 }

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

@@ -7,9 +7,12 @@ export default {
   selectParagraph: {
     title: '选择分段',
     error: '仅执行未成功分段',
-    all: '全部分段'
+    all: '全部分段',
   },
   folder: {
-    addFolder:'添加文件夹'
-  }
+    addFolder: '添加文件夹',
+    folderNamePlaceholder: '请输入名称',
+    description: '描述',
+    descriptionPlaceholder: '请输入描述',
+  },
 }

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

@@ -7,9 +7,12 @@ export default {
   selectParagraph: {
     title: '選擇分段',
     error: '僅執行未成功分段',
-    all: '全部分段'
+    all: '全部分段',
   },
   folder: {
-    addFolder:'添加文件夾'
-  }
+    addFolder: '添加文件夾',
+    folderNamePlaceholder: '請輸入名稱',
+    description: '描述',
+    descriptionPlaceholder: '請輸入描述',
+  },
 }

ui/src/router/modules/document.ts

@@ -1,5 +1,5 @@
 const DocumentRouter = {
-  path: '/knowledge/:id',
+  path: '/knowledge/:id/:folderId',
   name: 'KnowledgeDetail',
   meta: { title: 'common.fileUpload.document', activeMenu: '/knowledge', breadcrumb: true },
   component: () => import('@/layout/layout-template/MainLayout.vue'),
@@ -13,7 +13,7 @@ const DocumentRouter = {
         iconActive: 'app-document-active',
         title: 'common.fileUpload.document',
         active: 'document',
-        parentPath: '/knowledge/:id',
+        parentPath: '/knowledge/:id/:folderId',
         parentName: 'KnowledgeDetail',
       },
       component: () => import('@/views/document/index.vue'),
@@ -26,7 +26,7 @@ const DocumentRouter = {
         iconActive: 'QuestionFilled',
         title: 'views.problem.title',
         active: 'problem',
-        parentPath: '/knowledge/:id',
+        parentPath: '/knowledge/:id/:folderId',
         parentName: 'KnowledgeDetail'
       },
       component: () => import('@/views/problem/index.vue')
@@ -38,7 +38,7 @@ const DocumentRouter = {
         icon: 'app-hit-test',
         title: 'views.application.hitTest.title',
         active: 'hit-test',
-        parentPath: '/knowledge/:id',
+        parentPath: '/knowledge/:id/:folderId',
         parentName: 'KnowledgeDetail'
       },
       component: () => import('@/views/hit-test/index.vue')
@@ -51,8 +51,8 @@ const DocumentRouter = {
     //     iconActive: 'app-setting-active',
     //     title: 'common.setting',
     //     active: 'setting',
-    //     parentPath: '/dataset/:id',
-    //     parentName: 'DatasetDetail'
+    //     parentPath: '/knowledge/:id/:folderId',
+    //     parentName: 'KnowledgeDetail'
     //   },
     //   component: () => import('@/views/dataset/DatasetSetting.vue')
     // }

ui/src/views/knowledge/component/ResultSuccess.vue

@@ -19,7 +19,7 @@
         <el-button @click="router.push({ path: `/dataset` })">{{
           $t('views.dataset.ResultSuccess.buttons.toDataset')
         }}</el-button>
-        <el-button type="primary" @click="router.push({ path: `/dataset/${data?.id}/document` })">{{
+        <el-button type="primary" @click="router.push({ path: `/dataset/${data?.id}/${currentFolder.id}/document` })">{{
           $t('views.dataset.ResultSuccess.buttons.toDocument')
         }}</el-button>
       </template>

ui/src/views/knowledge/create-component/CreateKnowledgeDialog.vue

@@ -57,7 +57,7 @@ const submitHandle = async () => {
     }
     KnowledgeApi.postDataset('default', obj, loading).then((res) => {
       MsgSuccess(t('common.createSuccess'))
-      // router.push({ path: `/knowledge/${res.data.id}/document` })
+      // router.push({ path: `/knowledge/${res.data.id}/${currentFolder.value.id}/document` })
       emit('refresh')
     })
   } else {

ui/src/views/knowledge/create-component/CreateWebKnowledgeDialog.vue

@@ -103,7 +103,7 @@ const submitHandle = async () => {
         }
         KnowledgeApi.postWebDataset('default', obj, loading).then((res) => {
           MsgSuccess(t('common.createSuccess'))
-          router.push({ path: `/knowledge/${res.data.id}/document` })
+          router.push({ path: `/knowledge/${res.data.id}/${currentFolder.value.id}/document` })
           emit('refresh')
         })
       } else {

ui/src/views/knowledge/index.vue

@@ -117,7 +117,7 @@
                     </div>
                   </div>
                 </el-dropdown-item>
-                <el-dropdown-item @click="openCreateDialog" divided>
+                <el-dropdown-item @click="openCreateFolder" divided>
                   <div class="flex align-center">
                     <AppIcon iconName="app-folder" style="font-size: 32px"></AppIcon>
                     <div class="pre-wrap ml-4">
@@ -174,7 +174,9 @@
                   :title="item.name"
                   :description="item.desc"
                   class="cursor"
-                  @click="router.push({ path: `/knowledge/${item.id}/document` })"
+                  @click="
+                    router.push({ path: `/knowledge/${item.id}/${currentFolder.id}/document` })
+                  "
                 >
                   <template #icon>
                     <KnowledgeIcon :type="item.type" />
@@ -260,6 +262,7 @@
     </ContentContainer>
 
     <component :is="currentCreateDialog" ref="CreateKnowledgeDialogRef" />
+    <CreateFolderDialog ref="CreateFolderDialogRef" @refresh="refreshFolder" />
   </LayoutContainer>
 </template>
 
@@ -268,6 +271,7 @@ import { onMounted, ref, reactive, shallowRef, nextTick } from 'vue'
 import KnowledgeIcon from '@/views/knowledge/component/KnowledgeIcon.vue'
 import CreateKnowledgeDialog from './create-component/CreateKnowledgeDialog.vue'
 import CreateWebKnowledgeDialog from './create-component/CreateWebKnowledgeDialog.vue'
+import CreateFolderDialog from '@/components/folder-tree/CreateFolderDialog.vue'
 import KnowledgeApi from '@/api/knowledge/knowledge'
 import { MsgSuccess, MsgConfirm } from '@/utils/message'
 import useStore from '@/stores'
@@ -365,6 +369,16 @@ function folderClickHandel(row: any) {
   knowledgeList.value = []
   getList()
 }
+const CreateFolderDialogRef = ref()
+
+function openCreateFolder() {
+  CreateFolderDialogRef.value.open('KNOWLEDGE', currentFolder.value.parent_id)
+}
+
+function refreshFolder() {
+  getFolder()
+  getList()
+}
 
 onMounted(() => {
   getFolder()