feat: 解决bug

ui/package.json

@@ -14,7 +14,7 @@
   },
   "dependencies": {
     "axios": "^0.27.2",
-    "element-plus": "^2.3.14",
+    "element-plus": "^2.4.3",
     "install": "^0.13.0",
     "lodash": "^4.17.21",
     "markdown-it": "^13.0.2",

ui/src/api/document.ts

@@ -36,7 +36,7 @@ const getDocument: (dataset_id: string, name?: string) => Promise<Result<any>> =
 }
 
 /**
- * 创建文档
+ * 创建批量文档
  * @param 参数 
  * {
   "name": "string",
@@ -58,7 +58,7 @@ const postDocument: (dataset_id: string, data: any) => Promise<Result<any>> = (
   dataset_id,
   data
 ) => {
-  return post(`${prefix}/${dataset_id}/document`, data)
+  return post(`${prefix}/${dataset_id}/document/_bach`, data)
 }
 
 /**

ui/src/components/back-button/index.vue

@@ -14,13 +14,16 @@ const props = defineProps({
   to: String
 })
 
+const emit = defineEmits(['click'])
 /* 上一层路由 */
 const back: any = router.options.history.state.back
 function jump() {
   if (props.to === '-1') {
     back ? router.push(back) : router.go(-1)
-  } else {
+  } else if (props.to) {
     router.push(props.to as RouteLocationRaw)
+  } else {
+    emit('click')
   }
 }
 </script>

ui/src/components/card-box/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-card shadow="always" class="card-box" @mouseenter="cardEnter()" @mouseleave="cardLeave()">
+  <el-card shadow="hover" class="card-box" @mouseenter="cardEnter()" @mouseleave="cardLeave()">
     <div class="card-header">
       <slot name="header">
         <div class="title flex align-center">

ui/src/components/layout-container/index.vue

@@ -1,7 +1,9 @@
 <template>
   <div class="content-container">
     <div class="content-container__header flex align-center" v-if="slots.header || header">
+      <slot name="backButton">
         <back-button :to="backTo" v-if="showBack"></back-button>
+      </slot>
       <h3>{{ header }}</h3>
       <slot name="header"> </slot>
     </div>

ui/src/styles/app.scss

@@ -116,6 +116,10 @@ h4 {
 .mt-16 {
   margin-top: calc(var(--app-base-px) * 2);
 }
+
+.mb-4 {
+  margin-bottom: calc(var(--app-base-px) - 4px);
+}
 .mb-8 {
   margin-bottom: var(--app-base-px);
 }
@@ -416,3 +420,11 @@ h4 {
     border-right-color: transparent;
   }
 }
+
+
+.file-List-card {
+  border-radius: 4px;
+  .el-card__body {
+    padding: 8px 16px 8px 12px;
+  }
+}

ui/src/styles/element-plus.scss

@@ -74,25 +74,6 @@
   }
 }
 
-// @media only screen and (min-width: 1400px) {
-//   .app-list-row {
-//     .el-col-lg-6 {
-//       display: block;
-//       max-width: 20.8333333333%;
-//       flex: 0 0 20.8333333333%;
-//     }
-//   }
-// }
-// @media only screen and (min-width: 1920px) {
-//   .app-list-row {
-//     .el-col-xl-4 {
-//       display: block;
-//       max-width: 16.6666666667%;
-//       flex: 0 0 16.6666666667%;
-//     }
-//   }
-// }
-
 .el-card {
   --el-card-padding: calc(var(--app-base-px) * 2);
 }
@@ -197,3 +178,7 @@
 .el-select-group .el-select-dropdown__item {
   padding-left: 11px;
 }
+
+.el-tabs__header {
+  margin: 0 0 12px;
+}

ui/src/views/application/AppOverview.vue

@@ -23,7 +23,13 @@
           <el-col :span="12">
             <div class="flex">
               <el-text type="info">公开访问链接</el-text>
-              <el-switch class="ml-8" inline-prompt active-text="开" inactive-text="关" />
+              <el-switch
+                class="ml-8"
+                size="small"
+                inline-prompt
+                active-text="开"
+                inactive-text="关"
+              />
             </div>
 
             <div class="mt-4">
@@ -43,7 +49,13 @@
           <el-col :span="12">
             <div class="flex">
               <el-text type="info">API访问凭据</el-text>
-              <el-switch class="ml-8" inline-prompt active-text="开" inactive-text="关" />
+              <el-switch
+                class="ml-8"
+                size="small"
+                inline-prompt
+                active-text="开"
+                inactive-text="关"
+              />
             </div>
             <div class="mt-4">
               <span class="vertical-middle lighter">
@@ -78,7 +90,6 @@ const {
   params: { id }
 } = route as any
 
-
 const EmbedDialogRef = ref()
 const shareUrl = ref('')
 const accessToken = ref('')

ui/src/views/application/CreateAndSetting.vue

@@ -1,7 +1,7 @@
 <template>
   <LayoutContainer
     :header="id ? '设置' : '创建应用'"
-    :back-to="id ? '' : -1"
+    :back-to="id ? '' : '-1'"
     class="create-application"
   >
     <el-row v-loading="loading">
@@ -68,16 +68,19 @@
                       /></el-icon>
                     </el-option>
                   </el-option-group>
-                  <div class="border-t" style="padding: 8px 11px">
+                  <template #footer>
                     <el-button type="primary" link @click="openCreateModel">
                       <el-icon class="mr-4"><Plus /></el-icon> 添加模型
                     </el-button>
-                  </div>
+                  </template>
                 </el-select>
               </el-form-item>
 
               <el-form-item label="多轮对话" @click.prevent>
-                <el-switch v-model="applicationForm.multiple_rounds_dialogue"></el-switch>
+                <el-switch
+                  size="small"
+                  v-model="applicationForm.multiple_rounds_dialogue"
+                ></el-switch>
               </el-form-item>
               <el-form-item label="关联数据集">
                 <template #label>
@@ -230,9 +233,13 @@ const modelOptions = ref<any>(null)
 const providerOptions = ref<Array<Provider>>([])
 const datasetList = ref([])
 
-watch(exampleList.value, () => {
+watch(
-  applicationForm.value.example = exampleList.value.filter((v) => v)
+  () => exampleList.value,
-})
+  (val) => {
+    applicationForm.value.example = val.filter((v) => v)
+  },
+  { deep: true }
+)
 
 const submit = async (formEl: FormInstance | undefined) => {
   if (!formEl) return

ui/src/views/application/index.vue

@@ -15,7 +15,6 @@
         :gutter="15"
         v-infinite-scroll="loadDataset"
         :infinite-scroll-disabled="disabledScroll"
-        class="app-list-row"
       >
         <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb-16">
           <CardAdd title="创建应用" @click="router.push({ path: '/application/create' })" />
@@ -79,7 +78,7 @@
                       <el-dropdown-menu>
                         <div class="dropdown-custom-switch">
                           <span>运行中</span>
-                          <!-- <el-switch v-model="item.status"  @change="changeState($event, item)"  /> -->
+                          <!-- <el-switch size="small" v-model="item.status"  @change="changeState($event, item)"  /> -->
                         </div>
                         <el-dropdown-item divided @click="deleteApplication(item)"
                           >删除</el-dropdown-item

ui/src/views/dataset/CreateDataset.vue

@@ -1,5 +1,12 @@
 <template>
-  <LayoutContainer header="创建数据集" back-to="-1" class="create-dataset">
+  <LayoutContainer
+    :header="isCreate ? '创建数据集' : '上传文档'"
+    back-to="-1"
+    class="create-dataset"
+  >
+    <template #backButton>
+      <back-button @click="back"></back-button>
+    </template>
     <template #header>
       <el-steps :active="active" finish-status="success" align-center class="create-dataset__steps">
         <el-step v-for="(item, index) in steps" :key="index">
@@ -23,28 +30,7 @@
           <component :is="steps[active].component" :ref="steps[active]?.ref" />
         </template>
         <template v-else-if="active === 2">
-          <el-result icon="success" title="🎉 数据集创建成功 🎉">
+          <ResultSuccess :data="successInfo" />
-            <template #sub-title>
-              <div class="mt-8">
-                <span class="bold">{{ successInfo?.document_count || 0 }}</span>
-                <el-text type="info" class="ml-4">文档</el-text>
-                <el-divider direction="vertical" />
-                <span class="bold">{{ successInfo?.document_list.length || 0 }}</span>
-                <el-text type="info" class="ml-4">分段</el-text>
-                <el-divider direction="vertical" />
-                <span class="bold">{{ toThousands(successInfo?.char_length) || 0 }}</span>
-                <el-text type="info" class="ml-4">字符</el-text>
-              </div>
-            </template>
-            <template #extra>
-              <el-button @click="router.push({ path: `/dataset` })">返回数据集列表</el-button>
-              <el-button
-                type="primary"
-                @click="router.push({ path: `/dataset/${successInfo?.id}/document` })"
-                >前往文档</el-button
-              >
-            </template>
-          </el-result>
         </template>
       </div>
     </div>
@@ -65,11 +51,12 @@ import { ref, computed } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 import StepFirst from './step/StepFirst.vue'
 import StepSecond from './step/StepSecond.vue'
+import ResultSuccess from './step/ResultSuccess.vue'
 import datasetApi from '@/api/dataset'
 import type { datasetData } from '@/api/type/dataset'
 import documentApi from '@/api/document'
-import { MsgSuccess } from '@/utils/message'
+import { MsgConfirm, MsgSuccess } from '@/utils/message'
-import { toThousands } from '@/utils/utils'
+
 import useStore from '@/stores'
 const { dataset } = useStore()
 const baseInfo = computed(() => dataset.baseInfo)
@@ -77,9 +64,10 @@ const baseInfo = computed(() => dataset.baseInfo)
 const router = useRouter()
 const route = useRoute()
 const {
-  query: { id }
+  query: { id, type }
-} = route as any
+} = route
 
+const isCreate = type === 'create'
 const steps = [
   {
     ref: 'StepFirstRef',
@@ -125,7 +113,7 @@ function submit() {
   const obj = { ...baseInfo.value, documents } as datasetData
   if (id) {
     documentApi
-      .postDocument(id, documents)
+      .postDocument(id as string, documents)
       .then((res) => {
         MsgSuccess('提交成功')
         clearStore()
@@ -148,6 +136,21 @@ function submit() {
       })
   }
 }
+function back() {
+  if (baseInfo.value || StepSecondRef.value?.paragraphList?.length > 0) {
+    MsgConfirm(`提示`, `当前的更改尚未保存，确认退出吗?`, {
+      confirmButtonText: '确认',
+      type: 'warning'
+    })
+      .then(() => {
+        router.go(-1)
+        clearStore()
+      })
+      .catch(() => {})
+  } else {
+    router.go(-1)
+  }
+}
 </script>
 <style lang="scss" scoped>
 .create-dataset {

ui/src/views/dataset/component/ParagraphPreview.vue

@@ -9,6 +9,10 @@
           </div>
         </template>
         <el-scrollbar>
+          <div class="mb-16">
+            <el-text type="info">{{ item.content.length }} 段落</el-text>
+          </div>
+
           <div class="paragraph-list">
             <el-card
               v-for="(child, cIndex) in item.content"

ui/src/views/dataset/component/UploadComponent.vue

@@ -112,12 +112,7 @@ defineExpose({
 })
 </script>
 <style scoped lang="scss">
-.file-List-card {
+
-  border-radius: 4px;
-  :deep(.el-card__body) {
-    padding: 8px 16px 8px 12px;
-  }
-}
 .upload__decoration {
   font-size: 12px;
   line-height: 20px;

ui/src/views/dataset/index.vue

@@ -15,7 +15,6 @@
         :gutter="15"
         v-infinite-scroll="loadDataset"
         :infinite-scroll-disabled="disabledScroll"
-        class="app-list-row"
       >
         <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb-16">
           <CardAdd title="创建数据集" @click="router.push({ path: '/dataset/create' })" />

ui/src/views/dataset/step/ResultSuccess.vue

@@ -0,0 +1,74 @@
+<template>
+  <el-scrollbar>
+    <el-result icon="success" title="🎉 数据集创建成功 🎉">
+      <template #sub-title>
+        <div class="mt-8">
+          <span class="bold">{{ data?.document_count || 0 }}</span>
+          <el-text type="info" class="ml-4">文档</el-text>
+          <el-divider direction="vertical" />
+          <span class="bold">{{ data?.document_list.length || 0 }}</span>
+          <el-text type="info" class="ml-4">分段</el-text>
+          <el-divider direction="vertical" />
+          <span class="bold">{{ numberFormat(data?.char_length) || 0 }}</span>
+          <el-text type="info" class="ml-4">字符</el-text>
+        </div>
+      </template>
+      <template #extra>
+        <el-button @click="router.push({ path: `/dataset` })">返回数据集列表</el-button>
+        <el-button type="primary" @click="router.push({ path: `/dataset/${data?.id}/document` })"
+          >前往文档</el-button
+        >
+      </template>
+    </el-result>
+    <div class="result-success">
+      <p class="bolder">文档列表</p>
+      <el-card
+        shadow="never"
+        class="file-List-card mt-8"
+        v-for="(item, index) in data?.document_list"
+        :key="index"
+      >
+        <div class="flex-between">
+          <div class="flex">
+            <img :src="getImgUrl(item && item?.name)" alt="" />
+            <div class="ml-8">
+              <p>{{ item && item?.name }}</p>
+              <el-text type="info">{{ filesize(item && item?.char_length) }}</el-text>
+            </div>
+          </div>
+          <div>
+            <el-text type="info" class="mr-16">{{ item && item?.paragraph_count }} 个分段</el-text>
+            <el-text v-if="item.status === '1'">
+              <el-icon class="success"><SuccessFilled /></el-icon>
+            </el-text>
+            <el-text v-else-if="item.status === '2'">
+              <el-icon class="danger"><CircleCloseFilled /></el-icon>
+            </el-text>
+            <el-text v-else-if="item.status === '0'">
+              <el-icon class="is-loading primary"><Loading /></el-icon> 导入中...
+            </el-text>
+          </div>
+        </div>
+      </el-card>
+    </div>
+  </el-scrollbar>
+</template>
+<script setup lang="ts">
+import { useRouter, useRoute } from 'vue-router'
+import { numberFormat } from '@/utils/utils'
+import { filesize, getImgUrl } from '@/utils/utils'
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => {}
+  }
+})
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.result-success {
+  width: 70%;
+  margin: 0 auto;
+  margin-bottom: 30px;
+}
+</style>

ui/src/views/dataset/step/StepSecond.vue

@@ -2,21 +2,31 @@
   <div class="set-rules">
     <el-row>
       <el-col :span="10" class="p-24">
-        <h4 class="title-decoration-1 mb-8">设置分段规则</h4>
+        <h4 class="title-decoration-1 mb-16">设置分段规则</h4>
         <div class="set-rules__right">
           <el-scrollbar>
-            <div class="left-height">
+            <div class="left-height" @click.stop>
               <el-radio-group v-model="radio" class="set-rules__radio">
-                <el-radio label="1" size="large" border class="mb-16">
+                <el-card shadow="never" class="mb-16" :class="radio === '1' ? 'active' : ''">
-                  <p>智能分段（推荐)</p>
+                  <el-radio label="1" size="large">
+                    <p class="mb-4">智能分段（推荐)</p>
                     <el-text type="info">不了解如何设置分段规则推荐使用智能分段</el-text>
                   </el-radio>
-                <el-radio label="2" size="large" border class="mb-16">
+                </el-card>
-                  <p>高级分段</p>
+                <el-card shadow="never" class="mb-16" :class="radio === '2' ? 'active' : ''">
+                  <el-radio label="2" size="large">
+                    <p class="mb-4">高级分段</p>
                     <el-text type="info"
                       >用户可根据文档规范自行设置分段标识符、分段长度以及清洗规则
                     </el-text>
-                  <el-card shadow="never" class="card-never mt-16" v-if="radio === '2'">
+                  </el-radio>
+
+                  <el-card
+                    v-if="radio === '2'"
+                    shadow="never"
+                    class="card-never mt-16"
+                    style="margin-left: 30px"
+                  >
                     <div class="set-rules__form">
                       <div class="form-item mb-16">
                         <div class="title flex align-center mb-8">
@@ -31,23 +41,18 @@
                             </el-icon>
                           </el-tooltip>
                         </div>
-
+                        <div @click.stop>
-                        <el-select
+                          <el-select v-model="form.patterns" multiple placeholder="请选择">
-                          v-loading="patternLoading"
-                          v-model="form.patterns"
-                          multiple
-                          placeholder="请选择"
-                        >
                             <el-option
-                            v-for="item in splitPatternList"
+                              v-for="(item, index) in splitPatternList"
-                            :key="item"
+                              :key="index"
                               :label="item.key"
                               :value="item.value"
-                            multiple
                             >
                             </el-option>
                           </el-select>
                         </div>
+                      </div>
                       <div class="form-item mb-16">
                         <div class="title mb-8">分段长度</div>
                         <el-slider
@@ -60,14 +65,14 @@
                       </div>
                       <div class="form-item mb-16">
                         <div class="title mb-8">自动清洗</div>
-                        <el-switch v-model="form.with_filter" />
+                        <el-switch size="small" v-model="form.with_filter" />
                         <div style="margin-top: 4px">
                           <el-text type="info">去掉重复多余符号空格、空行、制表符</el-text>
                         </div>
                       </div>
                     </div>
                   </el-card>
-                </el-radio>
+                </el-card>
               </el-radio-group>
             </div>
           </el-scrollbar>
@@ -108,8 +113,8 @@ const form = reactive<{
   [propName: string]: any
 }>({
   patterns: [],
-  limit: 0,
+  limit: 500,
-  with_filter: false
+  with_filter: true
 })
 
 function splitDocument() {
@@ -129,7 +134,8 @@ function splitDocument() {
       }
     })
   }
-  documentApi.postSplitDocument(fd)
+  documentApi
+    .postSplitDocument(fd)
     .then((res: any) => {
       paragraphList.value = res.data
       loading.value = false
@@ -169,25 +175,27 @@ defineExpose({
   }
 
   &__radio {
+    width: 100%;
     display: block;
 
     .el-radio {
       white-space: break-spaces;
       width: 100%;
       height: 100%;
-      padding: calc(var(--app-base-px) * 2);
       line-height: 22px;
       color: var(--app-text-color);
     }
 
     :deep(.el-radio__label) {
-      padding-left: 32px;
+      padding-left: 30px;
       width: 100%;
     }
-
     :deep(.el-radio__input) {
       position: absolute;
-      top: 30px;
+      top: 16px;
+    }
+    .active {
+      border: 1px solid var(--el-color-primary);
     }
   }
 

ui/src/views/document/index.vue

@@ -39,7 +39,7 @@
           </el-table-column>
           <el-table-column prop="char_length" label="字符数" align="right">
             <template #default="{ row }">
-              {{ toThousands(row.char_length) }}
+              {{ numberFormat(row.char_length) }}
             </template>
           </el-table-column>
           <el-table-column prop="paragraph_count" label="分段" align="right" />
@@ -56,10 +56,14 @@
               </el-text>
             </template>
           </el-table-column>
-          <el-table-column prop="name" label="启动状态">
+          <el-table-column prop="name" label="启用状态">
             <template #default="{ row }">
               <div @click.stop>
-                <el-switch v-model="row.is_active" @change="changeState($event, row)" />
+                <el-switch
+                  size="small"
+                  v-model="row.is_active"
+                  @change="changeState($event, row)"
+                />
               </div>
             </template>
           </el-table-column>
@@ -97,10 +101,10 @@
   </LayoutContainer>
 </template>
 <script setup lang="ts">
-import { ref, onMounted, reactive,computed } from 'vue'
+import { ref, onMounted, reactive, computed } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 import documentApi from '@/api/document'
-import { toThousands } from '@/utils/utils'
+import { numberFormat } from '@/utils/utils'
 import { datetimeFormat } from '@/utils/time'
 import { MsgSuccess, MsgConfirm } from '@/utils/message'
 const router = useRouter()
@@ -121,7 +125,7 @@ const paginationConfig = reactive({
 })
 
 const dataList = computed(() =>
-documentData.value.slice(
+  documentData.value.slice(
     (paginationConfig.currentPage - 1) * paginationConfig.pageSize,
     paginationConfig.currentPage * paginationConfig.pageSize
   )
@@ -175,14 +179,14 @@ function deleteDocument(row: any) {
 /*
   更新名称或状态
 */
-function updateData(documentId: string, data: any) {
+function updateData(documentId: string, data: any, msg: string) {
   loading.value = true
   documentApi
     .putDocument(id, documentId, data)
     .then((res) => {
       const index = documentData.value.findIndex((v) => v.id === documentId)
       documentData.value.splice(index, 1, res.data)
-      MsgSuccess('修改成功')
+      MsgSuccess(msg)
       loading.value = false
     })
     .catch(() => {
@@ -194,14 +198,15 @@ function changeState(bool: Boolean, row: any) {
   const obj = {
     is_active: bool
   }
-  currentMouseId.value && updateData(row.id, obj)
+  const str = bool ? '启用成功' : '禁用成功'
+  currentMouseId.value && updateData(row.id, obj, str)
 }
 
 function editName(val: string) {
   const obj = {
     name: val
   }
-  currentMouseId.value && updateData(currentMouseId.value, obj)
+  currentMouseId.value && updateData(currentMouseId.value, obj, '修改成功')
 }
 
 function cellMouseEnter(row: any) {

ui/src/views/paragraph/component/ParagraphDialog.vue

@@ -97,7 +97,7 @@ const submitHandle = async () => {
         .then(() => {
           emit('refresh')
           loading.value = false
-          dialogVisible.value = false
+          isEdit.value = false
         })
         .catch(() => {
           loading.value = false

ui/src/views/paragraph/index.vue

@@ -45,7 +45,11 @@
                 @click="editParagraph(item)"
               >
                 <div class="active-button" @click.stop>
-                  <el-switch v-model="item.is_active" @change="changeState($event, item)" />
+                  <el-switch
+                    v-model="item.is_active"
+                    @change="changeState($event, item)"
+                    size="small"
+                  />
                 </div>
 
                 <template #footer>

ui/src/views/template/component/ModelCard.vue

@@ -71,6 +71,7 @@ const icon = computed(() => {
 <style lang="scss" scoped>
 .model-card {
   min-height: 153px;
+  min-width: auto;
   .operation-button {
     position: absolute;
     right: 12px;

ui/src/views/template/index.vue

@@ -30,7 +30,7 @@
               @change="list_model"
               placeholder="按 名称 搜索"
               prefix-icon="Search"
-              class="w-240"
+              style="max-width: 240px"
             />
           </div>
         </div>
@@ -66,7 +66,10 @@
       @change="openCreateModel($event)"
     ></CreateModelDialog>
 
-    <SelectProviderDialog ref="selectProviderRef" @change="openCreateModel($event)"></SelectProviderDialog>
+    <SelectProviderDialog
+      ref="selectProviderRef"
+      @change="openCreateModel($event)"
+    ></SelectProviderDialog>
   </LayoutContainer>
 </template>