签到二维码静态码改为动态码

src/views/training/models/sign-in-code.vue

@@ -1,5 +1,6 @@
 <template>
-    <vxe-modal v-model="dialogVisible" :title="title" show-zoom resize show-footer destroy-on-close transfer @hide="close" :width="width" :z-index="1002">
+    <vxe-modal v-model="dialogVisible" :title="title" show-zoom resize show-footer destroy-on-close transfer
+        @hide="close" :width="width" :z-index="1002">
         <template #default>
             <div>
                 <div v-if="info" ref="codeImgRef" style="width: 400px; margin: 0 auto;padding: 10px;">
@@ -7,15 +8,14 @@
                     <div class="mb-6">会议时间：{{ info?.trainingStart.slice(0, -3) }}~{{ info?.trainingEnd.slice(0, -3) }}</div>
                     <div class="mb-6">会议方式：{{ selectDictLabel(dict.lm_training_join_type, info.joinType) }}</div>
                     <div class="mb-6">联系电话：{{ info?.tel }}</div>
-                    <div class="mb-6 h-10"></div>
-                    <div class="d-flex j-c f-w-6 f-s-18 c-333">签到二维码</div>
-                    <div class="d-flex j-c a-c pd-20 ">
-                        <vueQr :text="VITE_APP_SHARE_QR_CODE_URL + '/meeting-sign-in?meetid=' + info?.id" :size="300"></vueQr>
+                    <div>签到二维码</div>
+                    <div class="d-flex j-c a-c pd-20">
+                        <vueQr :text="qrCode" :size="300"></vueQr>
                     </div>
                 </div>
             </div>
 
-            <div class="d-flex j-c">
+            <div v-if="!+info.joinType" class="d-flex j-c">
                 <el-button @click="saveImg">保存签到二维码</el-button>
             </div>
         </template>
@@ -37,9 +37,25 @@ const props = defineProps({
 const VITE_APP_SHARE_QR_CODE_URL = ref(import.meta.env.VITE_APP_SHARE_QR_CODE_URL);
 const dialogVisible = ref(false);
 const close = () => {
+    if (timer.value) {
+        clearTimeout(timer.value);
+    }
     emit('update:show', false);
     emit('close', false);
 };
+const qrCode = ref<string>(`${VITE_APP_SHARE_QR_CODE_URL.value}/meeting-sign-in?meetid=${props?.info?.id}&state=${new Date().getTime()}`);
+// 5s设置一次二维码qrCode setTimeout
+const timer = ref<any>(null);
+const setQrCode = () => {
+    if (timer.value) {
+        clearTimeout(timer.value);
+    }
+    timer.value = setTimeout(() => {
+        qrCode.value = `${VITE_APP_SHARE_QR_CODE_URL.value}/meeting-sign-in?meetid=${props?.info?.id}&state=${new Date().getTime()}`;
+        setQrCode();
+    }, 5000);
+}
+
 const codeImgRef = ref<HTMLElement | null>(null);
 const saveImg = () => {
     html2canvas(codeImgRef.value, {
@@ -58,6 +74,9 @@ watch(
     () => props.show,
     (val) => {
         dialogVisible.value = val;
+        if (val) {
+            setQrCode();
+        }
     },
     { immediate: true }
 );