|
|
@@ -3,49 +3,49 @@
|
|
|
<el-row>
|
|
|
<h3>模型服务商管理</h3>
|
|
|
</el-row>
|
|
|
- <el-row :gutter="20">
|
|
|
- <el-col :span="4" style="margin-left: 20px">
|
|
|
- <el-form-item label="服务商名称">
|
|
|
- <el-input v-model="input" style="width: 240px" placeholder="请输入服务商名称" />
|
|
|
- </el-form-item>
|
|
|
-
|
|
|
- </el-col>
|
|
|
- <el-col :span="5">
|
|
|
- <el-form-item label="服务商编码">
|
|
|
- <el-input v-model="input" style="width: 240px" placeholder="请输入服务商编码" />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="4">
|
|
|
- <el-form-item label="服务商种类">
|
|
|
- <el-select v-model="modelKind" placeholder="全部">
|
|
|
- <el-option
|
|
|
- v-for="item in modelKindOption"
|
|
|
- :value="item"
|
|
|
- :label="item"
|
|
|
- :key="item"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="4">
|
|
|
- <el-form-item label="状态">
|
|
|
- <el-select v-model="modelState" placeholder="全部">
|
|
|
- <el-option
|
|
|
- v-for="item in modelStateOption"
|
|
|
- :label="item"
|
|
|
- :value="item"
|
|
|
- :key="item"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="1" :offset="4" style="padding-left: 30px">
|
|
|
- <el-button type="primary">搜索</el-button>
|
|
|
- </el-col>
|
|
|
- <el-col :span="1" style="padding-left: 30px">
|
|
|
- <el-button>重置</el-button>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
+ <!-- 筛选器-->
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="4" style="margin-left: 20px">
|
|
|
+ <el-form-item label="服务商名称">
|
|
|
+ <el-input v-model="filters.vendorName" style="width: 240px" placeholder="请输入服务商名称" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item label="服务商编码">
|
|
|
+ <el-input v-model="filters.vendorCode" style="width: 240px" placeholder="请输入服务商编码" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4">
|
|
|
+ <el-form-item label="服务商种类">
|
|
|
+ <el-select v-model="filters.modelKind" placeholder="全部">
|
|
|
+ <el-option
|
|
|
+ v-for="item in modelKindOption"
|
|
|
+ :value="item"
|
|
|
+ :label="item"
|
|
|
+ :key="item"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4">
|
|
|
+ <el-form-item label="状态">
|
|
|
+ <el-select v-model="filters.status" placeholder="全部">
|
|
|
+ <el-option
|
|
|
+ v-for="item in modelStateOption"
|
|
|
+ :label="item"
|
|
|
+ :value="item"
|
|
|
+ :key="item"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1" :offset="4" style="padding-left: 30px">
|
|
|
+ <el-button type="primary">搜索</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="1" style="padding-left: 30px">
|
|
|
+ <el-button @click="resetFilters">重置</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="2">
|
|
|
<el-button type="primary" @click="dialogVisible = true">+新增服务商</el-button>
|
|
|
@@ -131,9 +131,9 @@
|
|
|
"
|
|
|
>
|
|
|
{{
|
|
|
- slot.row.status === 'active'
|
|
|
+ slot.row.status === 1
|
|
|
? '启用'
|
|
|
- : slot.row.status === 'configuring'
|
|
|
+ : slot.row.status === ''
|
|
|
? '配置中'
|
|
|
: '待配置'
|
|
|
}}
|
|
|
@@ -186,32 +186,85 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
-import { ref } from 'vue'
|
|
|
+import { ref, onMounted } from 'vue'
|
|
|
import type { TabsInstance, FormInstance } from 'element-plus'
|
|
|
import {Download, More, UploadFilled} from "@element-plus/icons-vue";
|
|
|
import { View, Edit, List, Check, Close } from '@element-plus/icons-vue'
|
|
|
import BasicInfo from "@/views/modleServiceProvide/components/BasicInfo.vue";
|
|
|
import ApiInfo from "@/views/modleServiceProvide/components/ApiInfo.vue";
|
|
|
import AdditionInfo from "@/views/modleServiceProvide/components/AdditionInfo.vue";
|
|
|
-import components from "../../../vite/plugins/components";
|
|
|
-import listModelVendor from "@/api/modleServiceProvide/index"
|
|
|
-import type { ModelVendorQuery, ModelVendorDto } from '../../api/modleServiceProvide/type' // 根据实际类型调整
|
|
|
+import { listModelVendor,addModelVendor, ModelVendorQuery, ModelVendorDto } from '@/api/modleServiceProvide';
|
|
|
+
|
|
|
+import request from "@/utils/request";
|
|
|
+// 筛选条件
|
|
|
+const filters = ref({
|
|
|
+ vendorName: '',
|
|
|
+ vendorCode: '',
|
|
|
+ modelKind: '',
|
|
|
+ status: ''
|
|
|
+});
|
|
|
+
|
|
|
+// 筛选后的数据
|
|
|
+const filteredData = computed(() => {
|
|
|
+ return dataList.value.filter(item => {
|
|
|
+ const matchName = item.vendorName.includes(filters.value.vendorName);
|
|
|
+ const matchCode = item.vendorCode.includes(filters.value.vendorCode);
|
|
|
+ const matchKind = !filters.value.modelKind || item.modelKind === filters.value.modelKind;
|
|
|
+ const matchStatus = !filters.value.status || item.status === filters.value.status;
|
|
|
+ return matchName && matchCode && matchKind && matchStatus;
|
|
|
+ });
|
|
|
+});
|
|
|
+
|
|
|
+// 重置筛选条件
|
|
|
+const resetFilters = () => {
|
|
|
+ filters.value = {
|
|
|
+ vendorName: '',
|
|
|
+ vendorCode: '',
|
|
|
+ modelKind: '',
|
|
|
+ status: ''
|
|
|
+ };
|
|
|
+};
|
|
|
+// 分页参数
|
|
|
+const queryParams = ref<ModelVendorQuery>({
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10
|
|
|
+});
|
|
|
+
|
|
|
+// 数据绑定
|
|
|
+const dataList = ref<ModelVendorDto[]>([]);
|
|
|
+const total = ref<number>(0);
|
|
|
+const loading = ref<boolean>(false);
|
|
|
+
|
|
|
+// 获取数据方法
|
|
|
+const getList = async () => {
|
|
|
+ loading.value = true;
|
|
|
+ try {
|
|
|
+ const res = await listModelVendor(queryParams.value);
|
|
|
+ dataList.value = res.data.list;
|
|
|
+ total.value = res.data.total;
|
|
|
+ } catch (error) {
|
|
|
+ console.error('获取数据失败:', error);
|
|
|
+ } finally {
|
|
|
+ loading.value = false;
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 页面加载时请求数据
|
|
|
+onMounted(() => {
|
|
|
+ getList();
|
|
|
+});
|
|
|
|
|
|
|
|
|
-const serviceOption = ref(["OpenAI"])
|
|
|
-const modelNameOption = ref(["服务商1","服务商2"])
|
|
|
const modelKindOption = ref(["大语言模型","多模态","OCR","视觉","向量化","重排序","语音"])
|
|
|
const modelStateOption = ref(["全部","开启","关闭"])
|
|
|
// const models = ref([])
|
|
|
-const total = ref(50) // 总条目数
|
|
|
const currentPage = ref(1) // 当前页码
|
|
|
const pageSize = ref(10) // 每页显示条目个数
|
|
|
const selected = ref<number[]>([]) // 存储选中的行ID
|
|
|
-const modelName = ref(null)
|
|
|
-const modelKind = ref(null)
|
|
|
+
|
|
|
const activeTab = 'info1'
|
|
|
-const service = ref(null)
|
|
|
const modelState = ref(null)
|
|
|
+
|
|
|
// 定义表格数据的类型
|
|
|
interface ProviderModel {
|
|
|
id: number
|
|
|
@@ -291,40 +344,33 @@ const handleSelectionChange = (selection: ProviderModel[]) => {
|
|
|
const dialogVisible = ref(false)
|
|
|
const formRef = ref<FormInstance>()
|
|
|
|
|
|
-interface Info1 {
|
|
|
- name: string
|
|
|
- desc: string
|
|
|
-}
|
|
|
|
|
|
-interface Info2 {
|
|
|
- phone: string
|
|
|
- email: string
|
|
|
-}
|
|
|
const formData = ref({
|
|
|
- info1: { name: '', desc: '' },
|
|
|
- info2: { phone: '', email: '' },
|
|
|
- info3: { address: '', remark: '' }
|
|
|
+ info1: {
|
|
|
+ vendorCode: '',
|
|
|
+ vendorName: '',
|
|
|
+ modelKind: '',
|
|
|
+ logoUrl: '',
|
|
|
+ logoFile: null, // 用于保存上传的文件对象
|
|
|
+ isOfficial: false,
|
|
|
+ status:0,
|
|
|
+ sortOrder: 0
|
|
|
+ },
|
|
|
+ info2: {
|
|
|
+ defaultUrl: '',
|
|
|
+ extraConfig: ''
|
|
|
+ },
|
|
|
+ info3: {
|
|
|
+ contactInfo: '',
|
|
|
+ website: '',
|
|
|
+ apiDocUrl: '',
|
|
|
+ pricingUrl: '',
|
|
|
+ description: '',
|
|
|
+
|
|
|
+ }
|
|
|
})
|
|
|
-interface Info3 {
|
|
|
- address: string
|
|
|
- remark: string
|
|
|
-}
|
|
|
|
|
|
-interface formData {
|
|
|
- info1: Info1
|
|
|
- info2: Info2
|
|
|
- info3: Info3
|
|
|
-}
|
|
|
|
|
|
-const form = ref({
|
|
|
- vendorName: '',
|
|
|
- vendorCode: '',
|
|
|
- modelKind: '',
|
|
|
- logoUrl: '',
|
|
|
- isofficial: false,
|
|
|
- apiAccess: false,
|
|
|
- status: 'active'
|
|
|
-})
|
|
|
|
|
|
//表单规则
|
|
|
const rules = {
|
|
|
@@ -355,35 +401,45 @@ const beforelogoUrlUpload = (file) => {
|
|
|
return isValid
|
|
|
}
|
|
|
|
|
|
-// 提交表单
|
|
|
const submitForm = () => {
|
|
|
- formRef.value.validate(valid => {
|
|
|
- if (valid) {
|
|
|
- // 添加 ID 和 创建时间
|
|
|
- const newProvider = {
|
|
|
- ...form.value,
|
|
|
- id: Math.floor(Math.random() * 10000),
|
|
|
- createTime: new Date().toLocaleString()
|
|
|
- }
|
|
|
-
|
|
|
- // 添加到表格数据
|
|
|
- models.value.unshift(newProvider)
|
|
|
-
|
|
|
- // 关闭弹窗并重置表单
|
|
|
- dialogVisible.value = false
|
|
|
- form.value = {
|
|
|
- vendorName: '',
|
|
|
- vendorCode: '',
|
|
|
- modelKind: '',
|
|
|
- logoUrl: '',
|
|
|
- isofficial: false,
|
|
|
- apiAccess: false,
|
|
|
- status: 'active'
|
|
|
- }
|
|
|
- } else {
|
|
|
- return false
|
|
|
+ const data = formData.value;
|
|
|
+
|
|
|
+ const submitData = new FormData();
|
|
|
+
|
|
|
+ // 添加普通字段
|
|
|
+ submitData.append('vendorName', data.info1.vendorName);
|
|
|
+ submitData.append('vendorCode', data.info1.vendorCode);
|
|
|
+ submitData.append('modelKind', data.info1.modelKind);
|
|
|
+ submitData.append('isOfficial', data.info1.isOfficial.toString());
|
|
|
+ submitData.append('sortOrder', data.info1.sortOrder.toString());
|
|
|
+
|
|
|
+ submitData.append('defaultUrl', data.info2.defaultUrl);
|
|
|
+ submitData.append('extraConfig', data.info2.extraConfig);
|
|
|
+
|
|
|
+ submitData.append('apiDocUrl', data.info3.apiDocUrl);
|
|
|
+ submitData.append('pricingUrl', data.info3.pricingUrl);
|
|
|
+ submitData.append('contactInfo', data.info3.contactInfo);
|
|
|
+ submitData.append('website', data.info3.website);
|
|
|
+
|
|
|
+ // 添加文件
|
|
|
+ if (data.info1.logoFile) {
|
|
|
+ submitData.append('logo', data.info1.logoFile);
|
|
|
}
|
|
|
- })
|
|
|
+
|
|
|
+ const res = listModelVendor(submitData);
|
|
|
+
|
|
|
+ // 发送请求
|
|
|
+ // axios.post('/api/model/vendor/save', submitData, {
|
|
|
+ // headers: {
|
|
|
+ // 'Content-Type': 'multipart/form-data'
|
|
|
+ // }
|
|
|
+ // }).then(() => {
|
|
|
+ // ElMessage.success('提交成功');
|
|
|
+ // dialogVisible.value = false;
|
|
|
+ // }).catch(() => {
|
|
|
+ // ElMessage.error('提交失败');
|
|
|
+ // });
|
|
|
+
|
|
|
}
|
|
|
</script>
|
|
|
|
zhaoen