二维码弹框组件封装 页面首次跳转到事件上报

.env.development

@@ -2,5 +2,5 @@ NODE_ENV='development'
 # must start with VUE_APP_
 VUE_APP_ENV = 'development'
 # VUE_APP_BASE_URL = 'http://192.168.1.144/api'
-VUE_APP_BASE_URL = http://192.168.1.140/api'
+VUE_APP_BASE_URL = https://epmet-test.elinkservice.cn/140-proxy
 outputDir = 'epmet-work-wx-dev'

README.md

@@ -6,7 +6,7 @@
 然后跑起来之后你本地的域名就会变成epmet-cloud.elinkservice.cn
 ↓↓↓↓
 在你小程序的公众号开发中输入以下网址就能够访问了
-http://epmet-cloud.elinkservice.cn:80/?appId=wx1078fa1e99424de9&redirect=epmet-cloud.elinkservice.cn&houseId=1640692803448688642
+http://epmet-test.elinkservice.cn:80/#/peoSuggestion?appId=wx1078fa1e99424de9&redirect=epmet-test.elinkservice.cn&houseId=1640692803448688642
 
 ### Node 版本要求
 

src/components/qrDialog/index.vue

@@ -0,0 +1,48 @@
+<template>
+    <div class=''>
+        <van-popup v-model="showQRCode" round  v-if="qrType">
+          <img :src="require(`@/assets/images/qrImg/${qrType}.png`)" show-menu-by-longpress="true" style="width: 160px;height: 160px;"/>
+          <h3>长按识别二维码跳转</h3>
+        </van-popup>
+    </div>
+</template>
+
+<script>
+
+export default {
+    data() {
+        return {};
+    },
+    props:{
+        showQRCode:{
+            type:Boolean,
+            default:false
+        },
+        qrType:{
+            type:String,
+            default:''
+        }
+    },
+    created() {},
+    methods: {},
+    components:{},
+    computed:{},
+    watch: {},
+}
+</script>
+
+<style lang='less' scoped>
+:deep .van-popup{
+    width: 320px;
+    height: 350px;
+    padding-top: 15px;
+    box-sizing: border-box;
+    background: url('@/assets/images/houseQR/dialog_bg.png') no-repeat;
+    background-size: 100% 100%;
+    overflow: hidden;
+    display: flex;
+    justify-content:  flex-end;
+    align-items:center;
+    flex-direction: column;
+}
+</style>

src/config/env.development.js

@@ -6,7 +6,7 @@ module.exports = {
   technicalSupport: '',
   copyright: 'Copyright @ 2023  版权所有',
   // baseUrl: 'http://127.0.0.1:8080', // 项目地址
-  baseUrl: 'http://192.168.1.144/api', // 项目地址
+  baseUrl: 'https://epmet-test.elinkservice.cn/140-proxy', // 项目地址
   baseApi: '/api', // 本地api请求地址,注意：如果你使用了代理，请设置成'/'
   wxId: 'wx1078fa1e99424de9',
   secret: 'ebecf6b88ab455f1cdf4a5b6357407b8',

src/config/env.dongming.js

@@ -16,7 +16,7 @@ module.exports = {
     copyright: 'Copyright @ 2023  版权所有',
     baseUrl: 'https://epmet-dongming.elinkservice.cn/', // 项目地址
     baseApi: 'https://epmet-dongming.elinkservice.cn/api',
-    wxId: 'wx1078fa1e99424de9',
+    wxId: 'wxfa5fa30e90f90b76',
     secret: 'ebecf6b88ab455f1cdf4a5b6357407b8',
     mapKey: '5D6BZ-KHLW4-JUXU5-XIM47-5Q2DJ-IPBBT'
   }

src/router/index.js

@@ -65,21 +65,22 @@ router.beforeEach((to, from, next) => {
     store.commit('SET_APP_ID', urlParams.appId)
     localStorage.setItem('appId', urlParams.appId)
   } else {
-    store.commit('SET_APP_ID', localStorage.getItem('appId'))
+    store.commit('SET_APP_ID', 'wx1078fa1e99424de9')
+    // store.commit('SET_APP_ID', localStorage.getItem('appId'))
   }
-  if (!localStorage.getItem('appId') && to.path !== '/errorPage'&& to.path != '/houseQR') {
+  // if (!localStorage.getItem('appId') && to.path !== '/errorPage'&& to.path != '/houseQR') {
-    if(to.path === '/errorPage'){
+  //   if(to.path === '/errorPage'){
-      next('/errorPage')
+  //     next('/errorPage')
-    }else{
+  //   }else{
-      next('/')
+  //     next('/')
-    }
+  //   }
-  } else {
+  // } else {
     if (to.params.type) {
       document.title = to.params.type === 'edit' ? '编辑' : '注册'
     } else {
       document.title = to.meta.title ? to.meta.title : title
     }
-    if (localStorage.getItem('token') && to.path != '/houseQR') {
+    if (localStorage.getItem('token') && (to.path != '/houseQR')) {
       store.dispatch('getUserInfo').then((res) => {
           if (res.agencyId) {
             next()
@@ -95,30 +96,51 @@ router.beforeEach((to, from, next) => {
         next({ path: '/login'})
       })
     } else { 
-      if (getQueryStringByName('code') && to.path != '/houseQR') {
+      if (getQueryStringByName('code') && (to.path != '/houseQR')) {
         login({ wxCode: getQueryStringByName('code'),appId:'wx1078fa1e99424de9'}).then(res => {
           localStorage.setItem('token', res.data.token)
           localStorage.setItem('userId', res.data.userH5DTO.id)
-          let state = decodeURIComponent(getQueryStringByName('state'))
+          let state;
-          state = state.replace(/[\\\b\f\n\r\t]/g, '')
+          try {
-          state = state.replace(/(\s*?{\s*?|\s*?,\s*?)(['"])?([a-zA-Z0-9]+)(['"])?:/g, '$1"$3":')
+            state = decodeURIComponent(getQueryStringByName('state'));
-          state = state
+          } catch (error) {
-            .replace(/":/g, '":"')
+            console.warn('Decoding state failed, using raw input:', error);
-            .replace(/,"/g, '","')
+            state = getQueryStringByName('state');
-            .replace(/},/g, '"},')
+          }
-            .replace(/}]/g, '"}]')
+          
-            .replace(/}}/g, '"}}')
+          // 验证是否是有效 JSON
-            .replace(/"{/g, '{')
+          try {
-            .replace(/:{"}/g, ':{}')
+            state = JSON.parse(state);
-            state = JSON.stringify({ path: '/', query: {} });
+          } catch {
-          let path = `${location.origin}${location.pathname === '/' ? '' : location.pathname}`
+            state = state
-          if (state && state != 'undefined') {
+              .replace(/[\\\b\f\n\r\t]/g, '')
-            state = JSON.parse(state)
+              .replace(/(\s*?{\s*?|\s*?,\s*?)(['"])?([a-zA-Z0-9]+)(['"])?:/g, '$1"$3":')
-            console.log(state, 'state')
+              .replace(/":/g, '":"')
-            console.log(`${path}/#${state.path}?${paramsFormat(state.query)}`, 'sss')
+              .replace(/,"/g, '","')
-            location.href = `${path}/#${state.path}?${paramsFormat(state.query)}`
+              .replace(/},/g, '"},')
+              .replace(/}]/g, '"}]')
+              .replace(/}}/g, '"}}')
+              .replace(/"{/g, '{')
+              .replace(/:{"}/g, ':{}')
+              .replace(/""/g, '"');
+          
+            try {
+              state = JSON.parse(state);
+            } catch (e) {
+              console.error('State parsing failed, using default:', e);
+              state = { path: '/', query: {} };
+            }
+          }
+          
+          let path = `${location.origin}${location.pathname === '/' ? '' : location.pathname}`;
+          debugger
+          if (state && state.path) {
+            let finalUrl = `${path}#${state.path}?${paramsFormat(state.query)}`;
+            console.log(finalUrl, 'Final URL');
+            location.href = finalUrl;
           } else {
-            location.href = path
+            console.log(path, 'Final URL');
+            location.href = path;
           }
         })
       } else {
@@ -129,7 +151,7 @@ router.beforeEach((to, from, next) => {
         }
       }
     }
-  }
+  // }
 })
 
 function getQueryParams() {

src/router/router.config.js

@@ -13,7 +13,7 @@ export const constantRouterMap = [
     path: '/index1',
     name: 'index1',
     component: () => import('@/views/home2'),
-    meta: { title: '设备关闭', keepAlive: false }
+    meta: { title: '首页', keepAlive: false }
   },
   {
     path: '/livingCircle',

src/views/employment/index.vue

@@ -16,7 +16,7 @@
             </div>
             <div class="grid-container nav flex-mean m-top18">
                 <div class="flex-y flex flex-center1 flex-center2 nav font-size12" v-for="(item, index) in squaredList"
-                    @click="handelClickJump(item.path,'tab')" :key="index">
+                    @click="handelClickIcon(item.type)" :key="index">
                     <img :src="item.imgSrc" alt="">
                     <span >{{ item.title }}</span>
                 </div>
@@ -60,6 +60,7 @@
 
         </div>
         <Android></Android>
+        <qr-dialog v-if="showQRCode" :showQRCode="showQRCode" :qrType="qrType"></qr-dialog>
     </div>
 
 
@@ -67,6 +68,8 @@
 
 <script>
 import { advertisingTag, communityPublicity } from '@/api/home';
+import qrDialog from '@/components/qrDialog/index'
+
 export default {
     data() {
         return {
@@ -86,19 +89,16 @@ export default {
                 {
                     imgSrc: require('@/assets/images/squaredPaper/12.png'),
                     title: '菏泽继续教育',
-                    path: 'govAffairs'
+                    type: ''
                 },
                 {
                     imgSrc: require('@/assets/images/squaredPaper/2.png'),
                     title: '菏泽人才网',
-                    path: 'communityPublicity'
+                    type: 'rcw'
-                },
-                {
-                    imgSrc: require('@/assets/images/squaredPaper/3.png'),
-                    title: '携程',
-                    path: 'communityPublicity'
                 }
             ],
+            showQRCode:false,
+            qrType:null
         };
     },
     created() {
@@ -160,17 +160,17 @@ export default {
             const chineseCharsAndPunctuation = str.match(/[\u4e00-\u9fa5\u3000-\u303F\uff00-\uffef]/g);
             return chineseCharsAndPunctuation ? chineseCharsAndPunctuation.join('') : '';
         },
-        handelChangeTags(val, title) {
+      
-            this.PublicityList = [];
+        handelClickIcon(type){
-            if (val !== 0) {
+         if(type){
-                this.tagId = this.tagList[val].id;
+          this.showQRCode = true;
-            } else {
+          this.qrType = type;
-                this.tagId = '';
+         }else{
-            }
+          this.$toast('暂无二维码')
-            this.communityPublicity()
+         }
-        },
+        }
     },
-    components: {},
+    components: {qrDialog},
     computed: {},
     watch: {},
 }

src/views/govAffairs/index.vue

@@ -37,15 +37,14 @@
       </div>
     </div>
     <Android></Android>
-    <van-popup v-model="showQRCode" round  v-if="qrType">
+    <qr-dialog v-if="showQRCode" :showQRCode="showQRCode" :qrType="qrType"></qr-dialog>
-          <h3>长按识别二维码跳转小程序</h3>
-          <img :src="require(`@/assets/images/govAffairs/qrImg/${qrType}.png`)" show-menu-by-longpress="true" style="width: 200px;height: 200px;margin-bottom: 20px;"/>
-    </van-popup>
   </div>
 
 </template>
 
 <script>
+import qrDialog from '@/components/qrDialog/index'
+
 export default {
     data() {
         return {
@@ -98,7 +97,7 @@ export default {
          }
         }
     },
-    components: {},
+    components: {qrDialog},
     computed: {},
     watch: {},
 }
@@ -193,21 +192,5 @@ export default {
   font-size: 14px;
   color: #333;
 }
-:deep .van-popup{
+
-    width: 320px;
-    height: 350px;
-    padding-top: 15px;
-    box-sizing: border-box;
-    background: url('@/assets/images/houseQR/dialog_bg.png') no-repeat;
-    background-size: 100% 100%;
-    overflow: hidden;
-    display: flex;
-    justify-content:  flex-end;
-    align-items:center;
-    flex-direction: column;
-    h3{
-      width: 100%;
-      padding-left: 10px;
-    }
-}
 </style>

src/views/login/index.vue

@@ -28,7 +28,6 @@ export default {
       let url = `//open.weixin.qq.com/connect/oauth2/authorize?appid=${this.$store.state.app.appId}&redirect_uri=${encodeURI(
         path
       )}&state=${encodeURIComponent(JSON.stringify(state))}&response_type=code&scope=snsapi_userinfo#wechat_redirect`
-      console.log(url)
       location.href = url
     }
   }

src/views/supervision/index.vue

@@ -20,7 +20,7 @@
             </div>
             <div class="grid-container nav flex-mean m-top18">
                 <div class="flex-y flex flex-center1 flex-center2 nav font-size12" v-for="(item, index) in squaredList"
-                    @click="handelClickJump(item.path,'tab')" :key="index">
+                    @click="handelClickIcon(item.type)" :key="index">
                     <img :src="item.imgSrc" alt="">
                     <span >{{ item.title }}</span>
                 </div>
@@ -64,6 +64,8 @@
 
         </div>
         <Android></Android>
+        <qr-dialog v-if="showQRCode" :showQRCode="showQRCode" :qrType="qrType"></qr-dialog>
+
     </div>
 
 
@@ -71,6 +73,7 @@
 
 <script>
 import { advertisingTag, communityPublicity } from '@/api/home';
+import qrDialog from '@/components/qrDialog/index'
 export default {
     data() {
         return {
@@ -83,41 +86,22 @@ export default {
             agencyId: null,
             finished: false,
             loading: true,
-            showRegister: false,
             searchValue: "",
 
             squaredList:[
-                {
-                    imgSrc: require('@/assets/images/squaredPaper/1.png'),
-                    title: '廉洁宁陵',
-                    path: 'govAffairs'
-                },
                 {
                     imgSrc: require('@/assets/images/squaredPaper/2.png'),
                     title: '基层小微权力监督一点通',
-                    path: 'communityPublicity'
+                    type: ''
-                },
-                {
-                    imgSrc: require('@/assets/images/squaredPaper/3.png'),
-                    title: '廉教中心',
-                    path: 'communityPublicity'
-                },
-                {
-                    imgSrc: require('@/assets/images/squaredPaper/4.png'),
-                    title: '廉政便民服务快车道',
-                    path: 'supervision'
-                },
-                {
-                    imgSrc: require('@/assets/images/squaredPaper/5.png'),
-                    title: '济宁消防廉线',
-                    path: 'communityPublicity'
                 },
                 {
                     imgSrc: require('@/assets/images/squaredPaper/6.png'),
-                    title: '清风郑州',
+                    title: '清风菏泽',
-                    path: 'communityPublicity'
+                    type: 'qfhz'
                 }
             ],
+            showQRCode:false,
+            qrType:null
         };
     },
     created() {
@@ -179,17 +163,17 @@ export default {
             const chineseCharsAndPunctuation = str.match(/[\u4e00-\u9fa5\u3000-\u303F\uff00-\uffef]/g);
             return chineseCharsAndPunctuation ? chineseCharsAndPunctuation.join('') : '';
         },
-        handelChangeTags(val, title) {
+    
-            this.PublicityList = [];
+        handelClickIcon(type){
-            if (val !== 0) {
+         if(type){
-                this.tagId = this.tagList[val].id;
+          this.showQRCode = true;
-            } else {
+          this.qrType = type;
-                this.tagId = '';
+         }else{
-            }
+          this.$toast('暂无二维码')
-            this.communityPublicity()
+         }
-        },
+        }
     },
-    components: {},
+    components: {qrDialog},
     computed: {},
     watch: {},
 }