oadmin/new-api
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(web): format code

Browse Source
This commit is contained in:
QuentinHsu
2025-04-04 12:00:38 +08:00
parent 424424c160
commit 6b79b89dc0
74 changed files with 6413 additions and 3548 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -77,7 +77,8 @@ const SystemSetting = () => {
const [isLoaded, setIsLoaded] = useState(false);
const formApiRef = useRef(null);
const [emailDomainWhitelist, setEmailDomainWhitelist] = useState([]);
const [showPasswordLoginConfirmModal, setShowPasswordLoginConfirmModal] = useState(false);
const [showPasswordLoginConfirmModal, setShowPasswordLoginConfirmModal] =
useState(false);
const [linuxDOOAuthEnabled, setLinuxDOOAuthEnabled] = useState(false);
const getOptions = async () => {
@@ -138,18 +139,18 @@ const SystemSetting = () => {
setLoading(true);
try {
// 分离 checkbox 类型的选项和其他选项
const checkboxOptions = options.filter(opt =>
opt.key.toLowerCase().endsWith('enabled')
const checkboxOptions = options.filter((opt) =>
opt.key.toLowerCase().endsWith('enabled'),
);
const otherOptions = options.filter(opt =>
!opt.key.toLowerCase().endsWith('enabled')
const otherOptions = options.filter(
(opt) => !opt.key.toLowerCase().endsWith('enabled'),
);
// 处理 checkbox 类型的选项
for (const opt of checkboxOptions) {
const res = await API.put('/api/option/', {
key: opt.key,
value: opt.value.toString()
value: opt.value.toString(),
});
if (!res.data.success) {
showError(res.data.message);
@@ -159,18 +160,19 @@ const SystemSetting = () => {
// 处理其他选项
if (otherOptions.length > 0) {
const requestQueue = otherOptions.map(opt =>
const requestQueue = otherOptions.map((opt) =>
API.put('/api/option/', {
key: opt.key,
value: typeof opt.value === 'boolean' ? opt.value.toString() : opt.value
})
value:
typeof opt.value === 'boolean' ? opt.value.toString() : opt.value,
}),
);
const results = await Promise.all(requestQueue);
// 检查所有请求是否成功
const errorResults = results.filter(res => !res.data.success);
errorResults.forEach(res => {
const errorResults = results.filter((res) => !res.data.success);
errorResults.forEach((res) => {
showError(res.data.message);
});
}
@@ -178,7 +180,7 @@ const SystemSetting = () => {
showSuccess('更新成功');
// 更新本地状态
const newInputs = { ...inputs };
options.forEach(opt => {
options.forEach((opt) => {
newInputs[opt.key] = opt.value;
});
setInputs(newInputs);
@@ -201,7 +203,7 @@ const SystemSetting = () => {
let WorkerUrl = removeTrailingSlash(inputs.WorkerUrl);
await updateOptions([
{ key: 'WorkerUrl', value: WorkerUrl },
{ key: 'WorkerValidKey', value: inputs.WorkerValidKey }
{ key: 'WorkerValidKey', value: inputs.WorkerValidKey },
]);
};
@@ -216,11 +218,11 @@ const SystemSetting = () => {
return;
}
}
const options = [
{ key: 'PayAddress', value: removeTrailingSlash(inputs.PayAddress) }
{ key: 'PayAddress', value: removeTrailingSlash(inputs.PayAddress) },
];
if (inputs.EpayId !== '') {
options.push({ key: 'EpayId', value: inputs.EpayId });
}
@@ -234,18 +236,21 @@ const SystemSetting = () => {
options.push({ key: 'MinTopUp', value: inputs.MinTopUp.toString() });
}
if (inputs.CustomCallbackAddress !== '') {
options.push({ key: 'CustomCallbackAddress', value: inputs.CustomCallbackAddress });
options.push({
key: 'CustomCallbackAddress',
value: inputs.CustomCallbackAddress,
});
}
if (originInputs['TopupGroupRatio'] !== inputs.TopupGroupRatio) {
options.push({ key: 'TopupGroupRatio', value: inputs.TopupGroupRatio });
}
await updateOptions(options);
};
const submitSMTP = async () => {
const options = [];
if (originInputs['SMTPServer'] !== inputs.SMTPServer) {
options.push({ key: 'SMTPServer', value: inputs.SMTPServer });
}
@@ -255,13 +260,19 @@ const SystemSetting = () => {
if (originInputs['SMTPFrom'] !== inputs.SMTPFrom) {
options.push({ key: 'SMTPFrom', value: inputs.SMTPFrom });
}
if (originInputs['SMTPPort'] !== inputs.SMTPPort && inputs.SMTPPort !== '') {
if (
originInputs['SMTPPort'] !== inputs.SMTPPort &&
inputs.SMTPPort !== ''
) {
options.push({ key: 'SMTPPort', value: inputs.SMTPPort });
}
if (originInputs['SMTPToken'] !== inputs.SMTPToken && inputs.SMTPToken !== '') {
if (
originInputs['SMTPToken'] !== inputs.SMTPToken &&
inputs.SMTPToken !== ''
) {
options.push({ key: 'SMTPToken', value: inputs.SMTPToken });
}
if (options.length > 0) {
await updateOptions(options);
}
@@ -269,10 +280,12 @@ const SystemSetting = () => {
const submitEmailDomainWhitelist = async () => {
if (Array.isArray(emailDomainWhitelist)) {
await updateOptions([{
key: 'EmailDomainWhitelist',
value: emailDomainWhitelist.join(',')
}]);
await updateOptions([
{
key: 'EmailDomainWhitelist',
value: emailDomainWhitelist.join(','),
},
]);
} else {
showError('邮箱域名白名单格式不正确');
}
@@ -280,23 +293,32 @@ const SystemSetting = () => {
const submitWeChat = async () => {
const options = [];
if (originInputs['WeChatServerAddress'] !== inputs.WeChatServerAddress) {
options.push({
key: 'WeChatServerAddress',
value: removeTrailingSlash(inputs.WeChatServerAddress)
options.push({
key: 'WeChatServerAddress',
value: removeTrailingSlash(inputs.WeChatServerAddress),
});
}
if (originInputs['WeChatAccountQRCodeImageURL'] !== inputs.WeChatAccountQRCodeImageURL) {
options.push({
key: 'WeChatAccountQRCodeImageURL',
value: inputs.WeChatAccountQRCodeImageURL
if (
originInputs['WeChatAccountQRCodeImageURL'] !==
inputs.WeChatAccountQRCodeImageURL
) {
options.push({
key: 'WeChatAccountQRCodeImageURL',
value: inputs.WeChatAccountQRCodeImageURL,
});
}
if (originInputs['WeChatServerToken'] !== inputs.WeChatServerToken && inputs.WeChatServerToken !== '') {
options.push({ key: 'WeChatServerToken', value: inputs.WeChatServerToken });
if (
originInputs['WeChatServerToken'] !== inputs.WeChatServerToken &&
inputs.WeChatServerToken !== ''
) {
options.push({
key: 'WeChatServerToken',
value: inputs.WeChatServerToken,
});
}
if (options.length > 0) {
await updateOptions(options);
}
@@ -304,14 +326,20 @@ const SystemSetting = () => {
const submitGitHubOAuth = async () => {
const options = [];
if (originInputs['GitHubClientId'] !== inputs.GitHubClientId) {
options.push({ key: 'GitHubClientId', value: inputs.GitHubClientId });
}
if (originInputs['GitHubClientSecret'] !== inputs.GitHubClientSecret && inputs.GitHubClientSecret !== '') {
options.push({ key: 'GitHubClientSecret', value: inputs.GitHubClientSecret });
if (
originInputs['GitHubClientSecret'] !== inputs.GitHubClientSecret &&
inputs.GitHubClientSecret !== ''
) {
options.push({
key: 'GitHubClientSecret',
value: inputs.GitHubClientSecret,
});
}
if (options.length > 0) {
await updateOptions(options);
}
@@ -319,44 +347,74 @@ const SystemSetting = () => {
const submitOIDCSettings = async () => {
if (inputs['oidc.well_known'] !== '') {
if (!inputs['oidc.well_known'].startsWith('http://') && !inputs['oidc.well_known'].startsWith('https://')) {
if (
!inputs['oidc.well_known'].startsWith('http://') &&
!inputs['oidc.well_known'].startsWith('https://')
) {
showError('Well-Known URL 必须以 http:// 或 https:// 开头');
return;
}
try {
const res = await API.get(inputs['oidc.well_known']);
inputs['oidc.authorization_endpoint'] = res.data['authorization_endpoint'];
inputs['oidc.authorization_endpoint'] =
res.data['authorization_endpoint'];
inputs['oidc.token_endpoint'] = res.data['token_endpoint'];
inputs['oidc.user_info_endpoint'] = res.data['userinfo_endpoint'];
showSuccess('获取 OIDC 配置成功！');
} catch (err) {
console.error(err);
showError("获取 OIDC 配置失败，请检查网络状况和 Well-Known URL 是否正确");
showError(
'获取 OIDC 配置失败，请检查网络状况和 Well-Known URL 是否正确',
);
return;
}
}
const options = [];
if (originInputs['oidc.well_known'] !== inputs['oidc.well_known']) {
options.push({ key: 'oidc.well_known', value: inputs['oidc.well_known'] });
options.push({
key: 'oidc.well_known',
value: inputs['oidc.well_known'],
});
}
if (originInputs['oidc.client_id'] !== inputs['oidc.client_id']) {
options.push({ key: 'oidc.client_id', value: inputs['oidc.client_id'] });
}
if (originInputs['oidc.client_secret'] !== inputs['oidc.client_secret'] && inputs['oidc.client_secret'] !== '') {
options.push({ key: 'oidc.client_secret', value: inputs['oidc.client_secret'] });
if (
originInputs['oidc.client_secret'] !== inputs['oidc.client_secret'] &&
inputs['oidc.client_secret'] !== ''
) {
options.push({
key: 'oidc.client_secret',
value: inputs['oidc.client_secret'],
});
}
if (originInputs['oidc.authorization_endpoint'] !== inputs['oidc.authorization_endpoint']) {
options.push({ key: 'oidc.authorization_endpoint', value: inputs['oidc.authorization_endpoint'] });
if (
originInputs['oidc.authorization_endpoint'] !==
inputs['oidc.authorization_endpoint']
) {
options.push({
key: 'oidc.authorization_endpoint',
value: inputs['oidc.authorization_endpoint'],
});
}
if (originInputs['oidc.token_endpoint'] !== inputs['oidc.token_endpoint']) {
options.push({ key: 'oidc.token_endpoint', value: inputs['oidc.token_endpoint'] });
options.push({
key: 'oidc.token_endpoint',
value: inputs['oidc.token_endpoint'],
});
}
if (originInputs['oidc.user_info_endpoint'] !== inputs['oidc.user_info_endpoint']) {
options.push({ key: 'oidc.user_info_endpoint', value: inputs['oidc.user_info_endpoint'] });
if (
originInputs['oidc.user_info_endpoint'] !==
inputs['oidc.user_info_endpoint']
) {
options.push({
key: 'oidc.user_info_endpoint',
value: inputs['oidc.user_info_endpoint'],
});
}
if (options.length > 0) {
await updateOptions(options);
}
@@ -365,21 +423,27 @@ const SystemSetting = () => {
const submitTelegramSettings = async () => {
const options = [
{ key: 'TelegramBotToken', value: inputs.TelegramBotToken },
{ key: 'TelegramBotName', value: inputs.TelegramBotName }
{ key: 'TelegramBotName', value: inputs.TelegramBotName },
];
await updateOptions(options);
};
const submitTurnstile = async () => {
const options = [];
if (originInputs['TurnstileSiteKey'] !== inputs.TurnstileSiteKey) {
options.push({ key: 'TurnstileSiteKey', value: inputs.TurnstileSiteKey });
}
if (originInputs['TurnstileSecretKey'] !== inputs.TurnstileSecretKey && inputs.TurnstileSecretKey !== '') {
options.push({ key: 'TurnstileSecretKey', value: inputs.TurnstileSecretKey });
if (
originInputs['TurnstileSecretKey'] !== inputs.TurnstileSecretKey &&
inputs.TurnstileSecretKey !== ''
) {
options.push({
key: 'TurnstileSecretKey',
value: inputs.TurnstileSecretKey,
});
}
if (options.length > 0) {
await updateOptions(options);
}
@@ -387,14 +451,20 @@ const SystemSetting = () => {
const submitLinuxDOOAuth = async () => {
const options = [];
if (originInputs['LinuxDOClientId'] !== inputs.LinuxDOClientId) {
options.push({ key: 'LinuxDOClientId', value: inputs.LinuxDOClientId });
}
if (originInputs['LinuxDOClientSecret'] !== inputs.LinuxDOClientSecret && inputs.LinuxDOClientSecret !== '') {
options.push({ key: 'LinuxDOClientSecret', value: inputs.LinuxDOClientSecret });
if (
originInputs['LinuxDOClientSecret'] !== inputs.LinuxDOClientSecret &&
inputs.LinuxDOClientSecret !== ''
) {
options.push({
key: 'LinuxDOClientSecret',
value: inputs.LinuxDOClientSecret,
});
}
if (options.length > 0) {
await updateOptions(options);
}
@@ -402,7 +472,7 @@ const SystemSetting = () => {
const handleCheckboxChange = async (optionKey, event) => {
const value = event.target.checked;
if (optionKey === 'PasswordLoginEnabled' && !value) {
setShowPasswordLoginConfirmModal(true);
} else {
@@ -450,7 +520,9 @@ const SystemSetting = () => {
</a>
）
</Text>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Input
field='WorkerUrl'
@@ -474,7 +546,9 @@ const SystemSetting = () => {
<Text>
（当前仅支持易支付接口，默认使用上方服务器地址作为回调地址！）
</Text>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={8} lg={8} xl={8}>
<Form.Input
field='PayAddress'
@@ -535,7 +609,9 @@ const SystemSetting = () => {
</Form.Section>
<Form.Section text='配置登录注册'>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Checkbox
field='PasswordLoginEnabled'
@@ -567,7 +643,9 @@ const SystemSetting = () => {
<Form.Checkbox
field='RegisterEnabled'
noLabel
onChange={(e) => handleCheckboxChange('RegisterEnabled', e)}
onChange={(e) =>
handleCheckboxChange('RegisterEnabled', e)
}
>
允许新用户注册
</Form.Checkbox>
@@ -631,7 +709,9 @@ const SystemSetting = () => {
<Form.Section text='配置邮箱域名白名单'>
<Text>用以防止恶意用户利用临时邮箱批量注册</Text>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Checkbox
field='EmailDomainRestrictionEnabled'
@@ -671,7 +751,9 @@ const SystemSetting = () => {
<Form.Section text='配置 SMTP'>
<Text>用以支持系统的邮件发送</Text>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={8} lg={8} xl={8}>
<Form.Input field='SMTPServer' label='SMTP 服务器地址' />
</Col>
@@ -701,7 +783,9 @@ const SystemSetting = () => {
<Form.Checkbox
field='SMTPSSLEnabled'
noLabel
onChange={(e) => handleCheckboxChange('SMTPSSLEnabled', e)}
onChange={(e) =>
handleCheckboxChange('SMTPSSLEnabled', e)
}
>
启用SMTP SSL
</Form.Checkbox>
@@ -711,14 +795,22 @@ const SystemSetting = () => {
</Form.Section>
<Form.Section text='配置 OIDC'>
<Text>用以支持通过 OIDC 登录，例如 Okta、Auth0 等兼容 OIDC 协议的 IdP</Text>
<Text>
用以支持通过 OIDC 登录，例如 Okta、Auth0 等兼容 OIDC 协议的
IdP
</Text>
<Banner
type='info'
description={`主页链接填 ${inputs.ServerAddress ? inputs.ServerAddress : '网站地址'}，重定向 URL 填 ${inputs.ServerAddress ? inputs.ServerAddress : '网站地址'}/oauth/oidc`}
style={{ marginBottom: 20, marginTop: 16 }}
/>
<Text>若你的 OIDC Provider 支持 Discovery Endpoint，你可以仅填写 OIDC Well-Known URL，系统会自动获取 OIDC 配置</Text>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Text>
若你的 OIDC Provider 支持 Discovery Endpoint，你可以仅填写
OIDC Well-Known URL，系统会自动获取 OIDC 配置
</Text>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Input
field='oidc.well_known'
@@ -734,7 +826,9 @@ const SystemSetting = () => {
/>
</Col>
</Row>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Input
field='oidc.client_secret'
@@ -751,7 +845,9 @@ const SystemSetting = () => {
/>
</Col>
</Row>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Input
field='oidc.token_endpoint'
@@ -777,9 +873,14 @@ const SystemSetting = () => {
description={`Homepage URL 填 ${inputs.ServerAddress ? inputs.ServerAddress : '网站地址'}，Authorization callback URL 填 ${inputs.ServerAddress ? inputs.ServerAddress : '网站地址'}/oauth/github`}
style={{ marginBottom: 20, marginTop: 16 }}
/>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Input field='GitHubClientId' label='GitHub Client ID' />
<Form.Input
field='GitHubClientId'
label='GitHub Client ID'
/>
</Col>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Input
@@ -801,7 +902,11 @@ const SystemSetting = () => {
href='https://connect.linux.do/'
target='_blank'
rel='noreferrer'
style={{ display: 'inline-block', marginLeft: 4, marginRight: 4 }}
style={{
display: 'inline-block',
marginLeft: 4,
marginRight: 4,
}}
>
点击此处
</a>
@@ -812,10 +917,12 @@ const SystemSetting = () => {
description={`回调 URL 填 ${inputs.ServerAddress ? inputs.ServerAddress : '网站地址'}/oauth/linuxdo`}
style={{ marginBottom: 20, marginTop: 16 }}
/>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Input
field='LinuxDOClientId'
<Form.Input
field='LinuxDOClientId'
label='Linux DO Client ID'
placeholder='输入你注册的 LinuxDO OAuth APP 的 ID'
/>
@@ -835,7 +942,9 @@ const SystemSetting = () => {
</Form.Section>
<Form.Section text='配置 WeChat Server'>
<Text>用以支持通过微信进行登录注册</Text>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={8} lg={8} xl={8}>
<Form.Input
field='WeChatServerAddress'
@@ -861,7 +970,9 @@ const SystemSetting = () => {
</Form.Section>
<Form.Section text='配置 Telegram 登录'>
<Text>用以支持通过 Telegram 进行登录注册</Text>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Input
field='TelegramBotToken'
@@ -883,7 +994,9 @@ const SystemSetting = () => {
</Form.Section>
<Form.Section text='配置 Turnstile'>
<Text>用以支持用户校验</Text>
<Row gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}>
<Row
gutter={{ xs: 8, sm: 16, md: 24, lg: 24, xl: 24, xxl: 24 }}
>
<Col xs={24} sm={24} md={12} lg={12} xl={12}>
<Form.Input
field='TurnstileSiteKey'
@@ -901,17 +1014,17 @@ const SystemSetting = () => {
</Row>
<Button onClick={submitTurnstile}>保存 Turnstile 设置</Button>
</Form.Section>
<Modal
title="确认取消密码登录"
title='确认取消密码登录'
visible={showPasswordLoginConfirmModal}
onOk={handlePasswordLoginConfirm}
onCancel={() => {
setShowPasswordLoginConfirmModal(false);
formApiRef.current.setValue('PasswordLoginEnabled', true);
}}
okText="确认"
cancelText="取消"
okText='确认'
cancelText='取消'
>
<p>您确定要取消密码登录功能吗？这可能会影响用户的登录方式。</p>
</Modal>
@@ -919,12 +1032,19 @@ const SystemSetting = () => {
)}
</Form>
) : (
<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100vh' }}>
<Spin size="large" />
<div
style={{
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
height: '100vh',
}}
>
<Spin size='large' />
</div>
)}
</div>
);
};
export default SystemSetting;
export default SystemSetting;