Ver código fonte

修改登录页样式

SanHQin 3 meses atrás
pai
commit
0b725ad2e2

+ 1 - 0
src/assets/login/account.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1744767402496" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8203" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M113.984 703.52c46.752-71.616 156.576-126.912 293.04-145.92a192 192 0 1 1 210 0c136.416 19.008 246.24 74.304 292.992 145.92A439.872 439.872 0 0 0 953.6 512 441.6 441.6 0 1 0 70.4 512c0 68.64 15.648 133.584 43.584 191.52zM512 992C246.896 992 32 777.104 32 512S246.896 32 512 32s480 214.896 480 480-214.896 480-480 480z" fill="#000000" p-id="8204"></path></svg>

+ 1 - 0
src/assets/login/form.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1744766934058" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2668" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M768 64 192 64C121.6 64 64 121.6 64 192l0 576c0 70.4 57.6 128 128 128l576 0c70.4 0 128-57.6 128-128L896 192C896 121.6 838.4 64 768 64zM640 672c0 17.92-14.08 32-32 32l-320 0C270.08 704 256 689.92 256 672l0 0C256 654.08 270.08 640 288 640l320 0C625.92 640 640 654.08 640 672L640 672zM256 480C256 462.08 270.08 448 288 448l256 0C561.92 448 576 462.08 576 480 576 497.92 561.92 512 544 512l-256 0C270.08 512 256 497.92 256 480zM672 320l-384 0C270.08 320 256 305.92 256 288 256 270.08 270.08 256 288 256l384 0C689.92 256 704 270.08 704 288 704 305.92 689.92 320 672 320z" p-id="2669" fill="#000000"></path></svg>

+ 31 - 18
src/views/login/loginPage.vue

@@ -5,10 +5,7 @@
 				v-if="form.basics && form.basics.loginBanner"
 				:src="form.basics.loginBanner"
 			/>
-			<img
-				v-else
-				src="@/assets/login.png"
-			/>
+			<img v-else src="@/assets/login.png" />
 		</div>
 		<div class="lp_right">
 			<div class="lp_r_box">
@@ -95,7 +92,7 @@
 				<div
 					class="lp_r_b_btn"
 					v-if="loginType == 'weChat'"
-					@click="loginType = 'default'"
+					style="opacity: 0; cursor: default"
 				>
 					账号密码登录
 				</div>
@@ -108,7 +105,7 @@
 					确认绑定
 				</div>
 				<div class="lp_r_b_line">
-					<template v-if="['default', 'weChat'].includes(loginType) && false">
+					<template v-if="['default', 'weChat'].includes(loginType)">
 						<div></div>
 						<span>其他登录方式</span>
 						<div></div>
@@ -117,10 +114,20 @@
 				<div class="lp_r_b_iconBtn">
 					<div
 						@click="loginType = 'weChat'"
-						v-show="false"
 						v-if="['default', 'weChat'].includes(loginType)"
 					>
-						<img src="@/assets/login/wechat.svg" />
+						<el-tooltip effect="dark" content="微信登录" placement="bottom">
+							<img src="@/assets/login/wechat.svg" />
+						</el-tooltip>
+					</div>
+
+					<div
+						@click="loginType = 'default'"
+						v-if="['default', 'weChat'].includes(loginType)"
+					>
+						<el-tooltip effect="dark" content="账号密码登录" placement="bottom">
+							<img src="@/assets/login/account.svg" />
+						</el-tooltip>
 					</div>
 				</div>
 			</div>
@@ -148,7 +155,7 @@ export default {
 			// 组织列表
 			OrgOptions: [],
 			form: {},
-			showName:"",
+			showName: "",
 		};
 	},
 	methods: {
@@ -272,9 +279,9 @@ export default {
 				.post(API_CONFIG.baseUrl, params)
 				.then((res) => {
 					let data = res.data[0];
-					console.log('data', data)
+					console.log("data", data);
 					this.form = JSON.parse(data[0].json);
-					this.showName = data[0].name
+					this.showName = data[0].name;
 				})
 				.catch((err) => {
 					console.error("请求失败,错误信息:", err);
@@ -341,7 +348,7 @@ export default {
 }
 
 .lp_r_box > span {
-	font-size: 48px;
+	font-size: 46px;
 	font-weight: bold;
 	margin: 40px 0;
 	display: block;
@@ -349,7 +356,7 @@ export default {
 
 .lp_r_b_formArea {
 	width: 100%;
-	height: 300px;
+	height: 250px;
 	margin-bottom: 40px;
 }
 
@@ -374,7 +381,7 @@ export default {
 
 .fa_i_item > div {
 	width: 100%;
-	height: 45px;
+	height: 40px;
 	border: solid 1px rgba(213, 213, 213, 1);
 	margin-top: 15px;
 	border-radius: 8px;
@@ -389,7 +396,7 @@ export default {
 	text-indent: 1em;
 
 	color: #000;
-	font-size: 16px;
+	font-size: 14px;
 	background: none;
 }
 
@@ -403,8 +410,8 @@ export default {
 	outline: none;
 	background: none;
 	text-indent: 1em;
-	font-size: 16px;
-	height: 45px;
+	font-size: 14px;
+	height: 40px;
 	padding-left: 0;
 	color: #000;
 }
@@ -447,7 +454,7 @@ export default {
 
 .lp_r_b_btn {
 	width: 100%;
-	height: 50px;
+	height: 45px;
 	background-color: rgba(0, 106, 254, 1);
 	border-radius: 10px;
 	display: flex;
@@ -502,5 +509,11 @@ export default {
 	width: 32px;
 	height: 32px;
 	cursor: pointer;
+	margin: 0 20px;
+}
+
+.lp_r_b_iconBtn > div > img {
+	width: 100%;
+	height: 100%;
 }
 </style>