feat：未登录不允许查看好友选项 (#112)

src/router/guard/index.ts

@@ -0,0 +1,8 @@
+import type { Router } from 'vue-router'
+import createPermissionGuard from './permissionGuard'
+
+const createGuard = (router: Router) => {
+  createPermissionGuard(router)
+}
+
+export default createGuard

src/router/guard/permissionGuard.ts

@@ -0,0 +1,32 @@
+import type { Router } from 'vue-router'
+
+import { useUserStore } from '@/stores/user'
+
+// 白名单，未登录用户可以访问
+const whiteList: Array<string | RegExp> = ['/']
+
+const whiteListTest = (path: string) => {
+  return whiteList.some((o) => {
+    if (o instanceof RegExp) {
+      return o.test(path)
+    } else {
+      return o === path
+    }
+  })
+}
+
+const createPermissionGuard = (router: Router) => {
+  router.beforeEach(async (to, from, next) => {
+    // 是否登录
+    const userStore = useUserStore()
+    const isSign = userStore.isSign
+
+    if (whiteListTest(to.path) || isSign) {
+      return next()
+    } else {
+      return next({ path: '/', replace: true })
+    }
+  })
+}
+
+export default createPermissionGuard

src/router/index.ts

@@ -1,4 +1,6 @@
 import { createRouter, createWebHistory } from 'vue-router'
+import createGuard from './guard'
+
 const HomeView = () => import(/* webpackChunkName: "Home" */ '@/views/Home/index.vue')
 const HomeChatView = () => import(/* webpackChunkName: "Home" */ '@/views/Home/Chat/index.vue')
 const HomeContactsView = () =>
@@ -31,4 +33,6 @@ const router = createRouter({
   ],
 })
 
+createGuard(router)
+
 export default router

src/views/Home/components/ToolBar/index.vue

@@ -78,7 +78,7 @@ const menuList = [
         </el-badge>
       </router-link>
       <!-- 联系人 -->
-      <router-link exactActiveClass="tool-icon-active" to="/contact">
+      <router-link v-login-show exactActiveClass="tool-icon-active" to="/contact">
         <el-badge
           :value="unReadMark.newFriendUnreadCount"
           :hidden="unReadMark.newFriendUnreadCount === 0"