Skip to content

phsl / new-api

Go to a project
Commit c04a4808 by QuentinHsu
Options

refactor: 运营设置-日志设置

parent 92cdf9c7
Showing with 165 additions and 52 deletions
web/package.json
...@@ -5,11 +5,12 @@ ...@@ -5,11 +5,12 @@
"type": "module", "type": "module",
"dependencies": { "dependencies": {
"@douyinfe/semi-icons": "^2.46.1", "@douyinfe/semi-icons": "^2.46.1",
"@douyinfe/semi-ui": "^2.46.1", "@douyinfe/semi-ui": "^2.55.3",
"@visactor/react-vchart": "~1.8.8", "@visactor/react-vchart": "~1.8.8",
"@visactor/vchart": "~1.8.8", "@visactor/vchart": "~1.8.8",
"@visactor/vchart-semi-theme": "~1.8.8", "@visactor/vchart-semi-theme": "~1.8.8",
"axios": "^0.27.2", "axios": "^0.27.2",
"dayjs": "^1.11.11",
"history": "^5.3.0", "history": "^5.3.0",
"marked": "^4.1.1", "marked": "^4.1.1",
"react": "^18.2.0", "react": "^18.2.0",
......
web/src/components/OperationSetting.js
...@@ -4,6 +4,7 @@ import { Card } from '@douyinfe/semi-ui'; ...@@ -4,6 +4,7 @@ import { Card } from '@douyinfe/semi-ui';
import SettingsGeneral from '../pages/Setting/Operation/SettingsGeneral.js'; import SettingsGeneral from '../pages/Setting/Operation/SettingsGeneral.js';
import SettingsDrawing from '../pages/Setting/Operation/SettingsDrawing.js'; import SettingsDrawing from '../pages/Setting/Operation/SettingsDrawing.js';
import SettingsSensitiveWords from '../pages/Setting/Operation/SettingsSensitiveWords.js'; import SettingsSensitiveWords from '../pages/Setting/Operation/SettingsSensitiveWords.js';
import SettingsLog from '../pages/Setting/Operation/SettingsLog.js';
import { import {
API, API,
...@@ -34,19 +35,19 @@ const OperationSetting = () => { ...@@ -34,19 +35,19 @@ const OperationSetting = () => {
AutomaticDisableChannelEnabled: '', AutomaticDisableChannelEnabled: '',
AutomaticEnableChannelEnabled: '', AutomaticEnableChannelEnabled: '',
ChannelDisableThreshold: 0, ChannelDisableThreshold: 0,
LogConsumeEnabled: '', LogConsumeEnabled: false,
DisplayInCurrencyEnabled: false, DisplayInCurrencyEnabled: false,
DisplayTokenStatEnabled: false, DisplayTokenStatEnabled: false,
CheckSensitiveEnabled: '', CheckSensitiveEnabled: false,
CheckSensitiveOnPromptEnabled: '', CheckSensitiveOnPromptEnabled: false,
CheckSensitiveOnCompletionEnabled: '', CheckSensitiveOnCompletionEnabled: '',
StopOnSensitiveEnabled: '', StopOnSensitiveEnabled: '',
SensitiveWords: '', SensitiveWords: '',
MjNotifyEnabled: '', MjNotifyEnabled: false,
MjAccountFilterEnabled: '', MjAccountFilterEnabled: false,
MjModeClearEnabled: '', MjModeClearEnabled: false,
MjForwardUrlEnabled: '', MjForwardUrlEnabled: false,
DrawingEnabled: '', DrawingEnabled: false,
DataExportEnabled: '', DataExportEnabled: '',
DataExportDefaultTime: 'hour', DataExportDefaultTime: 'hour',
DataExportInterval: 5, DataExportInterval: 5,
...@@ -223,19 +224,6 @@ const OperationSetting = () => { ...@@ -223,19 +224,6 @@ const OperationSetting = () => {
break; break;
} }
}; };
const deleteHistoryLogs = async () => {
console.log(inputs);
const res = await API.delete(
`/api/log/?target_timestamp=${Date.parse(historyTimestamp) / 1000}`,
);
const { success, message, data } = res.data;
if (success) {
showSuccess(`${data} 条日志已清理！`);
return;
}
showError('日志清理失败：' + message);
};
return ( return (
<> <>
{/* 通用设置 */} {/* 通用设置 */}
...@@ -250,6 +238,10 @@ const OperationSetting = () => { ...@@ -250,6 +238,10 @@ const OperationSetting = () => {
<Card style={{ marginTop: '10px' }}> <Card style={{ marginTop: '10px' }}>
<SettingsSensitiveWords options={inputs} /> <SettingsSensitiveWords options={inputs} />
</Card> </Card>
{/* 日志设置 */}
<Card style={{ marginTop: '10px' }}>
<SettingsLog options={inputs} />
</Card>
<Grid columns={1}> <Grid columns={1}>
<Grid.Column> <Grid.Column>
<Form loading={loading} inverted={isDark}> <Form loading={loading} inverted={isDark}>
...@@ -274,36 +266,6 @@ const OperationSetting = () => { ...@@ -274,36 +266,6 @@ const OperationSetting = () => {
{/*</Form.Group>*/} {/*</Form.Group>*/}
<Header as='h3' inverted={isDark}> <Header as='h3' inverted={isDark}>
日志设置
</Header>
<Form.Group inline>
<Form.Checkbox
checked={inputs.LogConsumeEnabled === 'true'}
label='启用额度消费日志记录'
name='LogConsumeEnabled'
onChange={handleInputChange}
/>
</Form.Group>
<Form.Group widths={4}>
<Form.Input
label='目标时间'
value={historyTimestamp}
type='datetime-local'
name='history_timestamp'
onChange={(e, { name, value }) => {
setHistoryTimestamp(value);
}}
/>
</Form.Group>
<Form.Button
onClick={() => {
deleteHistoryLogs().then();
}}
>
清理历史日志
</Form.Button>
<Divider />
<Header as='h3' inverted={isDark}>
数据看板 数据看板
</Header> </Header>
<Form.Checkbox <Form.Checkbox
......
web/src/pages/Setting/Operation/SettingsLog.js 0 → 100644
import React, { useEffect, useState, useRef } from 'react';
import { Button, Col, Form, Row, Spin, DatePicker } from '@douyinfe/semi-ui';
import dayjs from 'dayjs';
import {
compareObjects,
API,
showError,
showSuccess,
showWarning,
} from '../../../helpers';
export default function SettingsLog(props) {
const [loading, setLoading] = useState(false);
const [loadingCleanHistoryLog, setLoadingCleanHistoryLog] = useState(false);
const [inputs, setInputs] = useState({
LogConsumeEnabled: false,
historyTimestamp: dayjs().subtract(1, 'month').toDate(),
});
// const [historyTimestamp, setHistoryTimestamp] = useState(
// dayjs().subtract(1, 'month').toDate(),
// );
const refForm = useRef();
const [inputsRow, setInputsRow] = useState(inputs);
function onSubmit() {
const updateArray = compareObjects(inputs, inputsRow).filter(
(item) => item.key !== 'historyTimestamp',
);
if (!updateArray.length) return showWarning('你似乎并没有修改什么');
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('部分更新失败');
}
showSuccess('更新成功');
})
.catch(() => {
showError('更新失败');
})
.finally(() => {
setLoading(false);
setInputsRow(structuredClone(inputs));
});
}
async function onCleanHistoryLog() {
try {
setLoadingCleanHistoryLog(true);
if (!inputs.historyTimestamp) throw new Error('请选择日志记录时间');
const res = await API.delete(
`/api/log/?target_timestamp=${Date.parse(inputs.historyTimestamp) / 1000}`,
);
const { success, message, data } = res.data;
if (success) {
showSuccess(`${data} 条日志已清理！`);
return;
} else {
throw new Error('日志清理失败：' + message);
}
} catch (error) {
showError(error.message);
} finally {
setLoadingCleanHistoryLog(false);
}
}
useEffect(() => {
const currentInputs = {};
for (let key in props.options) {
if (Object.keys(inputs).includes(key)) {
currentInputs[key] = props.options[key];
}
}
currentInputs['historyTimestamp'] = inputs.historyTimestamp;
setInputs(Object.assign(inputs, currentInputs));
setInputsRow(structuredClone(currentInputs));
refForm.current.setValues(currentInputs);
}, [props.options]);
return (
<>
<Spin spinning={loading}>
<Form
values={inputs}
getFormApi={(formAPI) => (refForm.current = formAPI)}
style={{ marginBottom: 15 }}
>
<Form.Section text={'日志设置'}>
<Row gutter={16}>
<Col span={8}>
<Form.Switch
field={'LogConsumeEnabled'}
label={'启用额度消费日志记录'}
size='large'
checkedText='｜'
uncheckedText='〇'
onChange={(value) => {
setInputs({
...inputs,
LogConsumeEnabled: value,
});
}}
/>
</Col>
<Col span={8}>
<Spin spinning={loadingCleanHistoryLog}>
<Form.DatePicker
label='日志记录时间'
field={'historyTimestamp'}
type='dateTime'
inputReadOnly={true}
onChange={(value) => {
setInputs({
...inputs,
historyTimestamp: value,
});
}}
/>
<Button size='default' onClick={onCleanHistoryLog}>
清除历史日志
</Button>
</Spin>
</Col>
</Row>
<Row>
<Button size='large' onClick={onSubmit}>
保存日志设置
</Button>
</Row>
</Form.Section>
</Form>
</Spin>
</>
);
}
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