|
|
@@ -60,7 +60,7 @@
|
|
|
<!-- 底部 -->
|
|
|
<div class="el-login-footer">
|
|
|
<span>{{companyName}}</span>
|
|
|
- <a :href="icpUrl" target="_bank">{{icpRecord}}</a>
|
|
|
+ <a :href="icpUrl" target="_blank">{{icpRecord}}</a>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -86,7 +86,7 @@ export default {
|
|
|
rememberMe: false,
|
|
|
code: "",
|
|
|
uuid: "",
|
|
|
- type:'1',
|
|
|
+ type: '1',
|
|
|
},
|
|
|
loginRules: {
|
|
|
account: [
|
|
|
@@ -107,8 +107,7 @@ export default {
|
|
|
immediate: true
|
|
|
}
|
|
|
},
|
|
|
- mounted () {
|
|
|
-
|
|
|
+ mounted() {
|
|
|
},
|
|
|
created() {
|
|
|
this.getCode();
|
|
|
@@ -119,49 +118,60 @@ export default {
|
|
|
getCodeImg().then(res => {
|
|
|
this.codeUrl = "data:image/gif;base64," + res.img;
|
|
|
this.loginForm.uuid = res.uuid;
|
|
|
- console.log(res.uuid)
|
|
|
+ }).catch(err => {
|
|
|
+ this.$message.error("验证码获取失败,请刷新重试");
|
|
|
+ console.error("验证码接口异常:", err);
|
|
|
});
|
|
|
},
|
|
|
+ // 读取Cookie中的账号密码
|
|
|
getCookie() {
|
|
|
const account = Cookies.get("account");
|
|
|
const password = Cookies.get("password");
|
|
|
const rememberMe = Cookies.get('rememberMe');
|
|
|
- // 使用扩展运算符保留原来 loginForm 中的属性,包括 type
|
|
|
+
|
|
|
+ // 保留原有loginForm属性(如type),仅覆盖Cookie中存在的值
|
|
|
this.loginForm = {
|
|
|
...this.loginForm,
|
|
|
- account: account === undefined ? this.loginForm.account : account,
|
|
|
- password: password === undefined ? this.loginForm.password : decrypt(password),
|
|
|
- rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
|
|
|
+ account: account || this.loginForm.account,
|
|
|
+ password: password ? decrypt(password) : this.loginForm.password,
|
|
|
+ rememberMe: rememberMe !== undefined ? Boolean(rememberMe) : this.loginForm.rememberMe
|
|
|
};
|
|
|
},
|
|
|
+ // 登录核心逻辑
|
|
|
handleLogin() {
|
|
|
this.$refs.loginForm.validate(valid => {
|
|
|
- if (valid) {
|
|
|
- this.loading = true;
|
|
|
- if (this.loginForm.rememberMe) {
|
|
|
- Cookies.set("account", this.loginForm.account, { expires: 30 });
|
|
|
- Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
|
|
|
- Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 });
|
|
|
- } else {
|
|
|
- Cookies.remove("account");
|
|
|
- Cookies.remove("password");
|
|
|
- Cookies.remove('rememberMe');
|
|
|
- }
|
|
|
- // 记录登录类型以便 Sidebar Logo 动态展示标题
|
|
|
- try {
|
|
|
- localStorage.setItem('loginType', this.loginForm.type)
|
|
|
- } catch (e) {}
|
|
|
- this.$store
|
|
|
- .dispatch("Login", this.loginForm)
|
|
|
- .then((res) => {
|
|
|
- this.$router.push({ path: "/index" });
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- this.loading = false;
|
|
|
- this.getCode();
|
|
|
- });
|
|
|
+ if (!valid) return; // 表单校验失败直接返回
|
|
|
+
|
|
|
+ this.loading = true;
|
|
|
+ // 处理记住密码逻辑
|
|
|
+ if (this.loginForm.rememberMe) {
|
|
|
+ Cookies.set("account", this.loginForm.account, { expires: 30 });
|
|
|
+ Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
|
|
|
+ Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 });
|
|
|
+ } else {
|
|
|
+ Cookies.remove("account");
|
|
|
+ Cookies.remove("password");
|
|
|
+ Cookies.remove('rememberMe');
|
|
|
}
|
|
|
|
|
|
+ this.$store.dispatch("Login", this.loginForm)
|
|
|
+ .then((res) => {
|
|
|
+ const loginType = res.doctor.doctorType;
|
|
|
+ const userRole = loginType === 1 ? 'doctor' : 'nurse';
|
|
|
+ localStorage.setItem('loginType', loginType);
|
|
|
+ localStorage.setItem('userRole', userRole);
|
|
|
+
|
|
|
+ // 登录成功跳转首页
|
|
|
+ this.$router.push({ path: "/index" });
|
|
|
+ this.$message.success("登录成功!");
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ // 登录失败处理
|
|
|
+ this.loading = false;
|
|
|
+ this.getCode(); // 刷新验证码
|
|
|
+ this.$message.error(err.message || "登录失败,请检查账号密码或验证码");
|
|
|
+ console.error("登录异常:", err);
|
|
|
+ });
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
@@ -173,11 +183,12 @@ export default {
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
- height: 100%;
|
|
|
+ height: 100vh;
|
|
|
width: 100%;
|
|
|
background-image: linear-gradient(#0e68c3, #1e99f5);
|
|
|
background-size: cover;
|
|
|
- .login-con{
|
|
|
+
|
|
|
+ .login-con {
|
|
|
width: 750px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
@@ -185,10 +196,12 @@ export default {
|
|
|
border-radius: 10px;
|
|
|
overflow: hidden;
|
|
|
background: #ffffff;
|
|
|
- .img-box{
|
|
|
+ box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
|
|
|
+
|
|
|
+ .img-box {
|
|
|
width: 460px;
|
|
|
height: 460px;
|
|
|
- img{
|
|
|
+ img {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
object-fit: cover;
|
|
|
@@ -196,10 +209,13 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.title {
|
|
|
margin: 0px auto 30px auto;
|
|
|
text-align: center;
|
|
|
color: #707070;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 500;
|
|
|
}
|
|
|
|
|
|
.login-form {
|
|
|
@@ -207,23 +223,32 @@ export default {
|
|
|
background: #ffffff;
|
|
|
width: 330px;
|
|
|
padding: 25px 25px 5px 25px;
|
|
|
+
|
|
|
.el-input {
|
|
|
height: 38px;
|
|
|
input {
|
|
|
height: 38px;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.input-icon {
|
|
|
height: 39px;
|
|
|
width: 14px;
|
|
|
margin-left: 2px;
|
|
|
}
|
|
|
+
|
|
|
+ .el-radio-group {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-radio-button {
|
|
|
+ margin: 0 15px;
|
|
|
+ }
|
|
|
}
|
|
|
-.login-tip {
|
|
|
- font-size: 13px;
|
|
|
- text-align: center;
|
|
|
- color: #bfbfbf;
|
|
|
-}
|
|
|
+
|
|
|
.login-code {
|
|
|
width: 33%;
|
|
|
height: 38px;
|
|
|
@@ -231,8 +256,12 @@ export default {
|
|
|
img {
|
|
|
cursor: pointer;
|
|
|
vertical-align: middle;
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ object-fit: cover;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.el-login-footer {
|
|
|
height: 40px;
|
|
|
line-height: 40px;
|
|
|
@@ -245,7 +274,14 @@ export default {
|
|
|
font-size: 12px;
|
|
|
letter-spacing: 1px;
|
|
|
}
|
|
|
+
|
|
|
.login-code-img {
|
|
|
height: 38px;
|
|
|
+ border-radius: 4px;
|
|
|
+}
|
|
|
+
|
|
|
+.el-radio-button__inner {
|
|
|
+ border-radius: 20px !important;
|
|
|
+ padding: 0 20px;
|
|
|
}
|
|
|
</style>
|