站点详情预约

pages/searchPile/stationAndPile/stationDetails.vue

@@ -133,14 +133,20 @@
 					</view> 		
 				</view>
 				<view class="charging-gun" v-for="(item1,index1) in item.gunList" :key="index1" >
-					<view class="iconfont">
-						&#xe618;
-					</view>
-					<view class="gun-num">
-						充电枪{{item1.channelNo<10?'0'+item1.channelNo.toString():item1.channelNo.toString()}}
+					<view style="display: flex; flex-direction: row;">
+						
+						<view class="iconfont">
+							&#xe618;
+						</view>
+						<view class="gun-num">
+							充电枪{{item1.channelNo<10?'0'+item1.channelNo.toString():item1.channelNo.toString()}}
+						</view>
+						<view :class="item1.workStatus==0?'free-state':'recharge-state'">
+							{{item1.workStatus != 2 ?item1.workStatusText: (item1.soc!=null? (item1.workStatusText + ' SOC ' + item1.soc.toFixed(1)+'%'):item1.workStatusText)}}
+						</view>
 					</view>
-					<view :class="item1.workStatus==0?'free-state':'recharge-state'">
- 						{{item1.workStatus != 2 ?item1.workStatusText: (item1.soc!=null? (item1.workStatusText + ' SOC ' + item1.soc.toFixed(1)+'%'):item1.workStatusText)}}
+					<view v-if="item1.workStatus == 0">
+						<u-button class="buttonAppointment" shape="circle" size="small" @click="book(item1)">预约</u-button>
 					</view>
 				</view>			
 			</view> 
@@ -323,6 +329,12 @@
 					current:0
 				})
 			},
+			book(item){
+				uni.navigateTo({
+					url:'/pages/searchPile/apointment/apointmentRecharge?id='+item.id,
+				})
+				//console.log('book'+JSON.stringify(item))
+			},
 			getPoint() {
 				 
 	//			console.log('getPoint')
@@ -846,6 +858,8 @@
 		}
 		.charging-gun{
 			display: flex;
+			justify-content: space-between;
+			width: 100%; 
 			margin-top: 12px;
 			.iconfont{
 				color: #a5aaa8;
@@ -961,5 +975,21 @@
 		}
 		
 	}
+	
+	.buttonAppointment{
+		width: 120rpx;
+		height: 56rpx;
+		position: relative;
+		top : -10rpx;
+		right: -10rpx;
+		border-radius: 100rpx;
+		background-color: rgba(0, 185, 98, 100);
+		color: rgba(255, 255, 255, 100);
+		@include themeify{
+			font-size: themed('font-size2'); 
+		}	
+/*			font-size: 14px;*/
+		margin-left: 13px;
+	}
 </style>