扫码支付页面-键盘优化改动

agentApp/pages/allpages/index.vue

@@ -14,7 +14,7 @@
 		<text>代理商相关</text>
 		<button @click="goPage(1)">代理商登录</button>
 		<button @click="goPage(2)">代理商主页</button>
-
+		<button @click="goPage(3)">支付页</button>
 		<button @click="goPage(11)">代理商提现</button>
 		<button @click="goPage(12)">代理商提现详情</button>
 		<button @click="goPage(13)">代理商提现历史</button>

agentApp/pages/payment/payment.vue

@@ -29,7 +29,7 @@
 						￥
 					</view>
 					<view class="num">
-						<input type="text" class="pr-num" placeholder="请输入金额" placeholder-style="color: #cfcfcf;" />
+						<input type="text" class="pr-num" @focus="playFoucus" placeholder="请输入金额" placeholder-style="color: #cfcfcf;" />
 					</view>
 				</view>
 				<view class="pfooter u-border-top">
@@ -52,55 +52,7 @@
 					查看活动规则
 				</view>
 			</view>
-			<view class="pac-list">
-				<view class="pl-left">
-					<view class="pleft-num">
-						<button class="p-num">
-							1
-						</button>
-						<button class="p-num">
-							2
-						</button>
-						<button class="p-num">
-							3
-						</button>
-						<button class="p-num p-mar">
-							4
-						</button>
-						<button class="p-num p-mar">
-							5
-						</button>
-						<button class="p-num p-mar">
-							6
-						</button>
-						<button class="p-num p-mar">
-							7
-						</button>
-						<button class="p-num p-mar">
-							8
-						</button>
-						<button class="p-num p-mar">
-							9
-						</button>
-					</view>
-					<view class="pleft-btom">
-						<button class="p-num pu-zero">
-							0
-						</button>
-						<button class="p-num">
-							.
-						</button>
-					</view>
-				</view>
-				<view class="pl-right">
-					<button class="p-num pr-del">
-
-					</button>
-					<button class="p-num pr-sure">
-						确定
-					</button>
-				</view>
-			</view>
+			<u-keyboard mode="number" :closeOnClickOverlay="true" @close="close" :show="show" @confirm="confirm" @cancel="cancel"></u-keyboard>
 		</view>
 	</view>
 </template>
@@ -109,11 +61,22 @@
 export default {
 	data() {
 		return {
-
+			show: false
 		}
 	},
 	methods: {
-
+		playFoucus() {
+			this.show = true;
+		},
+		confirm() {
+			this.show = false;
+		},
+		cancel() {
+			this.show = false;
+		},
+		close() {
+			this.show = false;
+		}
 	}
 }
 </script>
@@ -147,7 +110,7 @@ export default {
 				.pname {
 					margin-top: 15rpx;
 					color: #454545;
-					font-size: 16px;
+					font-size: 32rpx;
 					line-height: 1.5;
 					font-weight: bold;
 				}
@@ -155,7 +118,7 @@ export default {
 				.paddre {
 					margin-top: 5rpx;
 					color: #666;
-					font-size: 12px;
+					font-size: 24rpx;
 					line-height: 1.5;
 				}
 			}
@@ -178,7 +141,7 @@ export default {
 		.pm-title {
 			padding-left: 40rpx;
 			color: #454545;
-			font-size: 15px;
+			font-size: 30rpx;
 			line-height: 1.5;
 		}
 
@@ -187,7 +150,7 @@ export default {
 			padding-left: 40rpx;
 			padding-top: 40rpx;
 			color: #666;
-			font-size: 12px;
+			font-size: 24rpx;
 			line-height: 1.5;
 		}
 
@@ -205,7 +168,7 @@ export default {
 			.font {
 				height: 60rpx;
 				line-height: 60rpx;
-				font-size: 15px;
+				font-size: 30rpx;
 				color: #454545;
 				font-weight: bold;
 			}
@@ -216,7 +179,7 @@ export default {
 				height: 60rpx;
 
 				.pr-num {
-					font-size: 34px;
+					font-size: 68rpx;
 					line-height: 70rpx;
 					min-height: 70rpx;
 					height: 70rpx;
@@ -236,7 +199,7 @@ export default {
 			display: flex;
 
 			.pcfont {
-				font-size: 12px;
+				font-size: 24rpx;
 				color: #666;
 				height: 30rpx;
 				line-height: 30rpx;
@@ -252,7 +215,7 @@ export default {
 			.pc-aplay {
 				padding-left: 40rpx;
 				margin-left: 20rpx;
-				font-size: 12px;
+				font-size: 24rpx;
 				height: 30rpx;
 				line-height: 30rpx;
 				color: #999;
@@ -263,7 +226,7 @@ export default {
 
 		.pac-link {
 			color: #1783FF;
-			font-size: 12px;
+			font-size: 24rpx;
 			height: 30rpx;
 			line-height: 30rpx;
 			cursor: pointer;
@@ -272,6 +235,7 @@ export default {
 
 	.pac-list {
 		display: flex;
+		display: none;
 		justify-content: space-between;
 		position: absolute;
 		width: 100%;