| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| import React, { useEffect, useState, useRef } from 'react'; |
| import { Button, Col, Form, Row, Spin } from '@douyinfe/semi-ui'; |
| import { useTranslation } from 'react-i18next'; |
| import { |
| compareObjects, |
| API, |
| showError, |
| showSuccess, |
| showWarning, |
| } from '../../../helpers'; |
|
|
| export default function SettingsCheckIn(props) { |
| const { t } = useTranslation(); |
| const [loading, setLoading] = useState(false); |
| const [inputs, setInputs] = useState({ |
| CheckInEnabled: false, |
| CheckInQuota: '', |
| CheckInMaxQuota: '', |
| }); |
| const refForm = useRef(); |
| const [inputsRow, setInputsRow] = useState(inputs); |
|
|
| useEffect(() => { |
| const currentInputs = {}; |
| for (let key in props.options) { |
| if (Object.keys(inputs).includes(key)) { |
| currentInputs[key] = props.options[key]; |
| } |
| } |
| setInputs(currentInputs); |
| setInputsRow(structuredClone(currentInputs)); |
| refForm.current.setValues(currentInputs); |
| }, [props.options]); |
|
|
| function handleFieldChange(fieldName) { |
| return (value) => { |
| setInputs((inputs) => ({ |
| ...inputs, |
| [fieldName]: typeof value === 'number' ? String(value) : value |
| })); |
| }; |
| } |
|
|
| function onSubmit() { |
| 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('部分保存失败，请重试')); |
| } |
| showSuccess(t('保存成功')); |
| props.refresh(); |
| }) |
| .catch(() => { |
| showError(t('保存失败，请重试')); |
| }) |
| .finally(() => { |
| setLoading(false); |
| }); |
| } |
|
|
| return ( |
| <> |
| <Spin spinning={loading}> |
| <Form |
| values={inputs} |
| getFormApi={(formAPI) => (refForm.current = formAPI)} |
| style={{ marginBottom: 15 }} |
| > |
| <Form.Section text={t('签到设置')}> |
| <Row gutter={16}> |
| <Col xs={24} sm={12} md={8} lg={8} xl={8}> |
| <Form.Switch |
| label={t('启用签到功能')} |
| field={'CheckInEnabled'} |
| onChange={handleFieldChange('CheckInEnabled')} |
| /> |
| </Col> |
| </Row> |
| <Row gutter={16}> |
| <Col xs={24} sm={12} md={8} lg={8} xl={8}> |
| <Form.InputNumber |
| label={t('每日签到额度')} |
| field={'CheckInQuota'} |
| step={100} |
| min={0} |
| suffix={'Token'} |
| extraText={t('每日签到可获得的固定额度，或随机额度的最小值')} |
| placeholder={t('例如：1000')} |
| onChange={handleFieldChange('CheckInQuota')} |
| /> |
| </Col> |
| <Col xs={24} sm={12} md={8} lg={8} xl={8}> |
| <Form.InputNumber |
| label={t('每日签到最高额度')} |
| field={'CheckInMaxQuota'} |
| step={100} |
| min={0} |
| suffix={'Token'} |
| extraText={t('可选。设置后，签到额度将在最小值和最高值之间随机')} |
| placeholder={t('例如：2000')} |
| onChange={handleFieldChange('CheckInMaxQuota')} |
| /> |
| </Col> |
| </Row> |
| <Row> |
| <Button size='default' onClick={onSubmit} style={{ marginBottom: 20 }}> |
| {t('保存签到设置')} |
| </Button> |
| </Row> |
| </Form.Section> |
| </Form> |
| </Spin> |
| </> |
| ); |
| } |
