Skip to content

phsl / new-api

Go to a project
Commit c20fbec1 by Apple\Apple
Options

Merge pull request #927 from QuentinHsu/refactor-system-setting 

# Conflicts:
#	web/src/App.js
#	web/src/components/ModelSetting.js
#	web/src/components/PersonalSetting.js
#	web/src/components/SystemSetting.js
#	web/src/pages/Channel/EditChannel.js
parents 50bf4a66 48fe64eb
Showing with 1330 additions and 922 deletions
web/.prettierrc.mjs
module.exports = require("@so1ve/prettier-config");
module.exports = require('@so1ve/prettier-config');
web/pnpm-lock.yaml
This source diff could not be displayed because it is too large. You can view the blob instead.
web/src/App.js
......@@ -21,9 +21,9 @@ import Chat2Link from './pages/Chat2Link';
import { Layout } from '@douyinfe/semi-ui';
import Midjourney from './pages/Midjourney';
import Pricing from './pages/Pricing/index.js';
import Task from "./pages/Task/index.js";
import Task from './pages/Task/index.js';
import Playground from './pages/Playground/Playground.js';
import OAuth2Callback from "./components/OAuth2Callback.js";
import OAuth2Callback from './components/OAuth2Callback.js';
import PersonalSetting from './components/PersonalSetting.js';
import Setup from './pages/Setup/index.js';
import SetupCheck from './components/SetupCheck';
......@@ -34,7 +34,7 @@ const About = lazy(() => import('./pages/About'));
function App() {
const location = useLocation();
return (
<SetupCheck>
<Routes>
......@@ -167,18 +167,18 @@ function App() {
}
/>
<Route
path='/oauth/oidc'
element={
<Suspense fallback={<Loading></Loading>}>
<OAuth2Callback type='oidc'></OAuth2Callback>
</Suspense>
}
path='/oauth/oidc'
element={
<Suspense fallback={<Loading></Loading>}>
<OAuth2Callback type='oidc'></OAuth2Callback>
</Suspense>
}
/>
<Route
path='/oauth/linuxdo'
element={
<Suspense fallback={<Loading></Loading>} key={location.pathname}>
<OAuth2Callback type='linuxdo'></OAuth2Callback>
<OAuth2Callback type='linuxdo'></OAuth2Callback>
</Suspense>
}
/>
......@@ -275,19 +275,19 @@ function App() {
}
/>
{/* 方便使用chat2link直接跳转聊天... */}
<Route
path='/chat2link'
element={
<PrivateRoute>
<Suspense fallback={<Loading></Loading>} key={location.pathname}>
<Chat2Link />
</Suspense>
</PrivateRoute>
}
/>
<Route path='*' element={<NotFound />} />
</Routes>
</SetupCheck>
<Route
path='/chat2link'
element={
<PrivateRoute>
<Suspense fallback={<Loading></Loading>} key={location.pathname}>
<Chat2Link />
</Suspense>
</PrivateRoute>
}
/>
<Route path='*' element={<NotFound />} />
</Routes>
</SetupCheck>
);
}
......
web/src/components/Footer.js
......@@ -28,11 +28,7 @@ const FooterBar = () => {
New API {import.meta.env.VITE_REACT_APP_VERSION}{' '}
</a>
{t('由')}{' '}
<a
href='https://github.com/Calcium-Ion'
target='_blank'
rel='noreferrer'
>
<a href='https://github.com/Calcium-Ion' target='_blank' rel='noreferrer'>
Calcium-Ion
</a>{' '}
{t('开发，基于')}{' '}
......@@ -59,10 +55,12 @@ const FooterBar = () => {
}, []);
return (
<div style={{
textAlign: 'center',
paddingBottom: '5px',
}}>
<div
style={{
textAlign: 'center',
paddingBottom: '5px',
}}
>
{footer ? (
<div
className='custom-footer'
......
web/src/components/LoginForm.js
......@@ -9,7 +9,11 @@ import {
showSuccess,
updateAPI,
} from '../helpers';
import {onGitHubOAuthClicked, onOIDCClicked, onLinuxDOOAuthClicked} from './utils';
import {
onGitHubOAuthClicked,
onOIDCClicked,
onLinuxDOOAuthClicked,
} from './utils';
import Turnstile from 'react-turnstile';
import {
Button,
......@@ -71,7 +75,6 @@ const LoginForm = () => {
}
}, []);
const onWeChatLoginClicked = () => {
setShowWeChatLoginModal(true);
};
......@@ -223,7 +226,8 @@ const LoginForm = () => {
}}
>
<Text>
{t('没有账户？')} <Link to='/register'>{t('点击注册')}</Link>
{t('没有账户？')}{' '}
<Link to='/register'>{t('点击注册')}</Link>
</Text>
<Text>
{t('忘记密码？')} <Link to='/reset'>{t('点击重置')}</Link>
......@@ -257,15 +261,18 @@ const LoginForm = () => {
<></>
)}
{status.oidc_enabled ? (
<Button
type='primary'
icon={<OIDCIcon />}
onClick={() =>
onOIDCClicked(status.oidc_authorization_endpoint, status.oidc_client_id)
}
/>
<Button
type='primary'
icon={<OIDCIcon />}
onClick={() =>
onOIDCClicked(
status.oidc_authorization_endpoint,
status.oidc_client_id,
)
}
/>
) : (
<></>
<></>
)}
{status.linuxdo_oauth ? (
<Button
......@@ -331,7 +338,9 @@ const LoginForm = () => {
</div>
<div style={{ textAlign: 'center' }}>
<p>
{t('微信扫码关注公众号，输入「验证码」获取验证码（三分钟内有效）')}
{t(
'微信扫码关注公众号，输入「验证码」获取验证码（三分钟内有效）',
)}
</p>
</div>
<Form size='large'>
......
web/src/components/MjLogsTable.js
......@@ -46,7 +46,6 @@ const LogsTable = () => {
const [isModalOpen, setIsModalOpen] = useState(false);
const [modalContent, setModalContent] = useState('');
function renderType(type) {
switch (type) {
case 'IMAGINE':
return (
......@@ -98,9 +97,9 @@ const LogsTable = () => {
);
case 'UPLOAD':
return (
<Tag color='blue' size='large'>
上传文件
</Tag>
<Tag color='blue' size='large'>
上传文件
</Tag>
);
case 'SHORTEN':
return (
......@@ -152,9 +151,8 @@ const LogsTable = () => {
);
}
}
function renderCode(code) {
switch (code) {
case 1:
return (
......@@ -188,9 +186,8 @@ const LogsTable = () => {
);
}
}
function renderStatus(type) {
switch (type) {
case 'SUCCESS':
return (
......@@ -236,22 +233,21 @@ const LogsTable = () => {
);
}
}
const renderTimestamp = (timestampInSeconds) => {
const date = new Date(timestampInSeconds * 1000); // 从秒转换为毫秒
const year = date.getFullYear(); // 获取年份
const month = ('0' + (date.getMonth() + 1)).slice(-2); // 获取月份，从0开始需要+1，并保证两位数
const day = ('0' + date.getDate()).slice(-2); // 获取日期，并保证两位数
const hours = ('0' + date.getHours()).slice(-2); // 获取小时，并保证两位数
const minutes = ('0' + date.getMinutes()).slice(-2); // 获取分钟，并保证两位数
const seconds = ('0' + date.getSeconds()).slice(-2); // 获取秒钟，并保证两位数
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; // 格式化输出
};
// 修改renderDuration函数以包含颜色逻辑
function renderDuration(submit_time, finishTime) {
if (!submit_time || !finishTime) return 'N/A';
const start = new Date(submit_time);
......@@ -261,7 +257,7 @@ const LogsTable = () => {
const color = durationSec > 60 ? 'red' : 'green';
return (
<Tag color={color} size="large">
<Tag color={color} size='large'>
{durationSec} {t('秒')}
</Tag>
);
......@@ -560,7 +556,9 @@ const LogsTable = () => {
{isAdminUser && showBanner ? (
<Banner
type='info'
description={t('当前未开启Midjourney回调，部分项目可能无法获得绘图结果，可在运营设置中开启。')}
description={t(
'当前未开启Midjourney回调，部分项目可能无法获得绘图结果，可在运营设置中开启。',
)}
/>
) : (
<></>
......@@ -634,7 +632,7 @@ const LogsTable = () => {
t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
start: page.currentStart,
end: page.currentEnd,
total: logCount
total: logCount,
}),
}}
loading={loading}
......
web/src/components/ModelPricing.js
......@@ -34,12 +34,12 @@ const ModelPricing = () => {
const [selectedGroup, setSelectedGroup] = useState('default');
const rowSelection = useMemo(
() => ({
onChange: (selectedRowKeys, selectedRows) => {
setSelectedRowKeys(selectedRowKeys);
},
}),
[]
() => ({
onChange: (selectedRowKeys, selectedRows) => {
setSelectedRowKeys(selectedRowKeys);
},
}),
[],
);
const handleChange = (value) => {
......@@ -59,7 +59,7 @@ const ModelPricing = () => {
const newFilteredValue = value ? [value] : [];
setFilteredValue(newFilteredValue);
};
function renderQuotaType(type) {
// Ensure all cases are string literals by adding quotes.
switch (type) {
......@@ -79,7 +79,7 @@ const ModelPricing = () => {
return t('未知');
}
}
function renderAvailable(available) {
return (
<Popover
......@@ -96,9 +96,9 @@ const ModelPricing = () => {
borderStyle: 'solid',
}}
>
<IconVerify style={{ color: 'green' }} size="large" />
<IconVerify style={{ color: 'green' }} size='large' />
</Popover>
)
);
}
const columns = [
......@@ -106,7 +106,7 @@ const ModelPricing = () => {
title: t('可用性'),
dataIndex: 'available',
render: (text, record, index) => {
// if record.enable_groups contains selectedGroup, then available is true
// if record.enable_groups contains selectedGroup, then available is true
return renderAvailable(record.enable_groups.includes(selectedGroup));
},
sorter: (a, b) => a.available - b.available,
......@@ -145,7 +145,6 @@ const ModelPricing = () => {
title: t('可用分组'),
dataIndex: 'enable_groups',
render: (text, record, index) => {
// enable_groups is a string array
return (
<Space>
......@@ -153,11 +152,7 @@ const ModelPricing = () => {
if (usableGroup[group]) {
if (group === selectedGroup) {
return (
<Tag
color='blue'
size='large'
prefixIcon={<IconVerify />}
>
<Tag color='blue' size='large' prefixIcon={<IconVerify />}>
{group}
</Tag>
);
......@@ -168,10 +163,12 @@ const ModelPricing = () => {
size='large'
onClick={() => {
setSelectedGroup(group);
showInfo(t('当前查看的分组为：{{group}}，倍率为：{{ratio}}', {
group: group,
ratio: groupRatio[group]
}));
showInfo(
t('当前查看的分组为：{{group}}，倍率为：{{ratio}}', {
group: group,
ratio: groupRatio[group],
}),
);
}}
>
{group}
......@@ -186,22 +183,23 @@ const ModelPricing = () => {
},
{
title: () => (
<span style={{'display':'flex','alignItems':'center'}}>
<span style={{ display: 'flex', alignItems: 'center' }}>
{t('倍率')}
<Popover
content={
<div style={{ padding: 8 }}>
{t('倍率是为了方便换算不同价格的模型')}<br/>
{t('倍率是为了方便换算不同价格的模型')}
<br />
{t('点击查看倍率说明')}
</div>
}
position='top'
style={{
backgroundColor: 'rgba(var(--semi-blue-4),1)',
borderColor: 'rgba(var(--semi-blue-4),1)',
color: 'var(--semi-color-white)',
borderWidth: 1,
borderStyle: 'solid',
backgroundColor: 'rgba(var(--semi-blue-4),1)',
borderColor: 'rgba(var(--semi-blue-4),1)',
color: 'var(--semi-color-white)',
borderWidth: 1,
borderStyle: 'solid',
}}
>
<IconHelpCircle
......@@ -219,11 +217,18 @@ const ModelPricing = () => {
let completionRatio = parseFloat(record.completion_ratio.toFixed(3));
content = (
<>
<Text>{t('模型倍率')}：{record.quota_type === 0 ? text : t('无')}</Text>
<Text>
{t('模型倍率')}：{record.quota_type === 0 ? text : t('无')}
</Text>
<br />
<Text>{t('补全倍率')}：{record.quota_type === 0 ? completionRatio : t('无')}</Text>
<Text>
{t('补全倍率')}：
{record.quota_type === 0 ? completionRatio : t('无')}
</Text>
<br />
<Text>{t('分组倍率')}：{groupRatio[selectedGroup]}</Text>
<Text>
{t('分组倍率')}：{groupRatio[selectedGroup]}
</Text>
</>
);
return <div>{content}</div>;
......@@ -236,21 +241,31 @@ const ModelPricing = () => {
let content = text;
if (record.quota_type === 0) {
// 这里的 *2 是因为 1倍率=0.002刀，请勿删除
let inputRatioPrice = record.model_ratio * 2 * groupRatio[selectedGroup];
let inputRatioPrice =
record.model_ratio * 2 * groupRatio[selectedGroup];
let completionRatioPrice =
record.model_ratio *
record.completion_ratio * 2 *
record.completion_ratio *
2 *
groupRatio[selectedGroup];
content = (
<>
<Text>{t('提示')} ${inputRatioPrice} / 1M tokens</Text>
<Text>
{t('提示')} ${inputRatioPrice} / 1M tokens
</Text>
<br />
<Text>{t('补全')} ${completionRatioPrice} / 1M tokens</Text>
<Text>
{t('补全')} ${completionRatioPrice} / 1M tokens
</Text>
</>
);
} else {
let price = parseFloat(text) * groupRatio[selectedGroup];
content = <>${t('模型价格')}：${price}</>;
content = (
<>
${t('模型价格')}：${price}
</>
);
}
return <div>{content}</div>;
},
......@@ -300,7 +315,7 @@ const ModelPricing = () => {
if (success) {
setGroupRatio(group_ratio);
setUsableGroup(usable_group);
setSelectedGroup(userState.user ? userState.user.group : 'default')
setSelectedGroup(userState.user ? userState.user.group : 'default');
setModelsFormat(data, group_ratio);
} else {
showError(message);
......@@ -330,32 +345,38 @@ const ModelPricing = () => {
<Layout>
{userState.user ? (
<Banner
type="success"
type='success'
fullMode={false}
closeIcon="null"
closeIcon='null'
description={t('您的默认分组为：{{group}}，分组倍率为：{{ratio}}', {
group: userState.user.group,
ratio: groupRatio[userState.user.group]
ratio: groupRatio[userState.user.group],
})}
/>
) : (
<Banner
type='warning'
fullMode={false}
closeIcon="null"
closeIcon='null'
description={t('您还未登陆，显示的价格为默认分组倍率: {{ratio}}', {
ratio: groupRatio['default']
ratio: groupRatio['default'],
})}
/>
)}
<br/>
<Banner
type="info"
fullMode={false}
description={<div>{t('按量计费费用 = 分组倍率 × 模型倍率 × （提示token数 + 补全token数 × 补全倍率）/ 500000 （单位：美元）')}</div>}
closeIcon="null"
<br />
<Banner
type='info'
fullMode={false}
description={
<div>
{t(
'按量计费费用 = 分组倍率 × 模型倍率 × （提示token数 + 补全token数 × 补全倍率）/ 500000 （单位：美元）',
)}
</div>
}
closeIcon='null'
/>
<br/>
<br />
<Space style={{ marginBottom: 16 }}>
<Input
placeholder={t('模糊搜索模型名称')}
......@@ -368,11 +389,11 @@ const ModelPricing = () => {
<Button
theme='light'
type='tertiary'
style={{width: 150}}
style={{ width: 150 }}
onClick={() => {
copyText(selectedRowKeys);
}}
disabled={selectedRowKeys == ""}
disabled={selectedRowKeys == ''}
>
{t('复制选中模型')}
</Button>
......@@ -387,7 +408,7 @@ const ModelPricing = () => {
t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
start: page.currentStart,
end: page.currentEnd,
total: models.length
total: models.length,
}),
pageSize: models.length,
showSizeChanger: false,
......
web/src/components/ModelSetting.js
import React, { useEffect, useState } from 'react';
import { Card, Spin, Tabs } from '@douyinfe/semi-ui';
import { API, showError, showSuccess } from '../helpers';
import { useTranslation } from 'react-i18next';
import SettingGeminiModel from '../pages/Setting/Model/SettingGeminiModel.js';
......@@ -34,15 +33,13 @@ const ModelSetting = () => {
if (
item.key === 'gemini.safety_settings' ||
item.key === 'gemini.version_settings' ||
item.key === 'claude.model_headers_settings'||
item.key === 'claude.default_max_tokens'||
item.key === 'claude.model_headers_settings' ||
item.key === 'claude.default_max_tokens' ||
item.key === 'gemini.supported_imagine_models'
) {
item.value = JSON.stringify(JSON.parse(item.value), null, 2);
}
if (
item.key.endsWith('Enabled') || item.key.endsWith('enabled')
) {
if (item.key.endsWith('Enabled') || item.key.endsWith('enabled')) {
newInputs[item.key] = item.value === 'true' ? true : false;
} else {
newInputs[item.key] = item.value;
......
web/src/components/OAuth2Callback.js
......@@ -6,56 +6,58 @@ import { UserContext } from '../context/User';
import { setUserData } from '../helpers/data.js';
const OAuth2Callback = (props) => {
const [searchParams, setSearchParams] = useSearchParams();
const [searchParams, setSearchParams] = useSearchParams();
const [userState, userDispatch] = useContext(UserContext);
const [prompt, setPrompt] = useState('处理中...');
const [processing, setProcessing] = useState(true);
const [userState, userDispatch] = useContext(UserContext);
const [prompt, setPrompt] = useState('处理中...');
const [processing, setProcessing] = useState(true);
let navigate = useNavigate();
let navigate = useNavigate();
const sendCode = async (code, state, count) => {
const res = await API.get(`/api/oauth/${props.type}?code=${code}&state=${state}`);
const { success, message, data } = res.data;
if (success) {
if (message === 'bind') {
showSuccess('绑定成功！');
navigate('/setting');
} else {
userDispatch({ type: 'login', payload: data });
localStorage.setItem('user', JSON.stringify(data));
setUserData(data);
updateAPI()
showSuccess('登录成功！');
navigate('/token');
}
} else {
showError(message);
if (count === 0) {
setPrompt(`操作失败，重定向至登录界面中...`);
navigate('/setting'); // in case this is failed to bind GitHub
return;
}
count++;
setPrompt(`出现错误，第 ${count} 次重试中...`);
await new Promise((resolve) => setTimeout(resolve, count * 2000));
await sendCode(code, state, count);
}
};
const sendCode = async (code, state, count) => {
const res = await API.get(
`/api/oauth/${props.type}?code=${code}&state=${state}`,
);
const { success, message, data } = res.data;
if (success) {
if (message === 'bind') {
showSuccess('绑定成功！');
navigate('/setting');
} else {
userDispatch({ type: 'login', payload: data });
localStorage.setItem('user', JSON.stringify(data));
setUserData(data);
updateAPI();
showSuccess('登录成功！');
navigate('/token');
}
} else {
showError(message);
if (count === 0) {
setPrompt(`操作失败，重定向至登录界面中...`);
navigate('/setting'); // in case this is failed to bind GitHub
return;
}
count++;
setPrompt(`出现错误，第 ${count} 次重试中...`);
await new Promise((resolve) => setTimeout(resolve, count * 2000));
await sendCode(code, state, count);
}
};
useEffect(() => {
let code = searchParams.get('code');
let state = searchParams.get('state');
sendCode(code, state, 0).then();
}, []);
useEffect(() => {
let code = searchParams.get('code');
let state = searchParams.get('state');
sendCode(code, state, 0).then();
}, []);
return (
<Segment style={{ minHeight: '300px' }}>
<Dimmer active inverted>
<Loader size='large'>{prompt}</Loader>
</Dimmer>
</Segment>
);
return (
<Segment style={{ minHeight: '300px' }}>
<Dimmer active inverted>
<Loader size='large'>{prompt}</Loader>
</Dimmer>
</Segment>
);
};
export default OAuth2Callback;
web/src/components/OIDCIcon.js
......@@ -2,21 +2,37 @@ import React from 'react';
import { Icon } from '@douyinfe/semi-ui';
const OIDCIcon = (props) => {
function CustomIcon() {
return (
<svg t="1723135116886" className="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="10969" width="1em" height="1em">
<path
d="M512 960C265 960 64 759 64 512S265 64 512 64s448 201 448 448-201 448-448 448z m0-882.6c-239.7 0-434.6 195-434.6 434.6s195 434.6 434.6 434.6 434.6-195 434.6-434.6S751.7 77.4 512 77.4z"
p-id="10970" fill="#2c2c2c" stroke="#2c2c2c" stroke-width="60"></path>
<path
d="M197.7 512c0-78.3 31.6-98.8 87.2-98.8 56.2 0 87.2 20.5 87.2 98.8s-31 98.8-87.2 98.8c-55.7 0-87.2-20.5-87.2-98.8z m130.4 0c0-46.8-7.8-64.5-43.2-64.5-35.2 0-42.9 17.7-42.9 64.5 0 47.1 7.8 63.7 42.9 63.7 35.4 0 43.2-16.6 43.2-63.7zM409.7 415.9h42.1V608h-42.1V415.9zM653.9 512c0 74.2-37.1 96.1-93.6 96.1h-65.9V415.9h65.9c56.5 0 93.6 16.1 93.6 96.1z m-43.5 0c0-49.3-17.7-60.6-52.3-60.6h-21.6v120.7h21.6c35.4 0 52.3-13.3 52.3-60.1zM686.5 512c0-74.2 36.3-98.8 92.7-98.8 18.3 0 33.2 2.2 44.8 6.4v36.3c-11.9-4.2-26-6.6-42.1-6.6-34.6 0-49.8 15.5-49.8 62.6 0 50.1 15.2 62.6 49.3 62.6 15.8 0 30.2-2.2 44.8-7.5v36c-11.3 4.7-28.5 8-46.8 8-56.1-0.2-92.9-18.7-92.9-99z"
p-id="10971" fill="#2c2c2c" stroke="#2c2c2c" stroke-width="20"></path>
</svg>
);
}
function CustomIcon() {
return (
<svg
t='1723135116886'
className='icon'
viewBox='0 0 1024 1024'
version='1.1'
xmlns='http://www.w3.org/2000/svg'
p-id='10969'
width='1em'
height='1em'
>
<path
d='M512 960C265 960 64 759 64 512S265 64 512 64s448 201 448 448-201 448-448 448z m0-882.6c-239.7 0-434.6 195-434.6 434.6s195 434.6 434.6 434.6 434.6-195 434.6-434.6S751.7 77.4 512 77.4z'
p-id='10970'
fill='#2c2c2c'
stroke='#2c2c2c'
stroke-width='60'
></path>
<path
d='M197.7 512c0-78.3 31.6-98.8 87.2-98.8 56.2 0 87.2 20.5 87.2 98.8s-31 98.8-87.2 98.8c-55.7 0-87.2-20.5-87.2-98.8z m130.4 0c0-46.8-7.8-64.5-43.2-64.5-35.2 0-42.9 17.7-42.9 64.5 0 47.1 7.8 63.7 42.9 63.7 35.4 0 43.2-16.6 43.2-63.7zM409.7 415.9h42.1V608h-42.1V415.9zM653.9 512c0 74.2-37.1 96.1-93.6 96.1h-65.9V415.9h65.9c56.5 0 93.6 16.1 93.6 96.1z m-43.5 0c0-49.3-17.7-60.6-52.3-60.6h-21.6v120.7h21.6c35.4 0 52.3-13.3 52.3-60.1zM686.5 512c0-74.2 36.3-98.8 92.7-98.8 18.3 0 33.2 2.2 44.8 6.4v36.3c-11.9-4.2-26-6.6-42.1-6.6-34.6 0-49.8 15.5-49.8 62.6 0 50.1 15.2 62.6 49.3 62.6 15.8 0 30.2-2.2 44.8-7.5v36c-11.3 4.7-28.5 8-46.8 8-56.1-0.2-92.9-18.7-92.9-99z'
p-id='10971'
fill='#2c2c2c'
stroke='#2c2c2c'
stroke-width='20'
></path>
</svg>
);
}
return <Icon svg={<CustomIcon />} />;
return <Icon svg={<CustomIcon />} />;
};
export default OIDCIcon;
\ No newline at end of file
export default OIDCIcon;
web/src/components/OperationSetting.js
......@@ -11,7 +11,6 @@ import ModelSettingsVisualEditor from '../pages/Setting/Operation/ModelSettingsV
import GroupRatioSettings from '../pages/Setting/Operation/GroupRatioSettings.js';
import ModelRatioSettings from '../pages/Setting/Operation/ModelRatioSettings.js';
import { API, showError, showSuccess } from '../helpers';
import SettingsChats from '../pages/Setting/Operation/SettingsChats.js';
import { useTranslation } from 'react-i18next';
......@@ -58,7 +57,7 @@ const OperationSetting = () => {
DataExportInterval: 5,
DefaultCollapseSidebar: false, // 默认折叠侧边栏
RetryTimes: 0,
Chats: "[]",
Chats: '[]',
DemoSiteEnabled: false,
SelfUseModeEnabled: false,
AutomaticDisableKeywords: '',
......@@ -154,14 +153,14 @@ const OperationSetting = () => {
</Card>
{/* 合并模型倍率设置和可视化倍率设置 */}
<Card style={{ marginTop: '10px' }}>
<Tabs type="line">
<Tabs.TabPane tab={t('模型倍率设置')} itemKey="model">
<Tabs type='line'>
<Tabs.TabPane tab={t('模型倍率设置')} itemKey='model'>
<ModelRatioSettings options={inputs} refresh={onRefresh} />
</Tabs.TabPane>
<Tabs.TabPane tab={t('可视化倍率设置')} itemKey="visual">
<Tabs.TabPane tab={t('可视化倍率设置')} itemKey='visual'>
<ModelSettingsVisualEditor options={inputs} refresh={onRefresh} />
</Tabs.TabPane>
<Tabs.TabPane tab={t('未设置倍率模型')} itemKey="unset_models">
<Tabs.TabPane tab={t('未设置倍率模型')} itemKey='unset_models'>
<ModelRatioNotSetEditor options={inputs} refresh={onRefresh} />
</Tabs.TabPane>
</Tabs>
......
web/src/components/PageLayout.js
......@@ -13,7 +13,6 @@ import { UserContext } from '../context/User/index.js';
import { StatusContext } from '../context/Status/index.js';
const { Sider, Content, Header, Footer } = Layout;
const PageLayout = () => {
const [userState, userDispatch] = useContext(UserContext);
const [statusState, statusDispatch] = useContext(StatusContext);
......@@ -62,85 +61,104 @@ const PageLayout = () => {
if (savedLang) {
i18n.changeLanguage(savedLang);
}
// 默认显示侧边栏
styleDispatch({ type: 'SET_SIDER', payload: true });
}, [i18n]);
// 获取侧边栏折叠状态
const isSidebarCollapsed = localStorage.getItem('default_collapse_sidebar') === 'true';
const isSidebarCollapsed =
localStorage.getItem('default_collapse_sidebar') === 'true';
return (
<Layout style={{
height: '100vh',
display: 'flex',
flexDirection: 'column',
overflow: styleState.isMobile ? 'visible' : 'hidden'
}}>
<Header style={{
padding: 0,
height: 'auto',
lineHeight: 'normal',
position: styleState.isMobile ? 'sticky' : 'fixed',
width: '100%',
top: 0,
zIndex: 100,
boxShadow: '0 1px 6px rgba(0, 0, 0, 0.08)'
}}>
<Layout
style={{
height: '100vh',
display: 'flex',
flexDirection: 'column',
overflow: styleState.isMobile ? 'visible' : 'hidden',
}}
>
<Header
style={{
padding: 0,
height: 'auto',
lineHeight: 'normal',
position: styleState.isMobile ? 'sticky' : 'fixed',
width: '100%',
top: 0,
zIndex: 100,
boxShadow: '0 1px 6px rgba(0, 0, 0, 0.08)',
}}
>
<HeaderBar />
</Header>
<Layout style={{
marginTop: styleState.isMobile ? '0' : '56px',
height: styleState.isMobile ? 'auto' : 'calc(100vh - 56px)',
overflow: styleState.isMobile ? 'visible' : 'auto',
display: 'flex',
flexDirection: 'column'
}}>
<Layout
style={{
marginTop: styleState.isMobile ? '0' : '56px',
height: styleState.isMobile ? 'auto' : 'calc(100vh - 56px)',
overflow: styleState.isMobile ? 'visible' : 'auto',
display: 'flex',
flexDirection: 'column',
}}
>
{styleState.showSider && (
<Sider style={{
position: 'fixed',
left: 0,
top: '56px',
zIndex: 99,
background: 'var(--semi-color-bg-1)',
boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
border: 'none',
paddingRight: '0',
height: 'calc(100vh - 56px)',
}}>
<Sider
style={{
position: 'fixed',
left: 0,
top: '56px',
zIndex: 99,
background: 'var(--semi-color-bg-1)',
boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
border: 'none',
paddingRight: '0',
height: 'calc(100vh - 56px)',
}}
>
<SiderBar />
</Sider>
)}
<Layout style={{
marginLeft: styleState.isMobile ? '0' : (styleState.showSider ? (styleState.siderCollapsed ? '60px' : '200px') : '0'),
transition: 'margin-left 0.3s ease',
flex: '1 1 auto',
display: 'flex',
flexDirection: 'column'
}}>
<Layout
style={{
marginLeft: styleState.isMobile
? '0'
: styleState.showSider
? styleState.siderCollapsed
? '60px'
: '200px'
: '0',
transition: 'margin-left 0.3s ease',
flex: '1 1 auto',
display: 'flex',
flexDirection: 'column',
}}
>
<Content
style={{
style={{
flex: '1 0 auto',
overflowY: styleState.isMobile ? 'visible' : 'auto',
WebkitOverflowScrolling: 'touch',
padding: styleState.shouldInnerPadding? '24px': '0',
padding: styleState.shouldInnerPadding ? '24px' : '0',
position: 'relative',
marginTop: styleState.isMobile ? '2px' : '0',
}}
>
<App />
</Content>
<Layout.Footer style={{
flex: '0 0 auto',
width: '100%'
}}>
<Layout.Footer
style={{
flex: '0 0 auto',
width: '100%',
}}
>
<FooterBar />
</Layout.Footer>
</Layout>
</Layout>
<ToastContainer />
</Layout>
)
}
);
};
export default PageLayout;
\ No newline at end of file
export default PageLayout;
web/src/components/RateLimitSetting.js
import React, { useEffect, useState } from 'react';
import { Card, Spin, Tabs } from '@douyinfe/semi-ui';
import { API, showError, showSuccess } from '../helpers';
import SettingsChats from '../pages/Setting/Operation/SettingsChats.js';
import { useTranslation } from 'react-i18next';
......@@ -24,9 +23,7 @@ const RateLimitSetting = () => {
if (success) {
let newInputs = {};
data.forEach((item) => {
if (
item.key.endsWith('Enabled')
) {
if (item.key.endsWith('Enabled')) {
newInputs[item.key] = item.value === 'true' ? true : false;
} else {
newInputs[item.key] = item.value;
......
web/src/components/RedemptionsTable.js
......@@ -10,7 +10,8 @@ import {
import { ITEMS_PER_PAGE } from '../constants';
import { renderQuota } from '../helpers/render';
import {
Button, Divider,
Button,
Divider,
Form,
Modal,
Popconfirm,
......@@ -193,15 +194,17 @@ const RedemptionsTable = () => {
};
const loadRedemptions = async (startIdx, pageSize) => {
const res = await API.get(`/api/redemption/?p=${startIdx}&page_size=${pageSize}`);
const res = await API.get(
`/api/redemption/?p=${startIdx}&page_size=${pageSize}`,
);
const { success, message, data } = res.data;
if (success) {
const newPageData = data.items;
setActivePage(data.page);
setTokenCount(data.total);
setRedemptionFormat(newPageData);
const newPageData = data.items;
setActivePage(data.page);
setTokenCount(data.total);
setRedemptionFormat(newPageData);
} else {
showError(message);
showError(message);
}
setLoading(false);
};
......@@ -282,19 +285,21 @@ const RedemptionsTable = () => {
const searchRedemptions = async (keyword, page, pageSize) => {
if (searchKeyword === '') {
await loadRedemptions(page, pageSize);
return;
await loadRedemptions(page, pageSize);
return;
}
setSearching(true);
const res = await API.get(`/api/redemption/search?keyword=${keyword}&p=${page}&page_size=${pageSize}`);
const res = await API.get(
`/api/redemption/search?keyword=${keyword}&p=${page}&page_size=${pageSize}`,
);
const { success, message, data } = res.data;
if (success) {
const newPageData = data.items;
setActivePage(data.page);
setTokenCount(data.total);
setRedemptionFormat(newPageData);
const newPageData = data.items;
setActivePage(data.page);
setTokenCount(data.total);
setRedemptionFormat(newPageData);
} else {
showError(message);
showError(message);
}
setSearching(false);
};
......@@ -355,9 +360,11 @@ const RedemptionsTable = () => {
visiable={showEdit}
handleClose={closeEdit}
></EditRedemption>
<Form onSubmit={()=> {
searchRedemptions(searchKeyword, activePage, pageSize).then();
}}>
<Form
onSubmit={() => {
searchRedemptions(searchKeyword, activePage, pageSize).then();
}}
>
<Form.Input
label={t('搜索关键字')}
field='keyword'
......@@ -369,35 +376,36 @@ const RedemptionsTable = () => {
onChange={handleKeywordChange}
/>
</Form>
<Divider style={{margin:'5px 0 15px 0'}}/>
<Divider style={{ margin: '5px 0 15px 0' }} />
<div>
<Button
theme='light'
type='primary'
style={{ marginRight: 8 }}
onClick={() => {
setEditingRedemption({
id: undefined,
});
setShowEdit(true);
}}
theme='light'
type='primary'
style={{ marginRight: 8 }}
onClick={() => {
setEditingRedemption({
id: undefined,
});
setShowEdit(true);
}}
>
{t('添加兑换码')}
</Button>
<Button
label={t('复制所选兑换码')}
type='warning'
onClick={async () => {
if (selectedKeys.length === 0) {
showError(t('请至少选择一个兑换码！'));
return;
}
let keys = '';
for (let i = 0; i < selectedKeys.length; i++) {
keys += selectedKeys[i].name + ' ' + selectedKeys[i].key + '\n';
}
await copyText(keys);
}}
label={t('复制所选兑换码')}
type='warning'
onClick={async () => {
if (selectedKeys.length === 0) {
showError(t('请至少选择一个兑换码！'));
return;
}
let keys = '';
for (let i = 0; i < selectedKeys.length; i++) {
keys +=
selectedKeys[i].name + ' ' + selectedKeys[i].key + '\n';
}
await copyText(keys);
}}
>
{t('复制所选兑换码到剪贴板')}
</Button>
......@@ -417,7 +425,7 @@ const RedemptionsTable = () => {
t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
start: page.currentStart,
end: page.currentEnd,
total: tokenCount
total: tokenCount,
}),
onPageSizeChange: (size) => {
setPageSize(size);
......
web/src/components/RegisterForm.js
import React, { useContext, useEffect, useState } from 'react';
import { Link, useNavigate } from 'react-router-dom';
import { API, getLogo, showError, showInfo, showSuccess, updateAPI } from '../helpers';
import {
API,
getLogo,
showError,
showInfo,
showSuccess,
updateAPI,
} from '../helpers';
import Turnstile from 'react-turnstile';
import { Button, Card, Divider, Form, Icon, Layout, Modal } from '@douyinfe/semi-ui';
import {
Button,
Card,
Divider,
Form,
Icon,
Layout,
Modal,
} from '@douyinfe/semi-ui';
import Title from '@douyinfe/semi-ui/lib/es/typography/title';
import Text from '@douyinfe/semi-ui/lib/es/typography/text';
import { IconGithubLogo } from '@douyinfe/semi-icons';
import {onGitHubOAuthClicked, onLinuxDOOAuthClicked, onOIDCClicked} from './utils.js';
import OIDCIcon from "./OIDCIcon.js";
import {
onGitHubOAuthClicked,
onLinuxDOOAuthClicked,
onOIDCClicked,
} from './utils.js';
import OIDCIcon from './OIDCIcon.js';
import LinuxDoIcon from './LinuxDoIcon.js';
import WeChatIcon from './WeChatIcon.js';
import TelegramLoginButton from 'react-telegram-login/src';
......@@ -22,7 +41,7 @@ const RegisterForm = () => {
password: '',
password2: '',
email: '',
verification_code: ''
verification_code: '',
});
const { username, password, password2 } = inputs;
const [showEmailVerification, setShowEmailVerification] = useState(false);
......@@ -54,7 +73,6 @@ const RegisterForm = () => {
}
});
const onWeChatLoginClicked = () => {
setShowWeChatLoginModal(true);
};
......@@ -106,7 +124,7 @@ const RegisterForm = () => {
inputs.aff_code = affCode;
const res = await API.post(
`/api/user/register?turnstile=${turnstileToken}`,
inputs
inputs,
);
const { success, message } = res.data;
if (success) {
......@@ -127,7 +145,7 @@ const RegisterForm = () => {
}
setLoading(true);
const res = await API.get(
`/api/verification?email=${inputs.email}&turnstile=${turnstileToken}`
`/api/verification?email=${inputs.email}&turnstile=${turnstileToken}`,
);
const { success, message } = res.data;
if (success) {
......@@ -169,7 +187,6 @@ const RegisterForm = () => {
}
};
return (
<div>
<Layout>
......@@ -179,7 +196,7 @@ const RegisterForm = () => {
style={{
justifyContent: 'center',
display: 'flex',
marginTop: 120
marginTop: 120,
}}
>
<div style={{ width: 500 }}>
......@@ -187,28 +204,28 @@ const RegisterForm = () => {
<Title heading={2} style={{ textAlign: 'center' }}>
{t('新用户注册')}
</Title>
<Form size="large">
<Form size='large'>
<Form.Input
field={'username'}
label={t('用户名')}
placeholder={t('用户名')}
name="username"
name='username'
onChange={(value) => handleChange('username', value)}
/>
<Form.Input
field={'password'}
label={t('密码')}
placeholder={t('输入密码，最短 8 位，最长 20 位')}
name="password"
type="password"
name='password'
type='password'
onChange={(value) => handleChange('password', value)}
/>
<Form.Input
field={'password2'}
label={t('确认密码')}
placeholder={t('确认密码')}
name="password2"
type="password"
name='password2'
type='password'
onChange={(value) => handleChange('password2', value)}
/>
{showEmailVerification ? (
......@@ -218,10 +235,13 @@ const RegisterForm = () => {
label={t('邮箱')}
placeholder={t('输入邮箱地址')}
onChange={(value) => handleChange('email', value)}
name="email"
type="email"
name='email'
type='email'
suffix={
<Button onClick={sendVerificationCode} disabled={loading}>
<Button
onClick={sendVerificationCode}
disabled={loading}
>
{t('获取验证码')}
</Button>
}
......@@ -230,8 +250,10 @@ const RegisterForm = () => {
field={'verification_code'}
label={t('验证码')}
placeholder={t('输入验证码')}
onChange={(value) => handleChange('verification_code', value)}
name="verification_code"
onChange={(value) =>
handleChange('verification_code', value)
}
name='verification_code'
/>
</>
) : (
......@@ -252,14 +274,12 @@ const RegisterForm = () => {
style={{
display: 'flex',
justifyContent: 'space-between',
marginTop: 20
marginTop: 20,
}}
>
<Text>
{t('已有账户？')}
<Link to="/login">
{t('点击登录')}
</Link>
<Link to='/login'>{t('点击登录')}</Link>
</Text>
</div>
{status.github_oauth ||
......@@ -290,15 +310,18 @@ const RegisterForm = () => {
<></>
)}
{status.oidc_enabled ? (
<Button
type='primary'
icon={<OIDCIcon />}
onClick={() =>
onOIDCClicked(status.oidc_authorization_endpoint, status.oidc_client_id)
}
/>
<Button
type='primary'
icon={<OIDCIcon />}
onClick={() =>
onOIDCClicked(
status.oidc_authorization_endpoint,
status.oidc_client_id,
)
}
/>
) : (
<></>
<></>
)}
{status.linuxdo_oauth ? (
<Button
......@@ -365,7 +388,9 @@ const RegisterForm = () => {
</div>
<div style={{ textAlign: 'center' }}>
<p>
{t('微信扫码关注公众号，输入「验证码」获取验证码（三分钟内有效）')}
{t(
'微信扫码关注公众号，输入「验证码」获取验证码（三分钟内有效）',
)}
</p>
</div>
<Form size='large'>
......
web/src/components/SiderBar.js
......@@ -15,10 +15,13 @@ import {
import '../index.css';
import {
IconCalendarClock, IconChecklistStroked,
IconComment, IconCommentStroked,
IconCalendarClock,
IconChecklistStroked,
IconComment,
IconCommentStroked,
IconCreditCard,
IconGift, IconHelpCircle,
IconGift,
IconHelpCircle,
IconHistogram,
IconHome,
IconImage,
......@@ -26,9 +29,16 @@ import {
IconLayers,
IconPriceTag,
IconSetting,
IconUser
IconUser,
} from '@douyinfe/semi-icons';
import { Avatar, Dropdown, Layout, Nav, Switch, Divider } from '@douyinfe/semi-ui';
import {
Avatar,
Dropdown,
Layout,
Nav,
Switch,
Divider,
} from '@douyinfe/semi-ui';
import { setStatusData } from '../helpers/data.js';
import { stringToColor } from '../helpers/render.js';
import { useSetTheme, useTheme } from '../context/Theme/index.js';
......@@ -44,21 +54,23 @@ const navItemStyle = {
// 自定义侧边栏按钮悬停样式
const navItemHoverStyle = {
backgroundColor: 'var(--semi-color-primary-light-default)',
color: 'var(--semi-color-primary)'
color: 'var(--semi-color-primary)',
};
// 自定义侧边栏按钮选中样式
const navItemSelectedStyle = {
backgroundColor: 'var(--semi-color-primary-light-default)',
color: 'var(--semi-color-primary)',
fontWeight: '600'
fontWeight: '600',
};
// 自定义图标样式
const iconStyle = (itemKey, selectedKeys) => {
return {
fontSize: '18px',
color: selectedKeys.includes(itemKey) ? 'var(--semi-color-primary)' : 'var(--semi-color-text-2)',
color: selectedKeys.includes(itemKey)
? 'var(--semi-color-primary)'
: 'var(--semi-color-text-2)',
};
};
......@@ -99,8 +111,24 @@ const SiderBar = () => {
// 预先计算所有可能的图标样式
const allItemKeys = useMemo(() => {
const keys = ['home', 'channel', 'token', 'redemption', 'topup', 'user', 'log', 'midjourney',
'setting', 'about', 'chat', 'detail', 'pricing', 'task', 'playground', 'personal'];
const keys = [
'home',
'channel',
'token',
'redemption',
'topup',
'user',
'log',
'midjourney',
'setting',
'about',
'chat',
'detail',
'pricing',
'task',
'playground',
'personal',
];
// 添加聊天项的keys
for (let i = 0; i < chatItems.length; i++) {
keys.push('chat' + i);
......@@ -111,7 +139,7 @@ const SiderBar = () => {
// 使用useMemo一次性计算所有图标样式
const iconStyles = useMemo(() => {
const styles = {};
allItemKeys.forEach(key => {
allItemKeys.forEach((key) => {
styles[key] = iconStyle(key, selectedKeys);
});
return styles;
......@@ -157,10 +185,8 @@ const SiderBar = () => {
to: '/task',
icon: <IconChecklistStroked />,
className:
localStorage.getItem('enable_task') === 'true'
? ''
: 'tableHiddle',
}
localStorage.getItem('enable_task') === 'true' ? '' : 'tableHiddle',
},
],
[
localStorage.getItem('enable_data_export'),
......@@ -241,13 +267,13 @@ const SiderBar = () => {
// Function to update router map with chat routes
const updateRouterMapWithChats = (chats) => {
const newRouterMap = { ...routerMap };
if (Array.isArray(chats) && chats.length > 0) {
for (let i = 0; i < chats.length; i++) {
newRouterMap['chat' + i] = '/chat/' + i;
}
}
setRouterMapState(newRouterMap);
return newRouterMap;
};
......@@ -270,13 +296,13 @@ const SiderBar = () => {
chatItems.push(chat);
}
setChatItems(chatItems);
// Update router map with chat routes
updateRouterMapWithChats(chats);
}
} catch (e) {
console.error(e);
showError('聊天数据解析失败')
showError('聊天数据解析失败');
}
}
}, []);
......@@ -284,7 +310,9 @@ const SiderBar = () => {
// Update the useEffect for route selection
useEffect(() => {
const currentPath = location.pathname;
let matchingKey = Object.keys(routerMapState).find(key => routerMapState[key] === currentPath);
let matchingKey = Object.keys(routerMapState).find(
(key) => routerMapState[key] === currentPath,
);
// Handle chat routes
if (!matchingKey && currentPath.startsWith('/chat/')) {
......@@ -325,8 +353,8 @@ const SiderBar = () => {
return (
<>
<Nav
className="custom-sidebar-nav"
style={{
className='custom-sidebar-nav'
style={{
width: isCollapsed ? '60px' : '200px',
boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
borderRight: '1px solid var(--semi-color-border)',
......@@ -351,7 +379,9 @@ const SiderBar = () => {
// 确保在收起侧边栏时有选中的项目，避免不必要的计算
if (selectedKeys.length === 0) {
const currentPath = location.pathname;
const matchingKey = Object.keys(routerMapState).find(key => routerMapState[key] === currentPath);
const matchingKey = Object.keys(routerMapState).find(
(key) => routerMapState[key] === currentPath,
);
if (matchingKey) {
setSelectedKeys([matchingKey]);
......@@ -382,12 +412,12 @@ const SiderBar = () => {
} else {
styleDispatch({ type: 'SET_INNER_PADDING', payload: true });
}
// 如果点击的是已经展开的子菜单的父项，则收起子菜单
if (openedKeys.includes(key.itemKey)) {
setOpenedKeys(openedKeys.filter(k => k !== key.itemKey));
setOpenedKeys(openedKeys.filter((k) => k !== key.itemKey));
}
setSelectedKeys([key.itemKey]);
}}
openKeys={openedKeys}
......@@ -403,7 +433,9 @@ const SiderBar = () => {
key={item.itemKey}
itemKey={item.itemKey}
text={item.text}
icon={React.cloneElement(item.icon, { style: iconStyles[item.itemKey] })}
icon={React.cloneElement(item.icon, {
style: iconStyles[item.itemKey],
})}
>
{item.items.map((subItem) => (
<Nav.Item
......@@ -420,7 +452,9 @@ const SiderBar = () => {
key={item.itemKey}
itemKey={item.itemKey}
text={item.text}
icon={React.cloneElement(item.icon, { style: iconStyles[item.itemKey] })}
icon={React.cloneElement(item.icon, {
style: iconStyles[item.itemKey],
})}
/>
);
}
......@@ -436,7 +470,9 @@ const SiderBar = () => {
key={item.itemKey}
itemKey={item.itemKey}
text={item.text}
icon={React.cloneElement(item.icon, { style: iconStyles[item.itemKey] })}
icon={React.cloneElement(item.icon, {
style: iconStyles[item.itemKey],
})}
className={item.className}
/>
))}
......@@ -453,7 +489,9 @@ const SiderBar = () => {
key={item.itemKey}
itemKey={item.itemKey}
text={item.text}
icon={React.cloneElement(item.icon, { style: iconStyles[item.itemKey] })}
icon={React.cloneElement(item.icon, {
style: iconStyles[item.itemKey],
})}
className={item.className}
/>
))}
......@@ -470,7 +508,9 @@ const SiderBar = () => {
key={item.itemKey}
itemKey={item.itemKey}
text={item.text}
icon={React.cloneElement(item.icon, { style: iconStyles[item.itemKey] })}
icon={React.cloneElement(item.icon, {
style: iconStyles[item.itemKey],
})}
className={item.className}
/>
))}
......@@ -480,14 +520,12 @@ const SiderBar = () => {
paddingBottom: styleState?.isMobile ? '112px' : '',
}}
collapseButton={true}
collapseText={(collapsed)=>
{
if(collapsed){
return t('展开侧边栏')
}
return t('收起侧边栏')
collapseText={(collapsed) => {
if (collapsed) {
return t('展开侧边栏');
}
}
return t('收起侧边栏');
}}
/>
</Nav>
</>
......
web/src/components/TokensTable.js
......@@ -8,14 +8,16 @@ import {
} from '../helpers';
import { ITEMS_PER_PAGE } from '../constants';
import {renderGroup, renderQuota} from '../helpers/render';
import { renderGroup, renderQuota } from '../helpers/render';
import {
Button, Divider,
Button,
Divider,
Dropdown,
Form,
Modal,
Popconfirm,
Popover, Space,
Popover,
Space,
SplitButtonGroup,
Table,
Tag,
......@@ -30,7 +32,6 @@ function renderTimestamp(timestamp) {
}
const TokensTable = () => {
const { t } = useTranslation();
const renderStatus = (status, model_limits_enabled = false) => {
......@@ -86,12 +87,14 @@ const TokensTable = () => {
dataIndex: 'status',
key: 'status',
render: (text, record, index) => {
return <div>
<Space>
{renderStatus(text, record.model_limits_enabled)}
{renderGroup(record.group)}
</Space>
</div>;
return (
<div>
<Space>
{renderStatus(text, record.model_limits_enabled)}
{renderGroup(record.group)}
</Space>
</div>
);
},
},
{
......@@ -143,7 +146,7 @@ const TokensTable = () => {
dataIndex: 'operate',
render: (text, record, index) => {
let chats = localStorage.getItem('chats');
let chatsArray = []
let chatsArray = [];
let shouldUseCustom = true;
if (shouldUseCustom) {
......@@ -153,7 +156,7 @@ const TokensTable = () => {
// check chats is array
if (Array.isArray(chats)) {
for (let i = 0; i < chats.length; i++) {
let chat = {}
let chat = {};
chat.node = 'item';
// c is a map
// chat.key = chats[i].name;
......@@ -164,13 +167,12 @@ const TokensTable = () => {
chat.name = key;
chat.onClick = () => {
onOpenLink(key, chats[i][key], record);
}
};
}
}
chatsArray.push(chat);
}
}
} catch (e) {
console.log(e);
showError(t('聊天链接配置错误，请联系管理员'));
......@@ -208,7 +210,11 @@ const TokensTable = () => {
if (chatsArray.length === 0) {
showError(t('请联系管理员配置聊天链接'));
} else {
onOpenLink('default', chats[0][Object.keys(chats[0])[0]], record);
onOpenLink(
'default',
chats[0][Object.keys(chats[0])[0]],
record,
);
}
}}
>
......@@ -539,36 +545,36 @@ const TokensTable = () => {
{t('查询')}
</Button>
</Form>
<Divider style={{margin:'15px 0'}}/>
<Divider style={{ margin: '15px 0' }} />
<div>
<Button
theme='light'
type='primary'
style={{ marginRight: 8 }}
onClick={() => {
setEditingToken({
id: undefined,
});
setShowEdit(true);
}}
theme='light'
type='primary'
style={{ marginRight: 8 }}
onClick={() => {
setEditingToken({
id: undefined,
});
setShowEdit(true);
}}
>
{t('添加令牌')}
{t('添加令牌')}
</Button>
<Button
label={t('复制所选令牌')}
type='warning'
onClick={async () => {
if (selectedKeys.length === 0) {
showError(t('请至少选择一个令牌！'));
return;
}
let keys = '';
for (let i = 0; i < selectedKeys.length; i++) {
keys +=
selectedKeys[i].name + ' sk-' + selectedKeys[i].key + '\n';
}
await copyText(keys);
}}
label={t('复制所选令牌')}
type='warning'
onClick={async () => {
if (selectedKeys.length === 0) {
showError(t('请至少选择一个令牌！'));
return;
}
let keys = '';
for (let i = 0; i < selectedKeys.length; i++) {
keys +=
selectedKeys[i].name + ' sk-' + selectedKeys[i].key + '\n';
}
await copyText(keys);
}}
>
{t('复制所选令牌到剪贴板')}
</Button>
......@@ -588,7 +594,7 @@ const TokensTable = () => {
t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
start: page.currentStart,
end: page.currentEnd,
total: tokens.length
total: tokens.length,
}),
onPageSizeChange: (size) => {
setPageSize(size);
......
web/src/components/UsersTable.js
......@@ -167,7 +167,11 @@ const UsersTable = () => {
manageUser(record.id, 'demote', record);
}}
>
<Button theme='light' type='secondary' style={{ marginRight: 1 }}>
<Button
theme='light'
type='secondary'
style={{ marginRight: 1 }}
>
{t('降级')}
</Button>
</Popconfirm>
......@@ -261,7 +265,7 @@ const UsersTable = () => {
users[i].key = users[i].id;
}
setUsers(users);
}
};
const loadUsers = async (startIdx, pageSize) => {
const res = await API.get(`/api/user/?p=${startIdx}&page_size=${pageSize}`);
......@@ -277,7 +281,6 @@ const UsersTable = () => {
setLoading(false);
};
useEffect(() => {
loadUsers(0, pageSize)
.then()
......@@ -327,22 +330,29 @@ const UsersTable = () => {
}
};
const searchUsers = async (startIdx, pageSize, searchKeyword, searchGroup) => {
const searchUsers = async (
startIdx,
pageSize,
searchKeyword,
searchGroup,
) => {
if (searchKeyword === '' && searchGroup === '') {
// if keyword is blank, load files instead.
await loadUsers(startIdx, pageSize);
return;
// if keyword is blank, load files instead.
await loadUsers(startIdx, pageSize);
return;
}
setSearching(true);
const res = await API.get(`/api/user/search?keyword=${searchKeyword}&group=${searchGroup}&p=${startIdx}&page_size=${pageSize}`);
const res = await API.get(
`/api/user/search?keyword=${searchKeyword}&group=${searchGroup}&p=${startIdx}&page_size=${pageSize}`,
);
const { success, message, data } = res.data;
if (success) {
const newPageData = data.items;
setActivePage(data.page);
setUserCount(data.total);
setUserFormat(newPageData);
const newPageData = data.items;
setActivePage(data.page);
setUserCount(data.total);
setUserFormat(newPageData);
} else {
showError(message);
showError(message);
}
setSearching(false);
};
......@@ -354,9 +364,9 @@ const UsersTable = () => {
const handlePageChange = (page) => {
setActivePage(page);
if (searchKeyword === '' && searchGroup === '') {
loadUsers(page, pageSize).then();
loadUsers(page, pageSize).then();
} else {
searchUsers(page, pageSize, searchKeyword, searchGroup).then();
searchUsers(page, pageSize, searchKeyword, searchGroup).then();
}
};
......@@ -372,7 +382,7 @@ const UsersTable = () => {
};
const refresh = async () => {
setActivePage(1)
setActivePage(1);
if (searchKeyword === '') {
await loadUsers(activePage, pageSize);
} else {
......@@ -431,7 +441,9 @@ const UsersTable = () => {
>
<div style={{ display: 'flex' }}>
<Space>
<Tooltip content={t('支持搜索用户的 ID、用户名、显示名称和邮箱地址')}>
<Tooltip
content={t('支持搜索用户的 ID、用户名、显示名称和邮箱地址')}
>
<Form.Input
label={t('搜索关键字')}
icon='search'
......@@ -443,7 +455,7 @@ const UsersTable = () => {
onChange={(value) => handleKeywordChange(value)}
/>
</Tooltip>
<Form.Select
field='group'
label={t('分组')}
......@@ -482,7 +494,7 @@ const UsersTable = () => {
t('第 {{start}} - {{end}} 条，共 {{total}} 条', {
start: page.currentStart,
end: page.currentEnd,
total: users.length
total: users.length,
}),
currentPage: activePage,
pageSize: pageSize,
......
web/src/components/custom/TextInput.js
import { Input, Typography } from '@douyinfe/semi-ui';
import React from 'react';
const TextInput = ({ label, name, value, onChange, placeholder, type = 'text' }) => {
const TextInput = ({
label,
name,
value,
onChange,
placeholder,
type = 'text',
}) => {
return (
<>
<div style={{ marginTop: 10 }}>
......@@ -12,10 +19,10 @@ const TextInput = ({ label, name, value, onChange, placeholder, type = 'text' })
placeholder={placeholder}
onChange={(value) => onChange(value)}
value={value}
autoComplete="new-password"
autoComplete='new-password'
/>
</>
);
}
};
export default TextInput;
\ No newline at end of file
export default TextInput;
web/src/components/custom/TextNumberInput.js
......@@ -12,10 +12,10 @@ const TextNumberInput = ({ label, name, value, onChange, placeholder }) => {
placeholder={placeholder}
onChange={(value) => onChange(value)}
value={value}
autoComplete="new-password"
autoComplete='new-password'
/>
</>
);
}
};
export default TextNumberInput;
\ No newline at end of file
export default TextNumberInput;
web/src/components/fetchTokenKeys.js
......@@ -13,7 +13,7 @@ async function fetchTokenKeys() {
throw new Error('Failed to fetch token keys');
}
} catch (error) {
console.error("Error fetching token keys:", error);
console.error('Error fetching token keys:', error);
return [];
}
}
......@@ -27,7 +27,7 @@ function getServerAddress() {
status = JSON.parse(status);
serverAddress = status.server_address || '';
} catch (error) {
console.error("Failed to parse status from localStorage:", error);
console.error('Failed to parse status from localStorage:', error);
}
}
......@@ -65,4 +65,4 @@ export function useTokenKeys(id) {
}, []);
return { keys, serverAddress, isLoading };
}
\ No newline at end of file
}
web/src/components/utils.js
......@@ -20,13 +20,12 @@ export async function onOIDCClicked(auth_url, client_id, openInNewTab = false) {
const state = await getOAuthState();
if (!state) return;
const redirect_uri = `${window.location.origin}/oauth/oidc`;
const response_type = "code";
const scope = "openid profile email";
const response_type = 'code';
const scope = 'openid profile email';
const url = `${auth_url}?client_id=${client_id}&redirect_uri=${redirect_uri}&response_type=${response_type}&scope=${scope}&state=${state}`;
if (openInNewTab) {
window.open(url);
} else
{
} else {
window.location.href = url;
}
}
......
web/src/constants/channel.constants.js
......@@ -3,86 +3,86 @@ export const CHANNEL_OPTIONS = [
{
value: 2,
color: 'light-blue',
label: 'Midjourney Proxy'
label: 'Midjourney Proxy',
},
{
value: 5,
color: 'blue',
label: 'Midjourney Proxy Plus'
label: 'Midjourney Proxy Plus',
},
{
value: 36,
color: 'purple',
label: 'Suno API'
label: 'Suno API',
},
{ value: 4, color: 'grey', label: 'Ollama' },
{
value: 14,
color: 'indigo',
label: 'Anthropic Claude'
label: 'Anthropic Claude',
},
{
value: 33,
color: 'indigo',
label: 'AWS Claude'
label: 'AWS Claude',
},
{ value: 41, color: 'blue', label: 'Vertex AI' },
{
value: 3,
color: 'teal',
label: 'Azure OpenAI'
label: 'Azure OpenAI',
},
{
value: 34,
color: 'purple',
label: 'Cohere'
label: 'Cohere',
},
{ value: 39, color: 'grey', label: 'Cloudflare' },
{ value: 43, color: 'blue', label: 'DeepSeek' },
{
value: 15,
color: 'blue',
label: '百度文心千帆'
label: '百度文心千帆',
},
{
value: 46,
color: 'blue',
label: '百度文心千帆V2'
label: '百度文心千帆V2',
},
{
value: 17,
color: 'orange',
label: '阿里通义千问'
label: '阿里通义千问',
},
{
value: 18,
color: 'blue',
label: '讯飞星火认知'
label: '讯飞星火认知',
},
{
value: 16,
color: 'violet',
label: '智谱 ChatGLM'
label: '智谱 ChatGLM',
},
{
value: 26,
color: 'purple',
label: '智谱 GLM-4V'
label: '智谱 GLM-4V',
},
{
value: 24,
color: 'orange',
label: 'Google Gemini'
label: 'Google Gemini',
},
{
value: 11,
color: 'orange',
label: 'Google PaLM2'
label: 'Google PaLM2',
},
{
value: 47,
color: 'blue',
label: 'Xinference'
label: 'Xinference',
},
{ value: 25, color: 'green', label: 'Moonshot' },
{ value: 20, color: 'green', label: 'OpenRouter' },
......@@ -98,22 +98,22 @@ export const CHANNEL_OPTIONS = [
{
value: 22,
color: 'blue',
label: '知识库：FastGPT'
label: '知识库：FastGPT',
},
{
value: 21,
color: 'purple',
label: '知识库：AI Proxy'
label: '知识库：AI Proxy',
},
{
value: 44,
color: 'purple',
label: '嵌入模型：MokaAI M3E'
label: '嵌入模型：MokaAI M3E',
},
{
value: 45,
color: 'blue',
label: '字节火山方舟、豆包、DeepSeek通用'
label: '字节火山方舟、豆包、DeepSeek通用',
},
{
value: 48,
......
web/src/context/Style/index.js
......@@ -19,25 +19,25 @@ export const StyleProvider = ({ children }) => {
if ('type' in action) {
switch (action.type) {
case 'TOGGLE_SIDER':
setState(prev => ({ ...prev, showSider: !prev.showSider }));
setState((prev) => ({ ...prev, showSider: !prev.showSider }));
break;
case 'SET_SIDER':
setState(prev => ({ ...prev, showSider: action.payload }));
setState((prev) => ({ ...prev, showSider: action.payload }));
break;
case 'SET_MOBILE':
setState(prev => ({ ...prev, isMobile: action.payload }));
setState((prev) => ({ ...prev, isMobile: action.payload }));
break;
case 'SET_SIDER_COLLAPSED':
setState(prev => ({ ...prev, siderCollapsed: action.payload }));
break
setState((prev) => ({ ...prev, siderCollapsed: action.payload }));
break;
case 'SET_INNER_PADDING':
setState(prev => ({ ...prev, shouldInnerPadding: action.payload }));
setState((prev) => ({ ...prev, shouldInnerPadding: action.payload }));
break;
default:
setState(prev => ({ ...prev, ...action }));
setState((prev) => ({ ...prev, ...action }));
}
} else {
setState(prev => ({ ...prev, ...action }));
setState((prev) => ({ ...prev, ...action }));
}
};
......@@ -45,7 +45,7 @@ export const StyleProvider = ({ children }) => {
const updateIsMobile = () => {
const mobileDetected = isMobile();
dispatch({ type: 'SET_MOBILE', payload: mobileDetected });
// If on mobile, we might want to auto-hide the sidebar
if (mobileDetected && state.showSider) {
dispatch({ type: 'SET_SIDER', payload: false });
......@@ -57,7 +57,12 @@ export const StyleProvider = ({ children }) => {
const updateShowSider = () => {
// check pathname
const pathname = window.location.pathname;
if (pathname === '' || pathname === '/' || pathname.includes('/home') || pathname.includes('/chat')) {
if (
pathname === '' ||
pathname === '/' ||
pathname.includes('/home') ||
pathname.includes('/chat')
) {
dispatch({ type: 'SET_SIDER', payload: false });
dispatch({ type: 'SET_INNER_PADDING', payload: false });
} else if (pathname === '/setup') {
......@@ -73,7 +78,8 @@ export const StyleProvider = ({ children }) => {
updateShowSider();
const updateSiderCollapsed = () => {
const isCollapsed = localStorage.getItem('default_collapse_sidebar') === 'true';
const isCollapsed =
localStorage.getItem('default_collapse_sidebar') === 'true';
dispatch({ type: 'SET_SIDER_COLLAPSED', payload: isCollapsed });
};
......@@ -83,7 +89,7 @@ export const StyleProvider = ({ children }) => {
const handleResize = () => {
updateIsMobile();
};
window.addEventListener('resize', handleResize);
// Cleanup event listener on component unmount
......
web/src/helpers/api.js
......@@ -7,8 +7,8 @@ export let API = axios.create({
: '',
headers: {
'New-API-User': getUserIdFromLocalStorage(),
'Cache-Control': 'no-store'
}
'Cache-Control': 'no-store',
},
});
export function updateAPI() {
......@@ -18,8 +18,8 @@ export function updateAPI() {
: '',
headers: {
'New-API-User': getUserIdFromLocalStorage(),
'Cache-Control': 'no-store'
}
'Cache-Control': 'no-store',
},
});
}
......
web/src/helpers/other.js
export function getLogOther(otherStr) {
if (otherStr === undefined || otherStr === '') {
otherStr = '{}'
}
let other = JSON.parse(otherStr)
return other
}
\ No newline at end of file
export function getLogOther(otherStr) {
if (otherStr === undefined || otherStr === '') {
otherStr = '{}';
}
let other = JSON.parse(otherStr);
return other;
}
web/src/helpers/utils.js
......@@ -51,11 +51,11 @@ export async function copy(text) {
} catch (e) {
try {
// 构建input 执行 复制命令
var _input = window.document.createElement("input");
var _input = window.document.createElement('input');
_input.value = text;
window.document.body.appendChild(_input);
_input.select();
window.document.execCommand("Copy");
window.document.execCommand('Copy');
window.document.body.removeChild(_input);
} catch (e) {
okay = false;
......@@ -191,7 +191,7 @@ export function timestamp2string1(timestamp, dataExportDefaultTime = 'hour') {
let day = date.getDate().toString();
let hour = date.getHours().toString();
if (day === '24') {
console.log("timestamp", timestamp);
console.log('timestamp', timestamp);
}
if (month.length === 1) {
month = '0' + month;
......@@ -247,7 +247,6 @@ export function verifyJSONPromise(value) {
}
}
export function shouldShowPrompt(id) {
let prompt = localStorage.getItem(`prompt-${id}`);
return !prompt;
......
web/src/i18n/i18n.js
......@@ -11,16 +11,16 @@ i18n
.init({
resources: {
en: {
translation: enTranslation
translation: enTranslation,
},
zh: {
translation: zhTranslation
}
translation: zhTranslation,
},
},
fallbackLng: 'zh',
interpolation: {
escapeValue: false
}
escapeValue: false,
},
});
export default i18n;
\ No newline at end of file
export default i18n;
web/src/i18n/locales/en.json
......@@ -1065,7 +1065,7 @@
"价格：${{price}} * 分组：{{ratio}}": "Price: ${{price}} * Group: {{ratio}}",
"模型: {{ratio}} * 分组: {{groupRatio}}": "Model: {{ratio}} * Group: {{groupRatio}}",
"统计额度": "Statistical quota",
"统计Tokens": "Statistical Tokens",
"统计Tokens": "Statistical Tokens",
"统计次数": "Statistical count",
"平均RPM": "Average RPM",
"平均TPM": "Average TPM",
......
web/src/i18n/locales/zh.json
......@@ -10,4 +10,4 @@
"展开侧边栏": "展开侧边栏",
"关闭侧边栏": "关闭侧边栏",
"注销成功!": "注销成功!"
}
\ No newline at end of file
}
web/src/index.css
body {
margin: 0;
padding-top: 0;
font-family: Lato, 'Helvetica Neue', Arial, Helvetica, 'Microsoft YaHei',
sans-serif;
font-family:
Lato, 'Helvetica Neue', Arial, Helvetica, 'Microsoft YaHei', sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
scrollbar-width: none;
......@@ -18,7 +18,20 @@ body {
overflow: hidden;
}
#root > section > header > section > div > div > div > div.semi-navigation-header-list-outer > div.semi-navigation-list-wrapper > ul > div > a > li > span{
#root
> section
> header
> section
> div
> div
> div
> div.semi-navigation-header-list-outer
> div.semi-navigation-list-wrapper
> ul
> div
> a
> li
> span {
font-weight: 600 !important;
}
......@@ -33,24 +46,56 @@ body {
.topnav {
padding: 0 8px;
}
.topnav .semi-navigation-item {
margin: 0 1px;
padding: 0 4px;
}
.topnav .semi-navigation-list-wrapper {
max-width: calc(55vw - 20px);
overflow-x: auto;
scrollbar-width: none;
}
#root > section > header > section > div > div > div > div.semi-navigation-footer > div > a > li {
#root
> section
> header
> section
> div
> div
> div
> div.semi-navigation-footer
> div
> a
> li {
padding: 0 0;
}
#root > section > header > section > div > div > div > div.semi-navigation-header-list-outer > div.semi-navigation-list-wrapper > ul > div > a > li {
#root
> section
> header
> section
> div
> div
> div
> div.semi-navigation-header-list-outer
> div.semi-navigation-list-wrapper
> ul
> div
> a
> li {
padding: 0 5px;
}
#root > section > header > section > div > div > div > div.semi-navigation-footer > div:nth-child(1) > a > li {
#root
> section
> header
> section
> div
> div
> div
> div.semi-navigation-footer
> div:nth-child(1)
> a
> li {
padding: 0 5px;
}
.semi-navigation-footer {
......@@ -96,13 +141,13 @@ body {
position: static !important;
height: 100% !important;
}
/* 确保内容区域在移动端可以正常滚动 */
#root {
overflow: visible !important;
height: 100% !important;
}
/* 隐藏在移动设备上 */
.hide-on-mobile {
display: none !important;
......@@ -147,8 +192,8 @@ body::-webkit-scrollbar {
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
font-family:
source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
}
.semi-navigation-item {
......
web/src/index.js
......@@ -28,7 +28,7 @@ root.render(
<BrowserRouter>
<ThemeProvider>
<StyleProvider>
<PageLayout/>
<PageLayout />
</StyleProvider>
</ThemeProvider>
</BrowserRouter>
......
web/src/pages/Channel/index.js
......@@ -9,10 +9,10 @@ const File = () => {
<>
<Layout>
<Layout.Header>
<h3>{t('管理渠道')}</h3>
</Layout.Header>
<Layout.Content>
<ChannelsTable />
<h3>{t('管理渠道')}</h3>
</Layout.Header>
<Layout.Content>
<ChannelsTable />
</Layout.Content>
</Layout>
</>
......
web/src/pages/Chat/index.js
import React, {useEffect} from 'react';
import React, { useEffect } from 'react';
import { useTokenKeys } from '../../components/fetchTokenKeys';
import {Banner, Layout} from '@douyinfe/semi-ui';
import { Banner, Layout } from '@douyinfe/semi-ui';
import { useParams } from 'react-router-dom';
const ChatPage = () => {
......@@ -10,21 +10,24 @@ const ChatPage = () => {
const comLink = (key) => {
// console.log('chatLink:', chatLink);
if (!serverAddress || !key) return '';
let link = "";
if (id) {
let chats = localStorage.getItem('chats');
if (chats) {
chats = JSON.parse(chats);
if (Array.isArray(chats) && chats.length > 0) {
for (let k in chats[id]) {
link = chats[id][k];
link = link.replaceAll('{address}', encodeURIComponent(serverAddress));
link = link.replaceAll('{key}', 'sk-' + key);
}
}
let link = '';
if (id) {
let chats = localStorage.getItem('chats');
if (chats) {
chats = JSON.parse(chats);
if (Array.isArray(chats) && chats.length > 0) {
for (let k in chats[id]) {
link = chats[id][k];
link = link.replaceAll(
'{address}',
encodeURIComponent(serverAddress),
);
link = link.replaceAll('{key}', 'sk-' + key);
}
}
}
return link;
}
return link;
};
const iframeSrc = keys.length > 0 ? comLink(keys[0]) : '';
......@@ -33,21 +36,18 @@ const ChatPage = () => {
<iframe
src={iframeSrc}
style={{ width: '100%', height: '100%', border: 'none' }}
title="Token Frame"
allow="camera;microphone"
title='Token Frame'
allow='camera;microphone'
/>
) : (
<div>
<Layout>
<Layout.Header>
<Banner
description={"正在跳转......"}
type={"warning"}
/>
<Banner description={'正在跳转......'} type={'warning'} />
</Layout.Header>
</Layout>
</div>
);
};
export default ChatPage;
\ No newline at end of file
export default ChatPage;
web/src/pages/Chat2Link/index.js
......@@ -18,9 +18,9 @@ const chat2page = () => {
return (
<div>
<h3>正在加载，请稍候...</h3>
<h3>正在加载，请稍候...</h3>
</div>
);
};
export default chat2page;
\ No newline at end of file
export default chat2page;
web/src/pages/Home/index.js
......@@ -40,19 +40,19 @@ const Home = () => {
setHomePageContent(content);
localStorage.setItem('home_page_content', content);
// 如果内容是 URL，则发送主题模式
if (data.startsWith('https://')) {
const iframe = document.querySelector('iframe');
if (iframe) {
const theme = localStorage.getItem('theme-mode') || 'light';
// 测试是否正确传递theme-mode给iframe
// console.log('Sending theme-mode to iframe:', theme);
iframe.onload = () => {
iframe.contentWindow.postMessage({ themeMode: theme }, '*');
iframe.contentWindow.postMessage({ lang: i18n.language }, '*');
};
}
// 如果内容是 URL，则发送主题模式
if (data.startsWith('https://')) {
const iframe = document.querySelector('iframe');
if (iframe) {
const theme = localStorage.getItem('theme-mode') || 'light';
// 测试是否正确传递theme-mode给iframe
// console.log('Sending theme-mode to iframe:', theme);
iframe.onload = () => {
iframe.contentWindow.postMessage({ themeMode: theme }, '*');
iframe.contentWindow.postMessage({ lang: i18n.language }, '*');
};
}
}
} else {
showError(message);
setHomePageContent('加载首页内容失败...');
......@@ -95,7 +95,9 @@ const Home = () => {
</span>
}
>
<p>{t('名称')}：{statusState?.status?.system_name}</p>
<p>
{t('名称')}：{statusState?.status?.system_name}
</p>
<p>
{t('版本')}：
{statusState?.status?.version
......@@ -123,7 +125,9 @@ const Home = () => {
Apache-2.0 License
</a>
</p>
<p>{t('启动时间')}：{getStartTimeString()}</p>
<p>
{t('启动时间')}：{getStartTimeString()}
</p>
</Card>
</Col>
<Col span={12}>
......@@ -155,8 +159,8 @@ const Home = () => {
<p>
{t('OIDC 身份验证')}：
{statusState?.status?.oidc === true
? t('已启用')
: t('未启用')}
? t('已启用')
: t('未启用')}
</p>
<p>
{t('微信身份验证')}：
......
web/src/pages/Redemption/EditRedemption.js
......@@ -8,7 +8,11 @@ import {
showError,
showSuccess,
} from '../../helpers';
import { getQuotaPerUnit, renderQuota, renderQuotaWithPrompt } from '../../helpers/render';
import {
getQuotaPerUnit,
renderQuota,
renderQuotaWithPrompt,
} from '../../helpers/render';
import {
AutoComplete,
Button,
......@@ -171,7 +175,9 @@ const EditRedemption = (props) => {
/>
<Divider />
<div style={{ marginTop: 20 }}>
<Typography.Text>{t('额度') + renderQuotaWithPrompt(quota)}</Typography.Text>
<Typography.Text>
{t('额度') + renderQuotaWithPrompt(quota)}
</Typography.Text>
</div>
<AutoComplete
style={{ marginTop: 8 }}
......
web/src/pages/Redemption/index.js
......@@ -9,14 +9,14 @@ const Redemption = () => {
<>
<Layout>
<Layout.Header>
<h3>{t('管理兑换码')}</h3>
</Layout.Header>
<Layout.Content>
<RedemptionsTable />
</Layout.Content>
</Layout>
</>
);
}
<h3>{t('管理兑换码')}</h3>
</Layout.Header>
<Layout.Content>
<RedemptionsTable />
</Layout.Content>
</Layout>
</>
);
};
export default Redemption;
web/src/pages/Setting/Model/SettingClaudeModel.js
......@@ -5,23 +5,27 @@ import {
API,
showError,
showSuccess,
showWarning, verifyJSON
showWarning,
verifyJSON,
} from '../../../helpers';
import { useTranslation } from 'react-i18next';
import Text from '@douyinfe/semi-ui/lib/es/typography/text';
const CLAUDE_HEADER = {
'claude-3-7-sonnet-20250219-thinking': {
'anthropic-beta': ['output-128k-2025-02-19', 'token-efficient-tools-2025-02-19'],
}
'anthropic-beta': [
'output-128k-2025-02-19',
'token-efficient-tools-2025-02-19',
],
},
};
const CLAUDE_DEFAULT_MAX_TOKENS = {
'default': 8192,
"claude-3-haiku-20240307": 4096,
"claude-3-opus-20240229": 4096,
default: 8192,
'claude-3-haiku-20240307': 4096,
'claude-3-opus-20240229': 4096,
'claude-3-7-sonnet-20250219-thinking': 8192,
}
};
export default function SettingClaudeModel(props) {
const { t } = useTranslation();
......@@ -41,7 +45,7 @@ export default function SettingClaudeModel(props) {
if (!updateArray.length) return showWarning(t('你似乎并没有修改什么'));
const requestQueue = updateArray.map((item) => {
let value = String(inputs[item.key]);
return API.put('/api/option/', {
key: item.key,
value,
......@@ -53,7 +57,8 @@ export default function SettingClaudeModel(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......@@ -92,18 +97,29 @@ export default function SettingClaudeModel(props) {
<Form.TextArea
label={t('Claude请求头覆盖')}
field={'claude.model_headers_settings'}
placeholder={t('为一个 JSON 文本，例如：') + '\n' + JSON.stringify(CLAUDE_HEADER, null, 2)}
extraText={t('示例') + '\n' + JSON.stringify(CLAUDE_HEADER, null, 2)}
placeholder={
t('为一个 JSON 文本，例如：') +
'\n' +
JSON.stringify(CLAUDE_HEADER, null, 2)
}
extraText={
t('示例') + '\n' + JSON.stringify(CLAUDE_HEADER, null, 2)
}
autosize={{ minRows: 6, maxRows: 12 }}
trigger='blur'
stopValidateWithError
rules={[
{
validator: (rule, value) => verifyJSON(value),
message: t('不是合法的 JSON 字符串')
}
message: t('不是合法的 JSON 字符串'),
},
]}
onChange={(value) => setInputs({ ...inputs, 'claude.model_headers_settings': value })}
onChange={(value) =>
setInputs({
...inputs,
'claude.model_headers_settings': value,
})
}
/>
</Col>
</Row>
......@@ -112,18 +128,28 @@ export default function SettingClaudeModel(props) {
<Form.TextArea
label={t('缺省 MaxTokens')}
field={'claude.default_max_tokens'}
placeholder={t('为一个 JSON 文本，例如：') + '\n' + JSON.stringify(CLAUDE_DEFAULT_MAX_TOKENS, null, 2)}
extraText={t('示例') + '\n' + JSON.stringify(CLAUDE_DEFAULT_MAX_TOKENS, null, 2)}
placeholder={
t('为一个 JSON 文本，例如：') +
'\n' +
JSON.stringify(CLAUDE_DEFAULT_MAX_TOKENS, null, 2)
}
extraText={
t('示例') +
'\n' +
JSON.stringify(CLAUDE_DEFAULT_MAX_TOKENS, null, 2)
}
autosize={{ minRows: 6, maxRows: 12 }}
trigger='blur'
stopValidateWithError
rules={[
{
validator: (rule, value) => verifyJSON(value),
message: t('不是合法的 JSON 字符串')
}
message: t('不是合法的 JSON 字符串'),
},
]}
onChange={(value) => setInputs({ ...inputs, 'claude.default_max_tokens': value })}
onChange={(value) =>
setInputs({ ...inputs, 'claude.default_max_tokens': value })
}
/>
</Col>
</Row>
......@@ -132,7 +158,12 @@ export default function SettingClaudeModel(props) {
<Form.Switch
label={t('启用Claude思考适配（-thinking后缀）')}
field={'claude.thinking_adapter_enabled'}
onChange={(value) => setInputs({ ...inputs, 'claude.thinking_adapter_enabled': value })}
onChange={(value) =>
setInputs({
...inputs,
'claude.thinking_adapter_enabled': value,
})
}
/>
</Col>
</Row>
......@@ -140,7 +171,9 @@ export default function SettingClaudeModel(props) {
<Col span={16}>
{/*//展示MaxTokens和BudgetTokens的计算公式, 并展示实际数字*/}
<Text>
{t('Claude思考适配 BudgetTokens = MaxTokens * BudgetTokens 百分比')}
{t(
'Claude思考适配 BudgetTokens = MaxTokens * BudgetTokens 百分比',
)}
</Text>
</Col>
</Row>
......@@ -153,7 +186,12 @@ export default function SettingClaudeModel(props) {
extraText={t('0.1-1之间的小数')}
min={0.1}
max={1}
onChange={(value) => setInputs({ ...inputs, 'claude.thinking_adapter_budget_tokens_percentage': value })}
onChange={(value) =>
setInputs({
...inputs,
'claude.thinking_adapter_budget_tokens_percentage': value,
})
}
/>
</Col>
</Row>
......
web/src/pages/Setting/Model/SettingGeminiModel.js
......@@ -5,20 +5,20 @@ import {
API,
showError,
showSuccess,
showWarning, verifyJSON
showWarning,
verifyJSON,
} from '../../../helpers';
import { useTranslation } from 'react-i18next';
const GEMINI_SETTING_EXAMPLE = {
'default': 'OFF',
'HARM_CATEGORY_CIVIC_INTEGRITY': 'BLOCK_NONE',
default: 'OFF',
HARM_CATEGORY_CIVIC_INTEGRITY: 'BLOCK_NONE',
};
const GEMINI_VERSION_EXAMPLE = {
'default': 'v1beta',
default: 'v1beta',
};
export default function SettingGeminiModel(props) {
const { t } = useTranslation();
......@@ -52,7 +52,8 @@ export default function SettingGeminiModel(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......@@ -90,19 +91,27 @@ export default function SettingGeminiModel(props) {
<Col xs={24} sm={12} md={8} lg={8} xl={8}>
<Form.TextArea
label={t('Gemini安全设置')}
placeholder={t('为一个 JSON 文本，例如：') + '\n' + JSON.stringify(GEMINI_SETTING_EXAMPLE, null, 2)}
placeholder={
t('为一个 JSON 文本，例如：') +
'\n' +
JSON.stringify(GEMINI_SETTING_EXAMPLE, null, 2)
}
field={'gemini.safety_settings'}
extraText={t('default为默认设置，可单独设置每个分类的安全等级')}
extraText={t(
'default为默认设置，可单独设置每个分类的安全等级',
)}
autosize={{ minRows: 6, maxRows: 12 }}
trigger='blur'
stopValidateWithError
rules={[
{
validator: (rule, value) => verifyJSON(value),
message: t('不是合法的 JSON 字符串')
}
message: t('不是合法的 JSON 字符串'),
},
]}
onChange={(value) => setInputs({ ...inputs, 'gemini.safety_settings': value })}
onChange={(value) =>
setInputs({ ...inputs, 'gemini.safety_settings': value })
}
/>
</Col>
</Row>
......@@ -110,7 +119,11 @@ export default function SettingGeminiModel(props) {
<Col xs={24} sm={12} md={8} lg={8} xl={8}>
<Form.TextArea
label={t('Gemini版本设置')}
placeholder={t('为一个 JSON 文本，例如：') + '\n' + JSON.stringify(GEMINI_VERSION_EXAMPLE, null, 2)}
placeholder={
t('为一个 JSON 文本，例如：') +
'\n' +
JSON.stringify(GEMINI_VERSION_EXAMPLE, null, 2)
}
field={'gemini.version_settings'}
extraText={t('default为默认设置，可单独设置每个模型的版本')}
autosize={{ minRows: 6, maxRows: 12 }}
......@@ -119,10 +132,12 @@ export default function SettingGeminiModel(props) {
rules={[
{
validator: (rule, value) => verifyJSON(value),
message: t('不是合法的 JSON 字符串')
}
message: t('不是合法的 JSON 字符串'),
},
]}
onChange={(value) => setInputs({ ...inputs, 'gemini.version_settings': value })}
onChange={(value) =>
setInputs({ ...inputs, 'gemini.version_settings': value })
}
/>
</Col>
</Row>
......
web/src/pages/Setting/Model/SettingGlobalModel.js
......@@ -5,7 +5,8 @@ import {
API,
showError,
showSuccess,
showWarning, verifyJSON
showWarning,
verifyJSON,
} from '../../../helpers';
import { useTranslation } from 'react-i18next';
......@@ -38,7 +39,8 @@ export default function SettingGlobalModel(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......@@ -77,8 +79,15 @@ export default function SettingGlobalModel(props) {
<Form.Switch
label={t('启用请求透传')}
field={'global.pass_through_request_enabled'}
onChange={(value) => setInputs({ ...inputs, 'global.pass_through_request_enabled': value })}
extraText={'开启后，所有请求将直接透传给上游，不会进行任何处理（重定向和渠道适配也将失效）,请谨慎开启'}
onChange={(value) =>
setInputs({
...inputs,
'global.pass_through_request_enabled': value,
})
}
extraText={
'开启后，所有请求将直接透传给上游，不会进行任何处理（重定向和渠道适配也将失效）,请谨慎开启'
}
/>
</Col>
</Row>
......
web/src/pages/Setting/Operation/GroupRatioSettings.js
......@@ -15,50 +15,59 @@ export default function GroupRatioSettings(props) {
const [loading, setLoading] = useState(false);
const [inputs, setInputs] = useState({
GroupRatio: '',
UserUsableGroups: ''
UserUsableGroups: '',
});
const refForm = useRef();
const [inputsRow, setInputsRow] = useState(inputs);
async function onSubmit() {
try {
await refForm.current.validate().then(() => {
const updateArray = compareObjects(inputs, inputsRow);
if (!updateArray.length) return showWarning(t('你似乎并没有修改什么'));
const requestQueue = updateArray.map((item) => {
const value = typeof inputs[item.key] === 'boolean'
? String(inputs[item.key])
: inputs[item.key];
return API.put('/api/option/', { key: item.key, value });
});
await refForm.current
.validate()
.then(() => {
const updateArray = compareObjects(inputs, inputsRow);
if (!updateArray.length)
return showWarning(t('你似乎并没有修改什么'));
setLoading(true);
Promise.all(requestQueue)
.then((res) => {
if (res.includes(undefined)) {
return showError(requestQueue.length > 1 ? t('部分保存失败，请重试') : t('保存失败'));
}
for (let i = 0; i < res.length; i++) {
if (!res[i].data.success) {
return showError(res[i].data.message);
}
}
showSuccess(t('保存成功'));
props.refresh();
})
.catch(error => {
console.error('Unexpected error:', error);
showError(t('保存失败，请重试'));
})
.finally(() => {
setLoading(false);
const requestQueue = updateArray.map((item) => {
const value =
typeof inputs[item.key] === 'boolean'
? String(inputs[item.key])
: inputs[item.key];
return API.put('/api/option/', { key: item.key, value });
});
}).catch(() => {
showError(t('请检查输入'));
});
setLoading(true);
Promise.all(requestQueue)
.then((res) => {
if (res.includes(undefined)) {
return showError(
requestQueue.length > 1
? t('部分保存失败，请重试')
: t('保存失败'),
);
}
for (let i = 0; i < res.length; i++) {
if (!res[i].data.success) {
return showError(res[i].data.message);
}
}
showSuccess(t('保存成功'));
props.refresh();
})
.catch((error) => {
console.error('Unexpected error:', error);
showError(t('保存失败，请重试'));
})
.finally(() => {
setLoading(false);
});
})
.catch(() => {
showError(t('请检查输入'));
});
} catch (error) {
showError(t('请检查输入'));
console.error(error);
......@@ -97,10 +106,12 @@ export default function GroupRatioSettings(props) {
rules={[
{
validator: (rule, value) => verifyJSON(value),
message: t('不是合法的 JSON 字符串')
}
message: t('不是合法的 JSON 字符串'),
},
]}
onChange={(value) => setInputs({ ...inputs, GroupRatio: value })}
onChange={(value) =>
setInputs({ ...inputs, GroupRatio: value })
}
/>
</Col>
</Row>
......@@ -116,10 +127,12 @@ export default function GroupRatioSettings(props) {
rules={[
{
validator: (rule, value) => verifyJSON(value),
message: t('不是合法的 JSON 字符串')
}
message: t('不是合法的 JSON 字符串'),
},
]}
onChange={(value) => setInputs({ ...inputs, UserUsableGroups: value })}
onChange={(value) =>
setInputs({ ...inputs, UserUsableGroups: value })
}
/>
</Col>
</Row>
......@@ -128,4 +141,4 @@ export default function GroupRatioSettings(props) {
<Button onClick={onSubmit}>{t('保存分组倍率设置')}</Button>
</Spin>
);
}
\ No newline at end of file
}
web/src/pages/Setting/Operation/ModelRatioSettings.js
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Popconfirm, Row, Space, Spin } from '@douyinfe/semi-ui';
import {
Button,
Col,
Form,
Popconfirm,
Row,
Space,
Spin,
} from '@douyinfe/semi-ui';
import {
compareObjects,
API,
......@@ -24,43 +32,52 @@ export default function ModelRatioSettings(props) {
async function onSubmit() {
try {
await refForm.current.validate().then(() => {
const updateArray = compareObjects(inputs, inputsRow);
if (!updateArray.length) return showWarning(t('你似乎并没有修改什么'));
const requestQueue = updateArray.map((item) => {
const value = typeof inputs[item.key] === 'boolean'
? String(inputs[item.key])
: inputs[item.key];
return API.put('/api/option/', { key: item.key, value });
});
await refForm.current
.validate()
.then(() => {
const updateArray = compareObjects(inputs, inputsRow);
if (!updateArray.length)
return showWarning(t('你似乎并没有修改什么'));
setLoading(true);
Promise.all(requestQueue)
.then((res) => {
if (res.includes(undefined)) {
return showError(requestQueue.length > 1 ? t('部分保存失败，请重试') : t('保存失败'));
}
for (let i = 0; i < res.length; i++) {
if (!res[i].data.success) {
return showError(res[i].data.message);
}
}
showSuccess(t('保存成功'));
props.refresh();
})
.catch(error => {
console.error('Unexpected error:', error);
showError(t('保存失败，请重试'));
})
.finally(() => {
setLoading(false);
const requestQueue = updateArray.map((item) => {
const value =
typeof inputs[item.key] === 'boolean'
? String(inputs[item.key])
: inputs[item.key];
return API.put('/api/option/', { key: item.key, value });
});
}).catch(() => {
showError(t('请检查输入'));
});
setLoading(true);
Promise.all(requestQueue)
.then((res) => {
if (res.includes(undefined)) {
return showError(
requestQueue.length > 1
? t('部分保存失败，请重试')
: t('保存失败'),
);
}
for (let i = 0; i < res.length; i++) {
if (!res[i].data.success) {
return showError(res[i].data.message);
}
}
showSuccess(t('保存成功'));
props.refresh();
})
.catch((error) => {
console.error('Unexpected error:', error);
showError(t('保存失败，请重试'));
})
.finally(() => {
setLoading(false);
});
})
.catch(() => {
showError(t('请检查输入'));
});
} catch (error) {
showError(t('请检查输入'));
console.error(error);
......@@ -106,7 +123,9 @@ export default function ModelRatioSettings(props) {
<Form.TextArea
label={t('模型固定价格')}
extraText={t('一次调用消耗多少刀，优先级大于模型倍率')}
placeholder={t('为一个 JSON 文本，键为模型名称，值为一次调用消耗多少刀，比如 "gpt-4-gizmo-*": 0.1，一次消耗0.1刀')}
placeholder={t(
'为一个 JSON 文本，键为模型名称，值为一次调用消耗多少刀，比如 "gpt-4-gizmo-*": 0.1，一次消耗0.1刀',
)}
field={'ModelPrice'}
autosize={{ minRows: 6, maxRows: 12 }}
trigger='blur'
......@@ -114,10 +133,12 @@ export default function ModelRatioSettings(props) {
rules={[
{
validator: (rule, value) => verifyJSON(value),
message: '不是合法的 JSON 字符串'
}
message: '不是合法的 JSON 字符串',
},
]}
onChange={(value) => setInputs({ ...inputs, ModelPrice: value })}
onChange={(value) =>
setInputs({ ...inputs, ModelPrice: value })
}
/>
</Col>
</Row>
......@@ -133,10 +154,12 @@ export default function ModelRatioSettings(props) {
rules={[
{
validator: (rule, value) => verifyJSON(value),
message: '不是合法的 JSON 字符串'
}
message: '不是合法的 JSON 字符串',
},
]}
onChange={(value) => setInputs({ ...inputs, ModelRatio: value })}
onChange={(value) =>
setInputs({ ...inputs, ModelRatio: value })
}
/>
</Col>
</Row>
......@@ -152,10 +175,12 @@ export default function ModelRatioSettings(props) {
rules={[
{
validator: (rule, value) => verifyJSON(value),
message: '不是合法的 JSON 字符串'
}
message: '不是合法的 JSON 字符串',
},
]}
onChange={(value) => setInputs({ ...inputs, CacheRatio: value })}
onChange={(value) =>
setInputs({ ...inputs, CacheRatio: value })
}
/>
</Col>
</Row>
......@@ -172,10 +197,12 @@ export default function ModelRatioSettings(props) {
rules={[
{
validator: (rule, value) => verifyJSON(value),
message: '不是合法的 JSON 字符串'
}
message: '不是合法的 JSON 字符串',
},
]}
onChange={(value) => setInputs({ ...inputs, CompletionRatio: value })}
onChange={(value) =>
setInputs({ ...inputs, CompletionRatio: value })
}
/>
</Col>
</Row>
......@@ -195,4 +222,4 @@ export default function ModelRatioSettings(props) {
</Space>
</Spin>
);
}
\ No newline at end of file
}
web/src/pages/Setting/Operation/SettingsChats.js
import React, { useEffect, useState, useRef } from 'react';
import { Banner, Button, Col, Form, Popconfirm, Row, Space, Spin } from '@douyinfe/semi-ui';
import {
Banner,
Button,
Col,
Form,
Popconfirm,
Row,
Space,
Spin,
} from '@douyinfe/semi-ui';
import {
compareObjects,
API,
......@@ -7,7 +16,7 @@ import {
showSuccess,
showWarning,
verifyJSON,
verifyJSONPromise
verifyJSONPromise,
} from '../../../helpers';
import { useTranslation } from 'react-i18next';
......@@ -15,7 +24,7 @@ export default function SettingsChats(props) {
const { t } = useTranslation();
const [loading, setLoading] = useState(false);
const [inputs, setInputs] = useState({
Chats: "[]",
Chats: '[]',
});
const refForm = useRef();
const [inputsRow, setInputsRow] = useState(inputs);
......@@ -23,44 +32,48 @@ export default function SettingsChats(props) {
async function onSubmit() {
try {
console.log('Starting validation...');
await refForm.current.validate().then(() => {
console.log('Validation passed');
const updateArray = compareObjects(inputs, inputsRow);
if (!updateArray.length) return showWarning(t('你似乎并没有修改什么'));
const requestQueue = updateArray.map((item) => {
let value = '';
if (typeof inputs[item.key] === 'boolean') {
value = String(inputs[item.key]);
} else {
value = inputs[item.key];
}
return API.put('/api/option/', {
key: item.key,
value
});
});
setLoading(true);
Promise.all(requestQueue)
.then((res) => {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
await refForm.current
.validate()
.then(() => {
console.log('Validation passed');
const updateArray = compareObjects(inputs, inputsRow);
if (!updateArray.length)
return showWarning(t('你似乎并没有修改什么'));
const requestQueue = updateArray.map((item) => {
let value = '';
if (typeof inputs[item.key] === 'boolean') {
value = String(inputs[item.key]);
} else {
value = inputs[item.key];
}
showSuccess(t('保存成功'));
props.refresh();
})
.catch(() => {
showError(t('保存失败，请重试'));
})
.finally(() => {
setLoading(false);
return API.put('/api/option/', {
key: item.key,
value,
});
});
}).catch((error) => {
console.error('Validation failed:', error);
showError(t('请检查输入'));
});
setLoading(true);
Promise.all(requestQueue)
.then((res) => {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
})
.catch(() => {
showError(t('保存失败，请重试'));
})
.finally(() => {
setLoading(false);
});
})
.catch((error) => {
console.error('Validation failed:', error);
showError(t('请检查输入'));
});
} catch (error) {
showError(t('请检查输入'));
console.error(error);
......@@ -109,11 +122,15 @@ export default function SettingsChats(props) {
<Form.Section text={t('令牌聊天设置')}>
<Banner
type='warning'
description={t('必须将上方聊天链接全部设置为空，才能使用下方聊天设置功能')}
description={t(
'必须将上方聊天链接全部设置为空，才能使用下方聊天设置功能',
)}
/>
<Banner
type='info'
description={t('链接中的{key}将自动替换为sk-xxxx，{address}将自动替换为系统设置的服务器地址，末尾不带/和/v1')}
description={t(
'链接中的{key}将自动替换为sk-xxxx，{address}将自动替换为系统设置的服务器地址，末尾不带/和/v1',
)}
/>
<Form.TextArea
label={t('聊天配置')}
......@@ -128,22 +145,20 @@ export default function SettingsChats(props) {
validator: (rule, value) => {
return verifyJSON(value);
},
message: t('不是合法的 JSON 字符串')
}
message: t('不是合法的 JSON 字符串'),
},
]}
onChange={(value) =>
setInputs({
...inputs,
Chats: value
Chats: value,
})
}
/>
</Form.Section>
</Form>
<Space>
<Button onClick={onSubmit}>
{t('保存聊天设置')}
</Button>
<Button onClick={onSubmit}>{t('保存聊天设置')}</Button>
</Space>
</Spin>
);
......
web/src/pages/Setting/Operation/SettingsCreditLimit.js
......@@ -42,7 +42,8 @@ export default function SettingsCreditLimit(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......
web/src/pages/Setting/Operation/SettingsDataDashboard.js
......@@ -11,7 +11,7 @@ import { useTranslation } from 'react-i18next';
export default function DataDashboard(props) {
const { t } = useTranslation();
const optionsDataExportDefaultTime = [
{ key: 'hour', label: t('小时'), value: 'hour' },
{ key: 'day', label: t('天'), value: 'day' },
......@@ -47,7 +47,8 @@ export default function DataDashboard(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......
web/src/pages/Setting/Operation/SettingsDrawing.js
......@@ -44,7 +44,8 @@ export default function SettingsDrawing(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......@@ -146,7 +147,8 @@ export default function SettingsDrawing(props) {
label={
<>
{t('开启之后会清除用户提示词中的')} <Tag>--fast</Tag> 、
<Tag>--relax</Tag> {t('以及')} <Tag>--turbo</Tag> {t('参数')}
<Tag>--relax</Tag> {t('以及')} <Tag>--turbo</Tag>{' '}
{t('参数')}
</>
}
size='default'
......
web/src/pages/Setting/Operation/SettingsGeneral.js
import React, { useEffect, useState, useRef } from 'react';
import { Banner, Button, Col, Form, Row, Spin, Collapse, Modal } from '@douyinfe/semi-ui';
import {
Banner,
Button,
Col,
Form,
Row,
Spin,
Collapse,
Modal,
} from '@douyinfe/semi-ui';
import {
compareObjects,
API,
......@@ -54,7 +63,8 @@ export default function GeneralSettings(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......@@ -198,7 +208,7 @@ export default function GeneralSettings(props) {
</Form.Section>
</Form>
</Spin>
<Modal
title={t('警告')}
visible={showQuotaWarning}
......@@ -209,7 +219,9 @@ export default function GeneralSettings(props) {
>
<Banner
type='warning'
description={t('此设置用于系统内部计算，默认值500000是为了精确到6位小数点设计，不推荐修改。')}
description={t(
'此设置用于系统内部计算，默认值500000是为了精确到6位小数点设计，不推荐修改。',
)}
bordered
fullMode={false}
closeIcon={null}
......
web/src/pages/Setting/Operation/SettingsLog.js
......@@ -45,7 +45,8 @@ export default function SettingsLog(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......
web/src/pages/Setting/Operation/SettingsMonitoring.js
......@@ -5,7 +5,8 @@ import {
API,
showError,
showSuccess,
showWarning, verifyJSON
showWarning,
verifyJSON,
} from '../../../helpers';
import { useTranslation } from 'react-i18next';
......@@ -43,7 +44,8 @@ export default function SettingsMonitoring(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......@@ -67,7 +69,7 @@ export default function SettingsMonitoring(props) {
setInputsRow(structuredClone(currentInputs));
refForm.current.setValues(currentInputs);
}, [props.options]);
return (
<>
<Spin spinning={loading}>
......@@ -84,7 +86,9 @@ export default function SettingsMonitoring(props) {
step={1}
min={0}
suffix={t('秒')}
extraText={t('当运行通道全部测试时，超过此时间将自动禁用通道')}
extraText={t(
'当运行通道全部测试时，超过此时间将自动禁用通道',
)}
placeholder={''}
field={'ChannelDisableThreshold'}
onChange={(value) =>
......@@ -150,10 +154,14 @@ export default function SettingsMonitoring(props) {
<Form.TextArea
label={t('自动禁用关键词')}
placeholder={t('一行一个，不区分大小写')}
extraText={t('当上游通道返回错误中包含这些关键词时（不区分大小写），自动禁用通道')}
extraText={t(
'当上游通道返回错误中包含这些关键词时（不区分大小写），自动禁用通道',
)}
field={'AutomaticDisableKeywords'}
autosize={{ minRows: 6, maxRows: 12 }}
onChange={(value) => setInputs({ ...inputs, AutomaticDisableKeywords: value })}
onChange={(value) =>
setInputs({ ...inputs, AutomaticDisableKeywords: value })
}
/>
</Col>
</Row>
......
web/src/pages/Setting/Operation/SettingsSensitiveWords.js
......@@ -41,7 +41,8 @@ export default function SettingsSensitiveWords(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......
web/src/pages/Setting/RateLimit/SettingsRequestRateLimit.js
......@@ -17,7 +17,7 @@ export default function RequestRateLimit(props) {
ModelRequestRateLimitEnabled: false,
ModelRequestRateLimitCount: -1,
ModelRequestRateLimitSuccessCount: 1000,
ModelRequestRateLimitDurationMinutes: 1
ModelRequestRateLimitDurationMinutes: 1,
});
const refForm = useRef();
const [inputsRow, setInputsRow] = useState(inputs);
......@@ -43,7 +43,8 @@ export default function RequestRateLimit(props) {
if (requestQueue.length === 1) {
if (res.includes(undefined)) return;
} else if (requestQueue.length > 1) {
if (res.includes(undefined)) return showError(t('部分保存失败，请重试'));
if (res.includes(undefined))
return showError(t('部分保存失败，请重试'));
}
showSuccess(t('保存成功'));
props.refresh();
......
web/src/pages/Task/index.js
import React from 'react';
import TaskLogsTable from "../../components/TaskLogsTable.js";
import TaskLogsTable from '../../components/TaskLogsTable.js';
const Task = () => (
<>
......
web/src/pages/Token/EditToken.js
......@@ -18,8 +18,9 @@ import {
Select,
SideSheet,
Space,
Spin, TextArea,
Typography
Spin,
TextArea,
Typography,
} from '@douyinfe/semi-ui';
import Title from '@douyinfe/semi-ui/lib/es/typography/title';
import { Divider } from 'semantic-ui-react';
......@@ -47,7 +48,7 @@ const EditToken = (props) => {
model_limits_enabled,
model_limits,
allow_ips,
group
group,
} = inputs;
// const [visible, setVisible] = useState(false);
const [models, setModels] = useState([]);
......@@ -100,7 +101,7 @@ const EditToken = (props) => {
let localGroupOptions = Object.entries(data).map(([group, info]) => ({
label: info.desc,
value: group,
ratio: info.ratio
ratio: info.ratio,
}));
setGroups(localGroupOptions);
} else {
......@@ -229,9 +230,7 @@ const EditToken = (props) => {
}
if (successCount > 0) {
showSuccess(
t('令牌创建成功，请在列表页面点击复制获取令牌！')
);
showSuccess(t('令牌创建成功，请在列表页面点击复制获取令牌！'));
props.refresh();
props.handleClose();
}
......@@ -246,7 +245,9 @@ const EditToken = (props) => {
<SideSheet
placement={isEdit ? 'right' : 'left'}
title={
<Title level={3}>{isEdit ? t('更新令牌信息') : t('创建新的令牌')}</Title>
<Title level={3}>
{isEdit ? t('更新令牌信息') : t('创建新的令牌')}
</Title>
}
headerStyle={{ borderBottom: '1px solid var(--semi-color-border)' }}
bodyStyle={{ borderBottom: '1px solid var(--semi-color-border)' }}
......@@ -333,7 +334,9 @@ const EditToken = (props) => {
<Divider />
<Banner
type={'warning'}
description={t('注意，令牌的额度仅用于限制令牌本身的最大额度使用量，实际的使用受到账户的剩余额度限制。')}
description={t(
'注意，令牌的额度仅用于限制令牌本身的最大额度使用量，实际的使用受到账户的剩余额度限制。',
)}
></Banner>
<div style={{ marginTop: 20 }}>
<Typography.Text>{`${t('额度')}${renderQuotaWithPrompt(remain_quota)}`}</Typography.Text>
......@@ -396,7 +399,9 @@ const EditToken = (props) => {
</div>
<Divider />
<div style={{ marginTop: 10 }}>
<Typography.Text>{t('IP白名单（请勿过度信任此功能）')}</Typography.Text>
<Typography.Text>
{t('IP白名单（请勿过度信任此功能）')}
</Typography.Text>
</div>
<TextArea
label={t('IP白名单')}
......@@ -440,7 +445,7 @@ const EditToken = (props) => {
<div style={{ marginTop: 10 }}>
<Typography.Text>{t('令牌分组，默认为用户的分组')}</Typography.Text>
</div>
{groups.length > 0 ?
{groups.length > 0 ? (
<Select
style={{ marginTop: 8 }}
placeholder={t('令牌分组，默认为用户的分组')}
......@@ -455,14 +460,15 @@ const EditToken = (props) => {
value={inputs.group}
autoComplete='new-password'
optionList={groups}
/>:
/>
) : (
<Select
style={{ marginTop: 8 }}
placeholder={t('管理员未设置用户可选分组')}
name='gruop'
disabled={true}
/>
}
)}
</Spin>
</SideSheet>
</>
......
web/src/pages/Token/index.js
......@@ -8,13 +8,15 @@ const Token = () => {
<>
<Layout>
<Layout.Header>
<Banner
type='warning'
description={t('令牌无法精确控制使用额度，只允许自用，请勿直接将令牌分发给他人。')}
/>
</Layout.Header>
<Layout.Content>
<TokensTable />
<Banner
type='warning'
description={t(
'令牌无法精确控制使用额度，只允许自用，请勿直接将令牌分发给他人。',
)}
/>
</Layout.Header>
<Layout.Content>
<TokensTable />
</Layout.Content>
</Layout>
</>
......
web/src/pages/TopUp/index.js
......@@ -228,8 +228,12 @@ const TopUp = () => {
size={'small'}
centered={true}
>
<p>{t('充值数量')}：{topUpCount}</p>
<p>{t('实付金额')}：{renderAmount()}</p>
<p>
{t('充值数量')}：{topUpCount}
</p>
<p>
{t('实付金额')}：{renderAmount()}
</p>
<p>{t('是否确认充值？')}</p>
</Modal>
<div
......@@ -280,7 +284,9 @@ const TopUp = () => {
disabled={!enableOnlineTopUp}
field={'redemptionCount'}
label={t('实付金额：') + ' ' + renderAmount()}
placeholder={t('充值数量，最低 ') + renderQuotaWithAmount(minTopUp)}
placeholder={
t('充值数量，最低 ') + renderQuotaWithAmount(minTopUp)
}
name='redemptionCount'
type={'number'}
value={topUpCount}
......
web/src/pages/User/EditUser.js
......@@ -201,7 +201,9 @@ const EditUser = (props) => {
search
selection
allowAdditions
additionLabel={t('请在系统设置页面编辑分组倍率以添加新的分组：')}
additionLabel={t(
'请在系统设置页面编辑分组倍率以添加新的分组：',
)}
onChange={(value) => handleInputChange('group', value)}
value={inputs.group}
autoComplete='new-password'
......@@ -231,17 +233,21 @@ const EditUser = (props) => {
name='github_id'
value={github_id}
autoComplete='new-password'
placeholder={t('此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改')}
placeholder={t(
'此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改',
)}
readonly
/>
<div style={{ marginTop: 20 }}>
<Typography.Text>{t('`已绑定的 OIDC 账户')}</Typography.Text>
</div>
<Input
name='oidc_id'
value={oidc_id}
placeholder={t('此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改')}
readonly
name='oidc_id'
value={oidc_id}
placeholder={t(
'此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改',
)}
readonly
/>
<div style={{ marginTop: 20 }}>
<Typography.Text>{t('已绑定的微信账户')}</Typography.Text>
......@@ -250,7 +256,9 @@ const EditUser = (props) => {
name='wechat_id'
value={wechat_id}
autoComplete='new-password'
placeholder={t('此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改')}
placeholder={t(
'此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改',
)}
readonly
/>
<div style={{ marginTop: 20 }}>
......@@ -260,7 +268,9 @@ const EditUser = (props) => {
name='email'
value={email}
autoComplete='new-password'
placeholder={t('此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改')}
placeholder={t(
'此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改',
)}
readonly
/>
<div style={{ marginTop: 20 }}>
......@@ -270,7 +280,9 @@ const EditUser = (props) => {
name='telegram_id'
value={telegram_id}
autoComplete='new-password'
placeholder={t('此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改')}
placeholder={t(
'此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改',
)}
readonly
/>
</Spin>
......
web/src/pages/User/index.js
......@@ -9,10 +9,10 @@ const User = () => {
<>
<Layout>
<Layout.Header>
<h3>{t('管理用户')}</h3>
</Layout.Header>
<Layout.Content>
<UsersTable />
<h3>{t('管理用户')}</h3>
</Layout.Header>
<Layout.Content>
<UsersTable />
</Layout.Content>
</Layout>
</>
......
web/vite.config.js
......@@ -46,7 +46,11 @@ export default defineConfig({
'react-toastify',
'react-turnstile',
],
'i18n': ['i18next', 'react-i18next', 'i18next-browser-languagedetector'],
i18n: [
'i18next',
'react-i18next',
'i18next-browser-languagedetector',
],
},
},
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment