Browse Source

完成登陆界面,

cauto 2 years ago
parent
commit
54d634b728
2 changed files with 50 additions and 9 deletions
  1. 48 6
      src/router/index.ts
  2. 2 3
      src/view/login/login.vue

+ 48 - 6
src/router/index.ts

@@ -1,19 +1,27 @@
 import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
 import HelloWorld from '/@/components/HelloWorld.vue'
-import Index from '/@/view/index/index.vue'
+import Home from '/@/view/index/index.vue'
 import Node from '/@/view/node/index.vue'
 import Task from '/@/view/task/index.vue'
-import Login from '/@/view/login/index.vue'
-import index from "/@/view/index/index.vue";
-import main from "/@/view/main.vue";
-
+import Login from '/@/view/login/login.vue'
+import Main from "/@/view/main.vue";
 
 const routes: Array<RouteRecordRaw> = [
 
     {
         path: '/',
         name: 'index',
-        component: Login
+        redirect: Login
+    },
+    {
+        path: '/main',
+        name: 'main',
+        component: Main
+    },
+    {
+        path: '/home',
+        name: 'home',
+        component: Home
     },
     {
         path:'/node',
@@ -24,7 +32,41 @@ const routes: Array<RouteRecordRaw> = [
         path:'/task',
         name: 'task',
         component:Task
+    },
+    {
+        path:'/login',
+        name: 'login',
+        component:Login
     }
 ]
 const router = createRouter({ history: createWebHashHistory(), routes })
 export default router
+
+
+router.beforeEach((to, from, next) => {
+    // 获取 token
+    const token = localStorage.getItem('token')
+    // 如果有token
+    if (token !== null && token !== '') {
+        // 带有token访问登录页面跳转至主页
+        if (to.path === '/login') {
+            console.log('token1')
+            next({ name: 'Vue_messageDemo' })
+        } else {
+            // 带有token访问其他页面允许跳转
+            next()
+        }
+    } else {
+        // 没有token
+        // 没有token访问登录页面允许
+        if (to.path === '/login') {
+            next()
+        } else {
+            // 没有token访问其他页面跳转至登录页面
+            next({
+                path: '/login',
+                query: { redirect: to.fullPath }
+            })
+        }
+    }
+})

+ 2 - 3
src/view/login/login.vue

@@ -1,5 +1,4 @@
 <template>
-  <div>ceshi</div>
   <div class="login-container">
     <h2 class="login-title">登陆页面</h2>
     <a-form ref="form" :model="form" class="login-form">
@@ -65,7 +64,7 @@ export default defineComponent({
   position: absolute;
   width: 100%;
   height: 100%;
-  background: white;
+  background: #000c17;
   background-size: 100% 100%;
 }
 
@@ -97,4 +96,4 @@ export default defineComponent({
 .ant-input-affix-wrapper .ant-input:not(:first-child) {
   padding-left: 50px;
 }
-</style>
+</style>