调整

pages/searchPile/apointment/apointmentRecharge.vue

@@ -22,16 +22,16 @@
 		<!-- 预留时长 -->
 		<view class="reserved-time box">
 			<p>充电桩预留时长</p>
-			<template v-for="(item,i) in  timeList">
-				<view :key="i" @click="selectTime=item" :class="{
-					time1:selectTime==item,
-					time2:selectTime!=item
-				}">
-					{{item}}分钟
-				</view>
-			</template>
-			
 		
+			<picker-view class="picker-view"  :value="[0]"  @change="bindChange2" >
+				<picker-view-column  >
+					<view class="item"   v-for="(item,i) in  timeList" :key="i">
+						<view  >{{item}}分钟</view>
+					</view>
+				</picker-view-column>
+			</picker-view>
+			
+			
 			<view class="end-time">
 				预留截止时间：{{endtime1}}
 			</view>
@@ -39,14 +39,14 @@
 		<!-- 预计充电时长 -->
 		<view class="reserved-time box">
 			<p>预计充电时长</p>
-			<template v-for="(item,i) in  numList">
-				<view :key="i" @click="selectNum=item" :class="{
-					time1:selectNum==item,
-					time0:selectNum!=item
-				}">
-					{{getPercent(item)}}
+			
+		<picker-view class="picker-view"  :value="[0]"  @change="bindChange" >
+			<picker-view-column  >
+				<view class="item"   v-for="(item,i) in  numList" :key="i">
+					<view  >{{getPercent(item)}}</view>
 				</view>
-			</template>
+			</picker-view-column>
+		</picker-view>
 		
 			<view class="end-time">
 				预留充满时间：{{endtime2}}
@@ -101,12 +101,15 @@
 	export default {
 		data() {
 			return {
+				
+			
+				
 				id:0,
 				lockStatus:false,
 				lockTime:"",
 				detail:{},
 				timeList:[],
-				numList:[60,90,120,0],
+				numList:[60,90,120],
 				apointment:"",
 				selectTime:15,
 				selectNum:60,
@@ -119,6 +122,24 @@
 			this.getInfo()
 		},
 		methods:{
+			bindChange(e){
+				console.log(e)
+				var index=e.detail.value[0];
+				var obj=this.numList[index];
+				if(obj){
+					this.selectNum=obj;
+				}
+			
+			},
+			bindChange2(e){
+				console.log()
+				
+				var index=e.detail.value[0];
+				var obj=this.timeList[index];
+				if(obj){
+					this.selectTime=obj;
+				}
+			},
 			submit(){
 				 if(this.lockStatus){
 					 return
@@ -178,10 +199,7 @@
 						
 						this.timeList=res.data.gunShare.reserveMinutes.split(",")
 						this.selectTime=this.timeList[0]
-						if(this.timeList.indexOf("30")>-1){
-							this.selectTime='30'
-						}
-						//this.timeList=[2]
+					
 					}
 					
 				}).catch(error => {
@@ -230,6 +248,18 @@
 </script>
 
 <style lang="scss" scoped>
+	.picker-view {
+			
+			height: 100px;
+			margin-top: 20rpx;
+		}
+		.item {
+			height: 35px;
+			font-size: 24px;
+			align-items: center;
+			justify-content: center;
+			text-align: center;
+		}
 	page {
 		padding-bottom: 191px;
 	}
@@ -300,7 +330,7 @@
 			line-height: 18px;
 			color: rgba(0, 185, 98, 100);
 			font-size: 16px;
-			margin-bottom: 42px;
+			margin-bottom: 22px;
 		}
 
 		.time1 {