修改

.env.development

@@ -38,3 +38,5 @@ VITE_APP_WEBSOCKET = false
 VITE_APP_SSE = true
 
 VITE_APP_PACKAGE_SHARE_URL = 'http://dm.share.yujin.shuziyunyao.com/package'
+# 测试版微信小程序扫码域名
+VITE_APP_SHARE_QR_CODE_URL = 'http://dm.share.yujin.shuziyunyao.com'

.env.production

@@ -41,3 +41,6 @@ VITE_APP_PACKAGE_SHARE_URL = 'https://www.shuziyunyao.com/dm/package'
 
 # appid
 VITE_APP_APPID = '1890328853823459329'
+# 测试版微信小程序扫码域名
+
+VITE_APP_SHARE_QR_CODE_URL = 'https://www.shuziyunyao.com/dm'

src/views/training/meeting/index.vue

@@ -55,9 +55,9 @@
                         <vxe-column field="joinCount" title="报名人数" width="80" />
                         <vxe-column field="signCount" title="签到人数" width="80" />
                         <vxe-column field="certCount" title="领取证书人数" width="80" />
-                        <vxe-column title="创建人" align="center" field="createByName" min-width="100" :formatter="colNoData" />
+                        <vxe-column title="创建人" align="center" field="createByName" width="80" :formatter="colNoData" />
                         <vxe-column title="创建时间" align="center" field="createTime" min-width="100" :formatter="colNoData" />
-                        <vxe-column field="certFlag" title="会议状态">
+                        <vxe-column field="certFlag" title="会议状态" width="80">
                             <template #default="{ row }">
                                 <DictTag :options="dm_training_status" :value="row?.trainingStatus"></DictTag>
                             </template>
@@ -72,7 +72,7 @@
                                 <span></span>
                                 <el-button v-if="!['3'].includes(row?.trainingStatus)" style="color: #0079fe;" text>分享</el-button>
                                 <span></span>
-                                <el-button v-if="['1', '0'].includes(row?.trainingStatus)" style="color: #0079fe;" text>签到二维码</el-button>
+                                <el-button v-if="['1', '0'].includes(row?.trainingStatus)" @click="trainingSignIn(row)" style="color: #0079fe;" text>签到二维码</el-button>
                                 <span></span>
                                 <el-button style="color: #0079fe;" text>详情</el-button>
                                 <span></span>
@@ -85,22 +85,26 @@
             </div>
         </div>
     </div>
+    <SignInCode v-if="showSignIn" v-model:show="showSignIn" :info="rowInfo"></SignInCode>
 </template>
 
 <script setup name="meeting" lang="ts">
 import { colNoData, colNoUnm } from '@/utils/noData';
 import { searchTabs } from '@/views/models';
 import { trainingList, queryTrainingCount, trainingDelete, publishTraining, unpublishTraining } from '@/api/training';
+import { SignInCode } from '../models';
 
 const router = useRouter();
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { dm_training_join_type, yes_no, dm_training_cert, dm_training_status } = toRefs<any>(proxy?.useDict('dm_training_join_type', 'yes_no', 'dm_training_cert', 'dm_training_status'));
 const loading = ref(true);
 const showSearch = ref(true);
+const showSignIn = ref(false);
 const total = ref(0);
 const queryFormRef = ref<ElFormInstance>();
 const dataList = ref<any[]>([]);
 const initFormData = {};
+const rowInfo = ref<any>({});
 const data = reactive<any>({
     form: { ...initFormData },
     queryParams: {
@@ -185,6 +189,11 @@ const getMeetingCount = async () => {
         tabs.value = res.data;
     }
 };
+// 打开签到二维码
+const trainingSignIn = (row: any) => {
+    rowInfo.value = { ...row };
+    showSignIn.value = true;
+};
 onMounted(() => {
     getMeetingCount();
     getList();

src/views/training/models/index.ts

@@ -0,0 +1 @@
+export { default as SignInCode } from './sign-in-code.vue'; // 查看签到码

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

@@ -0,0 +1,61 @@
+<template>
+    <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;">
+                    <div class="mb-6">会议名称：{{ info?.trainingName }}</div>
+                    <div class="mb-6">培训时间：{{ info?.trainingStart  }}~{{ info?.trainingEnd }}</div>
+                    <div>签到二维码</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"></vueQr>
+                    </div>
+                </div>
+            </div>
+
+            <div class="d-flex j-c">
+                <el-button @click="saveImg">保存签到二维码</el-button>
+            </div>
+        </template>
+    </vxe-modal>
+</template>
+
+<script setup name="SignInCode" lang="ts">
+import { propTypes } from '@/utils/propTypes';
+import vueQr from 'vue-qr/src/packages/vue-qr.vue';
+import html2canvas from 'html2canvas';
+const emit = defineEmits(['update:show', 'close', 'success']);
+const props = defineProps({
+    show: propTypes.bool.def(false),
+    title: propTypes.string.def('签到二维码'),
+    width: propTypes.number.def(560),
+    info: propTypes.any.def(null),
+    dict: propTypes.object.def({})
+});
+const VITE_APP_SHARE_QR_CODE_URL = ref(import.meta.env.VITE_APP_SHARE_QR_CODE_URL);
+const dialogVisible = ref(false);
+const close = () => {
+    emit('update:show', false);
+    emit('close', false);
+};
+const codeImgRef = ref<HTMLElement | null>(null);
+const saveImg = () => {
+    html2canvas(codeImgRef.value, {
+        useCORS: true,
+        allowTaint: false,
+        scale: 2
+    }).then((canvas) => {
+        const url = canvas.toDataURL('image/png');
+        const a: any = document.createElement('a');
+        a.download = `${props?.info?.trainingName}-签到二维码.png`;
+        a.href = url;
+        a.click();
+    });
+};
+watch(
+    () => props.show,
+    (val) => {
+        dialogVisible.value = val;
+    },
+    { immediate: true }
+);
+</script>