订单详情客服

subPackages/order/detail.vue

@@ -346,7 +346,7 @@
 		</view>
 
 		<!-- 联系客服 -->
-		<view class="kefu-box" @click="clickPhone('0515-69186109')">
+		<view class="kefu-box" @click="$refs.popup.open()">
 			<image src="https://static.ticket.sz-trip.com/yandu/images/order/kefu.png" mode="" class="kefu-img"></image>
 			联系客服
 		</view>
@@ -405,6 +405,18 @@
 				</view>
 			</view>
 		</view>
+		
+		<!-- 客服弹框 -->
+		<uni-popup ref="popup" type="center">
+			<view class="consult-popup">
+				即将拨打客服电话
+				<view class="consult-subtitle">服务时间：周一至周五<br>8:30-11:30，14:30-18:00</view>
+				<view class="consult-btns">
+					<view @click="$refs.popup.close()">取消</view>
+					<view @click="clickPhone('0515-69186109')">确定</view>
+				</view>
+			</view>
+		</uni-popup>
 	</view>
 </template>
 
@@ -1526,4 +1538,40 @@
 	.express-item-icons {
 		background: #71B580;
 	}
+	
+	.consult-popup {
+		width: 487rpx;
+		height: 367rpx;
+		background: #F0F0F0;
+		border-radius: 20rpx;
+		padding: 65rpx 0 23rpx;
+		font-weight: bold;
+		font-size: 32rpx;
+		color: #000000;
+		text-align: center;
+		
+		.consult-subtitle {
+			font-weight: 500;
+			font-size: 27rpx;
+			color: #333333;
+			margin-top: 43rpx;
+		}
+		
+		.consult-btns {
+			display: flex;
+			margin-top: 75rpx;
+			
+			view {
+				width: 50%;
+				font-weight: bold;
+				font-size: 32rpx;
+				color: #71B580;
+				line-height: 54rpx;
+			}
+			view:first-child {
+				border-right: 1rpx solid #D8D8D8;
+				color: #000000;
+			}
+		}
+	}
 </style>