geg-gas/geg-gas-web
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

----优化登录界面

Browse Source
This commit is contained in:
张福财
2025-12-29 16:51:37 +08:00
parent 3573e798c3
commit 1cadf58c92
9 changed files with 664 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/views/secondDev/Login.vue
View File

@ -1,16 +1,25 @@
<template>
<div :class="prefixCls" class="login-box relative w-full h-full" v-if="!isSingleLogin">
<div class="center-box">
<div class="login-left-title">
<div class="sub-title">{{ sysName }}</div>
<div class="t-container">
<StarBackground3 />
<div :class="prefixCls" class="login-box relative w-full h-full" v-if="!isSingleLogin">
<div class="center-box">
<div class="login-left-title">
<div class="sub-title">{{ sysName }}</div>
</div>
<div :class="`${prefixCls}-form`">
<LoginForm />
</div>
</div>
<div :class="`${prefixCls}-form`">
<LoginForm />
<div class="earth-wrapper">
<Earth3D />
</div>
</div>
</div>
<div style="width: 100%; height: 300px; display: flex; justify-content: center; align-items: center" v-else>
<a-spin />
<div style="width: 100%; height: 300px; display: flex; justify-content: center; align-items: center" v-else>
<a-spin />
</div>
<div v-if="isSingleLogin" class="absolute top-0 left-0 right-0 bottom-0 flex justify-center items-center">
<a-spin />
</div>
</div>
</template>
<script lang="ts" setup>
@ -26,6 +35,8 @@
import { useRouter } from 'vue-router';
import { useMessage } from '/@/hooks/web/useMessage';
import { useI18n } from '/@/hooks/web/useI18n';
import StarBackground3 from './StarBackground3.vue';
import Earth3D from './Earth3D.vue';
const { currentRoute } = useRouter();
const userStore = useUserStore();
@ -89,11 +100,29 @@
padding: 40px;
}
.t-container{
position: relative;
width: 100%;
height: 100vh;
background: #000;
}
.login-box {
display: flex;
background: linear-gradient(180deg, #00356d 0%, rgb(0 53 109 / 0%) 100%), linear-gradient(180deg, #0074d3 2%, #011853 100%);
align-items: center;
justify-content: center;
// display: flex;
// //background: linear-gradient(180deg, #00356d 0%, rgb(0 53 109 / 0%) 100%), linear-gradient(180deg, #0074d3 2%, #011853 100%);
// align-items: center;
// justify-content: center;
}
.earth-wrapper {
position: absolute;
left: 30%;
top: 50%;
transform: translate(-70%, -50%);
width: 700px;
height: 700px;
}
.logo-box {
@ -107,7 +136,14 @@
}
.center-box {
//background-color: #fff;
border: 1px solid #eaeaea;
border-radius: 10px;
overflow: hidden;
background-color: #fff;
position: absolute;
right: 15%;
top: 20%;
}
.login-left-title {