修改登录页面

This commit is contained in:
limengnan 2025-12-08 09:17:57 +08:00
parent 1b1bada016
commit 58a135fe74
3 changed files with 62 additions and 46 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 254 KiB

View File

@ -2579,9 +2579,6 @@ function refreshClick(type) {
padding: 12px 20px !important;
}
.el-card__body {
padding: 20px !important;
}
.el-button--primary:hover {
--el-button-bg-color: #A325B0 !important;

View File

@ -5,11 +5,12 @@
<div class="login-content">
<!-- 系统标题 -->
<div style="margin-right: 150px;">
<h1 class="system-login-title">欢迎登录</h1>
<h1 class="system-title">平衡体态检测系统</h1>
<!-- 登录页面 -->
<el-card v-if="!isRegisterMode && !isForgotPasswordMode" class="login-card">
<div class="card-header">欢迎登录</div>
<el-form class="login-form">
<!-- 账号输入框 -->
@ -51,7 +52,7 @@
<!-- 记住密码 & 忘记密码 -->
<div class="form-footer">
<el-checkbox v-model="form.remember" class="remember-checkbox" @change="handleRememberChange">记住账号及密码</el-checkbox>
<el-checkbox v-model="form.remember" class="remember-checkbox" @change="handleRememberChange">记住密码</el-checkbox>
<a href="#" class="forgot-link" @click="handleForgotPassword">忘记密码</a>
</div>
@ -222,7 +223,7 @@ import { ElMessage } from 'element-plus'
import { useAuthStore } from '../stores'
import { User, Lock, View, Hide, Phone } from '@element-plus/icons-vue'
import bg from '@/assets/new/newbg.jpg'
import bg from '@/assets/bg.jpg'
import { getBackendUrl,systemAPI } from '../services/api.js'
// import Model from './model.vue'
const BACKEND_URL = getBackendUrl()
@ -623,6 +624,7 @@ const copyPassword = async () => {
width: 100vw;
height: 100vh;
background-color: #000;
background-size:100% 100% ;
overflow: hidden;
}
@ -680,27 +682,25 @@ const copyPassword = async () => {
/* 系统标题 */
.system-title {
text-align: center;
font-family: 'Noto Sans SC';
font-family: 'Noto Sans SC Bold', 'Noto Sans SC Regular', 'Noto Sans SC';
font-weight: 700;
font-style: normal;
font-size: 40px;
color: rgb(255, 255, 255);
margin-bottom: 30px;
letter-spacing: 2px;
font-size: 48px;
color: #14AAFF;
padding-top: 15px;
padding-bottom: 40px;
}
/* 登录卡片 */
.login-card {
width: 482px;
height: 450px;
background-color: #1D1C21;
width: 450px;
/* height: 450px; */
background-color: transparent;
box-sizing: border-box;
border-width: 3px;
border-style: solid;
border-color: #1D1C21;
border-width: 0;
border-radius: 5px;
padding: 40px 25px 0;
box-shadow: 0 0 0px rgba(0, 0, 0, 0);
padding: 0px 0px 0;
}
/* 注册卡片 */
@ -730,7 +730,9 @@ const copyPassword = async () => {
.login-form {
width: 100%;
}
:deep(.el-card__body) {
padding: 0 !important;
}
/* 自定义输入框 */
/* .custom-input {
background-color: #004080 !important;
@ -763,21 +765,15 @@ const copyPassword = async () => {
}
/* 记住密码复选框 */
.remember-checkbox {
color: #fff !important;
}
.remember-checkbox .el-checkbox__input.is-checked .el-checkbox__inner {
background-color: #00ffff !important;
border-color: #00ffff !important;
}
.remember-checkbox .el-checkbox__inner {
border-color: #00ffff !important;
}
/* 忘记密码链接 */
.forgot-link {
color: #ffffff;
text-decoration: none;
font-family: 'Noto Sans SC';
font-weight: 400;
font-style: normal;
font-size: 14px;
color: #FFFFFF;
}
.forgot-link:hover {
text-decoration: underline;
@ -791,18 +787,20 @@ const copyPassword = async () => {
/* 登录按钮 */
.login-btn {
flex: 1;
background-color: #266fff !important;
border-color: #266fff !important;
color: #fff !important;
font-weight: 500 !important;
border-radius: 6px !important;
height: 50px;
font-size: 16px;
width: 450px;
height: 60px;
background: inherit;
background-color: rgba(11, 148, 213, 1);
border-color: rgba(11, 148, 213, 1) !important;
font-family: 'Noto Sans SC';
font-weight: 400;
font-style: normal;
font-size: 20px;
color: #FFFFFF;
}
.login-btn:hover {
background-color: #266fff !important;
border-color: #266fff !important;
background-color: #14aaff !important;
border-color: #14aaff !important;
}
/* 注册按钮 */
@ -1141,13 +1139,13 @@ const copyPassword = async () => {
.input-box{
display: flex;
align-items: center;
width: 100%;
height: 49px;
background-color: rgba(255, 255, 255, 0);
width: 450px;
height: 60px;
background-color: rgba(255, 255, 255, 0.1);
box-sizing: border-box;
border-width: 1px;
border-style: solid;
border-color: rgb(67, 67, 67);
border-color: transparent;
border-radius: 3px;
}
</style>
@ -1173,7 +1171,28 @@ const copyPassword = async () => {
.login-card .el-button{
padding: 12px 20px !important;
height: 50px;
height: 60px;
}
.system-login-title{
font-family: 'Noto Sans SC Bold', 'Noto Sans SC Regular', 'Noto Sans SC';
font-weight: 700;
font-style: normal;
font-size: 30px;
color: #FFFFFF;
}
.remember-checkbox {
color: #fff !important;
}
.remember-checkbox .el-checkbox__input.is-checked .el-checkbox__inner {
background-color: #0b94d5 !important;
border-color: #0b94d5 !important;
}
.remember-checkbox .el-checkbox__inner {
border-color: #fff !important;
background: transparent;
}
</style>