From bf1ac47ae368378a5bff9a1808cfa1a08fbfc917 Mon Sep 17 00:00:00 2001
From: Tevin <tingquanren@163.com>
Date: Wed, 20 Mar 2024 17:49:43 +0800
Subject: [PATCH] 图片预览组件，显示微调

---
 forms/userSignature/CUserSignature.vue |   34 ++++++++++++++++++++++++++--------
 1 files changed, 26 insertions(+), 8 deletions(-)

diff --git a/forms/userSignature/CUserSignature.vue b/forms/userSignature/CUserSignature.vue
index 7f33abd..ba66a1f 100644
--- a/forms/userSignature/CUserSignature.vue
+++ b/forms/userSignature/CUserSignature.vue
@@ -1,5 +1,5 @@
 /**
- * CUserSignature
+ * CUserSignature - 用户签名
  * @author Tevin
  */
 
@@ -32,6 +32,10 @@
                 />
             </view>
         </view>
+        <CSignatureLayer
+            v-if="drawSelf"
+            ref="drawLayer"
+        />
     </view>
 </template>
 
@@ -42,6 +46,8 @@
 import { Fetcher } from '@components/bases/Fetcher';
 import { $fetchCommon } from '@fetchers/FCommon';
 import { $bridge } from '@components/common/Bridge';
+import { $hostBoot } from '@components/bases/HostBoot';
+import CSignatureLayer from '@components/forms/userSignature/CSignatureLayer';
 import project from '@project';
 import './cUserSignature.scss';
 
@@ -50,6 +56,7 @@
     components: {
         AtInput,
         AtIcon,
+        CSignatureLayer,
     },
     props: {
         // 表单数据资源（表单组件内部机制专用）
@@ -57,9 +64,7 @@
     },
     data() {
         return {
-            id: 'CUserSignatureCanvas' + Date.now() + parseInt(Math.random() * 10000),
-            cavWidth: 1000,
-            cavHeight: 1600,
+            drawSelf: process.env.TARO_ENV === 'weapp',
         };
     },
     computed: {},
@@ -75,7 +80,17 @@
                     this.itemRes.onChange(url);
                 });
             }
-            // TODO: 普通h5、小程序中，使用 canvas 签名
+            // 小程序中
+            else if (process.env.TARO_ENV === 'weapp') {
+                this.$refs.drawLayer.$onDraw(sign => {
+                    if (sign.indexOf('http') >= 0) {
+                        this.itemRes.onChange(sign);
+                    } else {
+                        this.itemRes.onChange(sign);
+                    }
+                });
+            }
+            // TODO: 普通h5，使用 canvas 签名
         },
         _transBase64ToBlob(base64) {
             const arr = base64.split(',');
@@ -88,6 +103,9 @@
             }
             const blob = new Blob([u8arr], { type: mime });
             return URL.createObjectURL(blob);
+        },
+        $startEdit() {
+            this.handleStartEdit();
         },
         $uploadImage(callback) {
             const file = {
@@ -119,7 +137,7 @@
                 header['Cookie'] = cookiesArr.join('; ');
             }
             Taro.uploadFile({
-                url: Fetcher.host + $fetchCommon.getUploadImgURL(),
+                url: $hostBoot.getHost() + $fetchCommon.getUploadImgURL(),
                 header,
                 filePath: file.url,
                 fileName: file.fileName,
@@ -131,7 +149,7 @@
                     if (res2.state.code === 2000) {
                         const serverUrl = $fetchCommon.transImgPath(
                             'fix',
-                            res2.data.src || res2.data.file || res2.data.url
+                            res2.data.src || res2.data.file || res2.data.url,
                         );
                         this.itemRes.onChange(serverUrl);
                         callback('success');
@@ -156,7 +174,7 @@
         } else if (process.env.TARO_ENV === 'weapp') {
             $(this.$refs.input.$el)
                 .find('.at-input__container')
-                .append(this.$refs.drawing.$el);
+                .append(this.$refs.drawing);
         }
     },
 };

--
Gitblit v1.9.1