50 lines
1.3 KiB
JavaScript
50 lines
1.3 KiB
JavaScript
|
import { Button, Space } from "antd";
|
||
|
|
import HeaderBack from "../HeaderBack";
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 页面布局组件
|
||
|
|
*/
|
||
|
|
function Page(props) {
|
||
|
|
const {
|
||
|
|
headerTitle,
|
||
|
|
history,
|
||
|
|
isShowHeader = true,
|
||
|
|
headerPrevious = true,
|
||
|
|
isShowFooter = true,
|
||
|
|
isShowAllAction = true,
|
||
|
|
backButtonText = "关闭",
|
||
|
|
customActionButtons,
|
||
|
|
extraActionButtons,
|
||
|
|
} = props;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="page">
|
||
|
|
{(isShowAllAction && isShowHeader) && <HeaderBack title={headerTitle} history={history} previous={headerPrevious} />}
|
||
|
|
<div style={{ padding: 20 }}>
|
||
|
|
{props.children}
|
||
|
|
</div>
|
||
|
|
{
|
||
|
|
(isShowAllAction && isShowFooter) && (
|
||
|
|
<>
|
||
|
|
<div style={{ height: "52px" }}></div>
|
||
|
|
<div style={{ textAlign: "center", backgroundColor: "rgb(241, 241, 242)", margin: "0 -20px", padding: "10px 0", position: "fixed", bottom: "0", width: "100%" }}>
|
||
|
|
{customActionButtons || (
|
||
|
|
<Space>
|
||
|
|
{extraActionButtons}
|
||
|
|
<Button onClick={() => history?.goBack?.() || window.history.back()}>
|
||
|
|
{backButtonText}
|
||
|
|
</Button>
|
||
|
|
</Space>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
Page.displayName = "Page";
|
||
|
|
|
||
|
|
export default Page;
|