预约详情页面交互

src/common/http.interceptor.js

@@ -60,9 +60,9 @@ const install = (Vue, vm) => {
 		return config;
 	}
 	function getCode(res){
-		const result = res.data
+		const result = res.data || res
 		let code
-		if(res.hasOwnProperty('statusCode')){
+		if(result.hasOwnProperty('statusCode')){
 			code = res.statusCode
 		}else if(result.hasOwnProperty('code')){
 			code = result.code

src/pages/order/detail.vue

@@ -79,21 +79,31 @@
 			<!-- 过程反馈 -->
 			<view class="left">
 				<view v-show="allowFeedback" @click="clickFeedback" class="button">
-					<text style="font-size: small;">过程反馈</text>
+					过程反馈
 				</view>
 			</view>
-			<!--接单，抢单，已被抢， 预约 ，签到 ，去完工  :class="appoint-btn"  v-show="buttonShow(btn)"-->
+			<!--接单，抢单，已被抢， 预约 ，签到 ，去完工  timestampDiff(order.currentOverTime)>0 -->
 			<view class="center">
 				<view>
 					<u-toast ref="uToast" />
 				</view>
-				<view v-if="showCenterBtn" @click="handleBtn" class="button" :class="centerButtonClass">
+				<view v-if="showCenterBtn" @click="handleBtn"  class="button" :class="btnClass">
 					{{ centerButtonText }}
 				</view>
+				
+				<view v-show="order.currentOverTime > 0" >
+					<view class="tag">{{order.currentOverTime * 1000 > new Date().getTime()?'剩':'超'}}</view>
+					<u-count-down 
+						:timestamp="timestampDiff(order.currentOverTime)" 
+						font-size="30" 
+						:ref="'uCountDown'" 
+						@change="timeOutChange(order.currentOverTime)" >
+					</u-count-down>
+				</view>
 			</view>
 			<!-- 异常预约 ，现场拍照 这里是调用拍照的两个组件-->
 			<view class="right">
-				<view v-show="allowFeedback" @click="clickFeedback" class="button"></view>
+				<view v-show="allowRight" @click="allowRightClick" class="button"></view>
 			</view>
 		</view>
 	</view>
@@ -127,10 +137,11 @@
 				centerButtonText: '',
 				orderRecords: [],
 				method: null,
-				allowFeedbackStatus: [30, 31], // 过程反馈状态列表
 				showCenterBtn: false,
 				showTimeSelect: false,
-				submitType: ""
+				submitType: '',
+				nextUrl:'',
+				btnClass:'appoint-btn'
 			}
 		},
 		onLoad(option) {
@@ -143,8 +154,11 @@
 			}
 			this.loadOrderDetail()
 			this.loadOrderRecord()
+			this.getLocation()
+		},
+		created() {
+			
 		},
-		created(option) {},
 		computed: {
 			phoneIcon() {
 				return process.uniEnv.qn_base_url + 'icon/dianhua-1@2x.png'
@@ -176,7 +190,6 @@
 						// self.method =self.operationDoing[self.order.operationType].action;
 						// // 根据工单的状态确定是否需要过程反馈
 						// self.allowFeedback = self.allowFeedbackStatus.indexOf(self.order.orderStatus)>0
-
 					} else {
 						console.log(res.message, "获取订单详情失败！");
 					}
@@ -189,7 +202,6 @@
 				};
 				self.$u.api.listOrderRecord(param).then((res) => {
 					if (res.code == 200) {
-						console.log("===========", res.data)
 						self.orderRecords = res.data
 					} else {
 						console.log(res.message, "获取订单详情失败！");
@@ -231,11 +243,13 @@
 					this.centerButtonText = "接单"
 					// 已派单的时显示拒单按钮
 					this.allowRejection = true
+					this.submitType = "orderAccept"
 				} else if (orderStatus < 31 && orderBusinessType === '订单池') {
 					// 抢单
 					this.centerButton = "appoint1"
 					this.centerButtonText = "抢单"
 					this.showCenterBtn = true
+					this.submitType = "orderGan"
 				} else if (orderStatus === 31 && !this.order.appointmentDatetime) {
 					// 预约
 					this.centerButton = "appoint2"
@@ -253,38 +267,138 @@
 					this.submitType = "maintainWorkerCheckin"
 				} else if (orderStatus > 31 && orderStatus < 80) {
 					// 完工
-					this.centerButton = "appoint4"
+					this.centerButton = "filish"
 					this.centerButtonText = "去完工"
 					this.allowFeedback = true
 					this.showCenterBtn = true
 				} else {}
 			},
 			handleBtn() {
+				if(this.centerButton === "filish"){
+					this.filish()
+					return
+				}
+				if(!this.submitType){
+					return;
+				}
 				const data = {}
 				// 不同请求类型传递不同数据
-				if (this.submitType === 'maintainWorkerCheckin') {
+				if (this.submitType === 'maintainWorkerCheckin') { // 签到
+					// 检查见到距离是否符合
+					if(this.getDistance(this.order.contactAddressLatitud,this.order.contactAddressLongitud)>3){
+						this.$refs.uToast.show({
+							title: '签到失败，请点击异常签到处理或联系客服',
+							type: 'error'
+						})
+						return
+					}
 					data.remark = "123"
 					data.revert = true
+				}else if(this.submitType === 'orderAccept'){ // 接单
+					data.orderId = this.order.orderId
+				}else if(this.submitType === 'orderGan'){ // 抢单
+					data.orderId = this.order.orderId
 				}
-				this.$u.api[this.submitType](data, 123).then(res => {
-					if (res.data.code === 200) {
+				this.$u.api[this.submitType](data, this.order.orderId).then(res => {
+					if ((res.data.code!==undefined && res.data.code === 200) 
+					 || (res.code!==undefined && res.code === 200) ) {
 						this.$refs.uToast.show({
 							title: this.centerButtonText + '操作成功',
 							type: 'success',
-							url: 'pages/order/feedback',
+							url: 'pages/order/detail',
 							params: {
 								id: 1,
-								menu: 3
+								menu: 2
 							}
 						})
 					} else {
 						this.$refs.uToast.show({
-							title: res.data.message,
+							title: res.data.message!==undefined ? res.data.message:res.message,
 							// 如果不传此type参数，默认为default，也可以手动写上 type: 'default'
-							type: 'error'
+							type: 'error',
+							callback: res.data.message==='该工单已被抢'?this.isGan():''
 						})
 					}
 				})
+			},
+			isGan(){
+				this.centerButtonText = "已被抢"
+				this.submitType = ""
+				this.btnClass='isGan-btn'
+			},
+			clickFeedback(){
+				// 过程反馈
+				uni.navigateTo({
+					url: 'pages/order/feedback?orderId='+this.order.orderId
+				})
+			},
+			filish(){
+				// 去完工
+				uni.navigateTo({
+					url: 'pages/order/complete?orderId='+this.order.orderId
+				})
+			},
+			/**
+			 * 获取当前位置的经纬度
+			 */
+			getLocation() {
+				let self = this
+				const dataValue = this.dataValue || []
+				const waterInfo = this.waterInfo
+				uni.getLocation({
+					type: 'gcj02',
+					success: function(res) {
+						dataValue.push(res.longitude)
+						dataValue.push(res.latitude)
+						self.dataValue = dataValue
+					},
+					fail(err) {
+						
+					}
+				});
+			},
+			getDistance(Latitud, Longitud){
+				return this.distance(Latitud,Longitud,this.dataValue[0],this.dataValue[1])
+			},
+			/**  
+			 * echo distance(116.3896,39.91917,116.3940,39.91726);
+			 * 计算两点之间直线距离  
+			 * @param float $lon1    经度  
+			 * @param float $lat1    维度  
+			 * @param float $lon2    经度  
+			 * @param float $lat2    维度  
+			 * @return float         浮点数  
+			 */  
+			distance(la1, lo1, la2, lo2) {  
+						var La1 = la1 * Math.PI / 180.0;  
+						var La2 = la2 * Math.PI / 180.0;  
+						var La3 = La1 - La2;  
+						var Lb3 = lo1 * Math.PI / 180.0 - lo2 * Math.PI / 180.0;  
+						var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(La3 / 2), 2),Math.cos(La1) * Math.cos(La2) * Math.pow(Math.sin(Lb3 / 2), 2)));  
+						s = s * 6378.137;//地球半径  
+						s = Math.round(s * 10000) / 10000;  
+						// console.log("计算结果",s,'KM');   
+						return s?s.toFixed(2):0;
+			 },
+			 timestampDiff(currentOverTime){ // 计算超时时间
+			    if(!currentOverTime){
+					return 0
+				}
+			 	var nowTime = new Date(); // 当前时间
+			 	if(nowTime.getTime() > currentOverTime*1000){
+			 		var diff = nowTime.getTime() - (currentOverTime*1000);
+			 	}else{
+			 		var diff = (currentOverTime*1000) - nowTime.getTime();
+			 	}
+			 	return diff;
+			 },
+			 timeOutChange(currentOverTime){
+				let self = this
+				var nowTime = new Date(); // 当前时间
+				if(nowTime.getTime() > currentOverTime*1000){
+					this.btnClass='timeOut-btn'
+					self.$refs['uCountDown'].seconds += 2
+				}
 			}
 		}
 	};
@@ -451,6 +565,10 @@
 					height: 100rpx;
 					background: #929CB8;
 					border-radius: 100rpx;
+					font-size: 25rpx;
+					font-weight: bold;
+					align-items: center;
+					display: flex;
 				}
 			}
 
@@ -477,13 +595,13 @@
 					box-shadow: 2px 2px 20px 0px rgba(34, 114, 255, 0.3);
 				}
 
-				.sign-timeout-btn {
-					background: #FA5A49;
+				.isGan-btn {
+					background: #93a7a6;
 					box-shadow: 2px 2px 20px 0px rgba(34, 114, 255, 0.3);
 				}
 
-				.appoint-btn {
-					background: #2272FF;
+				.timeOut-btn {
+					background: #ff0000;
 					box-shadow: 2px 2px 20px 0px rgba(34, 114, 255, 0.3);
 				}
 			}
@@ -495,8 +613,12 @@
 				.button {
 					width: 100rpx;
 					height: 100rpx;
-					background: #12CF84;
+					background: #d99100;
 					border-radius: 100rpx;
+					font-size: 25rpx;
+					font-weight: bold;
+					align-items: center;
+					display: flex;
 				}
 			}
 		}