xinyin025/new-api
1
0
Fork 0
mirror of https://github.com/linux-do/new-api.git synced 2025-09-17 16:06:38 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: the dark mode does not work for the OperationSetting and SystemSetting panels

Browse Source
This commit is contained in:
kahosan 2024-04-16 17:12:54 +08:00
parent e9abe5b705
commit 848358d876
2 changed files with 45 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
web/src/components/OperationSetting.js
View File

@ -8,6 +8,8 @@ import {
verifyJSON,
} from '../helpers';
import { useTheme } from '../context/Theme';
const OperationSetting = () => {
let now = new Date();
let [inputs, setInputs] = useState({
@ -77,6 +79,9 @@ const OperationSetting = () => {
}
};
const theme = useTheme();
const isDark = theme === 'dark';
useEffect(() => {
getOptions().then();
}, []);
@ -219,8 +224,10 @@ const OperationSetting = () => {
return (
<Grid columns={1}>
<Grid.Column>
<Form loading={loading}>
<Header as='h3'>通用设置</Header>
<Form loading={loading} inverted={isDark}>
<Header as='h3' inverted={isDark}>
通用设置
</Header>
<Form.Group widths={4}>
<Form.Input
label='充值链接'
@ -299,7 +306,9 @@ const OperationSetting = () => {
保存通用设置
</Form.Button>
<Divider />
<Header as='h3'>绘图设置</Header>
<Header as='h3' inverted={isDark}>
绘图设置
</Header>
<Form.Group inline>
<Form.Checkbox
checked={inputs.DrawingEnabled === 'true'}
@ -321,7 +330,9 @@ const OperationSetting = () => {
/>
</Form.Group>
<Divider />
<Header as='h3'>屏蔽词过滤设置</Header>
<Header as='h3' inverted={isDark}>
屏蔽词过滤设置
</Header>
<Form.Group inline>
<Form.Checkbox
checked={inputs.CheckSensitiveEnabled === 'true'}
@ -381,7 +392,9 @@ const OperationSetting = () => {
保存屏蔽词设置
</Form.Button>
<Divider />
<Header as='h3'>日志设置</Header>
<Header as='h3' inverted={isDark}>
日志设置
</Header>
<Form.Group inline>
<Form.Checkbox
checked={inputs.LogConsumeEnabled === 'true'}
@ -409,7 +422,9 @@ const OperationSetting = () => {
清理历史日志
</Form.Button>
<Divider />
<Header as='h3'>数据看板</Header>
<Header as='h3' inverted={isDark}>
数据看板
</Header>
<Form.Checkbox
checked={inputs.DataExportEnabled === 'true'}
label='启用数据看板（实验性）'
@ -439,7 +454,9 @@ const OperationSetting = () => {
/>
</Form.Group>
<Divider />
<Header as='h3'>监控设置</Header>
<Header as='h3' inverted={isDark}>
监控设置
</Header>
<Form.Group widths={3}>
<Form.Input
label='最长响应时间'
@ -484,7 +501,9 @@ const OperationSetting = () => {
保存监控设置
</Form.Button>
<Divider />
<Header as='h3'>额度设置</Header>
<Header as='h3' inverted={isDark}>
额度设置
</Header>
<Form.Group widths={4}>
<Form.Input
label='新用户初始额度'
@ -535,7 +554,9 @@ const OperationSetting = () => {
保存额度设置
</Form.Button>
<Divider />
<Header as='h3'>倍率设置</Header>
<Header as='h3' inverted={isDark}>
倍率设置
</Header>
<Form.Group widths='equal'>
<Form.TextArea
label='模型固定价格（一次调用消耗多少刀，优先级大于模型倍率）'

25
web/src/components/SystemSetting.js
View File

@ -10,6 +10,8 @@ import {
} from 'semantic-ui-react';
import { API, removeTrailingSlash, showError, verifyJSON } from '../helpers';
import { useTheme } from '../context/Theme';
const SystemSetting = () => {
let [inputs, setInputs] = useState({
PasswordLoginEnabled: '',
@ -57,6 +59,9 @@ const SystemSetting = () => {
const [showPasswordWarningModal, setShowPasswordWarningModal] =
useState(false);
const theme = useTheme();
const isDark = theme === 'dark';
const getOptions = async () => {
const res = await API.get('/api/option/');
const { success, message, data } = res.data;
@ -306,8 +311,8 @@ const SystemSetting = () => {
return (
<Grid columns={1}>
<Grid.Column>
<Form loading={loading}>
<Header as='h3'>通用设置</Header>
<Form loading={loading} inverted={isDark}>
<Header as='h3' inverted={isDark}>通用设置</Header>
<Form.Group widths='equal'>
<Form.Input
label='服务器地址'
@ -321,7 +326,7 @@ const SystemSetting = () => {
更新服务器地址
</Form.Button>
<Divider />
<Header as='h3'>
<Header as='h3' inverted={isDark}>
支付设置（当前仅支持易支付接口，默认使用上方服务器地址作为回调地址！）
</Header>
<Form.Group widths='equal'>
@ -385,7 +390,7 @@ const SystemSetting = () => {
</Form.Group>
<Form.Button onClick={submitPayAddress}>更新支付设置</Form.Button>
<Divider />
<Header as='h3'>配置登录注册</Header>
<Header as='h3' inverted={isDark}>配置登录注册</Header>
<Form.Group inline>
<Form.Checkbox
checked={inputs.PasswordLoginEnabled === 'true'}
@ -468,7 +473,7 @@ const SystemSetting = () => {
/>
</Form.Group>
<Divider />
<Header as='h3'>
<Header as='h3' inverted={isDark}>
配置邮箱域名白名单
<Header.Subheader>
用以防止恶意用户利用临时邮箱批量注册
@ -533,7 +538,7 @@ const SystemSetting = () => {
保存邮箱域名白名单设置
</Form.Button>
<Divider />
<Header as='h3'>
<Header as='h3' inverted={isDark}>
配置 SMTP
<Header.Subheader>用以支持系统的邮件发送</Header.Subheader>
</Header>
@ -592,7 +597,7 @@ const SystemSetting = () => {
</Form.Group>
<Form.Button onClick={submitSMTP}>保存 SMTP 设置</Form.Button>
<Divider />
<Header as='h3'>
<Header as='h3' inverted={isDark}>
配置 GitHub OAuth App
<Header.Subheader>
用以支持通过 GitHub 进行登录注册，
@ -634,7 +639,7 @@ const SystemSetting = () => {
保存 GitHub OAuth 设置
</Form.Button>
<Divider />
<Header as='h3'>
<Header as='h3' inverted={isDark}>
配置 WeChat Server
<Header.Subheader>
用以支持通过微信进行登录注册，
@ -679,7 +684,7 @@ const SystemSetting = () => {
保存 WeChat Server 设置
</Form.Button>
<Divider />
<Header as='h3'>配置 Telegram 登录</Header>
<Header as='h3' inverted={isDark}>配置 Telegram 登录</Header>
<Form.Group inline>
<Form.Input
label='Telegram Bot Token'
@ -700,7 +705,7 @@ const SystemSetting = () => {
保存 Telegram 登录设置
</Form.Button>
<Divider />
<Header as='h3'>
<Header as='h3' inverted={isDark}>
配置 Turnstile
<Header.Subheader>
用以支持用户校验，