admin/django-vue3-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

登陆界面美化

Browse Source
This commit is contained in:
liyimin
2025-10-31 23:26:27 +08:00
parent 163e5eb2db
commit 8d6abeb891
3 changed files with 46 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
web/src/views/system/login/component/account.vue
View File

@@ -187,7 +187,7 @@ export default defineComponent({
// 初始化登录成功时间问候语
let currentTimeInfo = currentTime.value;
// 登录成功，跳到转首页
const pwd_change_count = userInfos.value.pwd_change_count
const pwd_change_count = userInfos.value.pwd_change_count ?? 0
if(pwd_change_count > 0){
// 如果是复制粘贴的路径，非首页/登录页，那么登录成功后重定向到对应的路径中
if (route.query?.redirect) {
@@ -234,16 +234,37 @@ export default defineComponent({
</script>
<style scoped lang="scss">
// 定义error-num动画的关键帧
@keyframes error-num {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.login-content-form {
margin-top: 20px;
// 为输入框添加圆角和设置字体大小
:deep(.el-input__wrapper) {
border-radius: 8px !important;
}
// 设置输入框文字大小
:deep(.el-input__inner) {
font-size: 12px !important; // Element Plus large尺寸的默认字体大小
}
@for $i from 1 through 4 {
.login-animation#{$i} {
opacity: 0;
animation-name: error-num;
animation-duration: 0.5s;
animation-fill-mode: forwards;
animation-delay: calc($i/10) + s;
animation-delay: #{$i/10}s;
}
}
@@ -253,7 +274,7 @@ export default defineComponent({
cursor: pointer;
&:hover {
color: #909399;
color: #909397;
}
}
@@ -262,6 +283,7 @@ export default defineComponent({
padding: 0;
font-weight: bold;
letter-spacing: 5px;
border-radius: 8px !important;
}
.login-content-submit {
@@ -269,6 +291,7 @@ export default defineComponent({
letter-spacing: 2px;
font-weight: 800;
margin-top: 15px;
border-radius:8px;
}
}
</style>

11
web/src/views/system/login/component/changePwd.vue
View File

@@ -239,6 +239,15 @@ export default defineComponent({
.login-content-form {
margin-top: 20px;
// 为输入框添加圆角和设置字体大小
:deep(.el-input__wrapper) {
border-radius: 8px !important;
}
// 设置输入框文字大小
:deep(.el-input__inner) {
font-size: 12px !important; // Element Plus large尺寸的默认字体大小
}
@for $i from 1 through 5 {
.login-animation#{$i} {
opacity: 0;
@@ -264,6 +273,7 @@ export default defineComponent({
padding: 0;
font-weight: bold;
letter-spacing: 5px;
border-radius: 8px !important;
}
.login-content-submit {
@@ -271,6 +281,7 @@ export default defineComponent({
letter-spacing: 2px;
font-weight: 800;
margin-top: 15px;
border-radius:8px;
}
}
</style>

19
web/src/views/system/login/index.vue
View File

@@ -5,8 +5,6 @@
<img :src="siteLogo" />
<div class="login-left-logo-text">
<span>{{ getSystemConfig['login.site_title'] || getThemeConfig.globalViceTitle }}</span>
<span class="login-left-logo-text-msg" style="margin-top: 5px;">{{
getSystemConfig['login.site_name'] || getThemeConfig.globalViceTitleMsg }}</span>
</div>
</div>
</div>
@@ -16,7 +14,9 @@
<!-- <span class="login-right-warp-two"></span>-->
<div class="login-right-warp-mian">
<div class="login-right-warp-main-title">
{{userInfos.pwd_change_count===0?'初次登录修改密码':'欢迎登录'}}
<span>{{getSystemConfig['login.site_name'] || getThemeConfig.globalViceTitleMsg }}</span>
<br>
<span>{{userInfos.pwd_change_count===0?'初次登录请修改密码':'欢迎登录'}}</span>
</div>
<div class="login-right-warp-main-form">
<div v-if="!state.isScan">
@@ -168,14 +168,11 @@ onMounted(() => {
span {
margin-left: 10px;
font-size: 16px;
font-size: 24px;
color: var(--el-color-primary);
}
.login-left-logo-text-msg {
font-size: 12px;
color: var(--el-color-primary);
}
}
}
@@ -280,10 +277,10 @@ onMounted(() => {
flex-direction: column;
height: 100%;
.login-right-warp-main-title {
height: 130px;
line-height: 130px;
font-size: 32px;
font-size: 24px;
font-weight: 600;
text-align: center;
letter-spacing: 3px;
@@ -347,7 +344,7 @@ onMounted(() => {
text-align: center;
p {
font-size: 14px;
font-size: 12px;
color: rgba(0, 0, 0, 0.5);
}