优化Signature

components/Signature/index.d.ts

@@ -16,6 +16,8 @@ export interface SignatureProps {
   width?: number;
   /** 签字区域高度，默认为 300 */
   height?: number;
+  /** 回显的签字图片 */
+  url?: string;
 }
 
 /**

components/Signature/index.js

@@ -1,6 +1,6 @@
 import { Button, Image, message, Modal } from "antd";
 import dayjs from "dayjs";
-import { useRef, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import SignatureCanvas from "react-signature-canvas";
 import { base642File } from "../../utils";
 
@@ -12,12 +12,16 @@ function Signature(props) {
     onConfirm,
     width = 752,
     height = 300,
+    url = "",
     ...restProps
   } = props;
 
   const [signatureModalOpen, setSignatureModalOpen] = useState(false);
   const signatureCanvas = useRef(null);
   const [base64, setBase64] = useState("");
+  useEffect(() => {
+    setBase64(url);
+  }, [url]);
 
   const onOk = () => {
     if (signatureCanvas.current.isEmpty()) {
@@ -49,7 +53,7 @@ function Signature(props) {
       </div>
       {base64 && (
         <div style={{ border: "1px dashed #d9d9d9", width, height, marginTop: 16 }}>
-          <Image src={base64} />
+          <Image src={base64} style={{ width, height, objectFit: "contain" }} />
         </div>
       )}
       <Modal