重新登录之前清除缓存

src/store/index.js

@@ -1,4 +1,4 @@
-import {createStore} from 'vuex'
+import { createStore } from 'vuex'
 import Presistent from './plugins/persistent'
 
 const debug = process.env.NODE_ENV !== 'production'
@@ -7,24 +7,24 @@ const files = import.meta.globEager('./modules/*.js')
 
 let modules = {}
 Object.keys(files).forEach((c) => {
-    const module = files[c].default
-    const moduleName = c.replace(/^\.\/(.*)\/(.*)\.\w+$/, '$2')
-    modules[moduleName] = module
+  const module = files[c].default
+  const moduleName = c.replace(/^\.\/(.*)\/(.*)\.\w+$/, '$2')
+  modules[moduleName] = module
 })
 
 const presistent = Presistent({
-    key: 'vuex',
-    modules,
-    modulesKeys: {
-        local: Object.keys(modules),
-        session: [],
-    },
+  key: 'vuex',
+  modules,
+  modulesKeys: {
+    local: Object.keys(modules),
+    session: [],
+  },
 })
 
 export default createStore({
-    modules: {
-        ...modules,
-    },
-    strict: debug,
-    plugins: [presistent],
+  modules: {
+    ...modules,
+  },
+  strict: debug,
+  plugins: [presistent],
 })

src/store/plugins/persistent.js

@@ -1,4 +1,3 @@
-const exclude = ['actions', 'getters', 'mutations', 'namespaced']
 export default function Presistent({ key, modules, modulesKeys }) {
   return (store) => {
     const localOldState = JSON.parse(localStorage.getItem(key) || '{}')
@@ -36,4 +35,4 @@ function setData(state, module) {
     data[i] = state[i]
   }
   return data
-}
+}

src/views/Login.vue

@@ -1,246 +0,0 @@
-<template>
-  <div class="login-box">
-    <h2>泰和工作集成平台</h2>
-    <form>
-      <div class="user-box">
-        <input type="text" v-model="user.codeRs" @keyup.enter="submit" required="required" />
-        <label>工号</label>
-      </div>
-      <div class="user-box">
-        <input type="password" v-model="user.password" @keyup.enter="submit" required="required" />
-        <label>密码</label>
-      </div>
-      <p class="tip">初始密码为：123456</p>
-      <a @click="submit">
-        <span></span>
-        <span></span>
-        <span></span>
-        <span></span>
-        登录
-      </a>
-    </form>
-  </div>
-</template>
-<script>
-import { closeWebSocket } from '@/utils/websocket'
-import { onMounted, reactive } from 'vue'
-import { login } from '@/api/login'
-import Cookies from 'js-cookie'
-import router from '@/router'
-export default {
-  name: 'Login',
-  setup() {
-    const user = reactive({
-      codeRs: '',
-      password: '',
-    })
-    const submit = () => {
-      login(user).then((res) => {
-        Cookies.set('code', res.code)
-        Cookies.set('sid', res.sid)
-        Cookies.set('token', res.token)
-        Cookies.set('name', res.name)
-        Cookies.set('roles', res.roles)
-        Cookies.set('dept', res.deptCode)
-        router.push('/')
-      })
-    }
-
-    onMounted(() => {
-      closeWebSocket()
-    })
-    return {
-      user,
-      submit,
-    }
-  },
-}
-</script>
-<style>
-.tip {
-  color: wheat;
-}
-html {
-  height: 100%;
-}
-body {
-  margin: 0;
-  padding: 0;
-  font-family: sans-serif;
-  background: linear-gradient(#141e30, #243b55);
-}
-
-.login-box {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  width: 400px;
-  padding: 40px;
-  transform: translate(-50%, -50%);
-  background: rgba(0, 0, 0, 0.5);
-  box-sizing: border-box;
-  box-shadow: 0 15px 25px rgba(0, 0, 0, 0.6);
-  border-radius: 10px;
-}
-
-.login-box h2 {
-  margin: 0 0 30px;
-  padding: 0;
-  color: #fff;
-  text-align: center;
-}
-
-.login-box .user-box {
-  position: relative;
-}
-
-.login-box .user-box input {
-  width: 100%;
-  padding: 10px 0;
-  font-size: 16px;
-  color: #fff;
-  margin-bottom: 30px;
-  border: none;
-  border-bottom: 1px solid #fff;
-  outline: none;
-  background: transparent;
-}
-
-/**
-* 下面这两个css 样式是去掉浏览器中 自动填充带来的别的样式冲突
-*/
-input:-webkit-autofill {
-  -webkit-text-fill-color: white !important; /*浏览器记住密码的字的颜色*/
-  transition: background-color 5000s ease-in-out 0s; /*通过延时渲染背景色变相去除背景颜色*/
-  caret-color: #acfff2; /*光标颜色*/
-}
-
-input:focus {
-  outline: none;
-} /*外边框线去除*/
-
-.login-box .user-box label {
-  position: absolute;
-  top: 0;
-  left: 0;
-  padding: 10px 0;
-  font-size: 16px;
-  color: #fff;
-  pointer-events: none;
-  transition: 0.5s;
-}
-
-.login-box .user-box input:focus ~ label,
-.login-box .user-box input:valid ~ label {
-  top: -20px;
-  left: 0;
-  color: #03e9f4;
-  font-size: 12px;
-}
-
-.login-box form a {
-  position: relative;
-  display: inline-block;
-  padding: 10px 20px;
-  color: #03e9f4;
-  font-size: 16px;
-  text-decoration: none;
-  text-transform: uppercase;
-  overflow: hidden;
-  transition: 0.5s;
-  margin-top: 40px;
-  letter-spacing: 4px;
-}
-
-.login-box a:hover {
-  background: #03e9f4;
-  cursor: pointer;
-  color: #fff;
-  border-radius: 5px;
-  box-shadow: 0 0 5px #03e9f4, 0 0 25px #03e9f4, 0 0 50px #03e9f4, 0 0 100px #03e9f4;
-}
-
-.login-box a span {
-  position: absolute;
-  display: block;
-}
-
-.login-box a span:nth-child(1) {
-  top: 0;
-  left: -100%;
-  width: 100%;
-  height: 2px;
-  background: linear-gradient(90deg, transparent, #03e9f4);
-  animation: btn-anim1 1s linear infinite;
-}
-
-@keyframes btn-anim1 {
-  0% {
-    left: -100%;
-  }
-  50%,
-  100% {
-    left: 100%;
-  }
-}
-
-.login-box a span:nth-child(2) {
-  top: -100%;
-  right: 0;
-  width: 2px;
-  height: 100%;
-  background: linear-gradient(180deg, transparent, #03e9f4);
-  animation: btn-anim2 1s linear infinite;
-  animation-delay: 0.25s;
-}
-
-@keyframes btn-anim2 {
-  0% {
-    top: -100%;
-  }
-  50%,
-  100% {
-    top: 100%;
-  }
-}
-
-.login-box a span:nth-child(3) {
-  bottom: 0;
-  right: -100%;
-  width: 100%;
-  height: 2px;
-  background: linear-gradient(270deg, transparent, #03e9f4);
-  animation: btn-anim3 1s linear infinite;
-  animation-delay: 0.5s;
-}
-
-@keyframes btn-anim3 {
-  0% {
-    right: -100%;
-  }
-  50%,
-  100% {
-    right: 100%;
-  }
-}
-
-.login-box a span:nth-child(4) {
-  bottom: -100%;
-  left: 0;
-  width: 2px;
-  height: 100%;
-  background: linear-gradient(360deg, transparent, #03e9f4);
-  animation: btn-anim4 1s linear infinite;
-  animation-delay: 0.75s;
-}
-
-@keyframes btn-anim4 {
-  0% {
-    bottom: -100%;
-  }
-  50%,
-  100% {
-    bottom: 100%;
-  }
-}
-</style>

src/views/system/login.vue

@@ -42,7 +42,6 @@ import { closeWebSocket } from '../../utils/websocket'
 
 export default defineComponent({
   setup() {
-    closeWebSocket()
     const store = useStore()
     const router = useRouter()
     const route = useRoute()
@@ -92,8 +91,9 @@ export default defineComponent({
       })
     }
 
-    onActivated(() => {
+    onMounted(() => {
       closeWebSocket()
+      localStorage.clear()
     })
 
     return {