长按二维码后轮询用户是否关注公众号

 <!--
 <!--
  * @Date: 2022-07-18 10:22:22
  * @Date: 2022-07-18 10:22:22
  * @LastEditors: hookehuyr hookehuyr@gmail.com
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-12-07 10:57:10
+ * @LastEditTime: 2022-12-07 15:08:29
  * @FilePath: /data-table/src/views/index.vue
  * @FilePath: /data-table/src/views/index.vue
  * @Description: 首页
  * @Description: 首页
 -->
 -->
@@ -63,7 +63,7 @@
     <div class="wrapper">
     <div class="wrapper">
       <div class="block">
       <div class="block">
         <div style="text-align: center; margin-top: 0.5rem;">请先关注公众号</div>
         <div style="text-align: center; margin-top: 0.5rem;">请先关注公众号</div>
-        <van-image width="100%" fit="cover" :src="qr_url" />
+        <van-image @touchstart="onTap" width="100%" fit="cover" :src="qr_url" />
         <div style="text-align: center; margin-bottom: 0.5rem; font-size: 0.85rem;">长按识别二维码</div>
         <div style="text-align: center; margin-bottom: 0.5rem; font-size: 0.85rem;">长按识别二维码</div>
       </div>
       </div>
     </div>
     </div>
@@ -87,8 +87,9 @@ import { useRoute } from "vue-router";
 import { queryFormAPI } from "@/api/form.js";
 import { queryFormAPI } from "@/api/form.js";
 import { addFormDataAPI } from "@/api/data.js";
 import { addFormDataAPI } from "@/api/data.js";
 import { showSuccessToast, showFailToast } from "vant";
 import { showSuccessToast, showFailToast } from "vant";
-import { wxInfo } from "@/utils/tools";
+import { wxInfo, getUrlParams } from "@/utils/tools";
 import { styleColor } from "@/constant.js";
 import { styleColor } from "@/constant.js";
+import { getFormSettingAPI } from "@/api/form.js";
 
 
 const store = mainStore();
 const store = mainStore();
 // 获取表单设置
 // 获取表单设置
@@ -250,14 +251,48 @@ onMounted(async () => {
   // 过期时间显示
   // 过期时间显示
   notice_text.value = `表单报名将在 ${formSetting.value.sjsj_end_time} 后结束`;
   notice_text.value = `表单报名将在 ${formSetting.value.sjsj_end_time} 后结束`;
   // 判断是否需要关注公众号, 弹出二维码识别
   // 判断是否需要关注公众号, 弹出二维码识别
-  if (formSetting.value.wxzq_must_follow) {
-    // wxzq_mp_qrcode
+  if (formSetting.value.wxzq_must_follow && !formSetting.value.x_field_weixin_subscribe) {
     show.value = true;
     show.value = true;
-    // qr_url.value = "http://gyzs.onwall.cn/gzs-img-6.png";
     qr_url.value = formSetting.value.wxzq_mp_qrcode;
     qr_url.value = formSetting.value.wxzq_mp_qrcode;
+    // 标记用户还未关注
+    localStorage.setItem('weixin_subscribe', 0);
   }
   }
 });
 });
 
 
+const onTap = () => {
+  // 打开轮询用户是否关注
+  if (localStorage.getItem('weixin_subscribe') === '0') {
+    setInterval(() => {
+      checkUserSubscribe()
+    }, 1000);
+  }
+}
+
+const checkUserSubscribe = async () => {
+  // 数据收集设置
+  const code = getUrlParams(location.href) ? getUrlParams(location.href).code : '';
+  const { data } = await getFormSettingAPI({ form_code: code });
+  const form_setting = {};
+  if (data.length) {
+    data[0].property_list.forEach((prop) => {
+      const key = prop["property_code"];
+      const obj = {
+        [key]:
+          prop["setting_value"].length > 1
+            ? prop["setting_value"]
+            : prop["setting_value"][0],
+      };
+      Object.assign(form_setting, obj, data[0]['extend']);
+    });
+  }
+  // 判断是否需要关注公众号, 弹出二维码识别
+  if (form_setting.wxzq_must_follow && form_setting.x_field_weixin_subscribe) {
+    // 标记用户已关注
+    localStorage.setItem('weixin_subscribe', 1);
+    show.value = false;
+  }
+}
+
 const show = ref(false);
 const show = ref(false);
 const qr_url = ref("");
 const qr_url = ref("");
 const onClose = () => {
 const onClose = () => {