添加软件基础配置

This commit is contained in:
2024-10-18 12:46:58 +08:00
parent 9618ae6b14
commit 11a23c92df
21 changed files with 482 additions and 22 deletions
@@ -0,0 +1,101 @@
import { GetOptions, getOptionsStringValue, SaveOptions } from '@/services/services/options/optionsTool';
import { useOptionsStore } from '@/store/options';
import { useSoftStore } from '@/store/software';
import { Button, Card, Form, Input } from 'antd';
import TextArea from 'antd/es/input/TextArea';
import { message } from 'antd/lib';
import React, { useEffect } from 'react';
const BasicOptions: React.FC = () => {
const { setTopSpinning, setTopSpinTip } = useSoftStore();
const [messageApi, messageHolder] = message.useMessage();
const { laitoolOptions, setLaitoolOptions } = useOptionsStore();
const [form] = Form.useForm();
useEffect(() => {
setTopSpinning(true);
setTopSpinTip("加载信息中");
// 这边加载所有的配音数据
GetOptions("software").then((res) => {
setLaitoolOptions(res);
form.setFieldsValue({
LaitoolHomePage: getOptionsStringValue(res, 'LaitoolHomePage', ""),
LaitoolUpdateContent: getOptionsStringValue(res, 'LaitoolUpdateContent', ""),
LaitoolNotice: getOptionsStringValue(res, 'LaitoolNotice', ""),
LaitoolVersion: getOptionsStringValue(res, 'LaitoolVersion', ""),
});
}
).catch((err: any) => {
messageApi.error(err.message);
}).finally(() => {
console.log('finally');
setTopSpinning(false);
});
}, []);
async function onFinish(values: any): Promise<void> {
setTopSpinning(true);
setTopSpinTip("正在保存通用设置");
try {
// 这边保存所有的配音数据
await SaveOptions(values);
// 判断Option中的key是不是在属性上
for (let key in values) {
setLaitoolOptions(laitoolOptions.map((item: OptionModel.Option) => {
if (item.key === key) {
item.value = values[key]
}
return item
}));
}
messageApi.success('设置成功');
} catch (error: any) {
messageApi.error(error.message);
} finally {
setTopSpinning(false);
}
}
return (
<div>
<Card title="通用设置" bordered={false}>
<Form name="trigger" form={form} layout="vertical" autoComplete="off" onFinish={onFinish}>
<Form.Item
label="软件版本号"
name="LaitoolVersion"
>
<Input placeholder='请输入版本号' />
</Form.Item>
<Form.Item
label="首页内容"
name="LaitoolHomePage"
>
<TextArea autoSize={{ minRows: 3, maxRows: 6 }} placeholder="支持HTML和网址,网址用iframe,可以内嵌所有的网页" />
</Form.Item>
<Form.Item
label="更新内容"
name="LaitoolUpdateContent"
>
<TextArea autoSize={{ minRows: 3, maxRows: 6 }} placeholder="支持HTML和网址,网址用iframe" />
</Form.Item>
<Form.Item
label="通知"
name="LaitoolNotice"
>
<TextArea autoSize={{ minRows: 3, maxRows: 6 }} placeholder="支持HTML和网址,网址用iframe" />
</Form.Item>
<Form.Item>
<Button color="primary" variant="filled" htmlType="submit"></Button>
</Form.Item>
</Form>
</Card>
{messageHolder}
</div>
);
};
export default BasicOptions;
@@ -0,0 +1,64 @@
import { getOptionsStringValue, SaveOptions } from '@/services/services/options/optionsTool';
import { useOptionsStore } from '@/store/options';
import { useSoftStore } from '@/store/software';
import { Button, Card, Col, Form, Input, message, Row } from 'antd';
import TextArea from 'antd/es/input/TextArea';
import React, { useEffect } from 'react';
const DubSettingTTsOptions: React.FC = () => {
const [form] = Form.useForm();
const { ttsOptions, setTTsOptions } = useOptionsStore();
const { topSpinning, setTopSpinning, topSpinTip, setTopSpinTip } = useSoftStore();
const [messageApi, messageHolder] = message.useMessage();
async function onFinish(values: any): Promise<void> {
console.log('Received values of form: ', values);
setTopSpinning(true);
setTopSpinTip("正在保存EdgeTTs配置");
try {
await SaveOptions(values);
setTTsOptions(ttsOptions.map((item: OptionModel.Option) => {
if (item.key === "EdgeTTsRoles") {
item.value = values.edgeTTsRoles
}
return item
}));
messageApi.success('设置成功');
} catch (error: any) {
messageApi.error(error.message);
} finally {
setTopSpinning(false);
}
}
useEffect(() => {
console.log("DubSettingTTsOptions", ttsOptions)
form.setFieldsValue({ edgeTTsRoles: getOptionsStringValue(ttsOptions, 'EdgeTTsRoles', "{}") })
}, [ttsOptions])
return (
<Card title="配置" >
<Form form={form} name="advanced_search" onFinish={onFinish} layout="vertical">
<Row gutter={24}>
<Col span={8}>
<Form.Item
label="语音合成角色"
name="edgeTTsRoles"
>
<TextArea placeholder="请输入EdgeTTs合成角色,JSON格式" autoSize={{ minRows: 6, maxRows: 6 }} />
</Form.Item>
</Col>
</Row>
<Form.Item wrapperCol={{ offset: 0, span: 16 }}>
<Button color="primary" variant="filled" htmlType="submit">
EdgeTTs配置
</Button>
</Form.Item>
</Form>
{messageHolder}
</Card>
);
};
export default DubSettingTTsOptions;
@@ -0,0 +1,51 @@
import { Card, Collapse, CollapseProps, Form } from 'antd';
import React, { useEffect } from 'react';
import DubSettingTTsOptions from './DubSettingTTsOptions';
import { useOptionsStore } from '@/store/options';
import { useSoftStore } from '@/store/software';
import { GetOptions } from '@/services/services/options/optionsTool';
const DubSetting: React.FC = () => {
const { ttsOptions, setTTsOptions } = useOptionsStore();
const { setTopSpinning, setTopSpinTip } = useSoftStore();
const onChange = (key: string | string[]) => {
console.log(key);
};
useEffect(() => {
setTopSpinning(true);
setTopSpinTip("加载信息中");
// 这边加载所有的配音数据
GetOptions('tts').then((res) => {
setTTsOptions(res);
}
).catch((err) => {
console.log(err);
}).finally(() => {
console.log('finally');
setTopSpinning(false);
});
}, []);
const items: CollapseProps['items'] = [
{
key: '1',
label: '配置',
children: <p></p>,
},
{
key: '2',
label: <strong>Edge TTS</strong>,
children: <DubSettingTTsOptions />,
},
];
return (
<Collapse items={items} bordered={false} ghost onChange={onChange} />
);
};
export default DubSetting;
@@ -0,0 +1,38 @@
import TemplateContainer from '@/pages/TemplateContainer';
import { useModel } from '@umijs/max';
import { Tabs, TabsProps, theme } from 'antd';
import React from 'react';
import DubSetting from '../DubSetting';
import BasicOptions from '../BasicOptions';
const LaitoolOptions: React.FC = () => {
const { initialState } = useModel('@@initialState');
const [tabKey, setTabKey] = React.useState<string | undefined>(undefined);
const items = [{
label: `软件设置`,
key: "software",
children: <BasicOptions />,
style: undefined,
}, {
label: `配音设置`,
key: "dub",
children: <DubSetting />,
style: undefined,
destroyInactiveTabPane : true
}]
const onChange = (key: string) => {
setTabKey(key);
};
return (
<TemplateContainer title={false} navTheme={initialState?.settings?.navTheme ?? "realDark"}>
<Tabs defaultActiveKey="1" destroyInactiveTabPane={true} items={items} onChange={onChange} />
</TemplateContainer>
);
};
export default LaitoolOptions;
@@ -115,7 +115,7 @@ const PromptManagement: React.FC = () => {
width: 220,
render: (dom, ent) => <>
<Button size='middle' style={{ marginRight: "5px" }} type="primary" onClick={() => {
debugger
setEditData(ent)
setType("edit")
setOpen(true)
+4 -3
View File
@@ -1,4 +1,4 @@
import React from 'react';
import React, { useEffect } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { Card, Spin } from 'antd';
import { useSoftStore } from '@/store/software';
@@ -7,9 +7,10 @@ interface TemplateContainerProps {
children: React.ReactNode;
navTheme: string;
style?: React.CSSProperties;
title?: React.ReactNode | false;
}
const TemplateContainer: React.FC<TemplateContainerProps> = ({ children, navTheme, style }) => {
const TemplateContainer: React.FC<TemplateContainerProps> = ({ children, navTheme, style, title }) => {
const { topSpinning, topSpinTip } = useSoftStore();
@@ -20,7 +21,7 @@ const TemplateContainer: React.FC<TemplateContainerProps> = ({ children, navThem
return (
<Spin spinning={topSpinning} tip={topSpinTip}>
<PageContainer>
<PageContainer title={title}>
<Card
style={{
...style,
-2
View File
@@ -27,8 +27,6 @@ const UserManagement: React.FC = () => {
totalBoundaryShowSizeChanger: true,
},
});
const [modal, contextHolder] = Modal.useModal();
const [loading, setLoading] = useState<boolean>(true);
const [userId, setUserId] = useState<number>(0);
const [openModal, setOpenModal] = useState<boolean>(false);