commit

src/main/resources/static/components/plugins/sysSignature/pc.vue

@@ -1,96 +1,108 @@
 <template>
-    <el-card shadow="never" class="pc-signature-card">
+  <el-card shadow="never" class="pc-signature-card">
-        <div class="pc-signature">
+    <div class="pc-signature">
-            <el-link type="primary">扫描下方二维码进行签字</el-link>
+      <el-link type="primary">扫描下方二维码进行签字</el-link>
-            <div class="signature-body">
+      <div class="signature-body" v-loading="loading">
-                <QrCode v-if="!signatureContent" :options="{ width: 126 }" :value="signatureAddress" class="signature-qrcode"></QrCode>
+        <QrCode v-if="!signatureContent" :options="{ width: 126 }" :value="signatureAddress"
-                <el-image v-if="signatureContent" :src="signatureContent" class="signature-image"></el-image>
+                class="signature-qrcode"></QrCode>
-            </div>
+        <el-image v-if="signatureContent" :src="signatureContent" class="signature-image"></el-image>
-            <el-link type="danger" icon="el-icon-edit" @click="signatureAgain" v-if="signatureContent">重签</el-link>
+      </div>
-        </div>
+      <el-link type="danger" icon="el-icon-edit" @click="signatureAgain" v-if="signatureContent">重签</el-link>
-    </el-card>
+    </div>
+  </el-card>
 </template>
 
 <script>
 module.exports = {
-    name: "sysSignaturePc",
+  name: "sysSignaturePc",
-    store,
+  store,
-    props: {
+  props: {
-        value: {
+    value: {
-            type: String,
+      type: String,
-            default: ""
+      default: ""
-        }
-    },
-    watch: {
-        value: {
-            handler(val) {
-              if(val){
-                this.signatureContent = val
-                this.$emit("input", this.signatureContent)
-              }
-            },
-            immediate: true
-        }
-    },
-    data() {
-        return {
-            //前端唯一标识 当然后端还有用户id作为唯一标识
-            id: new Date().getTime() + Math.floor(Math.random() * 10000) + 1,
-            signatureAddress: null,
-            interval: null,
-            signatureContent: null
-        }
-    },
-    methods: {
-        async init() {
-            const { code, data } = await this.$axios.post("/platform/signature/get")
-            if (code === 0) {
-                this.signatureContent = data && data.signature
-                this.$emit("input", this.signatureContent)
-            }
-            this.signatureAddress = origin + "/platform/signature/scanPcCode?id=" + this.id
-            console.log(this.signatureAddress)
-        },
-        signatureAgain() {
-            const val = sessionStorage.getItem("h5-scan-code-signature-" + this.id)
-            this.signatureContent = val
-            this.$emit("input", val)
-        }
-    },
-    mounted() {
-        this.init()
-        webSocketPubSub.subscribe("h5-scan-code-signature", (data) => {
-            console.info("ws:收到签字成功消息:", data)
-            this.signatureContent = data.value
-            this.$emit("input", data.value)
-        })
     }
+  },
+  watch: {
+    value: {
+      handler(val) {
+        if (val) {
+          this.signatureContent = val
+          this.$emit("input", this.signatureContent)
+        }
+      },
+      immediate: true
+    }
+  },
+  data() {
+    return {
+      //前端唯一标识 当然后端还有用户id作为唯一标识
+      id: new Date().getTime() + Math.floor(Math.random() * 10000) + 1,
+      signatureAddress: null,
+      interval: null,
+      signatureContent: null,
+      loading: true,
+    }
+  },
+  methods: {
+    async init() {
+      const {code, data} = await this.$axios.post("/platform/signature/get")
+      if (code === 0) {
+        this.signatureContent = data && data.signature
+        this.$emit("input", this.signatureContent)
+      }
+      this.signatureAddress = origin + "/platform/signature/scanPcCode?id=" + this.id
+      console.log(this.signatureAddress)
+    },
+    signatureAgain() {
+      const val = sessionStorage.getItem("h5-scan-code-signature-" + this.id)
+      this.signatureContent = val
+      this.$emit("input", val)
+    }
+  },
+  mounted() {
+    this.init()
+    webSocketPubSub.subscribe("h5-scan-code-signature", (data) => {
+      console.info("ws:收到签字成功消息:", data)
+      this.signatureContent = data.value
+      this.$emit("input", data.value)
+    })
+
+    // 可选：轮询或 watch ready 状态
+    const checkReady = () => {
+      if (window.webSocketPubSub.ws.readyState === 1) {
+        this.loading = false; // 允许签字
+      } else {
+        setTimeout(checkReady, 100);
+      }
+    };
+    checkReady();
+  }
 }
 </script>
 
 <style scoped>
 .pc-signature-card {
-    border: 1px solid var(--border-color-base);
+  border: 1px solid var(--border-color-base);
 }
 
 .pc-signature {
-    display: flex;
+  display: flex;
-    justify-content: center;
+  justify-content: center;
-    flex-direction: column;
+  flex-direction: column;
-    align-items: center;
+  align-items: center;
-    row-gap: 20px;
+  row-gap: 20px;
 }
 
 .signature-body {
-    position: relative;
+  position: relative;
 }
 
 .signature-qrcode {
-    transition: opacity 0.5s ease;
+  transition: opacity 0.5s ease;
 }
 
 .signature-image {
-    height: 100px;
+  height: 100px;
-    width: auto;
+  width: auto;
 }
 </style>

src/main/resources/views/layouts/v4/baseLayout.html

@@ -168,7 +168,7 @@
                             this.isSubscribed = true
                             this.sendJoinMessage()
                         }
-                    }, 500)
+                    }, 1000)
                 }
 
                 // 事件处理
@@ -202,6 +202,7 @@
                         // )
                         // 连接建立时不立即发送 join，等待订阅完成
                         this.ping()
+                        console.log('websocket open success')
                     }
                 }
 
@@ -245,7 +246,7 @@
                                 }
                             }, 500)
                         }
-                    }, 2000) // 延迟2秒重连
+                    }, 1000) // 延迟2秒重连
                 }
 
                 // 窗口事件处理