fix

src/subpackages/pages/broker/invitation/poster/index.jsx

@@ -7,39 +7,46 @@ import { save2Album, base64ToFile } from "@/utils/image";
 import useCanvas from "./useCanvas";
 import "./style.scss";
 
-export default (props) => {
-  const {
-    show,
-    dataSource,
-    onClose,
-    onSuccess,
-  } = props;
+export default props => {
+  const { show, dataSource, onClose, onSuccess } = props;
 
   const [img, setImg] = useState();
   const [processing, setProcessing] = useState(false);
 
   const [canvasInited, setCanvasInited] = useState(false);
 
-  
   const posterRender = useRef();
 
-  useCanvas("canvas-broker-poster", (fn) => {
+  useCanvas("canvas-broker-poster", fn => {
     posterRender.current = fn;
     setCanvasInited(true);
   });
 
+  const Save = e => {
+    e.stopPropagation();
+    if (img) {
+      save2Album(img).then(() => {
+        Taro.showToast({ title: "保存成功", icon: "none" });
+      });
+
+    }
+  };
 
   useEffect(() => {
     if (dataSource && canvasInited) {
       const getPoster = posterRender.current;
       setProcessing(true);
       getPoster(dataSource)
-        .then((image) => {
-        
-          setImg(image);
+        .then(image => {
+       
+          base64ToFile(image.replace("data:image/jpeg;base64,", "")).then(
+            tmpFile => {
+              console.log(tmpFile, "tmpFiletmpFile");
+              setImg(tmpFile);
+            }
+          );
 
           setProcessing(false);
-       
         })
         .catch(() => {
           setProcessing(false);
@@ -59,7 +66,7 @@ export default (props) => {
                     src={img}
                     mode="scaleToFill"
                     className="centerLabel"
-                    onClick={(e) => e.stopPropagation()}
+                    onClick={e => e.stopPropagation()}
                   />
                 ) : (
                   <Spin2
@@ -68,15 +75,21 @@ export default (props) => {
                     size={32}
                   />
                 )}
-                
               </view>
             </view>
+            <view className="saveimg">
+              <text onClick={Save}>保存到手机</text>
+            </view>
           </view>
         </View>
       )}
 
-      <View style={{ width: "1px", height: "1px",overflow:'hidden' }}>
-        <Canvas type="2d" id="canvas-broker-poster" style={{width: '1px',height:'1px'}}/>
+      <View style={{ width: "1px", height: "1px", overflow: "hidden" }}>
+        <Canvas
+          type="2d"
+          id="canvas-broker-poster"
+          style={{ width: "1px", height: "1px" }}
+        />
       </View>
     </>
   );

src/subpackages/pages/broker/invitation/poster/style.scss

@@ -5,22 +5,23 @@
   left: 0;
   bottom: 0;
   z-index: 1000;
-  background: rgba(0, 0, 0, 0.6);
-  >view {
+  // background: #fff;
+  background: rgba(0, 0, 0, 0.8);
+  > view {
     width: 100%;
-    >view {
+    > view {
       padding: 0 70px;
       position: relative;
       overflow: hidden;
       text-align: center;
-      >.Img {
+      > .Img {
         width: 100%;
         position: relative;
         overflow: hidden;
         padding-bottom: 150%;
         background: #eee;
         border-radius: 24px;
-        >image {
+        image {
           width: 100%;
           height: 100%;
           // position: absolute;
@@ -28,7 +29,27 @@
           // top: 0;
         }
       }
-    
+    }
+    .saveimg {
+      position: relative;
+      overflow: hidden;
+      margin-top: 60px;
+      > text {
+        display: block;
+        font-size: 32px;
+        line-height: 92px;
+
+        font-weight: bold;
+        border-radius: 92px;
+        text-align: center;
+        // border: 2px solid #193c83;
+        background: #fff;
+        color: #193c83;
+        border-radius: 92px;
+        // width: 50%;
+        // max-width: 360px;
+        // margin: 0 40px;
+      }
     }
   }
 }
@@ -39,11 +60,11 @@
   height: 100%;
   box-sizing: border-box;
   padding: 200px 75px;
-z-index: 10;
+  z-index: 10;
   &-img-box {
     width: 100%;
     position: relative;
-    >view {
+    > view {
       width: 600px;
       position: relative;
       margin: 0 auto;
@@ -67,7 +88,7 @@ z-index: 10;
     margin-top: 40rpx;
     width: 100%;
     height: 92rpx;
-    background: #193C83;
+    background: #193c83;
     border-radius: 46rpx;
     text-align: center;
     color: #fff;