zy-react-library/components/Page/index.js

51 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 = "关闭",
contentPadding = "20px",
customActionButtons,
extraActionButtons,
} = props;
return (
<div className="page">
{(isShowAllAction && isShowHeader) && <HeaderBack title={headerTitle} history={history} previous={headerPrevious} />}
<div style={{ padding: contentPadding }}>
{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;