feat: 评测模块新增详情页与创建向导

新增 EvalTaskDetail 与逐样本结果类型,Mock 与适配器补充评测详情接口,路由注册详情页并将维度创建并入向导;EvalCreateView 改为分步向导(任务配置、规则设置、维度表单),新增 EvalDetailView 展示综合得分与样本判定,列表补充详情入口,配套两份回归脚本。
This commit is contained in:
caoxiaozhu
2026-07-12 15:39:59 +08:00
parent c0f5f4a30a
commit 71ce26fff6
15 changed files with 1912 additions and 303 deletions

View File

@@ -1,19 +1,17 @@
<script setup lang="ts">
import { ref, reactive, computed, watch, onMounted } from 'vue'
import { ref, reactive, computed, onMounted } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
import { MdEditor } from 'md-editor-v3'
import 'md-editor-v3/lib/style.css'
import PageCard from '@/components/PageCard.vue'
import DimensionFormFields, { type DimensionFormDraft } from './create/DimensionFormFields.vue'
import {
createDimension,
updateDimension,
getDimension,
} from '@/api/modules/eval'
import { getModelList } from '@/api/modules/model'
import { EVAL_METHODS, EVAL_METHOD_PROMPTS } from '@/constants/dimension'
import { DIMENSION_TYPE_MAP } from '@/constants'
import type { DimensionType, ModelItem } from '@/types'
import { EVAL_METHODS } from '@/constants/dimension'
import type { ModelItem } from '@/types'
const route = useRoute()
const router = useRouter()
@@ -24,9 +22,9 @@ const editId = computed(() => route.params.id as string | undefined)
const evalModels = ref<ModelItem[]>([])
const form = reactive({
const form = reactive<DimensionFormDraft>({
name: '',
type: '' as DimensionType | '',
type: '',
description: '',
eval_model: '',
eval_method: '' as string | string[],
@@ -49,44 +47,10 @@ const rules: FormRules = {
],
type: [{ required: true, message: '请选择指标类型', trigger: 'change' }],
eval_model: [{ required: true, message: '请选择大模型', trigger: 'change' }],
eval_method: [{ required: true, message: '请选择评估方式', trigger: 'change' }],
eval_prompt: [{ required: true, message: '请填写评估 Prompt', trigger: 'blur' }],
}
const typeOptions = Object.entries(DIMENSION_TYPE_MAP).map(([value, label]) => ({ value, label }))
/** 当前类型下的评估方法选项 */
const currentMethods = computed(() => (form.type ? EVAL_METHODS[form.type] || [] : []))
/** 是否文本相似度类型(多选评估方法) */
const isTextSimilarity = computed(() => form.type === 'text_similarity')
/** 切换指标类型时重置相关字段 */
watch(
() => form.type,
(t) => {
if (!t) return
const methods = EVAL_METHODS[t] || []
const first = methods[0]?.value || ''
form.eval_method = isTextSimilarity.value ? [first] : first
// 切换 Prompt
if (form.type !== 'text_similarity' && EVAL_METHOD_PROMPTS[first]) {
form.eval_prompt = EVAL_METHOD_PROMPTS[first]
}
},
)
/** 评估方法变化时更新 Prompt */
watch(
() => form.eval_method,
(m) => {
if (form.type === 'text_similarity' || !m) return
const method = Array.isArray(m) ? m[0] : m
if (method && EVAL_METHOD_PROMPTS[method]) {
form.eval_prompt = EVAL_METHOD_PROMPTS[method]
}
},
)
async function loadEditData() {
if (!editId.value) return
try {
@@ -176,100 +140,7 @@ onMounted(() => {
<template>
<PageCard :title="isEdit ? '编辑评测维度' : '添加评测维度'">
<el-form ref="formRef" :model="form" :rules="rules" label-width="130px" style="max-width: 760px">
<el-form-item label="维度名称" prop="name">
<el-input v-model="form.name" placeholder="请输入维度名称" maxlength="50" 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="描述">
<el-input v-model="form.description" type="textarea" :rows="2" maxlength="200" show-word-limit />
</el-form-item>
<!-- 分类型 / 指标型需要选择大模型和评估方法 -->
<template v-if="form.type === 'classification' || form.type === 'metric'">
<el-form-item label="选择大模型" prop="eval_model">
<el-select v-model="form.eval_model" placeholder="请选择评测模型" filterable style="width: 100%">
<el-option v-for="m in evalModels" :key="m.id" :label="m.name" :value="m.name" />
</el-select>
</el-form-item>
<el-form-item label="评估方式" prop="eval_method">
<el-radio-group v-model="(form.eval_method as string)">
<el-radio v-for="m in currentMethods" :key="m.value" :value="m.value">
{{ m.name }}
<span class="method-desc">{{ m.desc }}</span>
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="评估 Prompt" prop="eval_prompt">
<MdEditor v-model="form.eval_prompt" language="zh-CN" :toolbars-exclude="['github', 'save']" style="height: 320px" />
</el-form-item>
</template>
<!-- 文本相似度多选评估方法 + BLEU/精度配置 -->
<template v-if="form.type === 'text_similarity'">
<el-form-item label="评估方式">
<el-checkbox-group v-model="(form.eval_method as string[])">
<el-checkbox v-for="m in currentMethods" :key="m.value" :value="m.value">
{{ m.name }}
<span class="method-desc">{{ m.desc }}</span>
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="BLEU n-gram">
<el-select v-model="form.bleu_n" style="width: 160px">
<el-option :value="1" label="1-gram" />
<el-option :value="2" label="2-gram" />
<el-option :value="3" label="3-gram" />
<el-option :value="4" label="4-gram" />
</el-select>
</el-form-item>
<el-form-item label="输出精度">
<el-select v-model="form.output_precision" style="width: 160px">
<el-option :value="1" label="1 位小数" />
<el-option :value="2" label="2 位小数" />
<el-option :value="3" label="3 位小数" />
<el-option :value="4" label="4 位小数" />
</el-select>
</el-form-item>
</template>
<!-- 指标型评分范围 + 通过阈值 -->
<template v-if="form.type === 'metric'">
<el-form-item label="评分最小值">
<el-input-number v-model="form.score_min" :min="0" :step="1" style="width: 160px" />
</el-form-item>
<el-form-item label="评分最大值">
<el-input-number v-model="form.score_max" :min="0" :step="1" style="width: 160px" />
</el-form-item>
<el-form-item label="通过阈值">
<div style="width: 100%">
<el-slider
v-model="form.pass_threshold"
:min="form.score_min"
:max="form.score_max"
:step="0.5"
show-input
:show-input-controls="false"
/>
</div>
</el-form-item>
</template>
<el-form-item label="启用该维度">
<el-switch v-model="form.is_active" />
</el-form-item>
<el-form-item label="设为默认">
<el-switch v-model="form.is_default" />
</el-form-item>
<DimensionFormFields v-model="form" :eval-models="evalModels" />
<el-form-item>
<el-button type="primary" :loading="submitting" @click="handleSubmit">
@@ -280,11 +151,3 @@ onMounted(() => {
</el-form>
</PageCard>
</template>
<style scoped>
.method-desc {
color: #909399;
font-size: 12px;
margin-left: 6px;
}
</style>

View File

@@ -1,91 +1,165 @@
<script setup lang="ts">
import { ref, reactive, computed, onMounted, watch } from 'vue'
import { onMounted, ref, watch } from 'vue'
import { useRouter } from 'vue-router'
import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
import { ElMessage } from 'element-plus'
import PageCard from '@/components/PageCard.vue'
import { startEval } from '@/api/modules/eval'
import { getDimensionList } from '@/api/modules/eval'
import { getTrainedModels } from '@/api/modules/model'
import EvalTaskSetupStep, { type EvalTaskSetupDraft } from './create/EvalTaskSetupStep.vue'
import EvalRuleSetupStep, { type EvalRuleSetupDraft } from './create/EvalRuleSetupStep.vue'
import { createDimension, getDimensionList, startEval } from '@/api/modules/eval'
import { getTrainedModels, getModelList } from '@/api/modules/model'
import { getDatasetList } from '@/api/modules/dataset'
import { getSystemInfo } from '@/api/modules/system'
import type { Dimension, TrainedModel, DatasetItem, GpuInfo } from '@/types'
import type { DatasetItem, Dimension, GpuInfo, ModelItem, TrainedModel } from '@/types'
type StepExposed = { validate: () => Promise<boolean> }
const router = useRouter()
const formRef = ref<FormInstance>()
const loading = ref(false)
const submitting = ref(false)
const taskStepRef = ref<StepExposed>()
const ruleStepRef = ref<StepExposed>()
const trainedModels = ref<TrainedModel[]>([])
const evalDatasets = ref<DatasetItem[]>([])
const dimensions = ref<Dimension[]>([])
const evalModels = ref<ModelItem[]>([])
const gpus = ref<GpuInfo[]>([])
const createdDimensionId = ref<string | number>('')
const form = reactive({
const taskForm = ref<EvalTaskSetupDraft>({
eval_task_name: '',
eval_type: 'custom' as 'custom' | 'baseline',
model_id: '' as string | number,
model_id: '',
gpu_id: '',
data_source: 'dataset' as 'dataset' | 'inference',
dataset_id: '' as string | number,
dimension_id: '' as string | number,
leaderboard: false, // 修复原项目字段名 bug原读 leader 恒 false
data_source: 'dataset',
dataset_id: '',
leaderboard: false,
})
const rules: FormRules = {
eval_task_name: [{ required: true, message: '请输入任务名称', trigger: 'blur' }],
model_id: [{ required: true, message: '请选择评测模型', trigger: 'change' }],
gpu_id: [{ required: true, message: '请选择 GPU', trigger: 'change' }],
dimension_id: [{ required: true, message: '请选择评测维度', trigger: 'change' }],
}
const ruleForm = ref<EvalRuleSetupDraft>({
ruleMode: 'existing',
dimension_id: '',
newDimension: {
name: '',
type: '',
description: '',
eval_model: '',
eval_method: '',
eval_prompt: '',
is_active: true,
is_default: false,
bleu_n: 1,
output_precision: 3,
score_min: 0,
score_max: 5,
pass_threshold: 3,
},
})
const showEvalRules = computed(() => form.eval_type === 'custom')
const showDataset = computed(() => form.data_source === 'dataset')
/** 选中维度详情 */
const selectedDimension = computed(() =>
dimensions.value.find((d) => d.id == form.dimension_id),
watch(
() => ruleForm.value.newDimension,
() => {
createdDimensionId.value = ''
},
{ deep: true },
)
async function loadData() {
try {
const [models, dims, allDs, sys] = await Promise.all([
getTrainedModels(),
getDimensionList(),
getDatasetList(),
getSystemInfo(),
])
trainedModels.value = models?.models || []
dimensions.value = dims || []
evalDatasets.value = (allDs || []).filter((d: DatasetItem) => d.type === 'eval')
gpus.value = sys?.gpu || []
} catch {
// ignore
loading.value = true
const results = await Promise.allSettled([
getTrainedModels(),
getDimensionList(),
getDatasetList(),
getSystemInfo(),
getModelList(),
])
if (results[0].status === 'fulfilled') trainedModels.value = results[0].value?.models || []
if (results[1].status === 'fulfilled') dimensions.value = results[1].value || []
if (results[2].status === 'fulfilled') {
evalDatasets.value = (results[2].value || []).filter((dataset) => dataset.type === 'eval')
}
if (results[3].status === 'fulfilled') gpus.value = results[3].value?.gpu || []
if (results[4].status === 'fulfilled') {
evalModels.value = (results[4].value || []).filter((model) => model.purpose === 'evaluation')
}
const failedCount = results.filter((result) => result.status === 'rejected').length
if (failedCount > 0) {
ElMessage.error(`部分基础数据加载失败(${failedCount} 项),请刷新页面后重试`)
}
loading.value = false
}
function buildDimensionPayload() {
const draft = ruleForm.value.newDimension
const payload: Partial<Dimension> = {
name: draft.name,
type: draft.type,
description: draft.description,
eval_model: draft.type === 'text_similarity' ? undefined : draft.eval_model,
eval_method: draft.eval_method,
eval_prompt: draft.type === 'text_similarity' ? undefined : draft.eval_prompt,
is_active: draft.is_active,
is_default: draft.is_default,
create_time: new Date().toISOString(),
}
if (draft.type === 'text_similarity') {
payload.bleu_n = draft.bleu_n
payload.output_precision = draft.output_precision
}
if (draft.type === 'metric') {
payload.score_min = draft.score_min
payload.score_max = draft.score_max
payload.pass_threshold = draft.pass_threshold
}
return payload
}
async function resolveDimensionId() {
if (ruleForm.value.ruleMode === 'baseline') return ''
if (ruleForm.value.ruleMode === 'existing') return ruleForm.value.dimension_id
if (createdDimensionId.value !== '') return createdDimensionId.value
const created = await createDimension(buildDimensionPayload())
if (created?.id === undefined || created.id === null || created.id === '') {
throw new Error('评测维度已提交,但未返回维度 ID无法启动评测任务')
}
createdDimensionId.value = created.id
return created.id
}
async function handleSubmit() {
if (!formRef.value) return
await formRef.value.validate(async (valid) => {
if (!valid) return
submitting.value = true
try {
await startEval({
eval_task_name: form.eval_task_name,
eval_type: form.eval_type,
model_id: form.model_id,
gpu_id: form.gpu_id,
dataset_id: form.dataset_id,
dimension_id: form.dimension_id,
data_source: form.data_source,
leaderboard: form.leaderboard,
})
ElMessage.success('评测任务已启动')
router.push('/model-eval')
} catch {
// ignore
} finally {
submitting.value = false
}
})
if (loading.value || submitting.value) return
const taskValid = await taskStepRef.value?.validate()
const ruleValid = await ruleStepRef.value?.validate()
if (!taskValid || !ruleValid) {
ElMessage.warning('请检查并完善所有必填项')
return
}
submitting.value = true
try {
const dimensionId = await resolveDimensionId()
await startEval({
eval_task_name: taskForm.value.eval_task_name,
eval_type: ruleForm.value.ruleMode === 'baseline' ? 'baseline' : 'custom',
model_id: taskForm.value.model_id,
gpu_id: taskForm.value.gpu_id,
dataset_id: taskForm.value.data_source === 'dataset' ? taskForm.value.dataset_id : '',
dimension_id: dimensionId,
data_source: taskForm.value.data_source,
leaderboard: taskForm.value.leaderboard,
})
ElMessage.success('评测任务已创建并启动')
router.push('/model-eval')
} catch (error) {
const message = error instanceof Error ? error.message : '创建评测任务失败,请稍后重试'
ElMessage.error(message)
} finally {
submitting.value = false
}
}
function handleCancel() {
@@ -96,82 +170,77 @@ onMounted(loadData)
</script>
<template>
<PageCard title="新建评测">
<el-form ref="formRef" :model="form" :rules="rules" label-width="120px" style="max-width: 720px">
<el-form-item label="任务名称" prop="eval_task_name">
<el-input v-model="form.eval_task_name" placeholder="请输入任务名称" maxlength="50" show-word-limit />
</el-form-item>
<PageCard title="新建评测任务" subtitle="完成任务配置与评测规则设置后启动评测">
<div v-loading="loading" class="form-container">
<div class="section-card">
<div class="section-title">任务基本配置</div>
<EvalTaskSetupStep
ref="taskStepRef"
v-model="taskForm"
:trained-models="trainedModels"
:eval-datasets="evalDatasets"
:gpus="gpus"
:loading="loading"
:disabled="submitting"
/>
</div>
<el-form-item label="评测方式">
<el-radio-group v-model="form.eval_type">
<el-radio-button value="custom">自定义评测</el-radio-button>
<el-radio-button value="baseline">基线评测</el-radio-button>
</el-radio-group>
</el-form-item>
<div class="section-card">
<div class="section-title">评测规则设置</div>
<EvalRuleSetupStep
ref="ruleStepRef"
v-model="ruleForm"
:dimensions="dimensions"
:eval-models="evalModels"
:loading="loading"
:disabled="submitting"
/>
</div>
</div>
<el-form-item label="评测模型" prop="model_id">
<el-select v-model="form.model_id" placeholder="请选择已训练模型" filterable style="width: 100%">
<el-option
v-for="m in trainedModels"
:key="m.id"
:label="m.name"
:value="m.id"
:disabled="!m.merged"
/>
</el-select>
</el-form-item>
<el-form-item label="选择 GPU" prop="gpu_id">
<el-select v-model="form.gpu_id" placeholder="请选择 GPU" style="width: 100%">
<el-option v-for="(g, idx) in gpus" :key="idx" :label="`${g.name} (GPU ${idx})`" :value="idx" />
</el-select>
</el-form-item>
<el-form-item label="数据来源">
<el-radio-group v-model="form.data_source">
<el-radio value="dataset">评测数据集</el-radio>
<el-radio value="inference">推理结果集</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item v-if="showDataset" label="评测数据集" prop="dataset_id">
<el-select v-model="form.dataset_id" placeholder="请选择评测数据集" filterable style="width: 100%">
<el-option v-for="d in evalDatasets" :key="d.id" :label="d.name" :value="d.id" />
</el-select>
</el-form-item>
<!-- 评测规则 custom 显示 -->
<template v-if="showEvalRules">
<el-divider content-position="left">评测规则</el-divider>
<el-form-item label="评测维度" prop="dimension_id">
<el-select
v-model="form.dimension_id"
placeholder="请选择评测维度"
filterable
style="width: 100%"
>
<el-option v-for="d in dimensions" :key="d.id" :label="d.name" :value="d.id" />
</el-select>
</el-form-item>
<el-form-item v-if="selectedDimension" label="维度详情">
<el-descriptions :column="1" border size="small">
<el-descriptions-item label="评估模型">{{ selectedDimension.eval_model || '-' }}</el-descriptions-item>
<el-descriptions-item label="评估方法">
{{ Array.isArray(selectedDimension.eval_method) ? selectedDimension.eval_method.join(', ') : selectedDimension.eval_method || '-' }}
</el-descriptions-item>
</el-descriptions>
</el-form-item>
</template>
<el-form-item label="加入排行榜">
<el-switch v-model="form.leaderboard" />
</el-form-item>
<el-form-item>
<el-button type="primary" :loading="submitting" @click="handleSubmit">启动评测</el-button>
<el-button @click="handleCancel">取消</el-button>
</el-form-item>
</el-form>
<div class="form-footer">
<el-button :disabled="submitting" @click="handleCancel">取消</el-button>
<el-button
type="primary"
:loading="submitting"
:disabled="loading"
@click="handleSubmit"
>
创建并启动评测
</el-button>
</div>
</PageCard>
</template>
<style scoped>
.form-container {
display: flex;
flex-direction: column;
gap: 24px;
}
.section-card {
padding: 24px;
border-radius: 8px;
background: #f9fafb;
border: 1px solid #e5e7eb;
}
.section-title {
font-size: 16px;
font-weight: 600;
color: #111827;
margin-bottom: 24px;
padding-bottom: 12px;
border-bottom: 1px solid #e5e7eb;
}
.form-footer {
display: flex;
justify-content: flex-end;
gap: 12px;
margin-top: 32px;
padding-top: 24px;
border-top: 1px solid #e5e7eb;
}
</style>

View File

@@ -0,0 +1,749 @@
<script setup lang="ts">
import { computed, onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import PageCard from '@/components/PageCard.vue'
import ModelStatusTag from '@/components/ModelStatusTag.vue'
import { getEvalDetail } from '@/api/modules/eval'
import type { EvalSampleResult, EvalTaskDetail } from '@/types'
const route = useRoute()
const taskId = route.params.id as string
const loading = ref(true)
const loadError = ref('')
const detail = ref<EvalTaskDetail | null>(null)
const keyword = ref('')
const judgementFilter = ref('')
const currentPage = ref(1)
const pageSize = ref(10)
const filteredSamples = computed(() => {
const normalizedKeyword = keyword.value.trim().toLowerCase()
return (detail.value?.samples || []).filter((sample) => {
const matchesJudgement = !judgementFilter.value || sample.judgement === judgementFilter.value
const searchableText = [
sample.input,
sample.reference_answer,
sample.model_output,
sample.evaluation_reason,
sample.error_type,
].filter(Boolean).join(' ').toLowerCase()
return matchesJudgement && (!normalizedKeyword || searchableText.includes(normalizedKeyword))
})
})
const paginatedSamples = computed(() => {
const start = (currentPage.value - 1) * pageSize.value
return filteredSamples.value.slice(start, start + pageSize.value)
})
const completionRate = computed(() => {
const total = detail.value?.sample_count || 0
return total ? Math.round(((detail.value?.completed_count || 0) / total) * 100) : 0
})
const passRate = computed(() => {
const completed = detail.value?.completed_count || 0
return completed ? Math.round(((detail.value?.passed_count || 0) / completed) * 100) : 0
})
const overallScore = computed(() => formatScore(detail.value?.overall_score, detail.value?.overall_score_max))
function formatDateTime(value?: string) {
if (!value) return '-'
const date = new Date(value)
return Number.isNaN(date.getTime())
? value
: date.toLocaleString('zh-CN', { hour12: false })
}
function formatScore(score?: number | null, maxScore?: number) {
if (score == null) return '-'
const decimals = Number.isInteger(score) ? 0 : 2
return `${score.toFixed(decimals)}${maxScore != null ? ` / ${maxScore}` : ''}`
}
function judgementTagType(judgement?: EvalSampleResult['judgement']) {
if (judgement === '正确') return 'success'
if (judgement === '部分正确') return 'warning'
if (judgement === '错误') return 'danger'
return 'info'
}
function resetPage() {
currentPage.value = 1
}
async function loadDetail() {
loading.value = true
loadError.value = ''
try {
detail.value = await getEvalDetail(taskId)
} catch {
detail.value = null
loadError.value = '评测详情加载失败,请稍后重试。'
} finally {
loading.value = false
}
}
onMounted(loadDetail)
</script>
<template>
<PageCard class="eval-detail-page" v-loading="loading">
<template #header>
<div class="page-heading">
<div class="heading-copy">
<div class="heading-row">
<h1>{{ detail?.eval_task_name || '评测任务详情' }}</h1>
<ModelStatusTag v-if="detail" :status="detail.status" />
</div>
<dl class="task-meta">
<div><dt>任务 ID</dt><dd>{{ detail?.id || taskId }}</dd></div>
<div><dt>评测模型</dt><dd>{{ detail?.model_name || '-' }}</dd></div>
<div><dt>测试集</dt><dd>{{ detail?.dataset || '-' }}</dd></div>
<div><dt>评测指标</dt><dd>{{ detail?.metric || '-' }}</dd></div>
</dl>
</div>
</div>
</template>
<div v-if="loadError" class="load-state is-error" role="alert">
<i class="fa fa-exclamation-circle" aria-hidden="true" />
<h2>无法加载评测详情</h2>
<p>{{ loadError }}</p>
<el-button type="primary" @click="loadDetail">重新加载</el-button>
</div>
<template v-else-if="detail">
<section class="overview-grid" aria-label="评测概览">
<div class="overview-item score-hero">
<span>综合得分</span>
<strong>{{ overallScore }}</strong>
<small>大模型综合评分</small>
</div>
<div class="overview-item">
<span>样本通过率</span>
<strong>{{ detail.completed_count ? `${passRate}%` : '-' }}</strong>
<small>通过 {{ detail.passed_count || 0 }} / 已评测 {{ detail.completed_count }}</small>
</div>
<div class="overview-item">
<span>评测进度</span>
<strong>{{ detail.completed_count }} / {{ detail.sample_count }}</strong>
<el-progress :percentage="completionRate" :show-text="false" :stroke-width="5" />
</div>
<div class="overview-item overview-time">
<span>{{ detail.completed_time ? '完成时间' : '创建时间' }}</span>
<strong>{{ formatDateTime(detail.completed_time || detail.create_time) }}</strong>
<small>{{ detail.completed_time ? '评测任务已完成' : `当前进度 ${completionRate}%` }}</small>
</div>
</section>
<section class="overall-review" aria-labelledby="overall-review-title">
<div class="review-copy">
<div class="section-heading">
<div>
<h2 id="overall-review-title">大模型综合评价</h2>
<p>基于全部已评测样本生成的总体结论</p>
</div>
<el-tag v-if="detail.evaluator_model" type="primary" size="small">
评审模型{{ detail.evaluator_model }}
</el-tag>
</div>
<p class="review-text">
{{ detail.overall_evaluation || (detail.status === 'running' ? '评测仍在进行,综合评价将在样本评分完成后生成。' : '暂无综合评价。') }}
</p>
<div class="suggestion-block">
<h3>改进建议</h3>
<ul v-if="detail.improvement_suggestions?.length" class="improvement-list">
<li v-for="suggestion in detail.improvement_suggestions" :key="suggestion">
{{ suggestion }}
</li>
</ul>
<p v-else class="empty-copy">暂无改进建议</p>
</div>
</div>
</section>
<section v-if="detail.dimension_summary?.length" class="dimension-summary" aria-labelledby="dimension-title">
<div class="section-heading compact-heading">
<div>
<h2 id="dimension-title">维度表现</h2>
<p>查看各评测维度的得分与样本通过率</p>
</div>
</div>
<div class="dimension-grid">
<div v-for="dimension in detail.dimension_summary" :key="dimension.name" class="dimension-item">
<div class="dimension-label">
<strong>{{ dimension.name }}</strong>
<span>{{ formatScore(dimension.score, dimension.max_score) }}</span>
</div>
<el-progress :percentage="dimension.pass_rate" :stroke-width="7" />
</div>
</div>
</section>
<section class="sample-section" aria-labelledby="sample-results-title">
<div class="sample-toolbar">
<div>
<h2 id="sample-results-title">测试集样本评测结果</h2>
<p> {{ filteredSamples.length }} 条结果展开行可查看评分依据与子维度分数</p>
</div>
<div class="sample-filters" aria-label="样本筛选">
<el-input
v-model="keyword"
clearable
placeholder="搜索问题、回答或评价"
aria-label="搜索样本"
@input="resetPage"
>
<template #prefix><i class="fa fa-search" aria-hidden="true" /></template>
</el-input>
<el-select
v-model="judgementFilter"
clearable
placeholder="全部判定"
aria-label="按判定筛选"
@change="resetPage"
>
<el-option label="正确" value="正确" />
<el-option label="部分正确" value="部分正确" />
<el-option label="错误" value="错误" />
</el-select>
</div>
</div>
<el-table
v-if="filteredSamples.length"
class="sample-results-table"
:data="paginatedSamples"
row-key="id"
table-layout="fixed"
>
<el-table-column type="expand" width="48">
<template #default="{ row }">
<div class="sample-detail-grid">
<div class="evaluation-reason">
<span>大模型评分依据</span>
<p>{{ row.evaluation_reason || '暂无评分依据。' }}</p>
</div>
<div v-if="row.error_type" class="error-type">
<span>错误类型</span>
<el-tag type="danger" size="small">{{ row.error_type }}</el-tag>
</div>
<div v-if="row.dimension_scores?.length" class="sample-dimensions">
<span>子维度评分</span>
<div class="dimension-score-list">
<span v-for="item in row.dimension_scores" :key="item.name">
{{ item.name }} <strong>{{ formatScore(item.score, item.max_score) }}</strong>
</span>
</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="#" prop="index" width="56" align="center" />
<el-table-column label="问题 / 输入" min-width="180">
<template #default="{ row }"><p class="cell-copy">{{ row.input }}</p></template>
</el-table-column>
<el-table-column label="标准答案" min-width="170">
<template #default="{ row }"><p class="cell-copy">{{ row.reference_answer || '-' }}</p></template>
</el-table-column>
<el-table-column label="模型回答" min-width="190">
<template #default="{ row }"><p class="cell-copy">{{ row.model_output || '等待生成' }}</p></template>
</el-table-column>
<el-table-column label="得分" width="90" align="center">
<template #default="{ row }">
<span class="sample-score">{{ formatScore(row.score, row.max_score) }}</span>
</template>
</el-table-column>
<el-table-column label="判定" width="96" align="center">
<template #default="{ row }">
<el-tag :type="judgementTagType(row.judgement)" size="small">
{{ row.judgement || (row.status === 'pending' ? '待评测' : '-') }}
</el-tag>
</template>
</el-table-column>
</el-table>
<div v-else class="load-state sample-empty">
<i class="fa fa-list-alt" aria-hidden="true" />
<h3>{{ detail.samples.length ? '没有符合筛选条件的样本' : '暂无样本评测结果' }}</h3>
<p>{{ detail.status === 'running' ? '任务正在运行,结果生成后会显示在这里。' : '请调整筛选条件或稍后重试。' }}</p>
</div>
<el-pagination
v-if="filteredSamples.length > pageSize"
v-model:current-page="currentPage"
v-model:page-size="pageSize"
background
layout="total, sizes, prev, pager, next"
:page-sizes="[10, 20, 50]"
:total="filteredSamples.length"
aria-label="样本结果分页"
/>
</section>
</template>
</PageCard>
</template>
<style scoped lang="scss">
.eval-detail-page {
min-width: 0;
}
.page-heading,
.heading-row,
.section-heading,
.sample-toolbar,
.sample-filters,
.dimension-label {
display: flex;
align-items: center;
}
.heading-copy {
width: 100%;
min-width: 0;
}
.heading-row {
gap: 10px;
flex-wrap: wrap;
}
.heading-row h1 {
margin: 0;
color: #303133;
font-size: 18px;
font-weight: 600;
line-height: 1.4;
}
.task-meta {
display: flex;
flex-wrap: wrap;
gap: 8px 24px;
margin: 10px 0 0;
}
.task-meta > div {
display: flex;
gap: 6px;
min-width: 0;
}
.task-meta dt,
.task-meta dd {
margin: 0;
font-size: 13px;
}
.task-meta dt {
color: #909399;
}
.task-meta dd {
color: #606266;
font-weight: 500;
}
.overview-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
border: 1px solid #e4e7ed;
border-radius: 8px;
overflow: hidden;
background: #fff;
}
.overview-item {
min-width: 0;
min-height: 92px;
padding: 16px 20px;
border-right: 1px solid #e4e7ed;
}
.overview-item:last-child {
border-right: 0;
}
.overview-item > span,
.evaluation-reason > span,
.error-type > span,
.sample-dimensions > span {
display: block;
margin-bottom: 8px;
color: #606266;
font-size: 13px;
font-weight: 500;
}
.overview-item > strong {
display: block;
color: #303133;
font-size: 22px;
font-weight: 600;
line-height: 1.3;
font-variant-numeric: tabular-nums;
}
.score-hero > strong {
color: var(--primary-color);
}
.overview-item small {
display: block;
margin-top: 5px;
color: #909399;
font-size: 12px;
}
.overview-item :deep(.el-progress) {
margin-top: 8px;
}
.overview-time > strong {
font-size: 14px;
font-weight: 500;
line-height: 1.6;
}
.overall-review {
margin-top: 16px;
border: 1px solid #e4e7ed;
border-radius: 8px;
background: #fff;
}
.review-copy {
padding: 18px 20px;
}
.section-heading,
.sample-toolbar {
justify-content: space-between;
gap: 16px;
}
.section-heading h2,
.sample-toolbar h2 {
margin: 0;
color: #303133;
font-size: 16px;
font-weight: 600;
}
.section-heading p,
.sample-toolbar p {
margin: 5px 0 0;
color: #909399;
font-size: 13px;
}
.review-text {
max-width: 1100px;
margin: 16px 0;
color: #606266;
font-size: 14px;
line-height: 1.75;
}
.suggestion-block {
padding: 14px 16px;
border: 1px solid #ebeef5;
border-radius: 6px;
background: #f8f9fb;
}
.suggestion-block h3 {
margin: 0 0 8px;
color: #303133;
font-size: 14px;
font-weight: 600;
}
.improvement-list {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 6px 24px;
margin: 0;
padding-left: 18px;
color: #606266;
font-size: 13px;
line-height: 1.6;
}
.dimension-summary,
.sample-section {
margin-top: 16px;
padding: 18px 20px;
border: 1px solid #e4e7ed;
border-radius: 8px;
background: #fff;
}
.compact-heading {
align-items: center;
}
.dimension-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0;
margin-top: 16px;
border: 1px solid #ebeef5;
border-radius: 6px;
overflow: hidden;
}
.dimension-item {
min-width: 0;
padding: 14px 16px;
border-right: 1px solid #ebeef5;
background: #fafafa;
}
.dimension-item:last-child {
border-right: 0;
}
.dimension-label {
justify-content: space-between;
margin-bottom: 8px;
gap: 8px;
color: #606266;
font-size: 13px;
}
.dimension-label strong {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.dimension-label span {
flex: 0 0 auto;
color: #303133;
font-weight: 600;
font-variant-numeric: tabular-nums;
}
.sample-toolbar {
align-items: center;
margin-bottom: 14px;
}
.sample-filters {
flex: 0 1 450px;
justify-content: flex-end;
gap: 10px;
}
.sample-filters :deep(.el-input) {
width: min(260px, 100%);
}
.sample-filters :deep(.el-select) {
width: 130px;
}
.sample-results-table {
width: 100%;
border: 1px solid #ebeef5;
border-radius: 6px;
}
.cell-copy {
display: -webkit-box;
overflow: hidden;
margin: 0;
color: #606266;
font-size: 13px;
line-height: 1.55;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.sample-score {
color: #303133;
font-weight: 600;
font-variant-numeric: tabular-nums;
}
.sample-detail-grid {
display: grid;
grid-template-columns: minmax(140px, 0.35fr) minmax(320px, 1fr);
gap: 14px 24px;
padding: 16px 48px;
background: #f7f8fa;
}
.evaluation-reason {
grid-column: 1 / -1;
}
.evaluation-reason p {
margin: 0;
color: #606266;
font-size: 13px;
line-height: 1.7;
}
.dimension-score-list {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.dimension-score-list > span {
color: #606266;
font-size: 12px;
}
.dimension-score-list > span:not(:last-child)::after {
margin-left: 8px;
color: #c0c4cc;
content: '/';
}
.dimension-score-list strong {
margin-left: 4px;
color: #303133;
font-variant-numeric: tabular-nums;
}
.load-state {
min-height: 280px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 32px;
color: #909399;
text-align: center;
}
.load-state > i {
margin-bottom: 12px;
color: #c0c4cc;
font-size: 30px;
}
.load-state h2,
.load-state h3 {
margin: 0;
color: #303133;
}
.load-state p,
.empty-copy {
margin: 8px 0 16px;
color: #909399;
font-size: 13px;
}
.load-state.is-error > i {
color: #ef4444;
}
.sample-empty {
min-height: 210px;
border: 1px dashed #dcdfe6;
border-radius: 6px;
background: #fafafa;
}
@media (max-width: 1100px) {
.overview-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.overview-item:nth-child(2) {
border-right: 0;
}
.overview-item:nth-child(-n + 2) {
border-bottom: 1px solid #e4e7ed;
}
.dimension-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.dimension-item:nth-child(2) {
border-right: 0;
}
.dimension-item:nth-child(-n + 2) {
border-bottom: 1px solid #ebeef5;
}
.sample-toolbar {
align-items: stretch;
flex-direction: column;
}
.sample-filters {
flex: 1;
justify-content: flex-start;
}
.sample-detail-grid {
padding: 16px 24px;
}
}
@media (max-width: 720px) {
.task-meta {
flex-direction: column;
gap: 5px;
}
.overview-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.overview-item {
padding: 14px;
}
.review-copy,
.dimension-summary,
.sample-section {
padding: 16px;
}
.dimension-grid,
.improvement-list,
.sample-detail-grid {
grid-template-columns: minmax(0, 1fr);
}
.dimension-item,
.dimension-item:nth-child(2) {
border-right: 0;
border-bottom: 1px solid #ebeef5;
}
.dimension-item:last-child {
border-bottom: 0;
}
.sample-filters {
flex-direction: column;
align-items: stretch;
}
.sample-filters :deep(.el-input),
.sample-filters :deep(.el-select) {
width: 100%;
}
.evaluation-reason {
grid-column: auto;
}
}
</style>

View File

@@ -68,15 +68,15 @@ function editDimension(row: any) {
}
function handleCreateClick() {
if (activeTab.value === 'tasks') {
router.push('/model-eval/create')
} else if (activeTab.value === 'dimensions') {
router.push('/model-eval/dimension/create')
}
router.push('/model-eval/create')
}
function isActiveTab(tab: string) {
return activeTab.value === tab
}
function handleViewDetail(row: any) {
ElMessage.info('详情功能开发中')
router.push({ name: 'model-eval-detail', params: { id: row.id } })
}
onMounted(() => {
@@ -101,9 +101,9 @@ onMounted(() => {
>
<template #title>
<div class="capsule-tabs">
<button class="capsule-tab-item" :class="{ active: activeTab === 'tasks' }" @click="activeTab = 'tasks'">评测任务</button>
<button class="capsule-tab-item" :class="{ active: activeTab === 'leaderboard' }" @click="activeTab = 'leaderboard'">排行榜</button>
<button class="capsule-tab-item" :class="{ active: activeTab === 'dimensions' }" @click="activeTab = 'dimensions'">评测维度</button>
<button class="capsule-tab-item" :class="{ active: isActiveTab('tasks') }" @click="activeTab = 'tasks'">评测任务</button>
<button class="capsule-tab-item" :class="{ active: isActiveTab('leaderboard') }" @click="activeTab = 'leaderboard'">排行榜</button>
<button class="capsule-tab-item" :class="{ active: isActiveTab('dimensions') }" @click="activeTab = 'dimensions'">评测维度</button>
</div>
</template>
<template #columns>
@@ -134,9 +134,9 @@ onMounted(() => {
>
<template #title>
<div class="capsule-tabs">
<button class="capsule-tab-item" :class="{ active: activeTab === 'tasks' }" @click="activeTab = 'tasks'">评测任务</button>
<button class="capsule-tab-item" :class="{ active: activeTab === 'leaderboard' }" @click="activeTab = 'leaderboard'">排行榜</button>
<button class="capsule-tab-item" :class="{ active: activeTab === 'dimensions' }" @click="activeTab = 'dimensions'">评测维度</button>
<button class="capsule-tab-item" :class="{ active: isActiveTab('tasks') }" @click="activeTab = 'tasks'">评测任务</button>
<button class="capsule-tab-item" :class="{ active: isActiveTab('leaderboard') }" @click="activeTab = 'leaderboard'">排行榜</button>
<button class="capsule-tab-item" :class="{ active: isActiveTab('dimensions') }" @click="activeTab = 'dimensions'">评测维度</button>
</div>
</template>
<template #columns>
@@ -153,16 +153,14 @@ onMounted(() => {
:data="dimensionList"
:loading="dimLoading"
:delete-fn="handleDeleteDimension"
create-text="添加维度"
@create="handleCreateClick"
row-key="id"
@refresh="loadDimensions"
>
<template #title>
<div class="capsule-tabs">
<button class="capsule-tab-item" :class="{ active: activeTab === 'tasks' }" @click="activeTab = 'tasks'">评测任务</button>
<button class="capsule-tab-item" :class="{ active: activeTab === 'leaderboard' }" @click="activeTab = 'leaderboard'">排行榜</button>
<button class="capsule-tab-item" :class="{ active: activeTab === 'dimensions' }" @click="activeTab = 'dimensions'">评测维度</button>
<button class="capsule-tab-item" :class="{ active: isActiveTab('tasks') }" @click="activeTab = 'tasks'">评测任务</button>
<button class="capsule-tab-item" :class="{ active: isActiveTab('leaderboard') }" @click="activeTab = 'leaderboard'">排行榜</button>
<button class="capsule-tab-item" :class="{ active: isActiveTab('dimensions') }" @click="activeTab = 'dimensions'">评测维度</button>
</div>
</template>
<template #columns>

View File

@@ -0,0 +1,168 @@
<script setup lang="ts">
import { computed, watch } from 'vue'
import { MdEditor } from 'md-editor-v3'
import 'md-editor-v3/lib/style.css'
import { EVAL_METHODS, EVAL_METHOD_PROMPTS } from '@/constants/dimension'
import { DIMENSION_TYPE_MAP } from '@/constants'
import type { DimensionType, ModelItem } from '@/types'
export interface DimensionFormDraft {
name: string
type: DimensionType | ''
description: string
eval_model: string
eval_method: string | string[]
eval_prompt: string
is_active: boolean
is_default: boolean
bleu_n: number
output_precision: number
score_min: number
score_max: number
pass_threshold: number
}
defineProps<{ evalModels: ModelItem[] }>()
const form = defineModel<DimensionFormDraft>({ required: true })
const typeOptions = Object.entries(DIMENSION_TYPE_MAP).map(([value, label]) => ({ value, label }))
const currentMethods = computed(() => (form.value.type ? EVAL_METHODS[form.value.type] || [] : []))
/**
* 指标类型变化时初始化对应的评估方式和 Prompt。
* 同步执行可保证编辑页批量回填时,接口返回值最终覆盖默认值。
*/
watch(
() => form.value.type,
(type) => {
if (!type) return
const firstMethod = EVAL_METHODS[type]?.[0]?.value || ''
form.value.eval_method = type === 'text_similarity' ? [firstMethod] : firstMethod
if (type !== 'text_similarity' && EVAL_METHOD_PROMPTS[firstMethod]) {
form.value.eval_prompt = EVAL_METHOD_PROMPTS[firstMethod]
}
},
{ flush: 'sync' },
)
/** 评估方式变化时应用对应的预置 Prompt。 */
watch(
() => form.value.eval_method,
(method) => {
if (form.value.type === 'text_similarity' || !method) return
const selectedMethod = Array.isArray(method) ? method[0] : method
if (selectedMethod && EVAL_METHOD_PROMPTS[selectedMethod]) {
form.value.eval_prompt = EVAL_METHOD_PROMPTS[selectedMethod]
}
},
{ flush: 'sync' },
)
</script>
<template>
<el-form-item label="维度名称" prop="name">
<el-input v-model="form.name" placeholder="请输入维度名称" maxlength="50" 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="option in typeOptions" :key="option.value" :label="option.label" :value="option.value" />
</el-select>
</el-form-item>
<el-form-item label="描述">
<el-input v-model="form.description" type="textarea" :rows="2" maxlength="200" show-word-limit />
</el-form-item>
<template v-if="form.type === 'classification' || form.type === 'metric'">
<el-form-item label="选择大模型" prop="eval_model">
<el-select v-model="form.eval_model" placeholder="请选择评测模型" filterable style="width: 100%">
<el-option v-for="model in evalModels" :key="model.id" :label="model.name" :value="model.name" />
</el-select>
</el-form-item>
<el-form-item label="评估方式" prop="eval_method">
<el-radio-group v-model="(form.eval_method as string)">
<el-radio v-for="method in currentMethods" :key="method.value" :value="method.value">
{{ method.name }}
<span class="method-desc">{{ method.desc }}</span>
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="评估 Prompt" prop="eval_prompt">
<MdEditor
v-model="form.eval_prompt"
language="zh-CN"
:toolbars-exclude="['github', 'save']"
style="height: 320px"
/>
</el-form-item>
</template>
<template v-if="form.type === 'text_similarity'">
<el-form-item label="评估方式" prop="eval_method">
<el-checkbox-group v-model="(form.eval_method as string[])">
<el-checkbox v-for="method in currentMethods" :key="method.value" :value="method.value">
{{ method.name }}
<span class="method-desc">{{ method.desc }}</span>
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="BLEU n-gram">
<el-select v-model="form.bleu_n" style="width: 160px">
<el-option :value="1" label="1-gram" />
<el-option :value="2" label="2-gram" />
<el-option :value="3" label="3-gram" />
<el-option :value="4" label="4-gram" />
</el-select>
</el-form-item>
<el-form-item label="输出精度">
<el-select v-model="form.output_precision" style="width: 160px">
<el-option :value="1" label="1 位小数" />
<el-option :value="2" label="2 位小数" />
<el-option :value="3" label="3 位小数" />
<el-option :value="4" label="4 位小数" />
</el-select>
</el-form-item>
</template>
<template v-if="form.type === 'metric'">
<el-form-item label="评分最小值">
<el-input-number v-model="form.score_min" :min="0" :step="1" style="width: 160px" />
</el-form-item>
<el-form-item label="评分最大值">
<el-input-number v-model="form.score_max" :min="0" :step="1" style="width: 160px" />
</el-form-item>
<el-form-item label="通过阈值">
<div style="width: 100%">
<el-slider
v-model="form.pass_threshold"
:min="form.score_min"
:max="form.score_max"
:step="0.5"
show-input
:show-input-controls="false"
/>
</div>
</el-form-item>
</template>
<el-form-item label="启用该维度">
<el-switch v-model="form.is_active" />
</el-form-item>
<el-form-item label="设为默认">
<el-switch v-model="form.is_default" />
</el-form-item>
</template>
<style scoped>
.method-desc {
color: #909399;
font-size: 12px;
margin-left: 6px;
}
</style>

View File

@@ -0,0 +1,159 @@
<script setup lang="ts">
import { computed, ref } from 'vue'
import type { FormInstance, FormRules } from 'element-plus'
import DimensionFormFields, { type DimensionFormDraft } from './DimensionFormFields.vue'
import type { Dimension, ModelItem } from '@/types'
export type EvalRuleMode = 'existing' | 'new' | 'baseline'
export interface EvalRuleSetupDraft {
ruleMode: EvalRuleMode
dimension_id: string | number
newDimension: DimensionFormDraft
}
const props = defineProps<{
dimensions: Dimension[]
evalModels: ModelItem[]
loading?: boolean
disabled?: boolean
}>()
const form = defineModel<EvalRuleSetupDraft>({ required: true })
const existingFormRef = ref<FormInstance>()
const newFormRef = ref<FormInstance>()
const existingRules: FormRules = {
dimension_id: [{ required: true, message: '请选择评测维度', trigger: 'change' }],
}
const dimensionRules: FormRules<DimensionFormDraft> = {
name: [
{ required: true, message: '请输入维度名称', trigger: 'blur' },
{ max: 50, message: '维度名称不超过 50 个字符', trigger: 'blur' },
],
type: [{ required: true, message: '请选择指标类型', trigger: 'change' }],
eval_model: [{ required: true, message: '请选择大模型', trigger: 'change' }],
eval_method: [{ required: true, message: '请选择评估方式', trigger: 'change' }],
eval_prompt: [{ required: true, message: '请填写评估 Prompt', trigger: 'blur' }],
}
const selectedDimension = computed(() =>
props.dimensions.find((dimension) => String(dimension.id) === String(form.value.dimension_id)),
)
async function validate() {
if (form.value.ruleMode === 'baseline') return true
const target = form.value.ruleMode === 'existing' ? existingFormRef.value : newFormRef.value
if (!target) return false
try {
await target.validate()
return true
} catch {
return false
}
}
defineExpose({ validate })
</script>
<template>
<div class="rule-step">
<div class="rule-mode-label">评测规则来源</div>
<el-radio-group v-model="form.ruleMode" :disabled="disabled" class="rule-mode-group">
<el-radio-button value="existing">选择已有维度</el-radio-button>
<el-radio-button value="new">新建评测维度</el-radio-button>
<el-radio-button value="baseline">系统基线规则</el-radio-button>
</el-radio-group>
<el-form
v-if="form.ruleMode === 'existing'"
ref="existingFormRef"
:model="form"
:rules="existingRules"
label-width="120px"
class="step-form"
:disabled="disabled"
>
<el-form-item label="评测维度" prop="dimension_id">
<el-select
v-model="form.dimension_id"
placeholder="请选择评测维度"
filterable
style="width: 100%"
:loading="loading"
>
<el-option
v-for="dimension in dimensions"
:key="dimension.id"
:label="dimension.name"
:value="dimension.id"
/>
</el-select>
</el-form-item>
<el-form-item v-if="selectedDimension" label="维度详情">
<el-descriptions :column="1" border size="small" style="width: 100%">
<el-descriptions-item label="指标类型">{{ selectedDimension.type || '-' }}</el-descriptions-item>
<el-descriptions-item label="评估模型">{{ selectedDimension.eval_model || '-' }}</el-descriptions-item>
<el-descriptions-item label="评估方法">
{{
Array.isArray(selectedDimension.eval_method)
? selectedDimension.eval_method.join('、')
: selectedDimension.eval_method || '-'
}}
</el-descriptions-item>
<el-descriptions-item v-if="selectedDimension.description" label="说明">
{{ selectedDimension.description }}
</el-descriptions-item>
</el-descriptions>
</el-form-item>
</el-form>
<el-form
v-else-if="form.ruleMode === 'new'"
ref="newFormRef"
:model="form.newDimension"
:rules="dimensionRules"
label-width="130px"
class="step-form step-form-wide"
:disabled="disabled"
>
<DimensionFormFields v-model="form.newDimension" :eval-models="evalModels" />
</el-form>
<el-alert
v-else
title="系统将使用内置基线规则进行评测,无需额外创建或选择评测维度。"
type="info"
:closable="false"
show-icon
class="baseline-alert"
/>
</div>
</template>
<style scoped>
.rule-mode-label {
margin-bottom: 10px;
color: #606266;
font-size: 14px;
font-weight: 500;
}
.rule-mode-group {
margin-bottom: 28px;
}
.step-form {
max-width: 760px;
}
.step-form-wide {
max-width: 920px;
}
.baseline-alert {
max-width: 760px;
}
</style>

View File

@@ -0,0 +1,162 @@
<script setup lang="ts">
import { ref, watch } from 'vue'
import type { FormInstance, FormRules } from 'element-plus'
import type { DatasetItem, GpuInfo, TrainedModel } from '@/types'
export interface EvalTaskSetupDraft {
eval_task_name: string
model_id: string | number
gpu_id: string | number
data_source: 'dataset' | 'inference'
dataset_id: string | number
leaderboard: boolean
}
defineProps<{
trainedModels: TrainedModel[]
evalDatasets: DatasetItem[]
gpus: GpuInfo[]
loading?: boolean
disabled?: boolean
}>()
const form = defineModel<EvalTaskSetupDraft>({ required: true })
const formRef = ref<FormInstance>()
const rules: FormRules<EvalTaskSetupDraft> = {
eval_task_name: [
{ required: true, message: '请输入任务名称', trigger: 'blur' },
{ max: 50, message: '任务名称不超过 50 个字符', trigger: 'blur' },
],
model_id: [{ required: true, message: '请选择评测模型', trigger: 'change' }],
gpu_id: [{ required: true, message: '请选择 GPU', trigger: 'change' }],
dataset_id: [
{
validator: (_rule, value, callback) => {
if (form.value.data_source === 'dataset' && (value === '' || value === null || value === undefined)) {
callback(new Error('请选择评测数据集'))
return
}
callback()
},
trigger: 'change',
},
],
}
watch(
() => form.value.data_source,
(source) => {
if (source !== 'dataset') {
form.value.dataset_id = ''
formRef.value?.clearValidate('dataset_id')
}
},
)
async function validate() {
if (!formRef.value) return false
try {
await formRef.value.validate()
return true
} catch {
return false
}
}
defineExpose({ validate })
</script>
<template>
<el-form
ref="formRef"
:model="form"
:rules="rules"
label-width="120px"
class="step-form"
:disabled="disabled"
>
<el-form-item label="任务名称" prop="eval_task_name">
<el-input v-model="form.eval_task_name" placeholder="请输入任务名称" maxlength="50" show-word-limit />
</el-form-item>
<el-form-item label="评测模型" prop="model_id">
<el-select
v-model="form.model_id"
placeholder="请选择已训练且已合并的模型"
filterable
style="width: 100%"
:loading="loading"
>
<el-option
v-for="model in trainedModels"
:key="model.id"
:label="model.name"
:value="model.id"
:disabled="!model.merged"
/>
</el-select>
<div class="field-tip">未完成合并的模型不可用于评测</div>
</el-form-item>
<el-form-item label="选择 GPU" prop="gpu_id">
<el-select v-model="form.gpu_id" placeholder="请选择 GPU" style="width: 100%" :loading="loading">
<el-option
v-for="(gpu, index) in gpus"
:key="index"
:label="`${gpu.name} (GPU ${index})`"
:value="index"
/>
</el-select>
</el-form-item>
<el-form-item label="数据来源">
<el-radio-group v-model="form.data_source">
<el-radio value="dataset">评测数据集</el-radio>
<el-radio value="inference">推理结果集</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item v-if="form.data_source === 'dataset'" label="评测数据集" prop="dataset_id">
<el-select
v-model="form.dataset_id"
placeholder="请选择评测数据集"
filterable
style="width: 100%"
:loading="loading"
>
<el-option v-for="dataset in evalDatasets" :key="dataset.id" :label="dataset.name" :value="dataset.id" />
</el-select>
</el-form-item>
<el-alert
v-else
title="将使用该模型最近一次可用的推理结果集。"
type="info"
:closable="false"
show-icon
class="source-alert"
/>
<el-form-item label="加入排行榜">
<el-switch v-model="form.leaderboard" />
</el-form-item>
</el-form>
</template>
<style scoped>
.step-form {
max-width: 760px;
}
.field-tip {
color: #909399;
font-size: 12px;
line-height: 20px;
}
.source-alert {
margin: -4px 0 20px 120px;
max-width: 640px;
}
</style>