登录页面适配平板设备

pages/login/login.vue

@@ -41,7 +41,7 @@ export default {
 	data() {
 		return {
 			loginMethod: "",
-			height: this.usePort == 'h5' ? "100px" : "150px",
+			height: this.usePort == 'h5' ? "100px" : "100px",
 			isAgreement: false
 		};
 	},

pages/login/modules/account.vue

@@ -2,19 +2,21 @@
 	<view class="container">
 		<view class="input-box">
 			<view class="iconfont icon-zhanghao" />
-			<input class="input" type="text" :value="account.account" placeholder="请输入账号" data-name='account'
-				@input="onInput">
+			<input class="input" placeholder-class="placeholder" type="text" :value="account.account" placeholder="请输入账号"
+				data-name='account' @input="onInput">
 		</view>
 		<view class="input-box" style="margin-top:15px;">
 			<view class="iconfont icon-mima" />
-			<input class="input" type="password" :value="account.password" placeholder="请输入密码" data-name='password'
-				@input="onInput">
+			<input class="input" placeholder-class="placeholder" type="password" :value="account.password"
+				placeholder="请输入密码" data-name='password' @input="onInput">
 		</view>
 		<view class="assist">
-			<label @click="memory = memory == '1' ? '0' : '1'">
-				<checkbox :checked="memory == 1" :class="memory == 1 ? 'checked blue' : 'blue'" />记住密码
-			</label>
-			<!-- <navigator url="#">忘记密码?</navigator> -->
+			<navigator class="navigator" url="#" style="display: flex; align-items: center;"
+				@click="memory = memory == '1' ? '0' : '1'">
+				<u-checkbox :checked="memory == 1" />记住密码
+			</navigator>
+
+			<navigator class="navigator" url="#">忘记密码?</navigator>
 		</view>
 		<u-button :customStyle="butSty" :disabled="account.account == '' || account.password == ''" :loading="loading"
 			loadingText='登陆中...' @click="startLogging">
@@ -117,6 +119,11 @@ export default {
 
 	.input {
 		font-size: 14px;
+		height: 30px;
+	}
+
+	.placeholder {
+		font-size: 12px !important;
 	}
 
 	.iconfont {
@@ -165,43 +172,19 @@ input {
 	background-color: $my-color-main;
 }
 
-/deep/.uni-checkbox.blue.checked .uni-checkbox-input {
-	background-color: #0A3971 !important;
-	opacity: 0.65;
-}
-
-/deep/ .uni-checkbox-input {
-	width: 14px !important;
-	height: 14px !important;
-	margin-right: 6px;
-}
-
 .assist {
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
 	width: 274px;
-	font-size: 12px;
-	font-family: PingFang SC-Regular, PingFang SC;
-	color: #FFFFFF;
 	margin: 13px auto 0;
 
-	label {
-		display: flex;
-		align-items: center;
-
-		checkbox {
-			transform: scale(0.6);
-			background: #0A3971;
-			color: #0A3971;
-			border-radius: 4px;
-			opacity: 0.65;
-			border: 1px solid rgba(11, 63, 126, 0.1);
-		}
-	}
-
-	navigator {
+	.navigator {
 		padding-right: 5px;
+		font-family: PingFang SC-Regular, PingFang SC;
+		font-size: 12px !important;
+		color: #FFFFFF;
+		border-radius: 4px;
 	}
 }
 

pages/login/modules/phone.vue

@@ -2,14 +2,14 @@
 	<view class="container">
 		<view class="input-box">
 			<view class="iconfont icon-shoujihao" />
-			<input class="input" type="number" :value="phoneNumber" placeholder="请输入手机号码" data-name='phoneNumber'
-				@input="onInput">
+			<input class="input" placeholder-class="placeholder" type="number" :value="phoneNumber" placeholder="请输入手机号码"
+				data-name='phoneNumber' @input="onInput">
 		</view>
 		<view class="authcode" style="margin-top:15px;">
 			<view class="input-box">
 				<view class="iconfont icon-duanxinyanzheng" />
-				<input class="input" type="number" :value="password" placeholder="请输入验证码" data-name='password'
-					@input="onInput">
+				<input class="input" placeholder-class="placeholder" type="number" :value="password" placeholder="请输入验证码"
+					data-name='password' @input="onInput">
 			</view>
 			<button class="cu-btn bg-red" :loading='loading' @click="getAuthcode">{{ butText }}</button>
 		</view>
@@ -136,14 +136,20 @@ export default {
 	background: #FFFFFF;
 	border-radius: 4px;
 	opacity: 0.65;
-	margin: 0 auto 0;
+	margin: 0 auto;
 
 	.input {
 		font-size: 14px;
+		height: 30px;
+		line-height: 30px;
+	}
+
+	.placeholder{
+		font-size: 12px !important;
 	}
 
 	.iconfont {
-		font-size: 12px;
+		font-size: 11px;
 		padding: 0 10px;
 		color: #052E5D;
 	}