feat: 优化模型设置可视化编辑器,增强输入验证和提示信息

This commit is contained in:
HynoR
2024-12-13 14:42:02 +08:00
parent 8504e07245
commit 498590d9fd

View File

@@ -1,7 +1,7 @@
// ModelSettingsVisualEditor.js // ModelSettingsVisualEditor.js
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { Table, Button, Input, Modal, Form, Space } from '@douyinfe/semi-ui'; import { Table, Button, Input, Modal, Form, Space } from '@douyinfe/semi-ui';
import { IconDelete, IconPlus, IconSearch,IconSave } from '@douyinfe/semi-icons'; import { IconDelete, IconPlus, IconSearch, IconSave } from '@douyinfe/semi-icons';
import { showError, showSuccess } from '../../../helpers'; import { showError, showSuccess } from '../../../helpers';
import { API } from '../../../helpers'; import { API } from '../../../helpers';
export default function ModelSettingsVisualEditor(props) { export default function ModelSettingsVisualEditor(props) {
@@ -55,40 +55,44 @@ export default function ModelSettingsVisualEditor(props) {
const pagedData = getPagedData(filteredModels, currentPage, pageSize); const pagedData = getPagedData(filteredModels, currentPage, pageSize);
const SubmitData = async () => { const SubmitData = async () => {
setLoading(true); setLoading(true);
const output = { const output = {
ModelPrice: {}, ModelPrice: {},
ModelRatio: {}, ModelRatio: {},
CompletionRatio: {} CompletionRatio: {}
}; };
let currentConvertModelName = ''; let currentConvertModelName = '';
try { try {
// 数据转换 // 数据转换
models.forEach(model => { models.forEach(model => {
currentConvertModelName = model.name; currentConvertModelName = model.name;
if (model.price !== '') output.ModelPrice[model.name] = parseFloat(model.price); if (model.price !== '') {
if (model.ratio !== '') output.ModelRatio[model.name] = parseFloat(model.ratio); // 如果价格不为空,则转换为浮点数,忽略倍率参数
if (model.completionRatio != '') output.CompletionRatio[model.name] = parseFloat(model.completionRatio); output.ModelPrice[model.name] = parseFloat(model.price)
} else {
if (model.ratio !== '') output.ModelRatio[model.name] = parseFloat(model.ratio);
if (model.completionRatio != '') output.CompletionRatio[model.name] = parseFloat(model.completionRatio);
}
}); });
// 准备API请求数组 // 准备API请求数组
const finalOutput = { const finalOutput = {
ModelPrice: JSON.stringify(output.ModelPrice, null, 2), ModelPrice: JSON.stringify(output.ModelPrice, null, 2),
ModelRatio: JSON.stringify(output.ModelRatio, null, 2), ModelRatio: JSON.stringify(output.ModelRatio, null, 2),
CompletionRatio: JSON.stringify(output.CompletionRatio, null, 2) CompletionRatio: JSON.stringify(output.CompletionRatio, null, 2)
}; };
const requestQueue = Object.entries(finalOutput).map(([key, value]) => { const requestQueue = Object.entries(finalOutput).map(([key, value]) => {
return API.put('/api/option/', { return API.put('/api/option/', {
key, key,
value value
}); });
}); });
// 批量处理请求 // 批量处理请求
const results = await Promise.all(requestQueue); const results = await Promise.all(requestQueue);
// 验证结果 // 验证结果
if (requestQueue.length === 1) { if (requestQueue.length === 1) {
if (results.includes(undefined)) return; if (results.includes(undefined)) return;
@@ -97,17 +101,17 @@ export default function ModelSettingsVisualEditor(props) {
return showError('部分保存失败,请重试'); return showError('部分保存失败,请重试');
} }
} }
// 检查每个请求的结果 // 检查每个请求的结果
for (const res of results) { for (const res of results) {
if (!res.data.success) { if (!res.data.success) {
return showError(res.data.message); return showError(res.data.message);
} }
} }
showSuccess('保存成功'); showSuccess('保存成功');
props.refresh(); props.refresh();
} catch (error) { } catch (error) {
console.error('保存失败:', error); console.error('保存失败:', error);
showError('保存失败,请重试'); showError('保存失败,请重试');
@@ -130,6 +134,7 @@ export default function ModelSettingsVisualEditor(props) {
<Input <Input
value={text} value={text}
placeholder="按量计价" placeholder="按量计价"
disabled={record.ratio !== ''}
onChange={value => updateModel(record.name, 'price', value)} onChange={value => updateModel(record.name, 'price', value)}
/> />
) )
@@ -141,7 +146,9 @@ export default function ModelSettingsVisualEditor(props) {
render: (text, record) => ( render: (text, record) => (
<Input <Input
value={text} value={text}
placeholder="默认倍率"
placeholder={record.price !== '' ? '固定价格' : '默认补全倍率'}
disabled={record.price !== ''}
onChange={value => updateModel(record.name, 'ratio', value)} onChange={value => updateModel(record.name, 'ratio', value)}
/> />
) )
@@ -153,7 +160,8 @@ export default function ModelSettingsVisualEditor(props) {
render: (text, record) => ( render: (text, record) => (
<Input <Input
value={text} value={text}
placeholder="默认补全值" placeholder={record.price !== '' ? '固定价格' : '默认补全倍率'}
disabled={record.price !== ''}
onChange={value => updateModel(record.name, 'completionRatio', value)} onChange={value => updateModel(record.name, 'completionRatio', value)}
/> />
) )
@@ -172,6 +180,10 @@ export default function ModelSettingsVisualEditor(props) {
]; ];
const updateModel = (name, field, value) => { const updateModel = (name, field, value) => {
if (isNaN(value)) {
showError('请输入数字');
return;
}
setModels(prev => setModels(prev =>
prev.map(model => prev.map(model =>
model.name === name model.name === name
@@ -203,7 +215,7 @@ export default function ModelSettingsVisualEditor(props) {
return ( return (
<> <>
<h3>模型价格</h3> <h3>模型价格</h3>
<Space vertical align="start" style={{ width: '100%' }}> <Space vertical align="start" style={{ width: '100%' }}>
<Space> <Space>
<Button icon={<IconPlus />} onClick={() => setVisible(true)}> <Button icon={<IconPlus />} onClick={() => setVisible(true)}>
@@ -247,6 +259,7 @@ export default function ModelSettingsVisualEditor(props) {
}} }}
> >
<Form> <Form>
<p>请输入固定价格或者模型倍率+补全倍率</p>
<Form.Input <Form.Input
field="name" field="name"
label="模型名称" label="模型名称"
@@ -255,17 +268,20 @@ export default function ModelSettingsVisualEditor(props) {
/> />
<Form.Input <Form.Input
field="price" field="price"
label="固定价格" label="固定价格(每次)"
placeholder="输入每次价格"
onChange={value => setCurrentModel(prev => ({ ...prev, price: value }))} onChange={value => setCurrentModel(prev => ({ ...prev, price: value }))}
/> />
<Form.Input <Form.Input
field="ratio" field="ratio"
label="模型倍率" label="模型倍率"
placeholder="输入模型倍率"
onChange={value => setCurrentModel(prev => ({ ...prev, ratio: value }))} onChange={value => setCurrentModel(prev => ({ ...prev, ratio: value }))}
/> />
<Form.Input <Form.Input
field="completionRatio" field="completionRatio"
label="补全倍率" label="补全倍率"
placeholder="输入补全价格"
onChange={value => setCurrentModel(prev => ({ ...prev, completionRatio: value }))} onChange={value => setCurrentModel(prev => ({ ...prev, completionRatio: value }))}
/> />
</Form> </Form>