feat: 企微助手 - 群活码 - H5相关接口联调

project/src/components/groupCode/index.vue

@@ -129,7 +129,6 @@ export default {
   methods: {
     // 获取群活码列表
     async handleGetCodeList() {
-      console.log('handleGetCodeList => ')
       try {
         this.loading = true
         const { data: res = {} } = await this.$axios.get(this.URL.BASEURL + this.URL.groupCode_ruleList, {
@@ -226,8 +225,7 @@ export default {
       let corpid = JSON.parse(sessionStorage.getItem('company_session_defaultCorp') || '{}').corpid
       if (!corpid) corpid = JSON.parse(this.$localSelfStore.getLocal('defaultCorp') || '{}').corpid || ''
 
-      return `http://192.168.1.123:8081/#/groupCodeH5?corpid=${corpid}&ruleid=${rule_id}` // mock
-      // return `http://${window.location.host}/playlet/qwh5/dist/index.html#/groupCodeH5?corpid=${corpid}&ruleid=${rule_id}`
+      return `http://${window.location.host}/playlet/qwh5/dist/index.html#/groupCodeH5?corpid=${corpid}&ruleid=${rule_id}`
     },
     // 生成二维码
     handleGetQRCode(text) {
@@ -237,7 +235,6 @@ export default {
         height: 200,
         text,
       });
-      console.log('qrcode => ', qrcode)
       return qrcode || ''
     },
     // 保存二维码至本地(下载二维码)

qwh5/src/views/groupCodeH5.vue

@@ -6,7 +6,7 @@
     </div>
 
     <div class="group-wrap">
-      <img src="https://wework.qpic.cn/wwpic/657529_fEoKPXoSSYaWeBX_1661508588/0" />
+      <img v-if="groupQrcode" :src="groupQrcode" />
     </div>
 
     <div class="btm-tips-wrap">
@@ -23,38 +23,108 @@
     <van-popup v-model:show="isShowPopup" round>
       <div class="customer-wrap">
         <div class="title">客服</div>
-        <img src="https://open.work.weixin.qq.com/wwopen/userQRCode?vcode=vce41e90ec5a4364eb" />
-        <div class="tips">有问题联系客服</div>
+        <img :src="customerInfo.qrcode" />
+        <div class="tips">{{ customerInfo.leading_words }}</div>
       </div>
     </van-popup>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive } from 'vue'
+import { ref, reactive, onMounted } from 'vue'
 import type { Ref } from 'vue'
-import { Icon as vanIcon, Popup as vanPopup } from 'vant';
+import { Icon as vanIcon, Popup as vanPopup, Toast } from 'vant';
 import { getQueryString } from '@/utils/common'
+import $axios from '@/utils/axios'
 
 interface IParams {
   corpid: string
   rule_id: string
 }
 
+interface IRes<T = any> {
+  errno: string | number
+  rst: T
+  [index: string]: any
+}
+
 // 请求参数
 const params = reactive<IParams>({
   corpid: getQueryString('corpid'),
   rule_id: getQueryString('ruleid'),
 })
 
+// 群二维码
+const groupQrcode: Ref = ref('')
+
+// 客服信息
+const customerInfo = reactive({
+  qrcode: '',
+  leading_words: '',
+})
+
 // 控制"客服"弹层显示
 const isShowPopup: Ref = ref(false)
 
 // 点击"客服"
-const onClickCustomer = () => {
-  isShowPopup.value = true
+const onClickCustomer = async () => {
+  try {
+    Toast.loading({
+      message: '加载中...',
+      duration: 0,
+      forbidClick: true,
+    })
+    const { errno, rst } = await $axios.get('/api/h5/chatGroupQrcode/contactQrcode', {...params}) as IRes
+    if (errno == 0) {
+      customerInfo.qrcode = rst?.qrcode
+      customerInfo.leading_words = rst?.leading_words
+      isShowPopup.value = true
+    } else {
+      customerInfo.qrcode = ''
+      customerInfo.leading_words = ''
+    }
+  } catch (error) {
+    console.log('error =>', error)
+  } finally {
+    Toast.clear();
+  }
+}
+
+// 扫码数据上报
+const handleFetchScanData = async () => {
+  try {
+    await $axios.get('/api/h5/chatGroupQrcode/scan', {...params}) as IRes
+  } catch (error) {
+    console.log('error =>', error)
+  }
+}
+
+// 获取群活码
+const handleGetGroupQrcode = async () => {
+  try {
+    Toast.loading({
+      message: '加载中...',
+      duration: 0,
+      forbidClick: true,
+    })
+    const { errno, rst } = await $axios.get('/api/h5/chatGroupQrcode/detail', {...params}) as IRes
+    if (errno == 0) {
+      groupQrcode.value = rst?.qrcode
+    } else {
+      groupQrcode.value = ''
+    }
+  } catch (error) {
+    console.log('error =>', error)
+  } finally {
+    Toast.clear();
+  }
 }
 
+onMounted(() => {
+  handleGetGroupQrcode() // 获取群活码
+  handleFetchScanData() // 扫码数据上报
+})
+
 </script>
 
 <style lang="scss" scoped>
@@ -76,9 +146,9 @@ const onClickCustomer = () => {
     display: flex;
     justify-content: center;
     margin-top: 24px;
+    height: 80vw;
     img {
       width: 80%;
-      height: 80%;
     }
   }
   .btm-tips-wrap {