修改登录页

src/router/index.ts

@@ -18,22 +18,22 @@ router.beforeEach((to, from, next) => {
         window.existLoading = true
     }
     console.log(to)
-    // if (to.path == '/login' || to.path == '/404') {
+    if (to.path == '/login' || to.path == '/404') {
-    //     // 登录或者注册才可以往下进行
+        // 登录或者注册才可以往下进行
-    //     next()
-    // } else {
-    //     // 获取 token
-    //     const token = localStorage.getItem('toKen')
-    //     // token 不存在
-    //     if (token === null || token === '') {
-    //         ElMessage.error('您还没有登录，请先登录')
-    //         next('/login')
-    //     } else {
-    //         next()
-    //     }
-    // }
-
         next()
+    } else {
+        // 获取 token
+        const token = localStorage.getItem('token')
+        // token 不存在
+        if (token === null || token === '') {
+            ElMessage.error('您还没有登录，请先登录')
+            next('/login')
+        } else {
+            next()
+        }
+    }
+
+    // next()
 })
 
 // 路由加载后

src/stores/adminInfo.ts

@@ -10,7 +10,7 @@ export const useAdminInfo = defineStore('adminInfo', {
             nickname: '',
             avatar: '',
             last_login_time: '',
-            token: '',
+            token: localStorage.getItem('token') || '',
             refresh_token: '',
             super: false
         }
@@ -26,7 +26,7 @@ export const useAdminInfo = defineStore('adminInfo', {
         setToken(token: string, type: 'auth' | 'refresh') {
             const field = type == 'auth' ? 'token' : 'refresh_token'
             this[field] = token
-            window.localStorage.setItem('token', token)
+            window.localStorage.setItem(field, token)
         },
         getToken(type: 'auth' | 'refresh' = 'auth') {
             return type === 'auth' ? this.token : this.refresh_token

src/views/user/login.vue

@@ -1,6 +1,8 @@
 <template>
     <div>
         <div @contextmenu.stop="" id="bubble" class="bubble">
+            <canvas id="bubble-canvas" class="bubble-canvas"></canvas>
+        </div>
         <div class="login-image"></div>
         <div class="login-container-form">
             <div class="title-container">
@@ -58,21 +60,25 @@
             <span>　　苏公网安备 32011502011902号</span>
         </div>
     </div>
-    </div>
 </template>
 
 <script setup lang="ts">
 import { onMounted, onBeforeUnmount, reactive, ref, nextTick } from 'vue'
 import * as pageBubble from '@/utils/pageBubble'
-import { sm3Digest } from '@/assets/commjs/sm3'
+import { sm3Digest } from '@/assets/commjs/sm3.js'
 import { sm2, encrypt } from '@/assets/commjs/sm2.js'
+import { ElMessage } from 'element-plus'
 import { gongkey, login } from '@/api/user'
+import { useAdminInfo } from '@/stores/adminInfo'
 import type { FormInstance, InputInstance, FormRules } from 'element-plus'
+import { useRouter } from 'vue-router'
+const router = useRouter()
 let timer: number
 
 const formRef = ref<FormInstance>()
 const usernameRef = ref<InputInstance>()
 const passwordRef = ref<InputInstance>()
+const useInfo = useAdminInfo()
 interface RuleForm {
     username: string
     password: string
@@ -114,7 +120,7 @@ const onSubmit = async (formEl: FormInstance | undefined) => {
     if (!formEl) return
     await formEl.validate((valid, fields) => {
         if (valid) {
-            console.log()
+            state.submitLoading = true
             gongkey({ loginName: encrypt(form.username) }).then(res => {
                 window.localStorage.setItem('publicKey', res.data)
                 let jiamipassword = sm2(sm3Digest(form.password) + '|' + form.password, res.data, 0)
@@ -125,14 +131,23 @@ const onSubmit = async (formEl: FormInstance | undefined) => {
                     imageCode: '',
                     verifyCode: 0
                 }).then(res => {
-                    window.localStorage.setItem('token', '123')
+                    if (res.code == 'A0000') {
+                        // window.localStorage.setItem('token', '123')
+                        useInfo.setToken(res.data.token_type + ' ' + res.data.access_token, 'auth')
+                        state.submitLoading = false
+                        router.push({
+                            path: '/admin/dashboard',
+                            name: 'dashboard'
+                        })
+                    } else {
+                        ElMessage({
+                            message: res.message,
+                            type: 'warning'
+                        })
+                        state.submitLoading = false
+                    }
                 })
             })
-            // routePush({ name: 'dashboard' })
-            // state.submitLoading = true
-            // setTimeout(() => {
-            //     state.submitLoading = false
-            // }, 3000)
         }
     })
 }
@@ -155,8 +170,8 @@ const onSubmit = async (formEl: FormInstance | undefined) => {
     position: absolute;
     top: 50%;
     left: 20%;
-    width: 45%;
+    min-width: 45%;
-    height: 80%;
+    min-height: 80%;
 
     background: url('../../assets/login/login2.png') no-repeat center center;
     background-size: contain;