添加全局loading

This commit is contained in:
hanhh 2021-09-18 15:08:45 +08:00
parent 955875cb7a
commit c0b4a70aa0
4 changed files with 35 additions and 21 deletions

View File

@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import ProLayout from '@ant-design/pro-layout'; import ProLayout, { PageLoading } from '@ant-design/pro-layout';
import { import {
enable as enableDarkMode, enable as enableDarkMode,
disable as disableDarkMode, disable as disableDarkMode,
@ -89,7 +89,9 @@ export default function (props: any) {
!navigator.userAgent.includes('Chrome'); !navigator.userAgent.includes('Chrome');
const isQQBrowser = navigator.userAgent.includes('QQBrowser'); const isQQBrowser = navigator.userAgent.includes('QQBrowser');
return ( return loading ? (
<PageLoading />
) : (
<ProLayout <ProLayout
selectedKeys={[props.location.pathname]} selectedKeys={[props.location.pathname]}
loading={loading} loading={loading}

View File

@ -19,6 +19,7 @@ const Config = ({ headerStyle, isPhone, theme }: any) => {
const [select, setSelect] = useState('config.sh'); const [select, setSelect] = useState('config.sh');
const [data, setData] = useState<any[]>([]); const [data, setData] = useState<any[]>([]);
const editorRef = useRef<any>(null); const editorRef = useRef<any>(null);
const [confirmLoading, setConfirmLoading] = useState(false);
const getConfig = (name: string) => { const getConfig = (name: string) => {
request.get(`${config.apiPrefix}configs/${name}`).then((data: any) => { request.get(`${config.apiPrefix}configs/${name}`).then((data: any) => {
@ -37,6 +38,7 @@ const Config = ({ headerStyle, isPhone, theme }: any) => {
}; };
const updateConfig = () => { const updateConfig = () => {
setConfirmLoading(true);
const content = editorRef.current const content = editorRef.current
? editorRef.current.getValue().replace(/\r\n/g, '\n') ? editorRef.current.getValue().replace(/\r\n/g, '\n')
: value; : value;
@ -47,6 +49,7 @@ const Config = ({ headerStyle, isPhone, theme }: any) => {
}) })
.then((data: any) => { .then((data: any) => {
message.success(data.message); message.success(data.message);
setConfirmLoading(false);
}); });
}; };
@ -76,7 +79,12 @@ const Config = ({ headerStyle, isPhone, theme }: any) => {
defaultValue="config.sh" defaultValue="config.sh"
onSelect={onSelect} onSelect={onSelect}
/>, />,
<Button key="1" type="primary" onClick={updateConfig}> <Button
key="1"
loading={confirmLoading}
type="primary"
onClick={updateConfig}
>
</Button>, </Button>,
]} ]}

View File

@ -141,6 +141,7 @@ const Script = ({ headerStyle, isPhone, theme }: any) => {
const content = editorRef.current const content = editorRef.current
? editorRef.current.getValue().replace(/\r\n/g, '\n') ? editorRef.current.getValue().replace(/\r\n/g, '\n')
: value; : value;
return new Promise((resolve) => {
request request
.put(`${config.apiPrefix}scripts`, { .put(`${config.apiPrefix}scripts`, {
data: { data: {
@ -156,6 +157,8 @@ const Script = ({ headerStyle, isPhone, theme }: any) => {
} else { } else {
message.error(_data); message.error(_data);
} }
resolve(null);
});
}); });
}, },
onCancel() { onCancel() {

View File

@ -1,9 +1,10 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { Typography, Input, Form, Button, Spin, message } from 'antd'; import { Typography, Input, Form, Button, message } from 'antd';
import { request } from '@/utils/http'; import { request } from '@/utils/http';
import config from '@/utils/config'; import config from '@/utils/config';
import { history } from 'umi'; import { history } from 'umi';
import QRCode from 'qrcode.react'; import QRCode from 'qrcode.react';
import { PageLoading } from '@ant-design/pro-layout';
const { Title, Link } = Typography; const { Title, Link } = Typography;
@ -146,7 +147,7 @@ const SecuritySettings = ({ user, userChange }: any) => {
</Button> </Button>
</div> </div>
) : ( ) : (
<Spin /> <PageLoading />
)} )}
</> </>
) : ( ) : (