232 lines
7.0 KiB
Vue
232 lines
7.0 KiB
Vue
|
<script setup lang="ts">
|
|||
|
|
import { ref, reactive, computed, onMounted } from 'vue'
|
|||
|
|
import { useRoute, useRouter } from 'vue-router'
|
|||
|
|
import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
|
|||
|
|
import PageCard from '@/components/PageCard.vue'
|
|||
|
|
import {
|
|||
|
|
getModel,
|
|||
|
|
createModel,
|
|||
|
|
updateModel,
|
|||
|
|
getLocalModels,
|
|||
|
|
} from '@/api/modules/model'
|
|||
|
|
import { MODEL_TYPE_MAP } from '@/constants'
|
|||
|
|
import type { ModelForm, ModelSource } from '@/types'
|
|||
|
|
|
|||
|
|
const route = useRoute()
|
|||
|
|
const router = useRouter()
|
|||
|
|
|
|||
|
|
const formRef = ref<FormInstance>()
|
|||
|
|
const loading = ref(false)
|
|||
|
|
const submitting = ref(false)
|
|||
|
|
const isEdit = computed(() => !!route.params.id)
|
|||
|
|
const editId = computed(() => route.params.id as string | undefined)
|
|||
|
|
|
|||
|
|
const localModels = ref<{ path: string; name: string }[]>([])
|
|||
|
|
|
|||
|
|
const form = reactive<ModelForm>({
|
|||
|
|
name: '',
|
|||
|
|
type: 'LLM',
|
|||
|
|
purpose: 'inference',
|
|||
|
|
model_source: 'local',
|
|||
|
|
description: '',
|
|||
|
|
path: '',
|
|||
|
|
api_url: '',
|
|||
|
|
api_key: '',
|
|||
|
|
online_model_name: '',
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
const rules: FormRules = {
|
|||
|
|
name: [
|
|||
|
|
{ required: true, message: '请输入模型名称', trigger: 'blur' },
|
|||
|
|
{ max: 100, message: '不超过 100 字符', trigger: 'blur' },
|
|||
|
|
],
|
|||
|
|
type: [{ required: true, message: '请选择模型类型', trigger: 'change' }],
|
|||
|
|
purpose: [{ required: true, message: '请选择模型用途', trigger: 'change' }],
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/** 根据 model_source 动态校验 */
|
|||
|
|
function getSourceRules(): FormRules {
|
|||
|
|
if (form.model_source === 'local') {
|
|||
|
|
return { path: [{ required: true, message: '请选择本地模型路径', trigger: 'change' }] }
|
|||
|
|
}
|
|||
|
|
return {
|
|||
|
|
api_url: [{ required: true, message: '请输入 API 地址', trigger: 'blur' }],
|
|||
|
|
api_key: [{ required: true, message: '请输入 API Key', trigger: 'blur' }],
|
|||
|
|
online_model_name: [{ required: true, message: '请输入模型名称', trigger: 'blur' }],
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const typeOptions = Object.entries(MODEL_TYPE_MAP).map(([value, label]) => ({ value, label }))
|
|||
|
|
|
|||
|
|
async function loadEditData() {
|
|||
|
|
if (!editId.value) return
|
|||
|
|
loading.value = true
|
|||
|
|
try {
|
|||
|
|
const model: any = await getModel(editId.value)
|
|||
|
|
// 兼容旧数据：online → api
|
|||
|
|
const source: ModelSource = model.model_source === 'online' ? 'api' : model.model_source || 'local'
|
|||
|
|
Object.assign(form, {
|
|||
|
|
name: model.name || '',
|
|||
|
|
type: model.type || 'LLM',
|
|||
|
|
purpose: model.purpose || 'inference',
|
|||
|
|
model_source: source,
|
|||
|
|
description: model.description || '',
|
|||
|
|
path: model.path || '',
|
|||
|
|
api_url: model.api_url || '',
|
|||
|
|
api_key: model.api_key || '',
|
|||
|
|
online_model_name: model.model_name || '',
|
|||
|
|
})
|
|||
|
|
} catch {
|
|||
|
|
// ignore
|
|||
|
|
} finally {
|
|||
|
|
loading.value = false
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function loadLocalModels() {
|
|||
|
|
try {
|
|||
|
|
const res = await getLocalModels()
|
|||
|
|
localModels.value = res?.models || []
|
|||
|
|
} catch {
|
|||
|
|
localModels.value = []
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
async function handleSubmit() {
|
|||
|
|
if (!formRef.value) return
|
|||
|
|
await formRef.value.validate(async (valid) => {
|
|||
|
|
if (!valid) return
|
|||
|
|
// 来源相关字段校验
|
|||
|
|
if (form.model_source === 'local' && !form.path) {
|
|||
|
|
ElMessage.warning('请选择本地模型路径')
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
submitting.value = true
|
|||
|
|
try {
|
|||
|
|
const data: ModelForm = {
|
|||
|
|
name: form.name,
|
|||
|
|
type: form.type,
|
|||
|
|
purpose: form.purpose,
|
|||
|
|
model_source: form.model_source,
|
|||
|
|
description: form.description,
|
|||
|
|
}
|
|||
|
|
if (form.model_source === 'local') {
|
|||
|
|
data.path = form.path
|
|||
|
|
} else {
|
|||
|
|
data.api_url = form.api_url
|
|||
|
|
data.api_key = form.api_key
|
|||
|
|
data.online_model_name = form.online_model_name
|
|||
|
|
}
|
|||
|
|
if (isEdit.value && editId.value) {
|
|||
|
|
await updateModel(editId.value, data)
|
|||
|
|
ElMessage.success('更新成功')
|
|||
|
|
} else {
|
|||
|
|
await createModel(data)
|
|||
|
|
ElMessage.success('创建成功')
|
|||
|
|
}
|
|||
|
|
router.push('/model-manage')
|
|||
|
|
} catch {
|
|||
|
|
// ignore
|
|||
|
|
} finally {
|
|||
|
|
submitting.value = false
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function handleCancel() {
|
|||
|
|
router.back()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
onMounted(() => {
|
|||
|
|
loadLocalModels()
|
|||
|
|
loadEditData()
|
|||
|
|
})
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<template>
|
|||
|
|
<PageCard :title="isEdit ? '编辑模型' : '添加模型'" v-loading="loading">
|
|||
|
|
<el-form
|
|||
|
|
ref="formRef"
|
|||
|
|
:model="form"
|
|||
|
|
:rules="{ ...rules, ...getSourceRules() }"
|
|||
|
|
label-width="120px"
|
|||
|
|
style="max-width: 640px"
|
|||
|
|
>
|
|||
|
|
<el-form-item label="模型名称" prop="name">
|
|||
|
|
<el-input v-model="form.name" placeholder="请输入模型名称" maxlength="100" show-word-limit />
|
|||
|
|
</el-form-item>
|
|||
|
|
|
|||
|
|
<el-form-item label="模型类型" prop="type">
|
|||
|
|
<el-select v-model="form.type" placeholder="请选择模型类型" style="width: 100%">
|
|||
|
|
<el-option v-for="opt in typeOptions" :key="opt.value" :label="opt.label" :value="opt.value" />
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
|
|||
|
|
<el-form-item label="模型用途" prop="purpose">
|
|||
|
|
<el-radio-group v-model="form.purpose">
|
|||
|
|
<el-radio value="training">训练基座</el-radio>
|
|||
|
|
<el-radio value="inference">推理对比</el-radio>
|
|||
|
|
<el-radio value="evaluation">评测</el-radio>
|
|||
|
|
</el-radio-group>
|
|||
|
|
</el-form-item>
|
|||
|
|
|
|||
|
|
<el-form-item label="模型来源" prop="model_source">
|
|||
|
|
<el-radio-group v-model="form.model_source">
|
|||
|
|
<el-radio value="local">本地模型</el-radio>
|
|||
|
|
<el-radio value="api">在线模型</el-radio>
|
|||
|
|
</el-radio-group>
|
|||
|
|
</el-form-item>
|
|||
|
|
|
|||
|
|
<!-- 本地模型 -->
|
|||
|
|
<template v-if="form.model_source === 'local'">
|
|||
|
|
<el-form-item label="本地模型路径" prop="path">
|
|||
|
|
<el-select
|
|||
|
|
v-model="form.path"
|
|||
|
|
placeholder="请选择本地模型路径"
|
|||
|
|
filterable
|
|||
|
|
style="width: 100%"
|
|||
|
|
>
|
|||
|
|
<el-option
|
|||
|
|
v-for="m in localModels"
|
|||
|
|
:key="m.path"
|
|||
|
|
:label="`${m.name} (${m.path})`"
|
|||
|
|
:value="m.path"
|
|||
|
|
/>
|
|||
|
|
</el-select>
|
|||
|
|
</el-form-item>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<!-- 在线 API 模型 -->
|
|||
|
|
<template v-else>
|
|||
|
|
<el-form-item label="API 地址" prop="api_url">
|
|||
|
|
<el-input v-model="form.api_url" placeholder="如：https://api.openai.com/v1" />
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="API Key" prop="api_key">
|
|||
|
|
<el-input v-model="form.api_key" type="password" show-password placeholder="请输入 API Key" />
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item label="模型名称" prop="online_model_name">
|
|||
|
|
<el-input v-model="form.online_model_name" placeholder="如：gpt-4、qwen-turbo" />
|
|||
|
|
</el-form-item>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<el-form-item label="模型描述">
|
|||
|
|
<el-input
|
|||
|
|
v-model="form.description"
|
|||
|
|
type="textarea"
|
|||
|
|
:rows="3"
|
|||
|
|
maxlength="500"
|
|||
|
|
show-word-limit
|
|||
|
|
placeholder="选填"
|
|||
|
|
/>
|
|||
|
|
</el-form-item>
|
|||
|
|
|
|||
|
|
<el-form-item>
|
|||
|
|
<el-button type="primary" :loading="submitting" @click="handleSubmit">
|
|||
|
|
{{ isEdit ? '保存' : '创建' }}
|
|||
|
|
</el-button>
|
|||
|
|
<el-button @click="handleCancel">取消</el-button>
|
|||
|
|
</el-form-item>
|
|||
|
|
</el-form>
|
|||
|
|
</PageCard>
|
|||
|
|
</template>
|