Procházet zdrojové kódy

支付按钮修改,密码框自动获取焦点

1004749546@qq.com před 4 roky
rodič
revize
16e2d80de7
3 změnil soubory, kde provedl 49 přidání a 11 odebrání
  1. 16 3
      pages/order/order.vue
  2. 15 3
      pages/order/orderDetail.vue
  3. 18 5
      pages/toOrder/index.vue

+ 16 - 3
pages/order/order.vue

@@ -54,7 +54,7 @@
 										<u-count-down @end="getRow" 
 										style="margin-right: 20upx;" separator ="zh" 
 										:timestamp="item.leftTimeT" :show-days="false" :show-hours="false"></u-count-down>
-									<u-button :custom-style="btnStyle" @click="toPay(item)"  shape="circle" type="error" size="medium">去支付</u-button>
+									<u-button :custom-style="btnStyle" @click="toPay(item)"  shape="circle" type="success" size="medium">去支付</u-button>
 								</view>
 								<view v-if="item.orderState=='WAIT_SEND'||item.orderState=='SEND_PART'" class="text-right">
 									<u-button :custom-style="btnStyle" @click="showTip" shape="circle" size="medium">提醒发货</u-button>
@@ -106,14 +106,17 @@
 					<u-image mode="scaleToFill" width="40rpx" height="40rpx" src="/static/ledou.png"></u-image>
 				</view>
 				<view class="footer">
-					<input v-model="password" maxlength="30" 
+					<input 
+					v-model="password" 
+					maxlength="30" 
+					:focus="focus"
 					style="text-align: center;"
 				    type="password" 
 					placeholder="请输入支付密码" 
 					@confirm="toPayOrder"/>
 				</view>
 				<view class="fot-btn">
-					<u-button  @click="toPayOrder" type="error" >确认支付</u-button>
+					<u-button  @click="toPayOrder" type="success" >确认支付</u-button>
 				</view>
 			</view>
 		</u-popup>
@@ -178,6 +181,7 @@
 				total: 0,
 				totalPrice: 0, // 支付合计
 				password: '', // 支付密码
+				focus: false,
 				action: 'swiperChange', // 操作类型,上划分页,或左右滑动
 				showSetPswModal: false,  // 设置支付密码弹窗
 				showInputPsw: false, // 打开输入密码弹窗
@@ -325,6 +329,9 @@
 			setPsw (e) {
 				if (e.success) {
 					this.showInputPsw = true
+					setTimeout(()=>{
+						this.focus = true
+					},300)
 				}
 			},
 			// 关闭输入密码弹窗
@@ -343,6 +350,9 @@
 			payAgain () {
 				this.showLeavePsw = false
 				this.showInputPsw = true
+				setTimeout(()=>{
+					this.focus = true
+				},300)
 			},
 			// 支付 判断用户是否设置过支付密码
 			toPay(item) {
@@ -356,6 +366,9 @@
 						// 设置过支付密码,输入密码
 						if(res.data) {
 							this.showInputPsw = true
+							setTimeout(()=>{
+								this.focus = true
+							},300)
 						} else {
 							// 没设置过支付密码,提示设置密码
 							 this.showSetPswModal = true

+ 15 - 3
pages/order/orderDetail.vue

@@ -101,14 +101,16 @@
 					<u-image mode="scaleToFill" width="40rpx" height="40rpx" src="/static/ledou.png"></u-image>
 				</view>
 				<view class="footer">
-					<input v-model="password" 
+					<input 
+					v-model="password" 
+					:focus="focus"
 					@confirm="toPayOrder" 
 					maxlength="30" 
 					style="text-align: center;" type="password" 
 					placeholder="请输入支付密码" />
 				</view>
 				<view class="fot-btn">
-					<u-button  @click="toPayOrder" type="error" >确认支付</u-button>
+					<u-button  @click="toPayOrder" type="success" >确认支付</u-button>
 				</view>
 			</view>
 		</u-popup>
@@ -136,7 +138,8 @@
 				showLeavePsw: false, // 打开确定放弃弹窗
 				orderId: '', // 订单id
 				leftTime: null,
-				payFinish: false  // 是否支付成功
+				payFinish: false , // 是否支付成功
+				focus: false
 			}
 		},
 		onLoad(options) {
@@ -190,6 +193,9 @@
 			setPsw (e) {
 				if (e.success) {
 					this.showInputPsw = true
+					setTimeout(()=>{
+						this.focus = true
+					},300)
 				}
 			},
 			// 关闭输入密码弹窗
@@ -208,6 +214,9 @@
 			payAgain () {
 				this.showLeavePsw = false
 				this.showInputPsw = true
+				setTimeout(()=>{
+					this.focus = true
+				},300)
 			},
 			// 支付 判断用户是否设置过支付密码
 			toPay() {
@@ -220,6 +229,9 @@
 						// 设置过支付密码,输入密码
 						if(res.data) {
 							this.showInputPsw = true
+							setTimeout(()=>{
+								this.focus = true
+							},300)
 						} else {
 							// 没设置过支付密码,提示设置密码
 							 this.showSetPswModal = true

+ 18 - 5
pages/toOrder/index.vue

@@ -54,7 +54,7 @@
 			  <u-image mode="scaleToFill" width="40rpx" height="40rpx" src="/static/ledou.png"></u-image>
 			</view>
 			<view>
-				<u-button size="mini" :loading="btnLoading" :custom-style="toOrderButton" type="error" @click="toSaveOrder">确认支付</u-button>
+				<u-button size="mini" :loading="btnLoading" :custom-style="toOrderButton" type="success" @click="toSaveOrder">确认支付</u-button>
 			</view>
 		</view>
 		<!-- 提示用户设置支付密码 -->
@@ -85,15 +85,17 @@
 					<u-image mode="scaleToFill" width="40rpx" height="40rpx" src="/static/ledou.png"></u-image>
 				</view>
 				<view class="footer">
-					<input v-model="password" 
+					<input 
+					v-model="password" 
 					maxlength="30" 
+					:focus="focus"
 					style="text-align: center;"
 					type="password" 
 					@confirm="toPay"
 					placeholder="请输入支付密码" />
 				</view>
 				<view class="fot-btn">
-					<u-button :loading="payBtn" @click="toPay" type="error" >确认支付</u-button>
+					<u-button :loading="payBtn" @click="toPay" type="success" >确认支付</u-button>
 				</view>
 			</view>
 		</u-popup>
@@ -124,7 +126,8 @@
 				showInputPsw: false, // 打开输入密码弹窗
 				showLeavePsw: false, // 打开确定放弃弹窗
 				payBtn: false,
-				orderForm: '' // 商品下单来源,商品详情或购物车
+				orderForm: '', // 商品下单来源,商品详情或购物车
+				focus: false
 			};
 		},
 		onShow() {
@@ -182,6 +185,9 @@
 			setPsw (e) {
 				if (e.success) {
 					this.showInputPsw = true
+					setTimeout(()=>{
+						this.focus = true
+					},300)
 				}
 			},
 			//确认放弃
@@ -198,6 +204,9 @@
 			payAgain () {
 				this.showLeavePsw = false
 				this.showInputPsw = true
+				setTimeout(()=>{
+					this.focus = true
+				},300)
 			},
 			// 支付  校验用户是否设置过支付密码
 			toCheckPwd(){
@@ -208,6 +217,9 @@
 						// 设置过支付密码,输入密码
 						if(res.data) {
 							this.showInputPsw = true
+							setTimeout(()=>{
+								this.focus = true
+							},300)
 						} else {
 							// 没设置过支付密码,提示设置密码
 							 this.showSetPswModal = true
@@ -243,7 +255,8 @@
 						receiverName: this.userInfo.receiverName,
 						receiverPhone: this.userInfo.receiverPhone,
 						orderGoodsList: orderGoodsList,
-						orderForm: this.orderForm
+						orderForm: this.orderForm,
+						payGold: this.totalPrice
 					}
 					saveOrder(params).then(res=>{
 						console.log(res,'rrrrrrr')