千分位方法说明

chensiAb

2025-01-14 e8265fcb603358426f2dbe06193a86ccf6332ad0

 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,18 @@
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 { uploadImage } from '@components/forms/imagePicker';
import project from '@project';
import './cUserSignature.scss';
import { $hostBoot } from '@components/bases/HostBoot';

export default {
    name: 'CUserSignature',
    components: {
        AtInput,
        AtIcon,
        CSignatureLayer,
    },
    props: {
        // 表单数据资源（表单组件内部机制专用）
@@ -58,9 +65,7 @@
    },
    data() {
        return {
            id: 'CUserSignatureCanvas' + Date.now() + parseInt(Math.random() * 10000),
            cavWidth: 1000,
            cavHeight: 1600,
            drawSelf: process.env.TARO_ENV === 'weapp',
        };
    },
    computed: {},
@@ -76,7 +81,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(',');
@@ -90,62 +105,28 @@
            const blob = new Blob([u8arr], { type: mime });
            return URL.createObjectURL(blob);
        },
        $startEdit() {
            this.handleStartEdit();
        },
        $uploadImage(callback) {
            const file = {
                url: this.itemRes.formData[this.itemRes.name],
                fileName: 'file-' + Date.now() + '.png',
            };
            // 没有上传内容，视为上传成功
            // 没有上传内容，视为无需上传
            if (!file.url) {
                callback('success');
                return;
            }
            // 不是临时文件，视为上传成功
            if (
                file.url.indexOf('blob') < 0 &&
                file.url.indexOf('wxfile') < 0 &&
                file.url.indexOf('http://tmp/') < 0
            ) {
                callback('success');
                return;
            }
            // 开始上传
            let header = {};
            if (process.env.TARO_ENV === 'weapp') {
                const localCookies = JSON.parse(Taro.getStorageSync('cookies') || '{}');
                const cookiesArr = [];
                Object.keys(localCookies).forEach(key => {
                    cookiesArr.push(key + '=' + localCookies[key]);
                });
                header['Cookie'] = cookiesArr.join('; ');
            }
            Taro.uploadFile({
                url: $hostBoot.getHost() + $fetchCommon.getUploadImgURL(),
                header,
                filePath: file.url,
                fileName: file.fileName,
                name: 'file',
                formData: {},
                success: res => {
                    const res2 =
                        typeof res.data === 'string' ? JSON.parse(res.data) : res.data;
                    if (res2.state.code === 2000) {
                        const serverUrl = $fetchCommon.transImgPath(
                            'fix',
                            res2.data.src || res2.data.file || res2.data.url
                        );
                        this.itemRes.onChange(serverUrl);
                        callback('success');
                    } else {
                        callback('error', res2.state.msg);
                    }
                },
                cancel() {
                    callback('error', '上传图片已取消！');
                },
                fail() {
                    callback('error', '上传图片失败！');
                },
            uploadImage([file], (state, res) => {
                if (state === 'success') {
                    this.itemRes.onChange(res[0]);
                    setTimeout(() => {
                        callback(state);
                    }, 10);
                } else if (state === 'error') {
                    callback(state, res);
                }
            });
        },
    },
@@ -157,7 +138,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);
        }
    },
};