ソースを参照

reactor:登录页面调整;

zhangchong 1 年間 前
コミット
9c0c998da5

BIN
src/assets/images/login/bg.png


+ 7 - 6
src/views/login/component/Account.vue

@@ -71,9 +71,11 @@
 				<el-button type="primary" class="login-content-submit" round @click="onSignIn(ruleFormRef)" :loading="state.loading">登录</el-button>
 			</el-form-item>
 		</motion>
-		<!-- <div class="font12 mt30 login-msg">
-			* 温馨提示:建议使用谷歌、Microsoft Edge,版本 79.0.1072.62 及以上浏览器,360浏览器请使用极速模式
-		</div> -->
+    <motion :delay="500">
+       <div class="mt10">
+        运营管理系统 <span class="color-danger font-bold">v5.0</span>
+      </div>
+    </motion>
 		<motion :delay="500">
 			<div class="login-msg">
 				<div>联系管理员<b>重置密码</b></div>
@@ -258,8 +260,7 @@ const signInSuccess = (isNoPower: boolean | undefined) => {
 
 	.login-content-submit {
 		width: 100%;
-		font-weight: 300;
-		margin-top: 85px;
+		margin-top: 45px;
 		height: 50px;
 		border-radius: 30px;
 		font-size: 16px;
@@ -267,7 +268,7 @@ const signInSuccess = (isNoPower: boolean | undefined) => {
 	}
 
 	.login-msg {
-		margin-top: 39px;
+		margin-top: 10px;
 		display: flex;
 		justify-content: space-between;
 		align-items: center;

+ 9 - 5
src/views/login/index.vue

@@ -1,5 +1,6 @@
 <template>
 	<div class="login-container w100 h100">
+		<img :src="getImageUrl('logo.png')" class="login-container-logo" alt="" />
 		<div class="login-content">
 			<div class="login-content-main">
 				<Motion>
@@ -67,12 +68,17 @@ onMounted(async () => {
 	// background-image: url("@/assets/images/login/bg.png");
 	background-repeat: no-repeat;
 	background-size: calc(100vw + 1px) calc(100vh + 1px);
-
+	&-logo {
+		position: absolute;
+		top:8vh;
+		left: calc(50% - 125px);
+		width: 250px;
+	}
 	.login-content {
 		width: 500px;
-		padding: 83px 80px 60px 80px;
+		padding: 40px 40px 30px;
 		position: absolute;
-		right: 10vw;
+		left: calc(50% - 250px);
 		top: 50vh;
 		transform: translateY(-50%) translate3d(0, 0, 0);
 		background-color: var(--el-color-white);
@@ -80,10 +86,8 @@ onMounted(async () => {
 		overflow: hidden;
 		z-index: 1;
 		box-shadow: 0 0 20px 0 rgba(26, 64, 144, 0.46);
-
 		.login-content-main {
 			margin: 0 auto;
-
 			.login-content-title {
 				color: var(--el-color-primary);
 				font-size: 28px;