P1 修复内容: - F7: health handler 连接池容量检查 (80%阈值返回503 degraded) - F9: SSE spawned task 并发限制 (Semaphore 16 permits) - F10: Key Pool 单次 JOIN 查询优化 (消除 N+1) - F12: CORS panic → 配置错误 - F14: 连接池使用率计算修正 (ratio = used*100/total) - F15: SQL 迁移解析器替换为状态机 (支持 $$, DO $body$, 存储过程) - Worker 重试机制: 失败任务通过 mpsc channel 重新入队 - DOMPurify XSS 防护 (PipelineResultPreview) - Admin V2: ErrorBoundary + SWR全局配置 + 请求优化
111 lines
3.8 KiB
TypeScript
111 lines
3.8 KiB
TypeScript
// ============================================================
|
|
// 系统配置
|
|
// ============================================================
|
|
|
|
import { useState } from 'react'
|
|
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
|
|
import { Card, Tabs, message, Tag, Input, Button, Space, Typography } from 'antd'
|
|
import type { ProColumns } from '@ant-design/pro-components'
|
|
import { ProTable } from '@ant-design/pro-components'
|
|
import { configService } from '@/services/config'
|
|
import type { ConfigItem } from '@/types'
|
|
|
|
const { Title } = Typography
|
|
|
|
export default function Config() {
|
|
const queryClient = useQueryClient()
|
|
const [category, setCategory] = useState<string>('general')
|
|
const [editingId, setEditingId] = useState<string | null>(null)
|
|
const [editValue, setEditValue] = useState('')
|
|
|
|
const { data, isLoading } = useQuery({
|
|
queryKey: ['config', category],
|
|
queryFn: ({ signal }) => configService.list({ category }, signal),
|
|
})
|
|
|
|
const updateMutation = useMutation({
|
|
mutationFn: ({ id, value }: { id: string; value: string }) =>
|
|
configService.update(id, { value }),
|
|
onSuccess: () => {
|
|
message.success('配置已更新')
|
|
queryClient.invalidateQueries({ queryKey: ['config', category] })
|
|
setEditingId(null)
|
|
},
|
|
onError: (err: Error) => message.error(err.message || '更新失败'),
|
|
})
|
|
|
|
const columns: ProColumns<ConfigItem>[] = [
|
|
{ title: '配置路径', dataIndex: 'key_path', width: 200, render: (_, r) => <code>{r.key_path}</code> },
|
|
{
|
|
title: '当前值',
|
|
dataIndex: 'current_value',
|
|
width: 250,
|
|
render: (_, record) => {
|
|
if (editingId === record.id) {
|
|
return (
|
|
<Space>
|
|
<Input
|
|
value={editValue}
|
|
onChange={(e) => setEditValue(e.target.value)}
|
|
style={{ width: 180 }}
|
|
onPressEnter={() => updateMutation.mutate({ id: record.id, value: editValue })}
|
|
/>
|
|
<Button size="small" type="primary" onClick={() => updateMutation.mutate({ id: record.id, value: editValue })}>
|
|
保存
|
|
</Button>
|
|
<Button size="small" onClick={() => setEditingId(null)}>取消</Button>
|
|
</Space>
|
|
)
|
|
}
|
|
return (
|
|
<span
|
|
onClick={() => { setEditingId(record.id); setEditValue(record.current_value || '') }}
|
|
style={{ cursor: 'pointer', color: '#1677ff' }}
|
|
>
|
|
{record.current_value || <Tag>未设置</Tag>}
|
|
</span>
|
|
)
|
|
},
|
|
},
|
|
{ title: '默认值', dataIndex: 'default_value', width: 200, render: (_, r) => r.default_value || '-' },
|
|
{ title: '类型', dataIndex: 'value_type', width: 80, render: (_, r) => <Tag>{r.value_type}</Tag> },
|
|
{ title: '描述', dataIndex: 'description', width: 200, ellipsis: true },
|
|
{
|
|
title: '需要重启',
|
|
dataIndex: 'requires_restart',
|
|
width: 90,
|
|
render: (_, r) => r.requires_restart ? <Tag color="orange">是</Tag> : <Tag>否</Tag>,
|
|
},
|
|
]
|
|
|
|
return (
|
|
<div>
|
|
<Title level={4} style={{ marginBottom: 24 }}>系统配置</Title>
|
|
|
|
<Tabs
|
|
activeKey={category}
|
|
onChange={(key) => { setCategory(key); setEditingId(null) }}
|
|
items={[
|
|
{ key: 'general', label: '通用' },
|
|
{ key: 'auth', label: '认证' },
|
|
{ key: 'relay', label: '中转' },
|
|
{ key: 'model', label: '模型' },
|
|
{ key: 'rate_limit', label: '限流' },
|
|
{ key: 'log', label: '日志' },
|
|
]}
|
|
/>
|
|
|
|
<ProTable<ConfigItem>
|
|
columns={columns}
|
|
dataSource={data ?? []}
|
|
loading={isLoading}
|
|
rowKey="id"
|
|
search={false}
|
|
toolBarRender={false}
|
|
pagination={false}
|
|
size="small"
|
|
/>
|
|
</div>
|
|
)
|
|
}
|