| <template> | |
| 	<view class="se-p-40 se-bgc-f5"> | |
| 		<view class="se-flex se-flex-v-sa se-flex-ai-fs se-py-20 se-px-30 se-bs se-bgc-white se-br-20"> | |
| 			<view class="se-flex"> | |
| 				<view class="se-w-160 se-h-160"> | |
| 					<image class="se-w-160 se-h-160 se-br-10"  | |
|                     :src="detail.employJob && detail.employJob.image || detail.jobHeadImg || detail.workHeadImg || '@/static/image/user.png'" mode=""> | |
| 					</image> | |
| 				</view> | |
| 				<view class="se-ml-20 se-flex se-flex-v-sa se-flex-ai-fs"> | |
| 					<view class="se-fw-6 se-c-black se-fs-30 se-display-ib">{{ detail.title }}</view> | |
| 					<view class="se-fs-24 se-c-text-third se-display-ib">所属行业:{{ detail.categoryOne }}</view> | |
| 					<view class="se-fs-24 se-c-text-third se-display-ib">所属工种:{{ detail.categoryTwo }}</view> | |
| 					<!-- <view class="se-fs-24 se-c-text-third se-display-ib">工作时间:3h</view> --> | |
| 				</view> | |
| 			</view> | |
| 		</view> | |
| 		<view class="se-flex se-flex-h-fs se-mt-30 se-py-20 se-px-30 se-bs se-bgc-white se-br-20"> | |
| 			<image class="se-a-30" src="@/static/image/46502.png" mode="" onerror="this.src='@/static/image/user.png'"></image> | |
| 			<text class="se-c-black se-fs-32 se-ml-20">{{ detail.employResume ? detail.employResume.name : detail.workUser }}</text> | |
| 			<text class="se-c-black se-fs-32 se-ml-20">{{ detail.employResume ? detail.employResume.phone : detail.workPhone }}</text> | |
| 		</view> | |
| 		<view class="se-mt-30 se-py-20 se-px-30 se-bs se-bgc-white se-br-20"> | |
| 			<view class="se-flex se-flex-h-sb se-pb-20 se-b-b"> | |
| 				<view class="se-flex se-flex-h-fs"> | |
| 					<image class="se-w-30 se-h-40" src="@/static/image/47961.png" mode="" onerror="this.src='@/static/image/user.png'"></image> | |
| 					<text class="se-c-black se-fs-32 se-ml-20">{{ detail.employResume ? detail.employResume.name : detail.workUser }}</text> | |
| 				</view> | |
| 				<view> | |
| 					<text class="se-c-orange se-fs-32 se-ml-20">$ {{ detail.payMoney }}</text> | |
| 				</view> | |
| 			</view> | |
| 			<!-- 新增保险费明细,仅 type==1 时显示 --> | |
| 			<template v-if="detail.type == 1"> | |
|                 <!-- <view  class="se-flex se-flex-h-sb se-pt-20"> | |
|                     <view class="se-flex se-flex-h-fs"> | |
|                         <u-checkbox v-model="insuranceChecked" @change="onInsuranceChange" activeColor="#ff7a31" shape="circle" size="16"></u-checkbox> | |
|                         <image class="se-w-30 se-h-40 se-ml-10" src="@/static/image/46524.png" mode=""></image> | |
|                         <text class="se-c-black se-fs-32 se-ml-20">保险费</text> | |
|                     </view> | |
|                     <view> | |
|                         <text class="se-c-orange se-fs-32 se-ml-20">¥{{ insuranceChecked ? detail.premium : 0 }}</text> | |
|                     </view> | |
|                 </view> --> | |
|                 <view class="se-flex se-flex-h-sb se-pt-20"  | |
|                 v-if="detail.employSeek"> | |
|                     <view class="se-flex se-flex-h-fs"> | |
|                         <image class="se-w-30 se-h-40" src="@/static/image/47961.png" mode="" onerror="this.src='@/static/image/user.png'"></image> | |
|                         <text class="se-c-black se-fs-32 se-ml-20">师傅试工交通费用</text> | |
|                     </view> | |
|                     <view class="se-flex se-flex-ai-c"> | |
|                         <view class="se-bgc-orange se-display-ib se-br-10 se-py-5 se-px-20 se-c-white se-fs-20"> | |
|                             {{ detail.employSeek.selectGo }} | |
|                         </view> | |
|                         <text class="se-c-orange se-fs-32 se-ml-20">$ {{ fare }}</text> | |
|                     </view> | |
|                 </view> | |
|                 <view class="se-c-black se-p-20 se-fs-24 se-flex se-flex-ai-c se-mt-20" | |
|                     style="background-color:rgba(255,164,113,0.48);"> | |
|                     <view class="se-w-10 se-h-10 se-br-5 se-bgc-orange se-mr-10"></view> | |
|                     <text>全程共</text> | |
|                     <text class="se-c-orange se-px-5 se-fw-6">{{ distance }}</text> | |
|                     <text>公里</text> | |
|                 </view> | |
|                 <view class="se-p-20 se-fs-24 se-flex se-flex-ai-c" style="background-color:rgba(255,164,113,0.18);"> | |
|                     从师傅出发地到用工目的地总全程为{{ distance }}公里,{{ distance }}公里x¥{{ farePerKm }}=¥{{ fare }} | |
|                 </view> | |
|                 <view class="se-fs-22 se-lh-50 se-flex se-flex-v se-mt-10"> | |
|                     <text>1.公交/地铁出行费用:每公里¥{{ trafficPrice.bus }}</text> | |
|                     <text>2.出租车出行费用:每公里¥{{ trafficPrice.taxi }}</text> | |
|                     <text>3.网约车出行费用:每公里¥{{ trafficPrice.online }}</text> | |
|                 </view> | |
|             </template> | |
| 		</view> | |
| 		<view class="se-mt-30 se-py-30 se-px-30 se-bs se-bgc-white se-br-20"> | |
| 			<u-radio-group size="18" v-model="payRadio" iconPlacement="right"> | |
| 				<view class="se-flex-v-sb se-w-p-100" style="align-items: unset;"> | |
| 					<u-radio name="2" activeColor="#ff7a31"> | |
| 						<view class="se-flex se-flex-ai-c se-pt-20"> | |
| 							<image class="se-w-35 se-h-30 se-mt-5" src="@/static/image/46662.png" mode="" onerror="this.src='@/static/image/wechat.png'"></image> | |
| 							<text class="se-c-black se-fs-30 se-ml-15">微信支付</text> | |
| 						</view> | |
| 					</u-radio> | |
| 					<u-radio name="1" activeColor="#ff7a31"> | |
| 						<view class="se-flex se-flex-ai-c se-pb-20"> | |
| 							<image class="se-w-30 se-h-25 se-mt-5" src="@/static/image/46518.png" mode="" onerror="this.src='@/static/image/user.png'"></image> | |
| 							<text class="se-c-black se-fs-30 se-ml-15">账户余额</text> | |
| 							<text class="se-c-text-third se-fs-28 se-ml-15">(余额:¥{{ amount }})</text> | |
| 						</view> | |
| 					</u-radio> | |
| 				</view> | |
| 			</u-radio-group> | |
| 		</view> | |
| 		<view class="se-mt-10 se-py-10 se-br-20 se-mb-160" | |
| 		style="display: flex;flex-direction: column;align-items: center;"> | |
| 			<text class="se-c-66 se-fs-22">温馨提示,下单前请仔细查看下单需知</text> | |
| 			<view class="se-flex-h-fs se-br-40 se-mt-20 se-flex-ai-fs se-h-80 se-lh-80 se-ta-c se-fs-24 se-c-33" | |
| 				style="align-items: unset;"> | |
| 				<u-checkbox :checked="checked" activeColor="#ff7a31" label-size="12" shape="circle" | |
| 					label="阅读并同意"></u-checkbox> | |
| 				<text class="se-c-orange" @click="show=true">《用户使用协议》</text> | |
| 			</view> | |
| 		</view> | |
| 		<view class="se-pos-fixed se-pos-lb se-bs-t se-flex se-flex-h-sb se-pb-60 se-pt-20 se-bgc-white se-w-vw-100"> | |
| 			<view class="se-fs-32 se-c-black se-ml-30"> | |
| 				<text class="se-fs-24">合计</text> | |
| 				<text class="se-c-orange">¥{{price}}元</text> | |
| 			</view> | |
| 			<view @click="payOrderCompany" | |
| 				class="se-mr-30 se-w-240 se-h-80 se-lh-80 se-ta-c se-c-white se-fs-32 se-br-40 se-bgc-orange"> | |
| 				立即支付 | |
| 			</view> | |
| 		</view> | |
| 		 | |
| 		<!-- 免责声明组件 --> | |
| 		<disclaimer-modal ref="disclaimerModal" @cancel="onDisclaimerCancel" @confirm="onDisclaimerConfirm"></disclaimer-modal> | |
| 	</view> | |
| </template> | |
| 
 | |
| <script> | |
| 	import { | |
| 		orderDetail, | |
| 		deleteOrder, | |
| 		confirmOrder, | |
| 		payOrderCompany, | |
| 		userInfo, | |
| 	} from "@/common/api.js" | |
|     import position from "@/utils/position.js" | |
| 	import DisclaimerModal from "@/components/disclaimer/index.vue" | |
| 	export default { | |
| 		components: { | |
| 			DisclaimerModal | |
| 		}, | |
| 		data() { | |
| 			return { | |
|                 amount: 0, | |
| 				payRadio: "2", | |
| 				orderId : 0, | |
| 				checked : 0, | |
| 				detail : {}, | |
| 				insuranceChecked: true, // 保险选择框,默认选中 | |
|  | |
|                 // type 0企业发布招聘,企业不需要支付保险、交通费,由个人承担 | |
|                 // type 1个人发布求职,企业承担保险费、交通费用 | |
|  | |
| 				// 出行价格定义 | |
| 				trafficPrice: { | |
| 					bus: 2, // 公交/地铁单价 | |
| 					taxi: 3, // 出租车每公里单价 | |
| 					online: 2.5 // 网约车每公里单价 | |
| 				}, | |
|                 fare : 0,//出行费 | |
|                 distance : 0,//距离 | |
|                 farePerKm : 2,//每公里单价 | |
| 			} | |
| 		}, | |
| 		computed : { | |
| 			price(){ | |
| 				// type 0企业发布招聘,企业不需要支付保险、交通费,由个人承担 | |
| 				// type 1个人发布求职,企业承担保险费、交通费用 | |
| 				let basePrice = Number(this.detail.payMoney) || 0; | |
| 				let premiumFee = this.insuranceChecked ? (Number(this.detail.premium) || 0) : 0; | |
| 				let trafficFee = Number(this.fare) || 0; | |
| 				 | |
| 				if (this.detail.type == 1) { | |
| 					// 个人发布求职,企业承担保险费、交通费用 | |
| 					return basePrice + trafficFee | |
| 				} else { | |
| 					// 企业发布招聘,企业不需要支付保险、交通费,由个人承担 | |
| 					return basePrice; | |
| 				} | |
| 			}, | |
| 		}, | |
| 		onLoad(options) { | |
| 			this.orderId = options.orderId | |
| 		}, | |
| 		onShow() { | |
| 			this.onOrderDetail() | |
| 			this.onUserInfo() | |
| 		}, | |
| 		methods: { | |
| 			onUserInfo(){ | |
| 				let params={} | |
| 				userInfo(params).then(response=>{ | |
| 					this.amount=response.result.amount?response.result.amount:0 | |
| 				}).catch(error=>{ | |
| 					 | |
| 				}) | |
| 			}, | |
| 			onOrderDetail() { | |
| 				let that = this | |
| 				let params = { | |
| 					orderId: that.orderId | |
| 				} | |
| 				orderDetail(params).then(response => { | |
| 					that.detail = response.result | |
| 
 | |
|                     that.calcDistance() | |
|                     that.calcFare() | |
| 
 | |
| 				}).catch(error => { | |
|                     console.log(error) | |
| 				}) | |
| 			}, | |
|             //计算距离 | |
|             calcDistance(){ | |
|                 console.log('calcDistance-计算距离') | |
|                 let distance = 0; | |
|                 if (this.detail.type == 1) { | |
|                     let seek = this.detail.employSeek | |
|                     let company = this.detail.employAuthenticationCompany | |
|                     distance = position.calculateDistance(seek.latitude, seek.longitude, company.latitude, company.longitude) | |
|                 } | |
|                 this.distance = distance; | |
|             }, | |
|             //计算路费 | |
|             calcFare(){ | |
|                 console.log('calcFare-计算费用') | |
|                 let fare = 0; | |
|                 if (this.detail.type == 1) { | |
|                     // 个人发布求职,企业承担保险费、交通费用 | |
|                     let seek = this.detail.employSeek | |
| 
 | |
|                     if(!seek) return | |
| 
 | |
|                     // 如果交通方式为"无"或空,则不计算交通费 | |
|                     if (!seek.selectGo || seek.selectGo == '无' || seek.selectGo.trim() == '') { | |
|                         this.fare = 0; | |
|                         return; | |
|                     } | |
| 
 | |
|                     // console.log(this.$store.state.data.configList); | |
|                      | |
|                     let configList = this.$store.state.data.configList | |
| 
 | |
|                     // if(seek.selectGo.includes('出租车')){ | |
|                     //     this.farePerKm = this.trafficPrice.taxi | |
|                     // }else if(seek.selectGo.includes('网约车')){ | |
|                     //     this.farePerKm = this.trafficPrice.online | |
|                     // }else if(seek.selectGo.includes('公交')){ | |
|                     //     this.farePerKm = this.trafficPrice.bus | |
|                     // } | |
|  | |
|                     if(seek.selectGo.includes('出租车')){ | |
|                         this.farePerKm = configList.taxi_price | |
|                     }else if(seek.selectGo.includes('网约车')){ | |
|                         this.farePerKm = configList.online_price | |
|                     }else if(seek.selectGo.includes('公交')){ | |
|                         this.farePerKm = configList.bus_price | |
|                     } | |
| 
 | |
|                     fare = this.farePerKm * this.distance; | |
| 
 | |
|                 } | |
|                 this.fare = fare; | |
|             }, | |
| 			onDetail() { | |
| 				uni.navigateTo({ | |
| 					url: "/pages_subpack/order-detail/index" | |
| 				}) | |
| 			}, | |
| 			onInsuranceChange(value) { | |
| 				if (!value) { | |
| 					// 取消选中保险时,先恢复选中状态,然后显示免责声明 | |
| 					this.insuranceChecked = true; | |
| 					this.$nextTick(() => { | |
| 						this.$refs.disclaimerModal.open(); | |
| 					}); | |
| 				} | |
| 			}, | |
| 			onDisclaimerCancel() { | |
| 				// 取消免责声明,重新选中保险 | |
| 				this.insuranceChecked = true; | |
| 				// 强制更新视图 | |
| 				this.$forceUpdate(); | |
| 			}, | |
| 			onDisclaimerConfirm() { | |
| 				// 确认免责声明,保持不选中保险 | |
| 				this.insuranceChecked = false; | |
| 				// 强制更新视图 | |
| 				this.$forceUpdate(); | |
| 			}, | |
| 			payOrderCompany() { | |
| 				 | |
| 				let that = this | |
| 				 | |
| 				if(that.checked.length==0){ | |
| 					return uni.showToast({ | |
| 						icon: "none", | |
| 						title: "请勾选隐私协议" | |
| 					}) | |
| 				} | |
| 
 | |
| 				let data = { | |
| 					orderId: this.orderId, | |
| 					payType: this.payRadio, | |
|                     fare : this.fare || 0,//出行费 | |
| 					buyInsurance: this.insuranceChecked // 新增参数,表示是否购买保险 | |
| 				} | |
| 
 | |
| 				payOrderCompany(data) | |
| 				.then(res => { | |
| 					if (res.code == 200) { | |
| 						if (data.payType == '2') { | |
| 							uni.requestPayment({ | |
| 								provider: 'wxpay', // 服务提提供商 | |
| 								timeStamp: res.result.timeStamp, // 时间戳 | |
| 								nonceStr: res.result.nonceStr, // 随机字符串 | |
| 								package: res.result.packageValue, | |
| 								signType: res.result.signType, // 签名算法 | |
| 								paySign: res.result.paySign, // 签名 | |
| 								success: function(res) { | |
| 									uni.navigateBack(-1) | |
| 								}, | |
| 								fail: function(err) { | |
| 									uni.showToast({ | |
| 										icon: 'none', | |
| 										title: "支付失败" | |
| 									}) | |
| 								} | |
| 							}); | |
| 						} else if (res.code == 200) { | |
| 							uni.navigateBack(-1) | |
| 						} | |
| 					} | |
| 				}) | |
| 			}, | |
| 		} | |
| 	} | |
| </script> | |
| 
 | |
| <style> | |
| </style> |