<template>
	<view class="dis_col_evenly">
		<text class="t_2">
			骑行时间 (min)
		</text>
		<text class="t_1">
			{{now_time_list}}
		</text>
		<text class="t_2">
			当前费用: {{expenses}}元
		</text>
		<view class="t_3">
			<text class="btn_now" style="width: 100px" @click="handle_finish">
				结束行程
			</text>
		</view>
		<text class="t_4">佰安出行已为您本次出行购买了《安全保险》</text>
	</view>
</template>

<script setup>
	import {
		ref,
		toRefs,
		defineProps,
		defineEmits
	} from 'vue'
	import mapnvueApi from '@/sheep/api/home/mapnvue';
	import {
		baseUrl,
		apiPath
	}
	from '@/sheep/config';
	import sheep from '@/sheep';
	import {
		onLoad,
		onShow,
		onReady
	} from '@dcloudio/uni-app';
	const props = defineProps({
		rideOrderId: Number,
		now_time_list: String,
		expenses: Number
	})
	const all_props = toRefs(props)
	const timer = ref(null)
	onShow(() => {

	})
	// 
	async function handle_finish() {
		// 查看是否需要调度费用
		let val = {
			lng: uni.getStorageSync('latitude'),
			log: uni.getStorageSync('longitude')
		}
		const {
			data,
			code
		} = await mapnvueApi.operate_scope(val)
		if (code == 0) {
			if (data == false) {
				uni.showModal({
					title: '换车范围外',
					content: '当前还车位置不在还车点内，是否确认还车',
					confirmText: '确认',
					success: (res) => {
						if (res.confirm) {
							handle_f_l()
						} else if (res.cancel) {
							return
						}
					}
				});
			} else {
				handle_f_l()
			}
		}
	}
	// 
	async function handle_f_l() {
		let rideOrderId = uni.getStorageSync('rideOrderId')
		const {
			data,
			code
		} = await mapnvueApi.finishRide(rideOrderId)
		if (code == 0) {
			handle_finish_pay(data.rideId)
		} else {
			uni.showToast({
				icon: 'error',
				title: '结束失败'
			})
		}
	}
	// 
	async function handle_finish_pay(val) {
		let coms = {
			rideId: val
		}
		const {
			data,
			code
		} = await mapnvueApi.business_pay(coms)
		if (code == 0) {
			sheep.$router.go('/pages/pay/index', {
				id: data,
				type: '结束行程'
			})
		} else {
			uni.showToast({
				icon: 'error',
				title: '支付失败'
			})
		}
	}
</script>

<style lang="scss" scoped>
	.dis_col_evenly {
		// width: 100%;
		height: 200px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
		padding: 10px 20px;
	}

	.t_1 {
		font-weight: 800;
		font-size: 30px;
		margin: 10px 0;
	}

	.t_2 {
		font-size: 13px;
		color: #999999;
		// margin-top: 5px;
	}

	.t_3 {
		// width: 500px;
		padding: 10px 40px;
	}

	.t_4 {
		margin-top: 5px;
		font-size: 13px;
		color: #a6a6a6;
	}

	.btn_now {
		height: 40px;
		background: #000000;
		color: #fff;
		font-size: 14px;
		border-radius: 3px;
		line-height: 40px;
		text-align: center;
		margin-top: 10px;
	}
</style>