polish

ZhiShuYun · Jan 28, 2024 · 969222d · 969222d
1 parent ab21121
commit 969222d
Show file tree

Hide file tree

Showing 14 changed files with 314 additions and 135 deletions.
diff --git a/src/components/chatdoc/CreateRepository.vue b/src/components/chatdoc/CreateRepository.vue
@@ -0,0 +1,90 @@
+<template>
+  <el-dialog v-model="dialogVisible" width="500px">
+    <el-form ref="form" label-width="60px">
+      <el-form-item :label="$t('chatdoc.field.name')" :prop="form.name">
+        <el-input v-model="form.name" />
+      </el-form-item>
+      <el-form-item :label="$t('chatdoc.field.description')" :prop="form.description">
+        <el-input v-model="form.description" />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="onSubmit">{{ $t('common.button.create') }}</el-button>
+      </el-form-item>
+    </el-form>
+  </el-dialog>
+  <button class="btn btn-create" @click="dialogVisible = true">
+    <font-awesome-icon :icon="['fas', 'plus']" />
+  </button>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { ElButton, ElDialog, ElMessage, ElForm, ElFormItem, ElInput } from 'element-plus';
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
+
+interface IData {
+  dialogVisible: boolean;
+  creating: boolean;
+  form: {
+    name: string;
+    description: string;
+  };
+}
+
+export default defineComponent({
+  name: 'UploadDocument',
+  components: {
+    ElButton,
+    ElDialog,
+    ElForm,
+    ElFormItem,
+    ElInput,
+    FontAwesomeIcon
+  },
+  data(): IData {
+    return {
+      dialogVisible: false,
+      creating: false,
+      form: {
+        name: '',
+        description: ''
+      }
+    };
+  },
+  computed: {},
+  methods: {
+    async onSubmit() {
+      this.creating = true;
+      this.$store
+        .dispatch('chatdoc/createRepository', {
+          name: this.form.name,
+          description: this.form.description
+        })
+        .then(() => {
+          this.creating = false;
+          ElMessage.success(this.$t('chatdoc.message.createDocumentSuccess'));
+          this.dialogVisible = false;
+          this.$store.dispatch('chatdoc/getRepositories');
+        })
+        .catch(() => {
+          this.creating = false;
+          ElMessage.error(this.$t('chatdoc.message.createRepositoryFailed'));
+        });
+    }
+  }
+});
+</script>
+
+<style scoped lang="scss">
+.btn.btn-create {
+  text-align: center;
+  cursor: pointer;
+  border: none;
+  width: 50px;
+  height: 50px;
+  border-radius: 50%;
+  margin-top: 5px;
+  background-color: #eee;
+  margin-bottom: 0;
+}
+</style>
diff --git a/src/components/chatdoc/InputBox.vue b/src/components/chatdoc/InputBox.vue
@@ -1,27 +1,5 @@
 <template>
   <div class="input-box">
-    <el-upload
-      v-model:file-list="fileList"
-      :class="{
-        upload: true,
-        disabled: !canUpload
-      }"
-      :disabled="!canUpload"
-      name="file"
-      :show-file-list="true"
-      :limit="1"
-      :multiple="false"
-      action="/api/v1/files/"
-      :on-exceed="onExceed"
-      :on-error="onError"
-      :headers="headers"
-    >
-      <el-tooltip class="box-item" effect="dark" :content="$t('chat.message.uploadFile')" placement="top">
-        <span class="btn btn-upload">
-          <font-awesome-icon icon="fa-solid fa-paperclip" class="icon icon-attachment" />
-        </span>
-      </el-tooltip>
-    </el-upload>
     <span
       :class="{
         btn: true,
@@ -56,54 +34,32 @@ export default defineComponent({
   name: 'InputBox',
   components: {
     ElInput,
-    ElTooltip,
-    FontAwesomeIcon,
-    ElUpload
+    FontAwesomeIcon
   },
   props: {
     disabled: {
       type: Boolean,
       required: false,
       default: false
     },
-    references: {
-      type: Array,
-      required: false,
-      default: () => []
-    },
     question: {
       type: String,
       required: true
     }
   },
-  emits: ['update:question', 'update:references', 'submit'],
+  emits: ['update:question', 'submit'],
   data() {
     return {
       questionValue: this.question,
       fileList: []
     };
   },
   computed: {
-    headers() {
-      return {
-        Authorization: `Bearer ${this.$store.state.token.access}`
-      };
-    },
-    urls(): string[] {
-      // @ts-ignore
-      return this.fileList.map((file: UploadFile) => file?.response?.file_url);
-    },
-    canUpload() {
-      return [CHAT_MODEL_CHATGPT4_VISION.name].includes(this.model.name);
-    },
     model(): IChatModel {
       return this.$store.state.chat.model;
     }
   },
   watch: {
-    urls(val) {
-      this.$emit('update:references', val);
-    },
     questionValue(val: string) {
       this.$emit('update:question', val);
     },
@@ -124,12 +80,6 @@ export default defineComponent({
         return;
       }
       this.$emit('submit');
-    },
-    onExceed() {
-      ElMessage.warning(this.$t('chat.message.uploadReferencesExceed'));
-    },
-    onError() {
-      ElMessage.error(this.$t('chat.message.uploadReferencesError'));
     }
   }
 });
@@ -168,21 +118,10 @@ export default defineComponent({
   background: none;
   box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
   top: 30px;
-  .upload {
-    display: inline-block;
-    &.disabled {
-      .btn-upload {
-        cursor: not-allowed;
-        .icon-attachment {
-          color: #eee;
-        }
-      }
-    }
-  }
   .input {
     border: none;
     width: calc(100% - 80px);
-    margin-left: 30px;
+    margin-left: 5px;
   }
   .info {
     display: block;
@@ -198,13 +137,6 @@ export default defineComponent({
     cursor: pointer;
     position: absolute;
     top: 7px;
-    &.btn-upload {
-      left: 10px;
-      .icon-attachment {
-        font-size: 14px;
-        color: #666;
-      }
-    }
     &.btn-send {
       right: 15px;
       &.disabled {

diff --git a/src/components/chatdoc/UploadDocument.vue b/src/components/chatdoc/UploadDocument.vue
@@ -95,3 +95,9 @@ export default defineComponent({
   }
 });
 </script>
+
+<style scoped lang="scss">
+.el-button {
+  border-radius: 20px;
+}
+</style>
diff --git a/src/i18n/zh/chatdoc/field.ts b/src/i18n/zh/chatdoc/field.ts
@@ -7,5 +7,7 @@ export default {
   state: '状态',
   stateProcessing: '学习中',
   stateCompleted: '学习完成',
-  stateFailed: '学习失败'
+  stateFailed: '学习失败',
+  name: '名称',
+  description: '描述'
 };
diff --git a/src/i18n/zh/chatdoc/message.ts b/src/i18n/zh/chatdoc/message.ts
@@ -19,5 +19,9 @@ export default {
   errorTimeout: '回答问题超时，请稍后重试',
   errorNotApplied: '您尚未申请该服务，请先申请再继续提问',
   confirmDelete: '确定删除',
-  howToUse: '按 Shift+Enter 键可以换行'
+  howToUse: '按 Shift+Enter 键可以换行',
+  createRepositorySuccess: '创建知识库成功',
+  createRepositoryFailed: '创建知识库失败',
+  deleteRepositorySuccess: '删除知识库成功',
+  deleteDocumentSuccess: '删除文档成功'
 };
diff --git a/src/i18n/zh/chatdoc/title.ts b/src/i18n/zh/chatdoc/title.ts
@@ -1,3 +1,4 @@
 export default {
-  knowledge: '我的知识库'
+  knowledge: '我的知识库',
+  createRepository: '创建知识库'
 };
diff --git a/src/i18n/zh/common/button.ts b/src/i18n/zh/common/button.ts
@@ -29,5 +29,6 @@ export default {
   buyMore: '购买更多',
   update: '更新',
   copy: '复制',
-  stop: '停止'
+  stop: '停止',
+  create: '创建'
 };
diff --git a/src/layouts/Chatdoc.vue b/src/layouts/Chatdoc.vue
@@ -19,12 +19,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { ElMenu, ElMenuItem } from 'element-plus';
-import {
-  ROUTE_CHATDOC_CONVERSATION,
-  ROUTE_CHATDOC_CONVERSATION_NEW,
-  ROUTE_CHATDOC_KNOWLEDGE,
-  ROUTE_CHATDOC_SETTING
-} from '@/router';
+import { ROUTE_CHATDOC_CONVERSATION_NEW, ROUTE_CHATDOC_KNOWLEDGE } from '@/router';
 import { RouteLocationRaw } from 'vue-router';
 
 interface IMenuItem {
@@ -36,7 +31,6 @@ interface IMenuItem {
 interface IData {
   repositoryId: string;
   drawer: boolean;
-  activeMenu: string | undefined;
   menuItems: IMenuItem[];
 }
 
@@ -50,7 +44,6 @@ export default defineComponent({
     return {
       repositoryId: this.$route.params?.repositoryId?.toString(),
       drawer: false,
-      activeMenu: undefined,
       menuItems: [
         {
           index: 'chat',
@@ -78,6 +71,16 @@ export default defineComponent({
       ]
     };
   },
+  computed: {
+    activeMenu() {
+      // @ts-ignore
+      const filterResult = this.menuItems.filter((menuItem) => menuItem.route?.name === this.$route.name);
+      if (filterResult) {
+        return filterResult[0]?.index;
+      }
+      return undefined;
+    }
+  },
   async mounted() {
     await this.onGetApplications();
     await this.onGetRepositories();
@@ -96,7 +99,7 @@ export default defineComponent({
           // @ts-ignore
           ...menuItem.route,
           params: {
-            id: this.id
+            id: this.repositoryId
           }
         });
       }

diff --git a/src/operators/chatdoc/operator.ts b/src/operators/chatdoc/operator.ts
@@ -12,11 +12,19 @@ import { ACTION_RETRIEVE_ALL, ACTION_UPDATE, BASE_URL_API } from '@/constants';
 import { ACTION_CREATE, ACTION_DELETE, ACTION_RETRIEVE, ACTION_RETRIEVE_BATCH } from '@/constants';
 
 class ChatdocOperator {
-  async createRepository(options: { token: string }): Promise<AxiosResponse<IChatdocRepositoryResponse>> {
+  async createRepository(
+    payload: {
+      name: string;
+      description?: string;
+    },
+    options: { token: string }
+  ): Promise<AxiosResponse<IChatdocRepositoryResponse>> {
     return await axios.post(
-      `/chatdoc/tasks`,
+      `/chatdoc/repositories`,
       {
-        action: ACTION_CREATE
+        action: ACTION_CREATE,
+        name: payload.name,
+        description: payload.description
       },
       {
         headers: {