优化FormBuilder

src/components/FormBuilder/FormBuilder.js

@@ -1,5 +1,6 @@
 import { Button, Col, Form, message, Row, Space, Spin } from "antd";
 import { useEffect, useState } from "react";
+import { throttle } from "throttle-debounce";
 import FormItemsRenderer from "./FormItemsRenderer";
 
 /**
@@ -26,12 +27,12 @@ const FormBuilder = (props) => {
 
   const [pageWidth, setPageWidth] = useState(window.innerWidth);
 
-  const getPageWidth = () => {
-    const pageDom = document.querySelector("#page");
+  const getPageWidth = throttle(50, () => {
+    const pageDom = document.querySelector("#page-layout");
     if (!pageDom)
       return;
     setPageWidth(pageDom.offsetWidth);
-  };
+  });
 
   useEffect(() => {
     const timer = setTimeout(() => {
@@ -77,7 +78,7 @@ const FormBuilder = (props) => {
           />
         </Row>
         {showActionButtons && (
-          <>
+          <div style={{ position: "relative", zIndex: "9" }}>
             <div style={{ height: "32px" }}></div>
             <Row
               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>
             </Row>
-          </>
+          </div>
         )}
       </Form>
     </Spin>