Browse Source

实现记住密码功能

zhouyuhao 1 year ago
parent
commit
16ed49fccc
2 changed files with 40 additions and 39 deletions
  1. 39 38
      src/views/Login/src/loginView.vue
  2. 1 1
      vite.config.ts

+ 39 - 38
src/views/Login/src/loginView.vue

@@ -7,6 +7,7 @@ import CryptoJS from 'crypto-js'
 
 
 const router = useRouter()
 const router = useRouter()
 const route = useRoute()
 const route = useRoute()
+
 const loginForm = ref({
 const loginForm = ref({
   username: '',
   username: '',
   password: '',
   password: '',
@@ -14,6 +15,44 @@ const loginForm = ref({
   code: ''
   code: ''
 })
 })
 
 
+const isRememerPwd = ref(false)
+const secretKey = 'fT5!R1k$7Mv@4Q9X'
+// AES 加密函数
+const encryptPassword = (password) => {
+  return CryptoJS.AES.encrypt(password, secretKey).toString()
+}
+
+// AES 解密函数
+const decryptPassword = (encryptedPassword) => {
+  const bytes = CryptoJS.AES.decrypt(encryptedPassword, secretKey)
+  return bytes.toString(CryptoJS.enc.Utf8)
+}
+
+// 存储账号和加密后的密码
+const saveCredentials = () => {
+  clearCredentials()
+  const encryptedPassword = encryptPassword(loginForm.value.password) // 加密密码
+  localStorage.setItem('account', loginForm.value.username)
+  localStorage.setItem('password', encryptedPassword)
+}
+
+// 读取存储的账号和解密后的密码
+const getCredentials = () => {
+  const username = localStorage.getItem('account')
+  const encryptedPassword = localStorage.getItem('password')
+  if (username && encryptedPassword) {
+    const password = decryptPassword(encryptedPassword) // 解密密码
+    loginForm.value.username = username
+    loginForm.value.password = password
+  }
+}
+
+// 删除存储的账号和密码
+const clearCredentials = () => {
+  localStorage.removeItem('account')
+  localStorage.removeItem('password')
+}
+getCredentials()
 const status = ref(route.query.status || 'login')
 const status = ref(route.query.status || 'login')
 watch(status, () => {
 watch(status, () => {
   loginForm.value = {
   loginForm.value = {
@@ -163,44 +202,6 @@ const handleDeleteEmailTips = (type?: any) => {
 }
 }
 
 
 const errorTipsRef = ref()
 const errorTipsRef = ref()
-
-const isRememerPwd = ref(false)
-const secretKey = 'fT5!R1k$7Mv@4Q9X'
-// AES 加密函数
-const encryptPassword = (password) => {
-  return CryptoJS.AES.encrypt(password, secretKey).toString()
-}
-
-// AES 解密函数
-const decryptPassword = (encryptedPassword) => {
-  const bytes = CryptoJS.AES.decrypt(encryptedPassword, secretKey)
-  return bytes.toString(CryptoJS.enc.Utf8)
-}
-
-// 存储账号和加密后的密码
-const saveCredentials = () => {
-  clearCredentials()
-  const encryptedPassword = encryptPassword(loginForm.value.password) // 加密密码
-  localStorage.setItem('username', loginForm.value.username)
-  localStorage.setItem('password', encryptedPassword)
-}
-
-// 读取存储的账号和解密后的密码
-const getCredentials = () => {
-  const username = localStorage.getItem('username')
-  const encryptedPassword = localStorage.getItem('password')
-  if (username && encryptedPassword) {
-    const password = decryptPassword(encryptedPassword) // 解密密码
-    loginForm.value.username = username
-    loginForm.value.password = password
-  }
-}
-
-// 删除存储的账号和密码
-const clearCredentials = () => {
-  localStorage.removeItem('username')
-  localStorage.removeItem('password')
-}
 </script>
 </script>
 
 
 <template>
 <template>

+ 1 - 1
vite.config.ts

@@ -9,7 +9,7 @@ import IconsResolver from 'unplugin-icons/resolver'
 
 
 // https://vitejs.dev/config/
 // https://vitejs.dev/config/
 export default defineConfig({
 export default defineConfig({
-  base: `/new/`,
+  base: `/k_new_online/`,
   resolve: {
   resolve: {
     alias: {
     alias: {
       '@': fileURLToPath(new URL('./src', import.meta.url))
       '@': fileURLToPath(new URL('./src', import.meta.url))