Procházet zdrojové kódy

调整细节样式 ,查询方式,实际操作方式优化

zhengkaixin před 1 rokem
rodič
revize
08ea611400

+ 55 - 33
pages/user/rechargeByPhone.vue

@@ -8,13 +8,11 @@
 		</ujp-navbar>
 		<view class="recharge">
 			<view class="recharge-text">
-				<p v-show="!queryCard.query">充值手机号
-				
-				</p >
+				<p >充值手机号 </p >
 				<p v-show="queryCard.query&&queryCard.name">
 					用户姓名:{{queryCard.name}}
 				</p>
-				<u-input v-model="phone" v-show="!queryCard.query"
+				<u-input v-model="phone"  style="    border-bottom: 1px solid rgb(220, 223, 230);"
 				:custom-style="{
 					'font-size': '48rpx',
 					'line-height': '48rpx',
@@ -25,24 +23,15 @@
 					'color':' rgba(204, 204, 204, 1)',
 				}"
 				 height="82" placeholder="请输入充值手机号" ></u-input>
+				 <view style="
+    color: red;
+    font-size: 16px;
+">{{errorText}}</view>
 			</view>
-			<view   class="rechargePhone" v-show="queryCard.query">
-				<view>
-					<h1 style="font-size: 48rpx;line-height: 48rpx;height:82rpx;    display: flex;align-items: center;"   >{{phone}}</h1>
-					
-				</view>
-				<view
-				 @click="queryCard.query=false,phone=''"
-				class="recharge-btn">
-					更换
-				</view>
-			</view>
-		</view>
-	
-		<view style="padding: 30rpx;" v-show="!queryCard.query"  >
 			
-			<u-button type="primary" @click="findByPhone" :custom-style="customStyle" shape="square">查询用户</u-button>
 		</view>
+	
+		 
 		<view class="rechargeBk" v-if="queryCard.query&&queryCard.chargingCardList&&queryCard.chargingCardList.length">
 			<view class="rechargeBkInfo" >
 				
@@ -86,7 +75,7 @@
 		</view>
 		
 		
-		<view v-show="queryCard.query">
+		<view >
 			<view class="charge" >
 				<view class="chargeTit">
 					选择充值金额
@@ -126,7 +115,7 @@
 					<u-icon name="tikuan" custom-prefix="custom-icon" color="#FF9502" size="48"></u-icon>
 					<span>支付 {{amount}} 元</span>
 				</view>
-				<u-button type="primary" @click="submit" :custom-style="customStyle" shape="square">确定充值</u-button>
+				<u-button type="primary" @click="submit" :custom-style="customStyle" shape="square">{{btnText}}</u-button>
 			</view>
 		</view>
 		
@@ -160,6 +149,8 @@
 				list:[5,10,20,50,100,200],
 				amount:5,
 				phone:"",
+				btnText:"请输入手机号",
+				errorText:"",
 			}
 		},
 		onLoad(op){
@@ -170,11 +161,33 @@
 		},
 		onReady() {
 		
+		},
+		watch:{
+				phone(old){
+					if(old&&old.length==11){
+						var checkPhoneResult = checkPhone(old);
+						
+						if ( checkPhoneResult !== true) {
+							this.btnText=checkPhoneResult
+						}else{
+							this.findByPhone()
+						}
+					}else{
+						this.btnText="请输入手机号"
+						this.queryCard={
+							query:false,
+							chargingCardList:[]
+						}
+						this.errorText="";
+					}
+				},
 		},
 		methods: {
 			showCardBtn(num){
 				if(num>5){
 					this.showCard=!this.showCard
+					
+					
 				}
 					
 			},
@@ -211,14 +224,14 @@
 					}else{
 						this.showCard=true
 					}
-				
+					this.btnText="充值"
 				}).catch(error => {
 					uni.hideLoading()
-					uni.showModal({
-						title:"提示",
-						content:error,
-						showCancel:false,
-					})
+					this.queryCard={
+						query:false,
+						chargingCardList:[]
+					}
+					this.errorText=error;
 				})
 			},
 			customBack(){
@@ -232,15 +245,24 @@
 				})
 			},
 			submit(){
+				
+				if(!this.queryCard.query){
+						uni.showModal({
+							title:"提示",
+							content:this.errorText?this.errorText:this.btnText,
+							showCancel:false,
+						})	
+						return
+				}
 				var checkPhoneResult = checkPhone(this.phone);
 				
-				if ( checkPhoneResult !== true) {
-					uni.showToast({
-						title: checkPhoneResult,
+				// if ( checkPhoneResult !== true) {
+				// 	uni.showToast({
+				// 		title: checkPhoneResult,
 				
-					})
-					return;
-				}
+				// 	})
+				// 	return;
+				// }
 				
 				uni.showLoading({
 					title: "加载中",

+ 1 - 1
pages/user/rechargeIndex.vue

@@ -1,6 +1,6 @@
 <template>
 	<view>
-		<ujp-navbar title="帮人充值"  :isBack="isBack" :customBack="customBack">
+		<ujp-navbar title="物业发卡充值"  :isBack="isBack" :customBack="customBack">
 		
 		</ujp-navbar>
 		<view class="item1 item" @click="gotoUrl('pages/user/rechargeSubmit')">

+ 52 - 15
pages/user/rechargeSubmit.vue

@@ -15,6 +15,14 @@
 				</view>
 
 			</view>
+				<view class="recharge-text" style="margin: 16rpx 0;">
+						<view class="recharge-title">充电卡状态</view>
+						<view class="recharge-value FF7B00 ">
+								{{cardText}}
+						</view>
+			
+				</view>
+
 		
 			<view class="recharge-text">
 				<view class="recharge-title">手机号码
@@ -29,7 +37,9 @@
 			</view>
 			
 			<view class="recharge-text">
-				<view class="recharge-title">验证码</view>
+				<view class="recharge-title">验证码
+				<span style="color: red;">*</span>
+				</view>
 				<view class="recharge-value">
 					<u-input v-model="code" :custom-style="customStyle" :placeholder-style="placeholderStyle"
 						:height="height" placeholder="请填写验证码"></u-input>
@@ -51,16 +61,12 @@
 				</view>
 			
 			</view>
-			<view class="recharge-text">
-				<view class="recharge-title">绑定状态</view>
-				<view class="recharge-value FF7B00 ">
-					未绑定
-				</view>
-
+			<view>
+				<span style="color: red;    font-size: 36rpx;margin-right: 12rpx;">* 为必填项</span>
 			</view>
 			<view class="foot-btn">
 
-				<u-button type="primary" @click="submit" shape="square">确定绑定</u-button>
+				<u-button type="primary" @click="submit" shape="square">发卡</u-button>
 			</view>
 		</view>
 		<view class="recharge" v-show="queryInfo">
@@ -95,7 +101,7 @@
 			</view>
 			<view class="foot-btn">
 		
-				<u-button type="success" @click="gotoUrl('pages/user/rechargeByPhone?phone='+phone)" shape="square">前往充值</u-button>
+				<u-button type="primary" @click="gotoUrl('pages/user/rechargeByPhone?phone='+phone)" shape="square">前往充值</u-button>
 			</view>
 		</view>
 
@@ -131,14 +137,14 @@
 				code: '',
 				queryCard:{},
 				queryInfo:false,
-				
+				cardText:"请输入",
 				codeTips: '',
 				isSendMsgIng: false,
-				sendMsgSecond: 60 * 5,
+				sendMsgSecond: 60 * 1,
 			}
 		},
 		onLoad(op) {
-
+		//cardText
 			
 		},
 		onReady() {
@@ -147,19 +153,28 @@
 				//this.$refs.uCode.start();
 				var nowtime = new Date().getTime()
 				var differ = (nowtime - time) / 1000
-				if (differ < 5 * 60) {
-					this.sendMsgSecond = 5 * 60 - parseInt(differ)
+				if (differ < 1* 60) {
+					this.sendMsgSecond = 1* 60 - parseInt(differ)
 					this.isSendMsgIng = true;
 					this.$refs.uCode.start();
 				}
 			}
+		},
+		watch:{
+			cardNo(old){
+				if(old){
+					this.findByCard()
+				}else{
+					this.cardText="请输入";
+				}
+			}
 		},
 		methods: {
 			codeChange(text) {
 				this.codeTips = text;
 			},
 			end() {
-				this.sendMsgSecond = 5 * 60;
+				this.sendMsgSecond = 1* 60;
 				this.isSendMsgIng = false;
 			},
 			start() {
@@ -241,6 +256,28 @@
 						title: error
 					})
 				})
+			},
+			findByCard(){
+				
+				API.findByCard({
+					cardNo: this.cardNo,
+				
+				}).then((response) => {
+					
+					var data = response.data
+					
+					if(data.regUser){
+						
+						this.cardText="当前卡号已被其他用户绑定";
+					}else{
+						this.cardText="未绑定";
+					}
+					
+				
+				}).catch(error => {
+				
+					this.cardText=error;
+				})
 			},
 			submit() {
 				if (!this.cardNo) {