From ab7c789e1b9119c0bbec220259cece88b13faa55 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Wed, 29 Nov 2023 11:25:14 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=BA=94=E7=94=A8=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ui/src/api/application.ts                     | 24 ++++++++-
 ui/src/components/ai-dialog/index.vue         | 30 ++++-------
 ui/src/stores/modules/application.ts          | 13 +++++
 ui/src/views/application/CreateAndSetting.vue | 22 ++++++--
 ui/src/views/application/index.vue            | 52 +++++++++----------
 5 files changed, 90 insertions(+), 51 deletions(-)

diff --git a/ui/src/api/application.ts b/ui/src/api/application.ts
index 7e3a3ffaa..d7e7e0a2e 100644
--- a/ui/src/api/application.ts
+++ b/ui/src/api/application.ts
@@ -72,14 +72,34 @@ const postChatMessage: (chat_id: string, message: string) => Promise<any> = (cha
   ]
 }
  */
-const postApplication: ( data: ApplicationFormType, loading?: Ref<boolean> ) => Promise<Result<any>> = (data, loading) => {
+const postApplication: (
+  data: ApplicationFormType,
+  loading?: Ref<boolean>
+) => Promise<Result<any>> = (data, loading) => {
   return post(`${prefix}`, data, undefined, loading)
 }
 
+/**
+ * 删除应用
+ * @param 参数 applicaiton_id
+ */
+const delApplication: (applicaiton_id: String) => Promise<Result<boolean>> = (applicaiton_id) => {
+  return del(`${prefix}/${applicaiton_id}`)
+}
+
+/**
+ * 应用详情
+ * @param 参数 applicaiton_id
+ */
+const getApplicationDetail: (applicaiton_id: string) => Promise<Result<any>> = (applicaiton_id) => {
+  return get(`${prefix}/${applicaiton_id}`)
+}
 export default {
   getAllAppilcation,
   getApplication,
   postApplication,
   postChatOpen,
-  postChatMessage
+  postChatMessage,
+  delApplication,
+  getApplicationDetail
 }
diff --git a/ui/src/components/ai-dialog/index.vue b/ui/src/components/ai-dialog/index.vue
index b231bfe5e..27e5e51d8 100644
--- a/ui/src/components/ai-dialog/index.vue
+++ b/ui/src/components/ai-dialog/index.vue
@@ -77,22 +77,9 @@
           :disabled="loading"
         />
         <div class="operate" v-loading="loading">
-          <el-button
-            text
-            class="sent-button"
-            :disabled="!(inputValue && data?.name && data?.model_id)"
-            @click="sendChatHandle"
-          >
-            <img
-              v-show="!(inputValue && data?.name && data?.model_id)"
-              src="@/assets/icon_send.svg"
-              alt=""
-            />
-            <img
-              v-show="inputValue && data?.name && data?.model_id"
-              src="@/assets/icon_send_colorful.svg"
-              alt=""
-            />
+          <el-button text class="sent-button" :disabled="isDisabledChart" @click="sendChatHandle">
+            <img v-show="isDisabledChart" src="@/assets/icon_send.svg" alt="" />
+            <img v-show="!isDisabledChart" src="@/assets/icon_send_colorful.svg" alt="" />
           </el-button>
         </div>
       </div>
@@ -100,7 +87,7 @@
   </div>
 </template>
 <script setup lang="ts">
-import { ref, nextTick, onUpdated } from 'vue'
+import { ref, nextTick, onUpdated, computed } from 'vue'
 import applicationApi from '@/api/application'
 import { ChatManage, type chatType } from '@/api/type/application'
 import { randomId } from '@/utils/utils'
@@ -119,6 +106,10 @@ const inputValue = ref('')
 const chartOpenId = ref('')
 const chatList = ref<chatType[]>([])
 
+const isDisabledChart = computed(
+  () => !(inputValue.value && props.data?.name && props.data?.model_id)
+)
+
 function quickProblemHandel(val: string) {
   inputValue.value = val
 }
@@ -127,8 +118,9 @@ function sendChatHandle(event: any) {
   if (!event.ctrlKey) {
     // 如果没有按下组合键ctrl，则会阻止默认事件
     event.preventDefault()
-
-    chatMessage()
+    if (!isDisabledChart.value) {
+      chatMessage()
+    }
   } else {
     // 如果同时按下ctrl+回车键，则会换行
     inputValue.value += '\n'
diff --git a/ui/src/stores/modules/application.ts b/ui/src/stores/modules/application.ts
index 8fb1ed5e5..9eda8aa8c 100644
--- a/ui/src/stores/modules/application.ts
+++ b/ui/src/stores/modules/application.ts
@@ -16,6 +16,19 @@ const useApplicationStore = defineStore({
             reject(error)
           })
       })
+    },
+
+    async asyncGetApplicationDetail(id: string) {
+      return new Promise((resolve, reject) => {
+        applicationApi
+          .getApplicationDetail(id)
+          .then((data) => {
+            resolve(data)
+          })
+          .catch((error) => {
+            reject(error)
+          })
+      })
     }
   }
 })
diff --git a/ui/src/views/application/CreateAndSetting.vue b/ui/src/views/application/CreateAndSetting.vue
index 2c9ca2360..854e5bc89 100644
--- a/ui/src/views/application/CreateAndSetting.vue
+++ b/ui/src/views/application/CreateAndSetting.vue
@@ -139,9 +139,9 @@
           </el-scrollbar>
         </div>
         <div class="text-right border-t p-16">
-          <el-button @click="router.push({ path: `/application` })"> 取消 </el-button>
+          <el-button v-if="!id" @click="router.push({ path: `/application` })"> 取消 </el-button>
           <el-button type="primary" @click="submit(applicationFormRef)" :disabled="loading">
-            创建
+            {{ id ? '保存' : '创建' }}
           </el-button>
         </div>
       </el-col>
@@ -171,7 +171,7 @@ import type { Provider } from '@/api/type/model'
 import { realatedObject } from '@/utils/utils'
 import { MsgSuccess } from '@/utils/message'
 import useStore from '@/stores'
-const { model, dataset } = useStore()
+const { model, dataset, application } = useStore()
 
 const router = useRouter()
 const route = useRoute()
@@ -241,6 +241,19 @@ function openDatasetDialog() {
   AddDatasetDialogRef.value.open(applicationForm.dataset_id_list)
 }
 
+function getDetail() {
+  loading.value = true
+  application
+    .asyncGetApplicationDetail(id)
+    .then((res) => {
+      // detail.value = res.data
+      loading.value = false
+    })
+    .catch(() => {
+      loading.value = false
+    })
+}
+
 function getDataset() {
   loading.value = true
   dataset
@@ -281,6 +294,9 @@ function getProvider() {
 }
 
 onMounted(() => {
+  if (id) {
+    getDetail()
+  }
   getProvider()
   getModel()
   getDataset()
diff --git a/ui/src/views/application/index.vue b/ui/src/views/application/index.vue
index 17e2e0504..32d14f957 100644
--- a/ui/src/views/application/index.vue
+++ b/ui/src/views/application/index.vue
@@ -71,7 +71,7 @@
                           <span>运行中</span>
                           <!-- <el-switch v-model="item.status"  @change="changeState($event, item)"  /> -->
                         </div>
-                        <el-dropdown-item divided>删除</el-dropdown-item>
+                        <el-dropdown-item divided @click="deleteApplication(item)">删除</el-dropdown-item>
                       </el-dropdown-menu>
                     </template>
                   </el-dropdown>
@@ -88,9 +88,8 @@
 import { ref, onMounted, reactive } from 'vue'
 import applicationApi from '@/api/application'
 import type { pageRequest } from '@/api/type/common'
-//   import { MsgSuccess, MsgConfirm } from '@/utils/message'
+  import { MsgSuccess, MsgConfirm } from '@/utils/message'
 import { useRouter } from 'vue-router'
-//   import { numberFormat } from '@/utils/utils'
 const router = useRouter()
 
 const loading = ref(false)
@@ -102,7 +101,6 @@ const pageConfig = reactive<pageRequest>({
 })
 
 const applicationList = ref<any[]>([])
-const state = ref(false)
 
 function loadDataset() {}
 
@@ -111,29 +109,29 @@ function search() {
   getList()
 }
 
-//   function deleteDateset(row: any) {
-//     MsgConfirm(
-//       `是否删除数据集：${row.name} ?`,
-//       `此数据集关联 ${row.char_length} 个应用，删除后无法恢复，请谨慎操作。`,
-//       {
-//         confirmButtonText: '删除',
-//         confirmButtonClass: 'danger'
-//       }
-//     )
-//       .then(() => {
-//         loading.value = true
-//         datasetApi
-//           .delDateset(row.id)
-//           .then(() => {
-//             MsgSuccess('删除成功')
-//             getList()
-//           })
-//           .catch(() => {
-//             loading.value = false
-//           })
-//       })
-//       .catch(() => {})
-//   }
+  function deleteApplication(row: any) {
+    MsgConfirm(
+      `是否删除应用：${row.name} ?`,
+      `删除后该应用将不再提供服务，请谨慎操作。`,
+      {
+        confirmButtonText: '删除',
+        confirmButtonClass: 'danger'
+      }
+    )
+      .then(() => {
+        loading.value = true
+        applicationApi
+          .delApplication(row.id)
+          .then(() => {
+            MsgSuccess('删除成功')
+            getList()
+          })
+          .catch(() => {
+            loading.value = false
+          })
+      })
+      .catch(() => {})
+  }
 
 // function changeState(bool: Boolean, row: any) {
 //   const obj = {