import React, { useEffect, useState, useRef } from 'react'; import { useTranslation } from 'react-i18next'; import { userRateLimitApi, showError, showSuccess } from '../../../../helpers'; import { Button, Table, Modal, Form, Avatar, Typography, Popconfirm, } from '@douyinfe/semi-ui'; import { IconDelete, IconPlus, IconClock } from '@douyinfe/semi-icons'; const { Text } = Typography; const UserModelRateLimitSection = ({ userId }) => { const { t } = useTranslation(); const [limits, setLimits] = useState([]); const [loading, setLoading] = useState(false); const [addModalVisible, setAddModalVisible] = useState(false); const formApiRef = useRef(null); const loadLimits = async () => { if (!userId) return; setLoading(true); try { const res = await userRateLimitApi.get(userId); const { success, data, message } = res.data; if (success) { setLimits(data || []); } else { showError(message); } } catch (e) { showError(e.message); } setLoading(false); }; useEffect(() => { loadLimits(); }, [userId]); const saveLimits = async (newLimits) => { try { const res = await userRateLimitApi.set(userId, newLimits); const { success, message } = res.data; if (success) { showSuccess(t('保存成功')); return true; } else { showError(message); return false; } } catch (e) { showError(e.message); return false; } }; const handleAdd = async (values) => { const rpm = parseInt(values.rpm) || 0; const newItem = { model: values.model, rpm }; const filtered = limits.filter((item) => item.model !== values.model); const newLimits = [...filtered, newItem]; const ok = await saveLimits(newLimits); if (ok) { setLimits(newLimits); setAddModalVisible(false); formApiRef.current?.reset(); } }; const handleDelete = async (model) => { const newLimits = limits.filter((item) => item.model !== model); const ok = await saveLimits(newLimits); if (ok) { setLimits(newLimits); } }; const columns = [ { title: t('模型'), dataIndex: 'model', key: 'model', }, { title: t('RPM 限制'), dataIndex: 'rpm', key: 'rpm', render: (rpm) => rpm === 0 ? ( {t('不限制')} ) : ( {rpm} ), }, { title: t('操作'), key: 'action', render: (_, record) => ( handleDelete(record.model)} > ), }, ]; return ( <>
{t('模型速率限制(RPM)')}
{t('为该用户配置各模型每分钟请求数上限,0 表示不限制')}
formApiRef.current?.submitForm()} onCancel={() => { setAddModalVisible(false); formApiRef.current?.reset(); }} >
(formApiRef.current = api)} onSubmit={handleAdd} >
); }; export default UserModelRateLimitSection;