From 615b60f8e182046c4bde64e480cf5d217b48c42b Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Mon, 4 Dec 2023 17:24:00 +0800
Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ui/src/views/application/CreateAndSetting.vue      |  9 ++++++++-
 .../application/components/AddDatasetDialog.vue    |  4 +++-
 ui/src/views/application/index.vue                 |  6 +++---
 ui/src/views/dataset/index.vue                     |  6 +++---
 .../{CreateModel.vue => CreateModelDialog.vue}     |  0
 ...SelectProvider.vue => SelectProviderDialog.vue} |  1 -
 ui/src/views/template/index.vue                    | 14 +++++++-------
 7 files changed, 24 insertions(+), 16 deletions(-)
 rename ui/src/views/template/component/{CreateModel.vue => CreateModelDialog.vue} (100%)
 rename ui/src/views/template/component/{SelectProvider.vue => SelectProviderDialog.vue} (99%)

diff --git a/ui/src/views/application/CreateAndSetting.vue b/ui/src/views/application/CreateAndSetting.vue
index e90c2248a..ccbc2dd48 100644
--- a/ui/src/views/application/CreateAndSetting.vue
+++ b/ui/src/views/application/CreateAndSetting.vue
@@ -65,7 +65,7 @@
                     </el-option>
                   </el-option-group>
                   <div class="border-t" style="padding: 8px 11px">
-                    <el-button type="primary" link>
+                    <el-button type="primary" link @click="openCreateModel">
                       <el-icon class="mr-4"><Plus /></el-icon> 添加模型
                     </el-button>
                   </div>
@@ -162,6 +162,7 @@
       @refresh="refresh"
       :loading="datasetLoading"
     />
+    <SelectProvider ref="selectProviderRef" />
   </LayoutContainer>
 </template>
 <script setup lang="ts">
@@ -170,6 +171,7 @@ import { useRouter, useRoute } from 'vue-router'
 import { groupBy } from 'lodash'
 import AiDialog from '@/components/ai-dialog/index.vue'
 import AddDatasetDialog from './components/AddDatasetDialog.vue'
+import SelectProvider from '@/views/template/component/SelectProvider.vue'
 import applicationApi from '@/api/application'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { ApplicationFormType } from '@/api/type/application'
@@ -185,6 +187,8 @@ const {
   params: { id }
 } = route as any
 
+const selectProviderRef = ref<InstanceType<typeof SelectProvider>>()
+
 const applicationFormRef = ref<FormInstance>()
 const AddDatasetDialogRef = ref()
 
@@ -239,6 +243,9 @@ const submit = async (formEl: FormInstance | undefined) => {
   })
 }
 
+const openCreateModel = () => {
+  selectProviderRef.value?.open()
+}
 function removeDataset(id: string) {
   applicationForm.value.dataset_id_list.splice(applicationForm.value.dataset_id_list.indexOf(id), 1)
 }
diff --git a/ui/src/views/application/components/AddDatasetDialog.vue b/ui/src/views/application/components/AddDatasetDialog.vue
index e20ea5ceb..5ac362c61 100644
--- a/ui/src/views/application/components/AddDatasetDialog.vue
+++ b/ui/src/views/application/components/AddDatasetDialog.vue
@@ -11,7 +11,9 @@
     <el-row :gutter="12" v-loading="loading">
       <el-col :span="12" v-for="(item, index) in data" :key="index" class="mb-16">
         <CardCheckbox value-field="id" :data="item" v-model="checkList">
-          {{ item.name }}
+          <span class="ellipsis-1">
+            {{ item.name }}
+          </span>
         </CardCheckbox>
       </el-col>
     </el-row>
diff --git a/ui/src/views/application/index.vue b/ui/src/views/application/index.vue
index d9eaf0f6f..375d4d89a 100644
--- a/ui/src/views/application/index.vue
+++ b/ui/src/views/application/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="application-list-container p-24" style="padding-top: 16px">
-    <div class="flex-between mb-8">
+    <div class="flex-between mb-16">
       <h3>应用</h3>
       <el-input
         v-model="pageConfig.name"
@@ -17,7 +17,7 @@
         :infinite-scroll-disabled="disabledScroll"
         class="app-list-row"
       >
-        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mt-8">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb-16">
           <CardAdd title="创建应用" @click="router.push({ path: '/application/create' })" />
         </el-col>
         <el-col
@@ -28,7 +28,7 @@
           :xl="4"
           v-for="(item, index) in applicationList"
           :key="index"
-          class="mt-8"
+          class="mb-16"
         >
           <CardBox
             :title="item.name"
diff --git a/ui/src/views/dataset/index.vue b/ui/src/views/dataset/index.vue
index 3010b8cc6..e6990db4c 100644
--- a/ui/src/views/dataset/index.vue
+++ b/ui/src/views/dataset/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="dataset-list-container p-24" style="padding-top: 16px">
-    <div class="flex-between mb-8">
+    <div class="flex-between mb-16">
       <h3>数据集</h3>
       <el-input
         v-model="pageConfig.name"
@@ -17,7 +17,7 @@
         :infinite-scroll-disabled="disabledScroll"
         class="app-list-row"
       >
-        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mt-8">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb-16">
           <CardAdd title="创建数据集" @click="router.push({ path: '/dataset/create' })" />
         </el-col>
         <el-col
@@ -28,7 +28,7 @@
           :xl="4"
           v-for="(item, index) in datasetList"
           :key="index"
-          class="mt-8"
+          class="mb-16"
         >
           <CardBox
             :title="item.name"
diff --git a/ui/src/views/template/component/CreateModel.vue b/ui/src/views/template/component/CreateModelDialog.vue
similarity index 100%
rename from ui/src/views/template/component/CreateModel.vue
rename to ui/src/views/template/component/CreateModelDialog.vue
diff --git a/ui/src/views/template/component/SelectProvider.vue b/ui/src/views/template/component/SelectProviderDialog.vue
similarity index 99%
rename from ui/src/views/template/component/SelectProvider.vue
rename to ui/src/views/template/component/SelectProviderDialog.vue
index 297054d19..ae77e9eb4 100644
--- a/ui/src/views/template/component/SelectProvider.vue
+++ b/ui/src/views/template/component/SelectProviderDialog.vue
@@ -24,7 +24,6 @@
 import { ref } from 'vue'
 import ModelApi from '@/api/model'
 import type { Provider } from '@/api/type/model'
-
 const loading = ref<boolean>(false)
 const dialogVisible = ref<boolean>(false)
 const list_provider = ref<Array<Provider>>([])
diff --git a/ui/src/views/template/index.vue b/ui/src/views/template/index.vue
index 91b9f5eee..4ed9d224d 100644
--- a/ui/src/views/template/index.vue
+++ b/ui/src/views/template/index.vue
@@ -60,13 +60,13 @@
         </div>
       </div>
     </div>
-    <CreateModel
+    <CreateModelDialog
       ref="createModelRef"
       @submit="list_model"
       @change="openCreateModel($event)"
-    ></CreateModel>
+    ></CreateModelDialog>
 
-    <SelectProvider ref="selectProviderRef" @change="openCreateModel($event)"></SelectProvider>
+    <SelectProviderDialog ref="selectProviderRef" @change="openCreateModel($event)"></SelectProviderDialog>
   </LayoutContainer>
 </template>
 
@@ -78,8 +78,8 @@ import type { Provider, Model } from '@/api/type/model'
 import AppIcon from '@/components/icons/AppIcon.vue'
 import ModelCard from '@/views/template/component/ModelCard.vue'
 import { splitArray } from '@/utils/common'
-import CreateModel from '@/views/template/component/CreateModel.vue'
-import SelectProvider from '@/views/template/component/SelectProvider.vue'
+import CreateModelDialog from '@/views/template/component/CreateModelDialog.vue'
+import SelectProviderDialog from '@/views/template/component/SelectProviderDialog.vue'
 
 const allObj = {
   icon: '',
@@ -99,8 +99,8 @@ const model_list = ref<Array<Model>>([])
 const model_split_list = computed(() => {
   return splitArray(model_list.value, 2)
 })
-const createModelRef = ref<InstanceType<typeof CreateModel>>()
-const selectProviderRef = ref<InstanceType<typeof SelectProvider>>()
+const createModelRef = ref<InstanceType<typeof CreateModelDialog>>()
+const selectProviderRef = ref<InstanceType<typeof SelectProviderDialog>>()
 
 const clickListHandle = (item: Provider) => {
   active_provider.value = item

From 3667048bf49ad806b8b94180b9680fec2be8fac6 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Mon, 4 Dec 2023 17:30:52 +0800
Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=E5=88=9B=E5=BB=BA=E5=BA=94?=
 =?UTF-8?q?=E7=94=A8=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ui/src/views/application/CreateAndSetting.vue | 22 ++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/ui/src/views/application/CreateAndSetting.vue b/ui/src/views/application/CreateAndSetting.vue
index ccbc2dd48..29f0e0812 100644
--- a/ui/src/views/application/CreateAndSetting.vue
+++ b/ui/src/views/application/CreateAndSetting.vue
@@ -162,7 +162,12 @@
       @refresh="refresh"
       :loading="datasetLoading"
     />
-    <SelectProvider ref="selectProviderRef" />
+    <CreateModelDialog
+      ref="createModelRef"
+      @submit="getModel"
+      @change="openCreateModel($event)"
+    ></CreateModelDialog>
+    <SelectProviderDialog ref="selectProviderRef" @change="openCreateModel($event)" />
   </LayoutContainer>
 </template>
 <script setup lang="ts">
@@ -171,7 +176,8 @@ import { useRouter, useRoute } from 'vue-router'
 import { groupBy } from 'lodash'
 import AiDialog from '@/components/ai-dialog/index.vue'
 import AddDatasetDialog from './components/AddDatasetDialog.vue'
-import SelectProvider from '@/views/template/component/SelectProvider.vue'
+import CreateModelDialog from '@/views/template/component/CreateModelDialog.vue'
+import SelectProviderDialog from '@/views/template/component/SelectProviderDialog.vue'
 import applicationApi from '@/api/application'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { ApplicationFormType } from '@/api/type/application'
@@ -187,7 +193,8 @@ const {
   params: { id }
 } = route as any
 
-const selectProviderRef = ref<InstanceType<typeof SelectProvider>>()
+const createModelRef = ref<InstanceType<typeof CreateModelDialog>>()
+const selectProviderRef = ref<InstanceType<typeof SelectProviderDialog>>()
 
 const applicationFormRef = ref<FormInstance>()
 const AddDatasetDialogRef = ref()
@@ -243,9 +250,14 @@ const submit = async (formEl: FormInstance | undefined) => {
   })
 }
 
-const openCreateModel = () => {
-  selectProviderRef.value?.open()
+const openCreateModel = (provider?: Provider) => {
+  if (provider && provider.provider) {
+    createModelRef.value?.open(provider)
+  } else {
+    selectProviderRef.value?.open()
+  }
 }
+
 function removeDataset(id: string) {
   applicationForm.value.dataset_id_list.splice(applicationForm.value.dataset_id_list.indexOf(id), 1)
 }