From 5b28cf6c663258d6314461d1e524e959b3c0cad4 Mon Sep 17 00:00:00 2001
From: CGD <3030332422@qq.com>
Date: Thu, 3 Apr 2025 14:31:57 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E2=80=9C=E8=8E=B7=E5=8F=96?=
 =?UTF-8?q?=E6=A8=A1=E5=9E=8B=E4=BE=9B=E5=BA=94=E5=99=A8=E5=88=97=E8=A1=A8?=
 =?UTF-8?q?=E2=80=9D=E7=9A=84API?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 main/manager-web/src/apis/module/model.js     |  17 +++
 .../src/components/AddModelDialog.vue         | 111 ++++++------------
 2 files changed, 54 insertions(+), 74 deletions(-)

diff --git a/main/manager-web/src/apis/module/model.js b/main/manager-web/src/apis/module/model.js
index 2534bb5a..28df13de 100644
--- a/main/manager-web/src/apis/module/model.js
+++ b/main/manager-web/src/apis/module/model.js
@@ -26,5 +26,22 @@ export default {
             })
         }).send()
     },
+     // 获取模型供应器列表
+    getModelProviders(modelType, callback) {
+      RequestService.sendRequest()
+        .url(`${getServiceUrl()}/api/v1/models/${modelType}/provideTypes`)
+        .method('GET')
+        .success((res) => {
+          RequestService.clearRequestTime()
+          callback(res.data?.data || [])
+        })
+        .fail((err) => {
+          console.error('获取供应器列表失败:', err)
+          this.$message.error('获取供应器列表失败')
+          RequestService.reAjaxFun(() => {
+            this.getModelProviders(modelType, callback)
+          })
+        }).send()
+    }
 
 }
diff --git a/main/manager-web/src/components/AddModelDialog.vue b/main/manager-web/src/components/AddModelDialog.vue
index 074be175..ed59057e 100644
--- a/main/manager-web/src/components/AddModelDialog.vue
+++ b/main/manager-web/src/components/AddModelDialog.vue
@@ -1,13 +1,5 @@
 <template>
-  <el-dialog
-      :visible.sync="visible"
-      width="975px"
-      center
-      custom-class="custom-dialog"
-      :show-close="false"
-      class="center-dialog"
-
-  >
+  <el-dialog :visible.sync="visible" width="975px" center custom-class="custom-dialog" :show-close="false" class="center-dialog">
     <div style="margin: 0 18px; text-align: left; padding: 10px; border-radius: 10px;">
       <div style="font-size: 30px; color: #3d4566; margin-top: -10px; margin-bottom: 10px; text-align: center;">
         添加模型
@@ -34,51 +26,28 @@
       </div>
 
       <div style="height: 2px; background: #e9e9e9; margin-bottom: 22px;"></div>
-
       <el-form :model="formData" label-width="100px" label-position="left" class="custom-form">
-        <!-- 第一行：模型名称和模型编码 -->
         <div style="display: flex; gap: 20px; margin-bottom: 0;">
           <el-form-item label="模型名称" prop="modelName" style="flex: 1;">
-            <el-input
-                v-model="formData.modelName"
-                placeholder="请输入模型名称"
-                class="custom-input-bg"
-            ></el-input>
+            <el-input v-model="formData.modelName" placeholder="请输入模型名称" class="custom-input-bg"></el-input>
           </el-form-item>
           <el-form-item label="模型编码" prop="modelCode" style="flex: 1;">
-            <el-input
-                v-model="formData.modelCode"
-                placeholder="请输入模型编码"
-                class="custom-input-bg"
-            ></el-input>
+            <el-input v-model="formData.modelCode" placeholder="请输入模型编码" class="custom-input-bg"></el-input>
           </el-form-item>
         </div>
 
-        <!-- 第二行：供应器和排序号 -->
         <div style="display: flex; gap: 20px; margin-bottom: 0;">
           <el-form-item label="供应器" prop="supplier" style="flex: 1;">
-            <el-select
-                v-model="formData.supplier"
-                placeholder="请选择"
-                class="custom-select custom-input-bg"
-                style="width: 100%;"
-            >
-              <el-option label="硅基流动" value="硅基流动"></el-option>
-              <el-option label="智脑科技" value="智脑科技"></el-option>
-              <el-option label="云智科技" value="云智科技"></el-option>
-              <el-option label="其他" value="其他"></el-option>
+            <el-select v-model="formData.supplier" placeholder="请选择" class="custom-select custom-input-bg" style="width: 100%;" @focus="loadProviders" filterable>
+            <el-option v-for="item in providers" :key="item.value" :label="item.label" :value="item.value"/>
             </el-select>
           </el-form-item>
           <el-form-item label="排序号" prop="sortOrder" style="flex: 1;">
-            <el-input
-                v-model="formData.sort"
-                placeholder="请输入排序号"
-                class="custom-input-bg"
-            ></el-input>
+            <el-input v-model="formData.sort" placeholder="请输入排序号" class="custom-input-bg"></el-input>
           </el-form-item>
         </div>
 
-        <!-- 文档地址 -->
+
         <el-form-item label="文档地址" prop="docLink" style="margin-bottom: 27px;">
           <el-input
               v-model="formData.docLink"
@@ -87,7 +56,6 @@
           ></el-input>
         </el-form-item>
 
-        <!-- 备注 -->
         <el-form-item label="备注" prop="remark" class="prop-remark">
           <el-input
               v-model="formData.remark"
@@ -99,48 +67,27 @@
         </el-form-item>
       </el-form>
 
-      <!-- 调用信息部分 -->
       <div style="font-size: 20px; font-weight: bold; color: #3d4566; margin-bottom: 15px;">调用信息</div>
       <div style="height: 2px; background: #e9e9e9; margin-bottom: 15px;"></div>
 
       <el-form :model="formData" label-width="100px" label-position="left" class="custom-form">
-        <!-- 第一行：模型名称和接口地址 -->
         <div style="display: flex; gap: 10px; margin-bottom: 15px;">
           <el-form-item label="模型名称" prop="param1" style="flex: 0.5; margin-bottom: 0;">
-            <el-input
-                v-model="formData.configJson.param1"
-                placeholder="请输入model_name"
-                class="custom-input-bg"
-            ></el-input>
+            <el-input v-model="formData.configJson.param1" placeholder="请输入model_name" class="custom-input-bg"></el-input>
           </el-form-item>
           <el-form-item label="接口地址" prop="param2" style="flex: 1; margin-bottom: 0;">
-            <el-input
-                v-model="formData.configJson.param2"
-                placeholder="请输入base_url"
-                class="custom-input-bg"
-            ></el-input>
+            <el-input v-model="formData.configJson.param2" placeholder="请输入base_url" class="custom-input-bg"></el-input>
           </el-form-item>
         </div>
 
-        <!-- 秘钥信息 -->
         <el-form-item label="秘钥信息" prop="apiKey">
-          <el-input
-              v-model="formData.configJson.apiKey"
-              placeholder="请输入api_key"
-              show-password
-              class="custom-input-bg"
-          ></el-input>
+          <el-input v-model="formData.configJson.apiKey" placeholder="请输入api_key" show-password class="custom-input-bg"></el-input>
         </el-form-item>
       </el-form>
     </div>
 
-    <!-- 保存按钮 -->
     <div style="display: flex;justify-content: center;">
-      <el-button
-          type="primary"
-          @click="confirm"
-          class="save-btn"
-      >
+      <el-button type="primary" @click="confirm" class="save-btn">
         保存
       </el-button>
     </div>
@@ -148,7 +95,9 @@
 </template>
 
 <script>
+import model from '@/apis/module/model'
 export default {
+  
   name: 'AddModelDialog',
   props: {
     visible: {type: Boolean, required: true},
@@ -156,6 +105,8 @@ export default {
   },
   data() {
     return {
+      providers: [],
+      providersLoaded: false,
       formData: {
         modelName: '',
         modelCode: '',
@@ -174,6 +125,19 @@ export default {
     }
   },
   methods: {
+    loadProviders() {
+      if (this.providersLoaded)
+        return
+
+      model.getModelProviders(this.modelType, (data) => {
+        console.log("data", data)
+        this.providers = data.map(item => ({
+          label: item.name,
+          value: item.providerCode
+        }))
+        this.providersLoaded = true
+      })
+    },
     confirm() {
       if (!this.formData.modelName || !this.formData.modelCode || !this.formData.supplier ||
           !this.formData.configJson.param1 || !this.formData.configJson.param2 || !this.formData.configJson.apiKey) {
@@ -204,6 +168,9 @@ export default {
           apiKey: ''
         }
       };
+      // 重置加载状态
+      this.providers = [];
+      this.providersLoaded = false;
     },
     handleClose() {
       this.resetForm();
@@ -297,7 +264,7 @@ export default {
 }
 
 .custom-form .el-form-item {
-  margin-bottom: 20px; /* 统一设置所有表单项的间距 */
+  margin-bottom: 20px;
 }
 
 .custom-form .el-form-item__label {
@@ -312,13 +279,12 @@ export default {
   margin-top: -4px;
 }
 
-/* 修改placeholder颜色 */
 .custom-input-bg .el-input__inner::-webkit-input-placeholder,
 .custom-input-bg .el-textarea__inner::-webkit-input-placeholder {
   color: #9c9f9e;
 }
 
-/* 输入框背景色 */
+
 .custom-input-bg .el-input__inner,
 .custom-input-bg .el-textarea__inner {
   background-color: #f6f8fc;
@@ -342,13 +308,12 @@ export default {
 }
 
 
-/* 修改开关样式 */
 .custom-switch .el-switch__core {
   border-radius: 20px;
   height: 23px;
   background-color: #c0ccda;
   width: 35px;
-  padding: 0 20px; /* 调整左右内边距 */
+  padding: 0 20px;
 }
 
 .custom-switch .el-switch__core:after {
@@ -363,7 +328,7 @@ export default {
 .custom-switch.is-checked .el-switch__core {
   border-color: #b5bcf0;
   background-color: #cfd7fa;
-  padding: 0 20px; /* 确保启用状态也有相同的间隔 */
+  padding: 0 20px;
 }
 
 .custom-switch.is-checked .el-switch__core:after {
@@ -373,14 +338,12 @@ export default {
 }
 
 
-/* 调整flex布局的gap */
 [style*="display: flex"] {
-  gap: 20px; /* 扩大flex项间距 */
+  gap: 20px;
 }
 
-/* 调整输入框高度 */
 .custom-input-bg .el-input__inner {
-  height: 32px; /* 固定输入框高度 */
+  height: 32px;
 }