feat(Page): 添加loading状态支持

master
LiuJiaNan 2026-06-01 08:28:26 +08:00
parent 2b19504196
commit 24d8ddcee5
2 changed files with 27 additions and 22 deletions

View File

@ -16,6 +16,8 @@ export interface PageProps {
isShowFooter?: boolean; isShowFooter?: boolean;
/** 是否显示头部和底部组件,默认 true */ /** 是否显示头部和底部组件,默认 true */
isShowAllAction?: boolean; isShowAllAction?: boolean;
/** 是否处于加载状态,默认 false */
loading?: boolean;
/** 取消按钮文字,默认 "关闭" */ /** 取消按钮文字,默认 "关闭" */
backButtonText?: string; backButtonText?: string;
/** 内容区域的padding默认 "20px" */ /** 内容区域的padding默认 "20px" */

View File

@ -1,4 +1,4 @@
import { Button, Space } from "antd"; import { Button, Space, Spin } from "antd";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { throttle } from "throttle-debounce"; import { throttle } from "throttle-debounce";
import HeaderBack from "../HeaderBack"; import HeaderBack from "../HeaderBack";
@ -14,6 +14,7 @@ function Page(props) {
headerPrevious = true, headerPrevious = true,
isShowFooter = true, isShowFooter = true,
isShowAllAction = true, isShowAllAction = true,
loading = false,
backButtonText = "关闭", backButtonText = "关闭",
contentPadding = "20px", contentPadding = "20px",
customActionButtons, customActionButtons,
@ -47,6 +48,7 @@ function Page(props) {
}, [isShowAllAction, isShowFooter]); }, [isShowAllAction, isShowFooter]);
return ( return (
<Spin spinning={loading}>
<div className="page-layout" id="page-layout"> <div className="page-layout" id="page-layout">
{(isShowAllAction && isShowHeader) && <HeaderBack title={headerTitle} history={history} previous={headerPrevious} />} {(isShowAllAction && isShowHeader) && <HeaderBack title={headerTitle} history={history} previous={headerPrevious} />}
<div style={{ padding: contentPadding }}> <div style={{ padding: contentPadding }}>
@ -70,6 +72,7 @@ function Page(props) {
} }
</div> </div>
</div> </div>
</Spin>
); );
} }