zx_flk_app/pages/orderStatus/orderStatus.vue

<template>
	
	
	<view class="container-view">
		<view class="time-info">
			<navBar bgColor="transparent" left="0"></navBar>
			<view>
				<view v-if="orderInfo.pay_status!=2">
					<view class="get-time-view flex-row" v-if="orderInfo.pay_status == 0">待支付</view>
					<view class="get-time-view flex-row" v-else-if="orderInfo.pay_status == 1">支付中</view>
					<view class="get-time-view flex-row" v-else-if="orderInfo.pay_status == 3">支付失败</view>
					<view class="get-time-view flex-row" v-else-if="orderInfo.pay_status == 4">支付取消</view>
					<view class="get-time-view flex-row" v-else-if="orderInfo.pay_status == 5">线下待审核</view>
					<view class="get-time-view flex-row" v-else-if="orderInfo.pay_status == 6">线下审核拒绝</view>
				</view>
				<block v-if="orderInfo.pay_status == 2">
					<view :class="['get-time-view', 'flex-row', 'blue-text']" v-if="orderInfo.order_status == 3">使用中...</view>
					<view :class="['get-time-view', 'flex-row', 'red-text']" v-if="orderInfo.order_status == 4">已逾期</view>
					<view class="get-time-view flex-row" v-if="orderInfo.order_status == 2">请上传车辆图片激活车辆</view>
					<view class="get-time-view flex-row" v-if="orderInfo.order_status == 5">待门店确认</view>
					<view class="get-time-view flex-row" v-if="orderInfo.order_status == 6">还车中,等待门店取车</view>
					<view class="get-time-view flex-row" v-if="orderInfo.order_status == 7">已完成</view>
					<view class="get-time-view flex-row" v-if="orderInfo.order_status == 8||orderInfo.order_status == 9">已取消</view>
					<view class="get-time-view flex-row" v-if="orderInfo.order_status == 1 "><text>请于</text><text class="get-car-time">{{tools.formatTimeSecond( orderInfo.pick_up_time)}}</text><text>到门店取车</text></view>
					<view v-if="orderInfo.order_status == 10">已完结</view>
				</block>
				
			</view>

			<view class="time-money">
				<view v-if="orderInfo.order_type != 3" class="flex-row flex-between">
					<view class="money-item">
						<view :class="orderInfo.order_status == 4?'red-status':''">
							<block v-if="orderInfo.hire_duration_time">{{orderInfo.hire_duration_time}}</block>
							<block v-else>{{Number(orderInfo.hire_cycle) * (orderInfo.hire_duration)}}</block>
						</view>
						
						<view>{{((orderInfo.order_status == 2) || orderInfo.order_status == 3)?'租期剩余':(orderInfo.order_status == 4 ? '逾期时长':'租借周期')}}·<text style="opacity: 0.4;">{{leaseUnits(orderInfo.hire_duration_unit)}}</text></view>
						
						<!-- <view v-if="(orderInfo.order_status == 2&&orderInfo.hire_type==2) || orderInfo.order_status == 3">
							租期剩余·天</view>
						<view v-else-if="orderInfo.order_status == 4 " class="red-status">逾期时长·天</view>
						<view v-else>租借周期·天</view> -->
					</view>
					<view v-if="orderInfo.order_status != 4" class="money-item">
						<view>
							{{tools.toFix(orderInfo.hire_money / 100)}}
						</view>
						<view>订单金额<text style="opacity: 0.4;">·$</text></view>
					</view>

					<view v-if="orderInfo.order_status == 4" class="money-item">
						<view style="color:#F95151" class="red-status">
							{{tools.toFix(overdueData.money / 100)}}
						</view>
						<view style="color:#F95151">逾期金额·$</view>
					</view>

					<view @tap="bindExpanded">
						<text>{{isExpanded?'收起':'展开'}}</text>
						<img
							:src="isExpanded?'https://qiniu.bms16.com/FvRah8ro91B_TUVEmInBq6n69W2f':'https://qiniu.bms16.com/FtbxPP0aXYG8hyJTEJfNTXa_Puuc'" />
					</view>
				</view>
				
				<view v-if="orderInfo.order_type == 3" class="flex-row flex-between">
					<view class="money-item">
						<view></view>
						<view>租借周期：购买</view>
					</view>
					<view class="money-item">
						<view :class="orderInfo.order_status == 4?'red-status':''">
							{{orderInfo.order_status == 4?tools.toFix(over_fee/100):tools.toFix(orderInfo.money / 100)}}<text>元</text>
						</view>
						<view>订单金额</view>
					</view>
					<view @tap="bindExpanded">
						<text>{{isExpanded?'收起':'展开'}}</text>
						<img
							:src="isExpanded?'https://qiniu.bms16.com/FvRah8ro91B_TUVEmInBq6n69W2f':'https://qiniu.bms16.com/FtbxPP0aXYG8hyJTEJfNTXa_Puuc'" />
					</view>
				</view>

				<view v-if="isExpanded" class="dashed-border"></view>
				
				<view v-if="isExpanded">
					<view class="big-text">订单信息</view>
					<view class="sn-content flex-row flex-between">
						<view class="sn-title">订单编号</view>
						<view class="sn-text">{{orderInfo.sub_sn}}</view>
					</view>
					<view class="sn-content flex-row flex-between">
						<view class="sn-title">下单时间</view>
						<view class="sn-text">{{tools.formatTime(orderInfo.ctime)}}</view>
					</view>
					<view v-if="orderInfo.pay_time" class="sn-content flex-row flex-between">
						<view class="sn-title">支付时间</view>
						<view class="sn-text">{{tools.formatTime(orderInfo.pay_time)}}</view>
					</view>
					<view class="sn-content flex-row flex-between">
						<view class="sn-title">支付方式</view>
						<view v-if="orderInfo.pay_type == 0" class="sn-text">微信支付</view>
						<view v-if="orderInfo.pay_type == 1" class="sn-text">线下支付</view>
						<view v-if="orderInfo.pay_type == 2" class="sn-text">支付宝支付</view>
						<view v-if="orderInfo.pay_type == 9" class="sn-text">钱包余额支付</view>
					</view>
					<view v-if="orderInfo.order_type != 3" class="sn-content flex-row flex-between">
						<view class="sn-title">租车金额</view>
						<view class="sn-text">$ {{tools.toFix(orderInfo.hire_money/1000)}}</view>
					</view>
					<view v-if="orderInfo.order_type != 3" class="sn-content flex-row flex-between">
						<view class="sn-title">租车押金</view>
						<view class="sn-text"><text class="grey-text"></text> $
							{{tools.toFix(orderInfo.deposit/1000)}}
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="car-info">
			<view class="flex-row flex-between" style="margin-bottom: 40rpx;">
				<text>自行去门店取还</text>
				<text class="distance-num">{{orderInfo.distance}}m</text>
			</view>
			<view class="flex-row store-img-view">
				<img src="https://qiniu.bms16.com/FrwDlFZdSMiBgqnqDjB19PiDUmuu" alt="">
				<view style="width: calc(100% - 180rpx);margin-left: 24rpx;">
					<view class="store-name">{{orderInfo.shop_name}}</view>
					<view class="store-name-address">{{orderInfo.address || '未知地址'}}</view>
					<view class="flex-row flex-between align-center">
						<view class="flex-row time-style align-center">
							<img v-if="orderInfo.work_begin_time && orderInfo.work_end_time"
								style="width: 40rpx;height: 40rpx;"
								src="https://qiniu.bms16.com/Fp-G1pdXxnTV-G3qFbgS453AuqcU" alt="">
							<text
								v-if="orderInfo.work_begin_time && orderInfo.work_end_time">{{orderInfo.work_begin_time}}-{{orderInfo.work_end_time}}</text>
						</view>
						<img @click="navToCabinet" style="width: 112rpx;height: 64rpx;"
							src="https://qiniu.bms16.com/Fts38M35doVjK09GfOza5qD-wwkK" alt="">
					</view>
				</view>
			</view>
		</view>
		<view class="car-info">
			<view>车辆信息</view>
			<view class="car-top flex-row flex-between">
				<view>
					<view class="top-flex">
						<view>{{orderInfo.model_name}}</view>
						<view>续航{{(orderInfo.endurance /1000).toFixed(0)}}km｜重量{{(orderInfo.weight / 1000).toFixed(0)}}kg</view>
					</view>
					<!-- //配套服务 -->
					<view class="serviceList">
						<view v-for="(item,index) of orderInfo.service_list" :key="index" class="tag">
							{{item}}
						</view>
					</view>
				</view>
				<image mode="aspectFill" v-if="orderInfo.model_images" :src="orderInfo.model_images"></image>
				<image v-else src="https://qiniu.bms16.com/FhEvnKUckAHPtWaC04mi2s53IEVj" mode=""></image>
			</view>
			<!-- <view class="exchange-info">
				<view class="flex-row flex-between">
					<view class="exchange-info-title flex-row align-center">
						<img style="width: 40rpx;height: 40rpx;" src="https://qiniu.bms16.com/Fj_ifr41AqH2PijZBdOBa3SCxADg" alt="">
						<text style="margin-left: 16rpx;">换电信息</text>
					</view>
					<view @tap="navToExchange" class="flex-row" style="margin-bottom: 28rpx;">
						<view class="exchange-button">共3次</view>
						<image src="https://qiniu.bms16.com/FpIN7AVzFU75slFlX-SIdnSEmn1k" style="width: 28rpx;height: 28rpx;" />
					</view>
				</view>			
				<view class="exchange-content">本单可享3次免费换电数，超出后需单独支付</view>
				<view class="exchange-content">自费换电:S1/次</view> -->
			<!-- <view class="exchange-content">本单您可享受{{orderInfo.gift_exchange_num}}次免费换电，
				当前免费换电剩余{{(orderInfo.gift_exchange_num - orderInfo.used_exchange_num) > 0 ? (orderInfo.gift_exchange_num - orderInfo.used_exchange_num) : '0' }}次，超出后需要单独支付换电费用
				</view> -->
			<!-- </view> -->
		</view>

		<view v-if="orderInfo.hire_begin_time!=0&&orderInfo.hire_end_time!=0" class="return-info">
			<view class="return-top flex-row flex-between">
				<view>取还时间</view>
				<view>
					<!-- 共3天{{orderInfo.hire_return_time.day > 0 ? orderInfo.hire_return_time.day :'' }}<text
						v-if="orderInfo.hire_return_time.day>0">日</text>{{orderInfo.hire_return_time.hour > 0 ? orderInfo.hire_return_time.hour :'' }}<text
						v-if="orderInfo.hire_return_time.hour>0">小时</text>{{orderInfo.hire_return_time.minute > 0 ? orderInfo.hire_return_time.minute :'' }}<text
						v-if="orderInfo.hire_return_time.minute>0">分</text> -->
					共{{hireDurationUnitsFn(orderInfo.total_hire_time,orderInfo.hire_duration_unit)}}
				</view>
			</view>
			<view class="return-bottom flex-row">
				<view>{{orderInfo.hire_begin_times}}</view>
				<img src="https://qiniu.bms16.com/FoXmBbj7YGWmjyeuVEY35nzieqnx" />
				<view>{{orderInfo.hire_end_times}}</view>
				<!-- <view>{{tools.formatTimeDate(orderInfo.hire_begin_time)}}</view>
				<img src="https://qiniu.bms16.com/FoXmBbj7YGWmjyeuVEY35nzieqnx" />
				<view>{{tools.formatTimeDate(orderInfo.hire_end_time)}}</view> -->
			</view>
		</view>


		<view v-if="orderInfo.order_status==2||orderInfo.order_status==3||orderInfo.order_status==4"
			class="overdue-info">
			<view>逾期规则</view>
			<view class="overdue-one">
				<view>1. 逾期后还可用车吗?</view>
				<view>如果逾期将触发智能锁车逻辑，可能导致您无法正常用车，请及时续费或联系商家处理。</view>
			</view>
			<view class="overdue-two">
				<view>2. 逾期费计算标准是什么?</view>
				<view>小时租逾期费=每小时费用*逾期小时；当日还/日/周/月/季租逾期费=每天费用*逾期天数；如果不满1小时按1小时算，不满1天按1天算，最终收取的逾期费以门店确认的费用为准</view>
			</view>
			<view class="overdue-thr">
				<view>3. 逾期后续租如何收费?</view>
				<view>逾期后及时续租不收取逾期费，逾期时长将从续租订单的用车时间中抵扣</view>
			</view>
		</view>
		<view class="inset-bottom"></view>
		<view class="payment-info flex-row flex-between">
			<view>
				<view v-if="(orderInfo.order_status == 0 ||orderInfo.order_status == 1 || orderInfo.pay_status == 5 || orderInfo.pay_status == 0) && orderInfo.order_type != 3" class="cancel" @tap="clickCancel">结束订单</view>
			</view>
			<view class="flex-row">
				<view v-if="orderInfo.order_status == 1" @tap="navToScan" class="sesame-btn ">扫码绑定</view>
				<view v-if="orderInfo.order_status == 2" @tap="navToScan" class="sesame-btn ">去上传</view>
				<view v-if="(orderInfo.order_status == 3||orderInfo.order_status == 4) && orderInfo.order_type != 3 && orderInfo.pay_status != 5" @tap="tapReturnCar" class="deposit-btn">到店还车</view>
				<view v-if="(orderInfo.order_status == 3||orderInfo.order_status == 4) && orderInfo.order_type != 3 && orderInfo.pay_status != 5"  @tap="bindRenew" class="sesame-btn">续租</view>
				<view @tap="callStorePhone" class="deposit-btn ">联系门店</view>
			</view>
		</view>
		
		<!-- <view class="payment-info flex-row flex-between">
			<view v-if="orderInfo.order_status == 1 || orderInfo.pay_status == 5" class="flex-row"> 
				<view v-if="orderInfo.order_type != 3"
					class="cancel" @tap="clickCancel">结束订单
				</view>
				<view @tap="callStorePhone" class="deposit-btn ">联系门店</view>
			</view>
			<view v-if="orderInfo.order_status == 1" class="flex-row"> 
				<view @tap="callStorePhone" class="deposit-btn ">联系门店</view>
				<view @tap="navToScan" class="sesame-btn ">扫码绑定</view>
			</view>

			<view v-if="orderInfo.order_status == 2" class="flex-row">
				<view @tap="callStorePhone" class="deposit-btn ">联系门店</view>
				<view @tap="navToScan" class="sesame-btn ">去上传</view>
			</view>

			<view
				v-else-if="(orderInfo.order_status == 3||orderInfo.order_status == 4) && orderInfo.order_type != 3 && orderInfo.pay_status != 5"
				class="flex-row"> 
				<view @tap="callStorePhone" class="cancel">联系门店</view>
				<view @tap="tapReturnCar" class="deposit-btn">到店还车</view>
				<view @tap="bindRenew" class="sesame-btn">续租</view>
			</view>

			<view v-else-if="orderInfo.order_status == 5||orderInfo.order_status == 6" @tap="callStorePhone"
				class="pay-btn">
				联系门店</view> 
			<view v-else-if="orderInfo.order_status == 7" @tap="callStorePhone" class="pay-btn">联系门店</view>
			

			<view v-if="orderInfo.order_type == 3 && (orderInfo.order_status == 3||orderInfo.order_status == 4)"
				@tap="callStorePhone" class="pay-btn">联系门店</view>
		</view> -->

		<view v-if="isShowCancel" class="cancel-b">
			<view class="cancel-box">
				<view class="cancel-title flex-row flex-between">
					<view>选择取消原因</view>
					<view @tap="isShowCancel = false" style="font-size: 60rpx;">×</view>
				</view>
				<view @click="reason = '行程变更无需用车'" class="cancel-item flex-row flex-between">
					<view>行程变更无需用车</view>
					<img
						:src="reason == '行程变更无需用车'?'https://qiniu.bms16.com/FhWimtmWybKlYMB6mgIReVWArbfq':'https://qiniu.bms16.com/Fh0JH6_QbiXYmVy7FNYnDkVIGvLC'" />
				</view>
				<view @click="reason = '修改订单信息'" class="cancel-item flex-row flex-between">
					<view>修改订单信息</view>
					<img
						:src="reason == '修改订单信息'?'https://qiniu.bms16.com/FhWimtmWybKlYMB6mgIReVWArbfq':'https://qiniu.bms16.com/Fh0JH6_QbiXYmVy7FNYnDkVIGvLC'" />
				</view>
				<view @click="reason = '不想要了'" class="cancel-item flex-row flex-between">
					<view>不想要了</view>
					<img
						:src="reason == '不想要了'?'https://qiniu.bms16.com/FhWimtmWybKlYMB6mgIReVWArbfq':'https://qiniu.bms16.com/Fh0JH6_QbiXYmVy7FNYnDkVIGvLC'" />
				</view>
				<view @click="bindCancel" class="cancel_btn">确认取消</view>
			</view>
		</view>

		<returnCar :isShowReturnCar="isShowReturnCar" @closeShowReturnCarBtn="()=>isShowReturnCar=false"
			@navStoreBtn="navStoreBtn" @immediatelyReturnBtn="immediatelyReturnBtn" />

		<carPlan :isBuy='false' @payToOrder='payReturn' v-if="showCarPlan" @changeSelectType="changeSelectType"
			@closeShowMore="showCarPlan = false" :params="params" :selectType="selectType" />

		<PayTypeModel @closeShow="()=>isShowToBuy=false" @payToOrder="payToOrder" :free_price="totalPrice"
			:isShowToBuy="isShowToBuy" />
	</view>
</template>
<script module="tools" lang="wxs" src="@/pages/common/wxs/tools.wxs"></script>
<script module="tools" lang="sjs" src="@/pages/common/wxs/tools.sjs"></script>
<script>
	var config_gyq = require('../../common/config_gyq.js');
	var config = require('../../common/config.js');
	var request = require('../../common/request');
	var common = require('../../common/common.js');
	var http = require('../../common/http.js');
	var storage = require('../../common/storage.js');
	var user = require('../../common/user.js');
	// 
	import {
		getRemainingTime
	} from '@/utils/util';
	import {
		MAX_LIMITS,LEASE_TYPE_ARR
	} from '@/common/constant.js'
	var appWhiteListFilter = require('../../common/appWhiteListFilter.js');
	import allPrice from '@/component/allPrice/allPrice';
	import ReturnCar from '@/component/returnCar/returnCar';
	import carPlan from '@/component/carPlan/carPlan';
	import PayTypeModel from '@/component/payTypeModel/payTypeModel';
	import dayjs from 'dayjs'
	import duration from 'dayjs/plugin/duration'
	dayjs.extend(duration);
	
	export default {
		components: {
			allPrice,
			ReturnCar,
			PayTypeModel,
			carPlan
		},
		data() {
			return {
				overdueData: {},
				select_type: '',
				car_detail: {},
				showCarPlan: false,
				return_imgs: {},
				charge_standard: {},
				isShowCancel: false,
				order_sn: '',
				reason: '行程变更无需用车',
				orderInfo: {},
				shop_image: [],
				isExpanded: false,
				isShowPrice: false,
				timer: '',
				isSelectStatus: 1,
				price_list: [], //车辆价格  hire_duration_unit 1 日 4 小时 6 周
				insurance_status: 0,
				over_fee: 0, //逾期金额
				plate_number: '',
				isScanCondeRentalCar: '',
				isShowReturnCar: false,
				isShowToBuy: false,
				totalPrice: 0, //逾期支付金额
			};
		},

		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			this.sub_sn = options.sub_sn || ''
			this.bindOrderInfo()
		},
		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function(e) {
			if (this.sub_sn && this.orderInfo.sub_sn) {
				this.bindOrderInfo()
			}
		},
		
		onUnload: function() {},

		computed: {},

		methods: {
			leaseUnits(type){
				const result = LEASE_TYPE_ARR.find(v => v.value == type);
				return result ? result.unit : '';
			},
			leaseUnitsResult(type) {
				const result = LEASE_TYPE_ARR.find(v => v.value == type);
				return result ? result.label : '';
			},
			payReturn() {},
			//逾期费用计算
			async overdueMoneyFn(car_sn) {
				let {
					data
				} = await request.postApi(config_gyq.API_FLK_CAR_OVERDUE_MONEY, {
					car_sn
				})
				if (data.code == 200) {
					this.overdueData = data.data
				} else {
					common.simpleToast(data.msg)
				}
			},
			payToOrder() {},
			async loadCarInfo(model_id) {
				const me = this
				http.postApi(config.API_FLK_INDEX_CAR_MODEL_DETAIL, {
					model_id,
				}, (resp) => {
					if (resp.data.code === 200) {
						const pData = {
							...this.car_detail,
							price: this.price
						}
						
						me.setData({
							car_detail: resp.data.data,
							params: {
								order_sn: this.orderInfo.order_sn,
								...resp.data.data,
								price: (resp.data.data.rental_setting[0].hire_price / 100).toFixed(2)
							}
						})
					} else {
						common.simpleToast(resp.data.msg);
					}
				})
			},

			changeSelectType(select_type, price) {
				this.setData({
					selectType: select_type,
					price: (price / 100).toFixed(2)
				})
			},
			
			async carDetFn(car_sn){
				let {data} = await request.postApi(config.API_FLK_CAR_DETAIL, {car_sn})
				if (data.code === 200) {
					if(data.data.model_id == this.orderInfo.model_id){
						return true
					}else{
						common.simpleToast('车型不匹配！')
						return false
					}
					
					if(data.data.is_hire == 1){
						return true
					}else{
						common.simpleToast('车辆已被租售！')
						return false
					}
					if(data.data.is_display == 1){
						return true
					}else{
						common.simpleToast('车辆未展示！')
						return false
					}
				} else {
					common.simpleToast('请扫描正确的二维码！')
					return false
				}
				return false
			},
			async navToScan() {
				let car_sn = this.orderInfo.car_sn || ''
				if (!car_sn) {
					let res = await uni.scanCode({
						onlyFromCamera: true,
						scanType: ['qrCode'],
					});
					if (res[0]) return
					car_sn = res[1].result
					if(!await this.carDetFn(car_sn)) return
				}
				uni.showLoading({
					title: '识别中....',
					mask: true
				})
				setTimeout(()=> {
					uni.hideLoading();
					uni.navigateTo({
						url: `/pages/activation/activation?model_id=${this.orderInfo.model_id}&sub_sn=${this.sub_sn}&car_sn=${car_sn}`
					})
				}, 1000);
				
			},

			navToCabinet() {
				const {
					latitude,
					longitude,
					cityname,
					address,
					shop_name
				} = this.orderInfo
				uni.openLocation({
					latitude: latitude - 0,
					longitude: longitude - 0,
					scale: 15,
					name: shop_name,
					address: address,
					success: function(res) {}
				});
			},

			hireDurationUnitFn(type) {
				if (type == 1) {
					return '天'
				} else if (type == 2) {
					return '月'
				} else if (type == 3) {
					return '年'
				} else if (type == 4) {
					return '小时'
				} else if (type == 5) {
					return '分钟'
				} else if (type == 6) {
					return '周'
				} else if (type == 7) {
					return '季'
				}
			},
			hireDurationUnitsFn(time, type) {

				if (type == 1) {
					return Math.ceil(time / 60 / 60 / 24) 
				} else if (type == 2) {
					return Math.ceil(time / 60 / 60 / 24 / 30)
				} else if (type == 3) {
					return Math.ceil(time / 60 / 60 / 24 / 30 / 365) 
				} else if (type == 4) {
					return Math.ceil(time / 60 / 60) 
				} else if (type == 5) {
					return Math.ceil(time / 60)
				} else if (type == 6) {
					return Math.ceil(time / 60 / 60 / 24 / 7)
				} else if (type == 7) {
					return Math.ceil(time / 60 / 60 / 24 / 30 / 3)
				}
			},

			async bindOrderInfo() {
				const me = this
				const locationStr = uni.getStorageSync('user_current_location');
				// if (locationStr) {
				// 	this.myLocation = locationStr;
				// }
				http.postApi(config.API_FLK_ORDER_INFO, {
					sub_sn: me.sub_sn,
					latitude: locationStr.latitude,
					longitude: locationStr.longitude,
				}, (resp) => {
					if (resp.data.code === 200) {
						me.orderInfo = resp.data.data.order_info
				me.orderInfo.model_images = me.orderInfo.model_images.split(',')[0]
						// 
						if (resp.data.data.order_info.model_id) {
							me.loadCarInfo(resp.data.data.order_info.model_id)
						}
						let distance = common.getFlatternDistance(locationStr.longitude, locationStr.latitude, me
							.orderInfo.longitude, me.orderInfo.latitude)
						resp.data.data.order_info.distance = distance
						// 取还时间展示
						// me.orderInfo.hire_return_time = common.getTimeToDay(Math.ceil(me.orderInfo
						// 	.hire_end_time - me.orderInfo.hire_begin_time) / 60)
				
						me.orderInfo.hire_return_time = getRemainingTime(me.orderInfo
							.hire_begin_time, me
							.orderInfo.hire_end_time)
						me.orderInfo.hire_begin_times = me.orderInfo.hire_begin_time ? dayjs(me
							.orderInfo
							.hire_begin_time * 1000).format(
							'YY-MM-DD') : 0
						me.orderInfo.hire_end_times = me.orderInfo.hire_end_time ? dayjs(me
							.orderInfo
							.hire_end_time * 1000).format(
							'YY-MM-DD') : 0
							console.log(me.orderInfo.order_status == 1);
							let other_time=0
						// 剩余租期判断
						if (me.orderInfo.order_status == 1){
							me.orderInfo.hire_duration_time=common.countToDay(me.orderInfo.hire_cycle*me.orderInfo.hire_duration,me.orderInfo.hire_duration_unit)
						;
						}else if((me.orderInfo.order_status == 2) ||me.orderInfo.order_status == 3) {

							me.orderInfo.hire_duration_time = common.timestampToDays(Math.ceil(me.orderInfo.hire_end_time - Math.floor(new Date()) /1000))
							console.log(me.orderInfo.hire_duration_time,'me.orderInfo.hire_duration_time')
						} else {
							if (me.orderInfo.order_status == 4) {
								me.overdueMoneyFn(me.orderInfo.car_sn)
								
								me.orderInfo.hire_duration_time = common.timestampToDays(Math.ceil(Math.floor(new Date()) / 1000 - me.orderInfo.hire_end_time))
							} else {
								me.orderInfo.hire_duration_time = common.timestampToDays(Math.ceil(me.orderInfo.hire_begin_time - me.orderInfo.hire_end_time))
							}
						}
					} else {
						// 默认返回上一个页面再提示报错
						uni.navigateBack({
							delta: 1
						})
						common.simpleToast(resp.data.msg)
					}
				})

			},
			navStoreBtn() {
				const {
					latitude,
					longitude,
					address,
					shop_name
				} = this.orderInfo
				uni.openLocation({
					latitude: latitude - 0,
					longitude: longitude - 0,
					scale: 15,
					name: shop_name,
					address: address,
					success: function(res) {}
				});
			},
			tapReturnCar() {
				this.setData({
					isShowReturnCar: true
				})
			},
			immediatelyReturnBtn() {
				//到店还车  判断逾期状态 如果逾期要交逾期费用 跳转到上传车辆图片再支付逾期费用还车
				const isOverdue = this.orderInfo.order_status == 4
				const {
					car_sn,
					shop_id,
					overdue_money
				} = this.orderInfo
				const returnCarParams = {
					car_sn,
					shop_id,
					overdue_money,
					isReturnCar: true,
				}
				//提交还车图片
				uni.navigateTo({
					url: `/pages/activation/activation?isReturnCar=true,model_id=${this.orderInfo.model_id}&sub_sn=${this.sub_sn}&car_sn=${this.orderInfo.car_sn}&isOverdue=${isOverdue}&overdueMoney=${this.overdueData.money}&overdueTime=${this.overdueData.time}`
				});
				// if (isOverdue) {
				// 	this.setData({
				// 		totalPrice: this.overdueData.money,
				// 		isShowToBuy: true
				// 	})
				// } else {
				// 	//提交还车图片
				// 	uni.navigateTo({
				// 		url: `/pages/activation/activation?isReturnCar=true,model_id=${this.orderInfo.model_id}&sub_sn=${this.sub_sn}&car_sn=${this.orderInfo.car_sn}&isOverdue=${isOverdue}&overdueMoney=${this.overdueData.money}&overdueTime=${this.overdueData.time}`
				// 	});
				// }
			},
			callStorePhone() {
				const phone = this.orderInfo.link_phone
				common.callPhone(phone)
			},
			async clickCancel() {
				this.isShowCancel = true
			},

			async bindCancel() {
				const me = this
				let res = await uni.showModal({
					title: '取消订单',
					content: '您是否需要取消该订单',
					confirmText: '是',
					confirmColor: '#0074FF',
					cancelText: '否',
					cancelColor: '#191D23',
				});
				if (res[1].confirm) {
					let {
						data
					} = await request.postApi(config.API_DAYHIRE_HIRE_CANCEL_ORDER, {
						sub_sn: this.sub_sn,
						remark: this.reason
					})
					if (data.code == 200) {
						common.simpleToast(data.msg)
						this.isShowCancel = false
						this.bindOrderInfo()
					} else {
						common.simpleToast(data.msg)
					}
				}
			},

			bindToNav() {
				console.log(111);
				const {
					address,
					latitude,
					longitude,
					shop_name
				} = this.shopInfo
				uni.openLocation({
					latitude: latitude - 0,
					longitude: longitude - 0,
					scale: 15,
					name: shop_name,
					address: address,
					success: function(res) {},
				})
			},

			bindToHome() {
				uni.reLaunch({
					url: '/pages/index/index',
					success: function(res) {},
					fail: function(res) {},
					complete: function(res) {}
				});
			},

			callPhone() {
				const me = this
				const phone = me.shopInfo.link_phone
				uni.showModal({
					content: `您是否要拨打电话${phone}？`,
					confirmText: '确定',
					success: (res) => {
						if (res.confirm) {
							uni.makePhoneCall({
								phoneNumber: phone,
								success() {},
								fail() {}
							})
						}
					},
					fail: (res) => {}
				})
			},

			bindRenew() {
				this.params.overdueData = this.overdueData
				this.showCarPlan = true
				// this.isReturnHome = false
				// let isRenew = true
				// uni.navigateTo({
				// 	url: '/pages/carIntroduce/carIntroduce?plate_number=' + this.orderInfo
				// 		.license_plate_number +
				// 		'&isRenew=' + isRenew +
				// 		'&order_sn=' + this.order_sn,
				// 	success: function(res) {},
				// 	fail: function(res) {},
				// 	complete: function(res) {}
				// });
			},

			bindBattery() {
				this.isReturnHome = false
				uni.navigateTo({
					url: '/pages/battery/battery?plate_number=' + this.orderInfo.license_plate_number,
					success: function(res) {},
					fail: function(res) {},
					complete: function(res) {}
				});
			},

			bindExpanded() {
				this.isExpanded = !this.isExpanded
			},

			navToInput() {
				this.isReturnHome = false
				uni.navigateTo({
					url: '/pages/inputLicensePlate/inputLicensePlate?order_sn=' + this.orderInfo
						.order_sn,
					success: function(res) {},
					fail: function(res) {},
					complete: function(res) {}
				});
			},

			// 激活车辆
			navToActive() {
				this.isReturnHome = false
				const me = this
				if (this.orderInfo.hire_type == 1) { // 预约
					if (me.isScanCondeRentalCar) {
						uni.scanCode({
							onlyFromCamera: true,
							success: function(res) {
								me.loadScanCode(res.result)
							},
							fail: function(res) {},
							complete: function(res) {},
						})
					} else {
						uni.navigateTo({
							url: '/pages/inputLicensePlate/inputLicensePlate?order_sn=' + this
								.order_sn + '&order_model_id=' + this.orderInfo.model_id,
							success: function(res) {},
							fail: function(res) {},
							complete: function(res) {}
						});
					}
				} else { // 非预约
					const isJumpReturn = false
					uni.navigateTo({
						url: '/pages/activation/activation?order_sn=' + this.order_sn +
							'&plate_number=' + this
							.orderInfo.license_plate_number + '&isJumpReturn=' + isJumpReturn,
						success: function(res) {},
						fail: function(res) {},
						complete: function(res) {}
					});
				}
			},

			loadScanCode(battery_sn) {
				const pData = {
					longitude: this.longitude,
					latitude: this.latitude,
					battery_sn: battery_sn
				}
				const me = this
				http.postApi(config.API_DAYHIRE_CAR_CAR_INFO, pData, (resp) => {
					uni.hideLoading()
					if (resp.data.code === 200) {
						const timestamp = Date.now(); // 获取当前时间戳（毫秒）  
						const isOffline = (Math.floor(timestamp / 1000) - resp.data.data
							.last_comm_time) > 1800
						me.plate_number = resp.data.data.license_plate_number
						if (resp.data.data.last_comm_time === 0 || isOffline) {
							common.simpleToast('此车辆已离线，请选择其他车辆')
						} else {
							let carInfo = JSON.stringify(resp.data.data)
							const car_model = resp.data.data.model_info.car_model
							const model_images = resp.data.data.model_info.model_images.split(',')
							const return_imgs = resp.data.data.return_imgs
							var model_id = resp.data.data.model_info.model_id
							if (resp.data.data.has_owner) { //车辆正在被使用
								if (resp.data.data.is_mine) { //是本人在使用
									wx.showModal({
										title: '提示',
										content: '已有正在使用的车辆，是否跳转至车辆详情页?',
										cancelText: '取消',
										confirmText: '确定',
										success: function(res) {
											this.isReturnHome = false
											uni.navigateTo({
												url: '/pages/battery/battery?plate_number=' +
													this.plate_number
											});
										},
										fail: function(res) {},
										complete: function(res) {},
									})
								} else {
									common.simpleToast('此车辆正在被使用')
								}
							} else {
								if (me.order_sn && me.order_sn != '') {
									if (this.orderInfo.model_id != model_id) { // 预租车型与之前预约车型不一致
										common.simpleToast('与预约车型不符')
									} else {
										this.isReturnHome = false
										uni.navigateTo({
											url: '/pages/activation/activation?plate_number=' +
												this.plate_number + '&order_sn=' + this
												.order_sn +
												'&car_model=' + car_model + '&model_image=' +
												model_images[0] + '&return_imgs=' + JSON
												.stringify(
													return_imgs),
											fail() {}
										})
									}

								} else {
									this.isReturnHome = false
									uni.navigateTo({
										url: '/pages/carIntroduce/carIntroduce?carInfo=' +
											encodeURIComponent(carInfo) + '&plate_number=' +
											this.plate_number,
										fail() {}
									})
								}
							}
						}
					} else {
						common.simpleToast(resp.data.msg)
					}
				})
			},

			bindToPay() {
				const me = this
				//#ifdef MP-ALIPAY
				const _from = 'ali'
				const _pay_type = 2
				//#endif
				//#ifdef MP-WEIXIN
				const _from = 'wx'
				const _pay_type = 0
				//#endif
				http.postApi(config.API_DAYHIRE_HIRE_CONTINUE_PAY, {
					order_sn: me.order_sn,
					from: _from,
					pay_type: _pay_type
				}, (resp) => {
					common.loading()
					if (resp.data.code === 200) {
						uni.hideLoading()
						//#ifdef MP-ALIPAY
						my.tradePay({
							tradeNO: resp.data.data.trade_no,
							success: function(res) {
								if (res.resultCode == 9000) {
									common.simpleToast('支付成功');
								}
								setTimeout(function() {
									me.bindOrderInfo()
								}, 1000)
							},
							fail: function(res) {
								common.simpleToast('支付失败，请重试')
							},
						})
						//#endif
						//#ifdef MP-WEIXIN
						var payParams = JSON.parse(resp.data.data.payParams);
						user.wxPay(me.order_sn, payParams, function(isSuccess) {
							if (isSuccess) {
								common.simpleToast('支付成功')
								setTimeout(function() {
									me.bindOrderInfo()
								}, 1000)
							} else {
								common.simpleToast('支付失败，请重试')
							}
						});
						//#endif
					} else {
						uni.hideLoading()
						common.simpleToast(resp.data.msg)
					}
				})
			},

			// 计算拖车说明收费价格
			calculateFare(distance, charge_list) {
				let fare = 0
				if (distance <= charge_list.start_mil) {
					fare = charge_list.start_price / 100
				} else {
					// actual_start_mil:实际距离单位米
					// over_start_price:向上取整的公里数*超出首公里的费用
					var actual_start_mil = distance - charge_list.start_mil
					var over_start_price = (Math.ceil(actual_start_mil / charge_list.step_mil)) * charge_list
						.step_price
					fare = (charge_list.start_price + over_start_price) / 100
				}
				const fareArray = fare.toFixed(2).split('.'); //将价格拆分为整数部分和小数部分
				const price_list = {
					start_mil: (charge_list.start_mil / 1000).toFixed(2),
					start_price: (charge_list.start_price / 100).toFixed(2),
					step_mil: (charge_list.step_mil / 1000).toFixed(2),
					step_price: (charge_list.step_price / 100).toFixed(2),
					actual_start_mil: actual_start_mil ? (actual_start_mil / 1000).toFixed(2) : 0,
					over_start_price: over_start_price ? (over_start_price / 100).toFixed(2) : 0,
					fare: fare.toFixed(2), // 保留两位小数
					fareArray: fareArray //将价格拆分为整数部分和小数部分
				}
				return price_list
			},

			bindChangeStatus(e) {
				const {
					status,
					unit
				} = e.currentTarget.dataset
				this.setData({
					isSelectStatus: unit,
					selectIndex: status
				})
				// this.bindDuration()
			},

			//计算价格
			// bindDuration(){
			// 	const me = this
			// 	var _insurance_price  //保险金
			// 	const unit_price=(me.price_list[0].hire_price/100) * me.leaseTime  //租金
			// 	// insurance_setting 保险
			// 	if (me.insurance_setting!=null) {  // 有保险的时候
			// 		// isSelectDeposit==0为免押  isOpenNoDeposit为是否成功开通免押  total_money为总金额
			// 		// unit_price 租金   insurance_setting.price 保险金   deposit 押金
			// 		if (me.duration_unit == 4) { // 时
			// 			_insurance_price = (me.insurance_setting.price - 0) * 1
			// 		} else if(me.duration_unit == 6) { // 周
			// 			_insurance_price = (me.insurance_setting.price - 0) * 7 * me.leaseTime
			// 		} else { //天
			// 			_insurance_price = (me.insurance_setting.price - 0) * me.leaseTime
			// 		}
			// 	} else {  // 无保险
			// 		_insurance_price = 0
			// 	}

			// 	if (me.isOpenNoDeposit) {
			// 		// 金额=(周期数*周期价格)+保险金
			// 			me.amount = ((me.leaseTime * me.price_list[0].hire_price -0) + (_insurance_price - 0)) / 100
			// 	} else {
			// 		// 金额=(周期数*周期价格)+押金+保险金
			// 		me.amount = ((me.leaseTime * me.price_list[0].hire_price -0) + (me.modelInfo.deposit -0) + (_insurance_price - 0)) / 100
			// 	}
			// },

			loadEnd() {
				this.bindOrderInfo()
			},
			navToExchange() {
				console.log('跳转换电记录');
				uni.navigateTo({
					url: '/pages/exchangeRecord/exchangeRecord' +
						'?order_sn=' + this.orderInfo.order_sn
				})
			}
		}
	};
</script>

<style>
	@import './orderStatus.css';

	.cancel_btn {
		width: 702rpx;
		height: 80rpx;
		background: #060809;
		border-radius: 40rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		font-size: 32rpx;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>