feat: 知识库设置增加embedding模型

ui/src/api/dataset.ts

@@ -129,11 +129,12 @@ const getDatasetDetail: (dataset_id: string, loading?: Ref<boolean>) => Promise<
       "desc": true
     }
  */
-const putDataset: (dataset_id: string, data: any) => Promise<Result<any>> = (
-  dataset_id,
-  data: any
-) => {
-  return put(`${prefix}/${dataset_id}`, data)
+const putDataset: (
+  dataset_id: string,
+  data: any,
+  loading?: Ref<boolean>
+) => Promise<Result<any>> = (dataset_id, data, loading) => {
+  return put(`${prefix}/${dataset_id}`, data, undefined, loading)
 }
 /**
  * 获取知识库 可关联的应用列表

ui/src/views/dataset/DatasetSetting.vue

@@ -105,7 +105,7 @@ import { useRoute } from 'vue-router'
 import BaseForm from '@/views/dataset/component/BaseForm.vue'
 import datasetApi from '@/api/dataset'
 import type { ApplicationFormType } from '@/api/type/application'
-import { MsgSuccess } from '@/utils/message'
+import { MsgSuccess, MsgConfirm } from '@/utils/message'
 import { isAppIcon } from '@/utils/application'
 import useStore from '@/stores'
 const route = useRoute()
@@ -120,6 +120,8 @@ const loading = ref(false)
 const detail = ref<any>({})
 const application_list = ref<Array<ApplicationFormType>>([])
 const application_id_list = ref([])
+const cloneModelId = ref('')
+
 const form = ref<any>({
   source_url: '',
   selector: ''
@@ -133,7 +135,6 @@ async function submit() {
   if (await BaseFormRef.value?.validate()) {
     await webFormRef.value.validate((valid: any) => {
       if (valid) {
-        loading.value = true
         const obj =
           detail.value.type === '1'
             ? {
@@ -145,27 +146,49 @@ async function submit() {
                 application_id_list: application_id_list.value,
                 ...BaseFormRef.value.form
               }
-        datasetApi
-          .putDataset(id, obj)
-          .then((res) => {
+
+        if (cloneModelId.value !== BaseFormRef.value.form.embedding_mode_id) {
+          MsgConfirm(`提示`, `修改知识库向量模型后，需要对知识库重新向量化，是否继续保存？`, {
+            confirmButtonText: '重新向量化',
+            confirmButtonClass: 'primary'
+          })
+            .then(() => {
+              datasetApi.putDataset(id, obj, loading).then((res) => {
+                datasetApi.putReEmbeddingDataset(id).then(() => {
+                  MsgSuccess('保存成功')
+                })
+              })
+            })
+            .catch(() => {})
+        } else {
+          datasetApi.putDataset(id, obj, loading).then((res) => {
             MsgSuccess('保存成功')
-            loading.value = false
-          })
-          .catch(() => {
-            loading.value = false
           })
+        }
       }
     })
   }
 }
 
+function reEmbeddingDataset(row: any) {
+  datasetApi.putReEmbeddingDataset(row.id).then(() => {
+    MsgSuccess('提交成功')
+  })
+}
+
+function saveDataset(data: any) {
+  datasetApi.putDataset(id, data, loading).then((res) => {
+    MsgSuccess('保存成功')
+  })
+}
+
 function getDetail() {
   dataset.asyncGetDatasetDetail(id, loading).then((res: any) => {
     detail.value = res.data
+    cloneModelId.value = res.data?.embedding_mode_id
     if (detail.value.type === '1') {
       form.value = res.data.meta
     }
-
     application_id_list.value = res.data?.application_id_list
     datasetApi.listUsableApplication(id, loading).then((ok) => {
       application_list.value = ok.data

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

@@ -5,6 +5,7 @@
     :rules="rules"
     label-position="top"
     require-asterisk-position="right"
+    v-loading="loading"
   >
     <el-form-item label="知识库名称" prop="name">
       <el-input
@@ -29,23 +30,69 @@
     <el-form-item label="Embedding模型" prop="embedding_mode_id">
       <el-select
         v-model="form.embedding_mode_id"
-        class="w-full m-2"
         placeholder="请选择Embedding模型"
+        class="w-full"
+        popper-class="select-model"
+        :clearable="true"
       >
-        <el-option
-          v-for="item in modelOptions"
-          :key="item.id"
-          :label="item.name"
-          :value="item.id"
-        ></el-option>
+        <el-option-group
+          v-for="(value, label) in modelOptions"
+          :key="value"
+          :label="relatedObject(providerOptions, label, 'provider')?.name"
+        >
+          <el-option
+            v-for="item in value.filter((v: any) => v.status === 'SUCCESS')"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+            class="flex-between"
+          >
+            <div class="flex">
+              <span
+                v-html="relatedObject(providerOptions, label, 'provider')?.icon"
+                class="model-icon mr-8"
+              ></span>
+              <span>{{ item.name }}</span>
+            </div>
+            <el-icon class="check-icon" v-if="item.id === form.embedding_mode_id"
+              ><Check
+            /></el-icon>
+          </el-option>
+          <!-- 不可用 -->
+          <el-option
+            v-for="item in value.filter((v: any) => v.status !== 'SUCCESS')"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+            class="flex-between"
+            disabled
+          >
+            <div class="flex">
+              <span
+                v-html="relatedObject(providerOptions, label, 'provider')?.icon"
+                class="model-icon mr-8"
+              ></span>
+              <span>{{ item.name }}</span>
+              <span class="danger">{{
+                $t('views.application.applicationForm.form.aiModel.unavailable')
+              }}</span>
+            </div>
+            <el-icon class="check-icon" v-if="item.id === form.embedding_mode_id"
+              ><Check
+            /></el-icon>
+          </el-option>
+        </el-option-group>
       </el-select>
     </el-form-item>
   </el-form>
 </template>
 <script setup lang="ts">
 import { ref, reactive, onMounted, onUnmounted, computed, watch } from 'vue'
+import { groupBy } from 'lodash'
 import useStore from '@/stores'
 import type { datasetData } from '@/api/type/dataset'
+import { relatedObject } from '@/utils/utils'
+import type { Provider } from '@/api/type/model'
 
 const props = defineProps({
   data: {
@@ -65,8 +112,11 @@ const rules = reactive({
   desc: [{ required: true, message: '请输入知识库描述', trigger: 'blur' }],
   embedding_mode_id: [{ required: true, message: '请输入Embedding模型', trigger: 'change' }]
 })
+
 const FormRef = ref()
-const modelOptions = ref([])
+const loading = ref(false)
+const modelOptions = ref<any>([])
+const providerOptions = ref<Array<Provider>>([])
 
 watch(
   () => props.data,
@@ -91,12 +141,33 @@ function validate() {
 }
 
 function getModel() {
-  model.asyncGetModel({ model_type: 'EMBEDDING' }).then((res: any) => {
-    modelOptions.value = res?.data
-  })
+  loading.value = true
+  model
+    .asyncGetModel({ model_type: 'EMBEDDING' })
+    .then((res: any) => {
+      modelOptions.value = groupBy(res?.data, 'provider')
+      loading.value = false
+    })
+    .catch(() => {
+      loading.value = false
+    })
+}
+
+function getProvider() {
+  loading.value = true
+  model
+    .asyncGetProvider()
+    .then((res: any) => {
+      providerOptions.value = res?.data
+      loading.value = false
+    })
+    .catch(() => {
+      loading.value = false
+    })
 }
 
 onMounted(() => {
+  getProvider()
   getModel()
 })
 onUnmounted(() => {