From 91f61aa4bab9cfead8ff7e172f5ea47889f83a3e Mon Sep 17 00:00:00 2001
From: 祖安之光 <11848914+light-of-zuan@user.noreply.gitee.com>
Date: 星期五, 22 八月 2025 15:29:07 +0800
Subject: [PATCH] 修改新增
---
src/views/homePage.vue | 107 ++++++++++++++++++++++++++++++++++++++++++++---------
1 files changed, 89 insertions(+), 18 deletions(-)
diff --git a/src/views/homePage.vue b/src/views/homePage.vue
index f70c6c5..fdb7074 100644
--- a/src/views/homePage.vue
+++ b/src/views/homePage.vue
@@ -1,12 +1,14 @@
<template>
<el-row class="login-panel">
- <el-col :sm="24" :md="12" class="login-img">
- 多体系<br/>建设信息化条统
+ <el-col :sm="24" :md="13" class="login-img">
+
</el-col>
- <el-col :sm="24" :md="12" class="login-box">
+ <el-col :sm="24" :md="11" class="login-box">
+ <div class="glass-bg"></div>
+ <div class="login-title">多体系<br/>建设信息化系统</div>
<div class="login-card">
<el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
- <h3 class="title">登录系统</h3>
+ <h3 class="title">欢迎登录</h3>
<el-form-item prop="username">
<el-input
v-model="loginForm.username"
@@ -138,7 +140,6 @@
loading.value = true;
Cookies.set("username", loginForm.value.username, { expires: 30 });
Cookies.set("password", encrypt(loginForm.value.password), { expires: 30 });
-
const param = {
username: loginForm.value.username,
password: Base64.encode(loginForm.value.password),
@@ -147,14 +148,18 @@
identity: loginForm.value.role
}
userStore.login(param).then(() => {
- const query = route.query;
- const otherQueryParams = Object.keys(query).reduce((acc, cur) => {
- if (cur !== "redirect") {
- acc[cur] = query[cur];
- }
- return acc;
- }, {});
- router.push({ path: redirect.value || "/", query: otherQueryParams });
+ if (redirect.value && redirect.value !== '/index') {
+ const query = route.query;
+ const otherQueryParams = Object.keys(query).reduce((acc, cur) => {
+ if (cur !== "redirect") {
+ acc[cur] = query[cur];
+ }
+ return acc;
+ }, {});
+ router.push({ path: redirect.value, query: otherQueryParams });
+ } else {
+ router.push({ path: "/menuPage" });
+ }
}).catch(() => {
loading.value = false;
// 重新获取验证码
@@ -196,10 +201,36 @@
font-style: normal;
font-weight: normal;
}
+
+@keyframes move {
+ 0% {
+ -webkit-transform: translateX(100%);
+ -ms-transform: translateX(100%);
+ transform: translateX(100%);
+ }
+
+ 100% {
+ -webkit-transform: translateX(0);
+ -ms-transform: translateX(0);
+ transform: translateX(0);
+ }
+}
+
+@keyframes show {
+ 100% {
+ -webkit-transform: translateY(0);
+ -ms-transform: translateY(0);
+ transform: translateY(0);
+ -webkit-opacity: 1;
+ -ms-opacity: 1;
+ opacity: 1
+ }
+}
+
.login-panel{
width: 100%;
height: 100%;
- background: url("@/assets/images/bg4.png") no-repeat center;
+ background: url("@/assets/images/bg6.jpg") no-repeat center;
background-size: cover;
justify-content: center;
align-items: center;
@@ -211,28 +242,68 @@
align-items: center;
font-family: 'AliMa';
color: #fff;
- font-size: 3.2rem;
+ font-size: clamp(3rem, 1.286rem + 2.68vw, 4.5rem);
+ letter-spacing: 10px;
text-align: center;
line-height: 1.5;
transform: translateY(-80px);
text-shadow: -10px 10px 20px rgba(0,0,0,.4);
}
.login-box{
+ position: relative;
display: flex;
+ flex-direction: column;
justify-content: center;
align-items: center;
- transform: translateY(-40px);
+ height: 100%;
+ overflow: hidden;
+
+ .glass-bg{
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 0;
+ background: (255,255,255,.8);
+ backdrop-filter: blur(4px);
+ -webkit-backdrop-filter: blur(4px);
+ border-left: 2px solid rgba(255,255,255,.4);
+ animation: move 0.6s ease-in-out forwards;
+ }
+ .login-title{
+ font-family: 'AliMa';
+ color: #2563eb;
+ font-size: clamp(3rem, 1.286rem + 2.68vw, 4.5rem);
+ line-height: 1.2;
+ text-shadow: 0 5px 10px rgba(37,99,235,.3);
+ margin-bottom: 40px;
+ transform: translateY(20px);
+ -webkit-transform: translateY(20px);
+ -ms-transform: translateY(20px);
+ opacity: 0;
+ -webkit-opacity: 0;
+ -ms-opacity: 0;
+ animation: show 0.5s 0.7s ease-in-out forwards;
+ }
.login-card{
width: 500px;
padding: 30px;
border-radius: 16px;
- background-color: rgba(255,255,255,.2);
+ background-color: rgba(255,255,255,.8);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
border: 1px solid rgba(255,255,255,.4);
max-width: 100%;
box-sizing: border-box;
box-shadow: 0 10px 20px rgba(0,0,0,.05);
+ transform: translateY(20px);
+ -webkit-transform: translateY(20px);
+ -ms-transform: translateY(20px);
+ opacity: 0;
+ -webkit-opacity: 0;
+ -ms-opacity: 0;
+ animation: show 0.5s 0.7s ease-in-out forwards;
}
.login-form {
width: 100%;
@@ -241,7 +312,7 @@
.title{
margin: 0 0 30px;
text-align: center;
- color: #fff
+ color: #333
}
.el-form-item{
--
Gitblit v1.9.2