first commit

2026-09-09 09:14:28 +08:00
commit 5343198112
5199 changed files with 1052895 additions and 0 deletions
@@ -0,0 +1,136 @@
+<template>
+    <div class="h5-signature">
+        <div v-if="!showSignaturePanel" class="main-panel">
+            <slot v-if="$slots.default"></slot>
+            <template v-else>
+                <van-button @click="openSignature" class="open-button" size="middle" plain native-type="button">打开签字板</van-button>
+                <van-image :src="signatureContent">
+                    <template v-slot:error>请点击下方打开签字板按钮进行签字</template>
+                </van-image>
+            </template>
+        </div>
+        <van-popup v-model="showSignaturePanel" :style="{ height: '100vh', width: '100vw', display: 'flex', 'align-items': 'center' }">
+            <signature v-if="showSignaturePanel" @save="save"></signature>
+        </van-popup>
+    </div>
+</template>
+
+<script>
+module.exports = {
+    name: "h5",
+    components: {
+        signature: httpVueLoader("/components/sign/index.vue?v=" + new Date().getTime())
+    },
+    props: {
+        value: {
+            type: String,
+            default: ""
+        }
+    },
+    watch: {
+        value: {
+            handler(val) {
+                if (!val) {
+                    this.signatureContent = val
+                    return
+                }
+                if (val.startsWith("/signature/getSignData?") || val.startsWith('data:image/png;')) {
+                    this.signatureContent = val
+                } else {
+                    this.signatureContent = '/signature/getSignData?path=' + val
+                }
+            },
+            immediate: true
+        }
+    },
+    data() {
+        return {
+            signatureContent: null,
+            showSignaturePanel: false
+        }
+    },
+    methods: {
+        openSignature() {
+            this.showSignaturePanel = true
+        },
+
+        save(signature) {
+            $.post("/mobile/common/signing/update", {sign: signature})
+                .then((res) => {
+                    if (res.code === 0) {
+                        this.$toast.success("保存成功")
+                        this.showSignaturePanel = false
+                        this.getMySign()
+                    } else {
+                        this.$toast.fail("保存失败")
+                    }
+                })
+        },
+        base64ToFile(base64Data, filename) {
+            // 将base64的数据部分提取出来
+            const parts = base64Data.split(";base64,")
+            const contentType = parts[0].split(":")[1]
+            const raw = window.atob(parts[1])
+            const rawLength = raw.length
+            const uInt8Array = new Uint8Array(rawLength)
+
+            for (let i = 0; i < rawLength; ++i) {
+                uInt8Array[i] = raw.charCodeAt(i)
+            }
+
+            // 使用Blob对象创建File对象
+            const blob = new Blob([uInt8Array], { type: contentType })
+            blob.lastModifiedDate = new Date()
+            blob.name = filename
+            return new File([blob], filename, { type: contentType })
+        },
+        async getMySign() {
+            const data = await $.get("/mobile/common/signing/getMySign")
+            if (data) {
+                if (data.startsWith("/signature/getSignData?") || data.startsWith('data:image/png;')) {
+                    this.signatureContent = data
+                } else {
+                    this.signatureContent = '/signature/getSignData?path=' + data
+                }
+                this.$emit("input", data)
+            }
+        }
+    },
+    async created() {
+        await this.getMySign()
+    },
+}
+</script>
+
+<style>
+.h5-signature {
+    width: 100%;
+}
+
+.main-panel {
+    position: relative;
+    flex-direction: column-reverse;
+    display: flex;
+    row-gap: 10px;
+}
+
+.main-panel .van-image {
+    min-height: 150px;
+    display: block;
+    width: 90%;
+    margin: 0 auto;
+    background: white;
+    border-radius: 8px;
+}
+
+.main-panel .open-button {
+    margin: 0 auto;
+    width: 90%;
+    height: 36px;
+    border-radius: 12px;
+    color: white;
+    background: rgb(33, 109, 179);
+    border-color: rgb(33, 109, 179);
+    font-size: 14px;
+}
+</style>