优化FormBuilder

master
LiuJiaNan 2025-12-27 09:52:16 +08:00
parent 5d6da5c7d3
commit cf529ee0c9
1 changed files with 6 additions and 5 deletions

View File

@ -1,5 +1,6 @@
import { Button, Col, Form, message, Row, Space, Spin } from "antd"; import { Button, Col, Form, message, Row, Space, Spin } from "antd";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { throttle } from "throttle-debounce";
import FormItemsRenderer from "./FormItemsRenderer"; import FormItemsRenderer from "./FormItemsRenderer";
/** /**
@ -26,12 +27,12 @@ const FormBuilder = (props) => {
const [pageWidth, setPageWidth] = useState(window.innerWidth); const [pageWidth, setPageWidth] = useState(window.innerWidth);
const getPageWidth = () => { const getPageWidth = throttle(50, () => {
const pageDom = document.querySelector("#page"); const pageDom = document.querySelector("#page-layout");
if (!pageDom) if (!pageDom)
return; return;
setPageWidth(pageDom.offsetWidth); setPageWidth(pageDom.offsetWidth);
}; });
useEffect(() => { useEffect(() => {
const timer = setTimeout(() => { const timer = setTimeout(() => {
@ -77,7 +78,7 @@ const FormBuilder = (props) => {
/> />
</Row> </Row>
{showActionButtons && ( {showActionButtons && (
<> <div style={{ position: "relative", zIndex: "9" }}>
<div style={{ height: "32px" }}></div> <div style={{ height: "32px" }}></div>
<Row <Row
style={{ textAlign: "center", backgroundColor: "rgb(241, 241, 242)", padding: "10px 0", position: "fixed", bottom: "0", width: pageWidth, margin: "0 -44px" }} style={{ textAlign: "center", backgroundColor: "rgb(241, 241, 242)", padding: "10px 0", position: "fixed", bottom: "0", width: pageWidth, margin: "0 -44px" }}
@ -100,7 +101,7 @@ const FormBuilder = (props) => {
)} )}
</Col> </Col>
</Row> </Row>
</> </div>
)} )}
</Form> </Form>
</Spin> </Spin>