refactor(登录): 用localStorage替换Cookies存储登录信息

移除Cookies相关依赖,改用localStorage存储用户名和密码
优化记住密码功能,处理布尔值到字符串的转换
清理未使用的注释代码
This commit is contained in:
砂糖
2026-01-04 18:11:22 +08:00
parent 42dbbf79ae
commit a0f03c374a

View File

@@ -2,7 +2,6 @@
<div class="login-page">
<div class="login-box">
<div class="login-left">
<div class="login-title-welcome">
<img src="../assets/logo/logo.png" alt="logo" class="logo-img" />
<span class="login-title">欢迎使用科伦普冷轧涂镀数智一体化平台</span>
@@ -17,7 +16,6 @@
</div>
<div class="login-right">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
<h2>登录</h2>
<el-form-item prop="username">
@@ -49,25 +47,14 @@
</el-button>
</el-form-item>
</el-form>
<!-- <div class="login-illustration">
<img src="https://sf3-scmcdn-cn.feishucdn.com/goofy/ee/suite/passport/static/login/img/light.ba71f7a1.png"
alt="illustration" class="illustration-img" />
<div class="login-slogan">
<div class="slogan-title">先进团队先用科伦普</div>
<div class="slogan-desc">信息一处搞定</div>
</div>
</div> -->
</div>
</div>
</div>
</template>
<script>
import { getCodeImg } from "@/api/login";
import Cookies from "js-cookie";
import { encrypt, decrypt } from '@/utils/jsencrypt'
import { encrypt, decrypt } from '@/utils/jsencrypt' // 保留加密解密工具
export default {
name: "Login",
@@ -75,8 +62,8 @@ export default {
return {
codeUrl: "",
loginForm: {
username: "",
password: "",
username: "", // 默认账号为空
password: "", // 默认密码为空
rememberMe: false,
code: "",
uuid: ""
@@ -108,7 +95,7 @@ export default {
},
created() {
this.getCode();
this.getCookie();
this.getLocalStorage(); // 初始化读取localStorage替换原来的getCookie
},
methods: {
getCode() {
@@ -120,36 +107,36 @@ export default {
}
});
},
getCookie() {
const username = Cookies.get("username");
const password = Cookies.get("password");
const rememberMe = Cookies.get('rememberMe')
// 读取localStorage中的账号密码替换原来的getCookie方法
getLocalStorage() {
const username = localStorage.getItem("username"); // 读取localStorage
const password = localStorage.getItem("password");
const rememberMe = localStorage.getItem('rememberMe');
this.loginForm = {
username: username === undefined ? this.loginForm.username : username,
password: password === undefined ? this.loginForm.password : decrypt(password),
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
username: username === null ? this.loginForm.username : username, // 无缓存则保持默认空值
password: password === null ? this.loginForm.password : decrypt(password), // 解密后填充密码
rememberMe: rememberMe === null ? false : (rememberMe === 'true'), // localStorage存储字符串需转为布尔值
code: "",
uuid: ""
};
},
handleLogin() {
this.$refs.loginForm.validate(valid => {
if (valid) {
this.loading = true;
// 根据是否勾选“记住密码”操作localStorage
if (this.loginForm.rememberMe) {
Cookies.set("username", this.loginForm.username, { expires: 30 });
Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 });
// 存储账号(明文,可按需加密)、加密后的密码、记住密码状态
localStorage.setItem("username", this.loginForm.username);
localStorage.setItem("password", encrypt(this.loginForm.password));
localStorage.setItem('rememberMe', this.loginForm.rememberMe.toString()); // 布尔值转字符串存储
} else {
Cookies.remove("username");
Cookies.remove("password");
Cookies.remove('rememberMe');
// 不勾选则清除localStorage中的对应缓存
localStorage.removeItem("username");
localStorage.removeItem("password");
localStorage.removeItem('rememberMe');
}
this.$store.dispatch("Login", this.loginForm).then(() => {
// this.$store.dispatch('category/getCategoryList');
// this.$store.dispatch('category/getProductMap');
// this.$store.dispatch('category/getRawMaterialMap');
// this.$store.dispatch('category/getBomMap');
// this.$store.dispatch('finance/getFinancialAccounts');
// this.$store.dispatch('craft/getProcessList');
this.$router.push({ path: this.redirect || "/" }).catch(() => { });
}).catch(() => {
this.loading = false;