fix(frontend): refresh scenario model references
This commit is contained in:
parent
470ff5875f
commit
457dfed252
@ -10,6 +10,7 @@ import {
|
|||||||
} from '../api'
|
} from '../api'
|
||||||
import PageWrapper from '../components/PageWrapper'
|
import PageWrapper from '../components/PageWrapper'
|
||||||
import { formatDateTime } from '../utils/date'
|
import { formatDateTime } from '../utils/date'
|
||||||
|
import { notifyModelConfigsChanged } from '../utils/modelConfigEvents'
|
||||||
|
|
||||||
const capabilityLabels: Record<ModelCapability, string> = {
|
const capabilityLabels: Record<ModelCapability, string> = {
|
||||||
chat: '对话',
|
chat: '对话',
|
||||||
@ -86,6 +87,7 @@ export default function ModelConfigsPage() {
|
|||||||
await modelConfigsApi.create(payload)
|
await modelConfigsApi.create(payload)
|
||||||
message.success('模型配置已创建')
|
message.success('模型配置已创建')
|
||||||
}
|
}
|
||||||
|
notifyModelConfigsChanged()
|
||||||
setDrawerOpen(false)
|
setDrawerOpen(false)
|
||||||
load()
|
load()
|
||||||
}
|
}
|
||||||
@ -104,6 +106,7 @@ export default function ModelConfigsPage() {
|
|||||||
const remove = async (config: ModelConfig) => {
|
const remove = async (config: ModelConfig) => {
|
||||||
await modelConfigsApi.delete(config.id)
|
await modelConfigsApi.delete(config.id)
|
||||||
message.success('模型配置已删除')
|
message.success('模型配置已删除')
|
||||||
|
notifyModelConfigsChanged()
|
||||||
load()
|
load()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1,4 +1,4 @@
|
|||||||
import { useEffect, useState } from 'react'
|
import { useEffect, useRef, useState } from 'react'
|
||||||
import {
|
import {
|
||||||
Button, Card, Drawer, Form, Input, message, Modal, Popconfirm,
|
Button, Card, Drawer, Form, Input, message, Modal, Popconfirm,
|
||||||
Select, Space, Table, Tag, Tooltip,
|
Select, Space, Table, Tag, Tooltip,
|
||||||
@ -12,6 +12,7 @@ import { modelConfigsApi, scenariosApi, type ModelConfig, type Scenario } from '
|
|||||||
import PageWrapper from '../components/PageWrapper'
|
import PageWrapper from '../components/PageWrapper'
|
||||||
import { colors } from '../tokens'
|
import { colors } from '../tokens'
|
||||||
import { formatDateTime } from '../utils/date'
|
import { formatDateTime } from '../utils/date'
|
||||||
|
import { MODEL_CONFIGS_CHANGED_EVENT } from '../utils/modelConfigEvents'
|
||||||
|
|
||||||
const YAML_TEMPLATE = `# 场景用例示例(JSON 格式)
|
const YAML_TEMPLATE = `# 场景用例示例(JSON 格式)
|
||||||
[
|
[
|
||||||
@ -43,7 +44,9 @@ export default function ScenariosPage() {
|
|||||||
const [editingScenario, setEditingScenario] = useState<Scenario | null>(null)
|
const [editingScenario, setEditingScenario] = useState<Scenario | null>(null)
|
||||||
const [casesJson, setCasesJson] = useState(YAML_TEMPLATE)
|
const [casesJson, setCasesJson] = useState(YAML_TEMPLATE)
|
||||||
const [modelConfigs, setModelConfigs] = useState<ModelConfig[]>([])
|
const [modelConfigs, setModelConfigs] = useState<ModelConfig[]>([])
|
||||||
|
const [modelConfigsLoading, setModelConfigsLoading] = useState(false)
|
||||||
const [modelBindings, setModelBindings] = useState<Record<string, string>>({})
|
const [modelBindings, setModelBindings] = useState<Record<string, string>>({})
|
||||||
|
const modelConfigRequestId = useRef(0)
|
||||||
const [form] = Form.useForm()
|
const [form] = Form.useForm()
|
||||||
|
|
||||||
// Template picker
|
// Template picker
|
||||||
@ -62,16 +65,25 @@ export default function ScenariosPage() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const loadModelConfigs = async () => {
|
const loadModelConfigs = async () => {
|
||||||
const res = await modelConfigsApi.list({ enabled: true })
|
const requestId = ++modelConfigRequestId.current
|
||||||
setModelConfigs(res.data)
|
setModelConfigsLoading(true)
|
||||||
|
try {
|
||||||
|
const res = await modelConfigsApi.list({ enabled: true })
|
||||||
|
if (requestId === modelConfigRequestId.current) setModelConfigs(res.data)
|
||||||
|
} finally {
|
||||||
|
if (requestId === modelConfigRequestId.current) setModelConfigsLoading(false)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
load()
|
load()
|
||||||
loadModelConfigs()
|
loadModelConfigs()
|
||||||
|
window.addEventListener(MODEL_CONFIGS_CHANGED_EVENT, loadModelConfigs)
|
||||||
|
return () => window.removeEventListener(MODEL_CONFIGS_CHANGED_EVENT, loadModelConfigs)
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
const openCreate = () => {
|
const openCreate = () => {
|
||||||
|
loadModelConfigs()
|
||||||
setEditingScenario(null)
|
setEditingScenario(null)
|
||||||
form.resetFields()
|
form.resetFields()
|
||||||
setCasesJson(YAML_TEMPLATE)
|
setCasesJson(YAML_TEMPLATE)
|
||||||
@ -92,6 +104,7 @@ export default function ScenariosPage() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const applyTemplate = (tpl: any) => {
|
const applyTemplate = (tpl: any) => {
|
||||||
|
loadModelConfigs()
|
||||||
setTplModalOpen(false)
|
setTplModalOpen(false)
|
||||||
setEditingScenario(null)
|
setEditingScenario(null)
|
||||||
form.resetFields()
|
form.resetFields()
|
||||||
@ -102,6 +115,7 @@ export default function ScenariosPage() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const openEdit = (scenario: Scenario) => {
|
const openEdit = (scenario: Scenario) => {
|
||||||
|
loadModelConfigs()
|
||||||
setEditingScenario(scenario)
|
setEditingScenario(scenario)
|
||||||
form.setFieldsValue({
|
form.setFieldsValue({
|
||||||
name: scenario.name,
|
name: scenario.name,
|
||||||
@ -199,7 +213,14 @@ export default function ScenariosPage() {
|
|||||||
extra={
|
extra={
|
||||||
<Space>
|
<Space>
|
||||||
<Tooltip title="刷新">
|
<Tooltip title="刷新">
|
||||||
<Button size="middle" icon={<ReloadOutlined />} onClick={load} />
|
<Button
|
||||||
|
size="middle"
|
||||||
|
icon={<ReloadOutlined />}
|
||||||
|
onClick={() => {
|
||||||
|
load()
|
||||||
|
loadModelConfigs()
|
||||||
|
}}
|
||||||
|
/>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
<Button icon={<AppstoreAddOutlined />} onClick={openTemplateModal}>
|
<Button icon={<AppstoreAddOutlined />} onClick={openTemplateModal}>
|
||||||
从模板新建
|
从模板新建
|
||||||
@ -265,6 +286,7 @@ export default function ScenariosPage() {
|
|||||||
<Select
|
<Select
|
||||||
allowClear
|
allowClear
|
||||||
showSearch
|
showSearch
|
||||||
|
loading={modelConfigsLoading}
|
||||||
optionFilterProp="label"
|
optionFilterProp="label"
|
||||||
style={{ width: '100%' }}
|
style={{ width: '100%' }}
|
||||||
placeholder="未绑定"
|
placeholder="未绑定"
|
||||||
|
|||||||
5
frontend/web/src/utils/modelConfigEvents.ts
Normal file
5
frontend/web/src/utils/modelConfigEvents.ts
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
export const MODEL_CONFIGS_CHANGED_EVENT = 'agenteval:model-configs-changed'
|
||||||
|
|
||||||
|
export function notifyModelConfigsChanged() {
|
||||||
|
window.dispatchEvent(new Event(MODEL_CONFIGS_CHANGED_EVENT))
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user