✨ feat: 新增授权功能

hookehuyr
Commit 362e9144e98fd904422a6b1f6ffef9fdea442142 362e9144 1 parent ad80de09
Showing 5 changed files with 65 additions and 15 deletions
src/App.vue
src/components/common/hagerFooter.vue
src/route.js
src/utils/tools.js
src/views/auth.vue
--- a/src/App.vue
View file @362e914
+++ b/src/App.vue
View file @362e914
 <!--
  * @Date: 2024-09-26 13:36:06
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-11-19 14:30:13
+ * @LastEditTime: 2024-12-04 11:43:06
  * @FilePath: /hager/src/App.vue
  * @Description: 文件描述
 -->
@@ -9,7 +9,7 @@
   <div style="display: flex; flex-direction: column; min-height: 100vh; overflow: hidden;">
     <hager-header @onShowMenu="onShowMenu"></hager-header>
     <router-view :class="[!isLoginPage ? 'wrapper' : '', is_xs ? 'xs' : '']"></router-view>
-    <hager-footer v-if="!isLoginPage"></hager-footer>
+    <hager-footer v-if="!isLoginPage" @send-openid="sendOpenid"></hager-footer>
     <div v-if="showMask" class="mask">
     </div>
   </div>
@@ -19,6 +19,7 @@
 import hagerHeader from '@/components/common/hagerHeader.vue';
 import hagerFooter from '@/components/common/hagerFooter.vue';
 import mixin from '@/common/mixin';
+import { wxInfo } from '@/utils/tools';
 export default {
   // TAG：配置页面meta和标题信息
@@ -50,6 +51,16 @@ export default {
     onShowMenu (val) {
       this.showMask = val;
     },
+    sendOpenid (openid) {
+      if (wxInfo().isWeiXin && !openid) { // TAG: 微信环境下需要授权登录
+        this.$router.replace({
+          path: '/auth',
+          query: {
+            href: location.hash,
+          }
+        });
+      }
+    }
   }
 }
 </script>
--- a/src/components/common/hagerFooter.vue
View file @362e914
+++ b/src/components/common/hagerFooter.vue
View file @362e914
 <!--
  * @Date: 2024-09-26 13:42:22
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-11-07 11:01:58
+ * @LastEditTime: 2024-12-04 11:40:52
  * @FilePath: /hager/src/components/common/hagerFooter.vue
  * @Description: 文件描述
 -->
@@ -169,13 +169,14 @@ export default {
         e_title: 'Honors',
         content: '海格集团是行业创新领导者之一，我们与来自工业和电气领域的客户一起致力于引领面向未来的主题，如家庭互联、智能建筑技术、能源效率、生活辅助系统、电动交通、可再生能源。',
         link: '/about/honors',
-      }]
+      }],
     }
   },
   async mounted () {
     const { code, data } = await getFooterAPI();
     if (code) {
       this.footer_data = data;
+      this.$emit('send-openid', data.openid)
     }
   },
   methods: {
--- a/src/route.js
View file @362e914
+++ b/src/route.js
View file @362e914
 /*
  * @Date: 2024-08-26 10:42:15
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-11-29 14:06:03
+ * @LastEditTime: 2024-12-02 15:47:19
  * @FilePath: /hager/src/route.js
  * @Description: 文件描述
  */
@@ -213,4 +213,13 @@ export default [{
     tag: 'search'
   },
   children: []
+}, {
+  path: '/auth',
+  name: '授权页面',
+  component: () => import('@/views/auth'),
+  meta: {
+    title: '授权页面',
+    tag: 'auth'
+  },
+  children: []
 }]
--- a/src/utils/tools.js
View file @362e914
+++ b/src/utils/tools.js
View file @362e914
 /*
  * @Date: 2022-04-18 15:59:42
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2023-08-07 13:31:59
+ * @LastEditTime: 2024-12-02 15:45:06
- * @FilePath: /map-demo/src/utils/tools.js
+ * @FilePath: /hager/src/utils/tools.js
  * @Description: 文件描述
  */
 import dayjs from 'dayjs';
@@ -20,18 +20,18 @@ const wxInfo = () => {
   let u = navigator.userAgent;
   let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器
   let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
+  let isMobile = u.indexOf('Android') > -1 || u.indexOf('iPhone') > -1 || u.indexOf('iPad') > -1; // 移动端平台
+  let isIpad = u.indexOf('iPad') > -1; // iPad平台
   let uAgent = navigator.userAgent.toLowerCase();
-  let isTable = (uAgent.match(/MicroMessenger/i) == 'micromessenger') ? true : false;
+  let isWeiXin = (uAgent.match(/MicroMessenger/i) == 'micromessenger') ? true : false;
-  let isPC = uAgent.match(
+  let isPC = (uAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone|micromessenger)/i)) ? false : true;
-    /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone|micromessenger)/i,
-  )
-    ? false
-    : true;
   return {
     isAndroid,
     isiOS,
-    isTable,
+    isWeiXin,
-    isPC,
+    isMobile,
+    isIpad,
+    isPC
   };
 };
--- a/src/views/auth.vue 0 → 100644
View file @362e914
+++ b/src/views/auth.vue 0 → 100644
View file @362e914
+<!--
+ * @Date: 2022-08-29 13:55:31
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2024-12-04 11:36:15
+ * @FilePath: /hager/src/views/auth.vue
+ * @Description: 授权模块
+-->
+<template>
+  <div />
+</template>
+
+<script>
+export default {
+  mounted () {
+    // php需要先跳转链接获取openid
+    /**
+     * encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。
+     * 该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： - _ . ! ~ * ' ( ) 。
+     * 其他字符（比如 ：;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号），都是由一个或多个十六进制的转义序列替换的。
+     */
+    let raw_url = encodeURIComponent(location.origin + location.pathname + this.$route.query.href); // 未授权的地址
+    // TAG: 开发环境测试数据
+    const short_url = `/srv/?m=srv&a=openid&res=${raw_url}`;
+    location.href = import.meta.env.DEV
+      ? `${short_url}&openid=${import.meta.env.VITE_OPENID}`
+      : `${short_url}`;
+  }
+}
+</script>