From f81a7a619725aa57c48353fca2c21a43fc3b7aee Mon Sep 17 00:00:00 2001 From: Tevin <tingquanren@163.com> Date: Wed, 06 Mar 2024 16:28:54 +0800 Subject: [PATCH] 公共组件库,文档建设开始 --- forms/userSignature/CUserSignature.vue | 32 +++++++++++++++++++++++++------- 1 files changed, 25 insertions(+), 7 deletions(-) diff --git a/forms/userSignature/CUserSignature.vue b/forms/userSignature/CUserSignature.vue index 0c5dd73..8182423 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,15 +46,17 @@ 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'; -import { $hostBoot } from '@components/bases/HostBoot'; export default { name: 'CUserSignature', components: { AtInput, AtIcon, + CSignatureLayer, }, props: { // 表单数据资源(表单组件内部机制专用) @@ -58,9 +64,7 @@ }, data() { return { - id: 'CUserSignatureCanvas' + Date.now() + parseInt(Math.random() * 10000), - cavWidth: 1000, - cavHeight: 1600, + drawSelf: process.env.TARO_ENV === 'weapp', }; }, computed: {}, @@ -76,7 +80,18 @@ 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 { + const url = this._transBase64ToBlob(sign); + this.itemRes.onChange(url); + } + }); + } + // TODO: 普通h5,使用 canvas 签名 }, _transBase64ToBlob(base64) { const arr = base64.split(','); @@ -89,6 +104,9 @@ } const blob = new Blob([u8arr], { type: mime }); return URL.createObjectURL(blob); + }, + $startEdit() { + this.handleStartEdit(); }, $uploadImage(callback) { const file = { @@ -157,7 +175,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