<template>
	<view class="container">

		<view>
			<uni-forms>
				<uni-forms-item label="站点">
					<uni-data-select v-model="scheduleExtension.siteId" :localdata="regindata"
						@change="changeZT"></uni-data-select>
				</uni-forms-item>
				<uni-forms-item label="车辆编号">
					<bikeCodeScan ref="childComponent" @scan-change="bikeCodeScanChange" :codeValue="newbikeCode" />
				</uni-forms-item>
			</uni-forms>
		</view>
		<view class="">
			<uni-section title="上传图片" type="line">
				<view class="example-body">
					<uni-file-picker limit="9" @select="selectImg" @delete="delChangeImg"
						:value="fileLists"></uni-file-picker>
				</view>
			</uni-section>
		</view>
		<view class="button-container">
			<view class="button-group flex justify-between padding">
				<button class="cu-btn bg-blue margin-tb-sm lg" @click="unlockHandler">开锁</button>
				<button class="cu-btn bg-blue margin-tb-sm lg" @click="unlockHandler"><strong>推车</strong></button>

			</view>
		</view>
		<view class="table-container">
			<uni-table>
				<uni-tr>
					<uni-th width="100" align="center">车辆编号</uni-th>
					<uni-th width="50" align="center">状态</uni-th>
					<uni-th width="80" align="center">响铃</uni-th>
					<uni-th width="80" align="center">操作</uni-th>
				</uni-tr>
				<uni-tr v-for="(item, index) in dispatchRecords" :key="index">
					<uni-td>{{ item.bikeCode }}</uni-td>
					<uni-td>
						<view class="name">离线</view>
					</uni-td>
					<uni-td align="center">
						<view class="cu-tag  line-blue">
							<uni-icons type="sound" @click="onRingClick(item.bikeCode)" color="rgb(102,179,255)"
								size="20"></uni-icons>
						</view>
					</uni-td>
					<uni-td align="center">
						<uni-icons type="minus-filled" color="black" size="30"
							@click="deleteDispatchRecord(item.id,index)"></uni-icons>
					</uni-td>
				</uni-tr>
			</uni-table>
		</view>
	</view>
	<view class="nav-panel">
		<uni-goods-nav :fill="true" :options="[]" :buttonGroup="navButtonGroup" @buttonClick="navButtonClick" />
	</view>
</template>


<script setup>
	import {
		ref,
		onMounted
	} from 'vue';
	import * as api from '@/utils/api.js';
	import {
		onLoad
	} from '@dcloudio/uni-app';
	import {
		showModelMessage
	} from '@/utils/tools.js';

	const orderId = ref("");
	const fileLists = ref([]);
	const reginvalue = ref("");
	const regindata = ref([]);
	const newbikeCode = ref("");

	const dispatchRecords = ref([]);
	const scheduleExtension = ref({})
	const navButtonGroup = [{
		text: '完成投放',
		backgroundColor: 'rgb(0,120,212)',
		color: '#fff'
	}];


	const changeZT = (e) => {
		console.log("e:", e);
	}
	onLoad((options) => {
		orderId.value = options.orderId;
	});

	onMounted(() => {
		let userDefultOperation = uni.getStorageSync('userDefultOperation');
		//获取站点信息 
		api.callOperateApi("ebikeRegion/getRegion?regionId=" + userDefultOperation.operationRegionId, {}, "get")
			.then(
				res => {
					if (res.code == 200) {
						res.data.forEach(res => {
							let quyuemap = {
								"text": res.siteName,
								"value": res.siteRegionId
							};
							regindata.value.push(quyuemap);
						});
					}
				})
		getInfoList();
	})
	const getInfoList = () => {
		api.callEbikeInfo("getDispatchVehicleByOrderId?orderId=" + orderId.value, {}, "get").then(
			res => {
				if (res.code == 200) {
					dispatchRecords.value = res.data.dispatchRecords;
					scheduleExtension.value = res.data.scheduleExtension
				}
			})
	}
	const delChangeImg = (res) => {
		const fileUniqueKey = fileLists.value[res.index].fileUniqueKey;
		fileLists.value.splice(res.index, 1);
		api.callEbikeInfo("deletedFile?fileUniqueKey=" + fileUniqueKey, {}, "get");
	};
	const selectImg = (data) => {
		const file = data.tempFiles[0];
		api.fileUpload(file).then(res => {
			if (res.code == 200) {
				fileLists.value.push(res.data)
			} else {
				if (fileLists.value.length > 0) {
					fileLists.value.pop();
				} else {
					fileLists.value = [];
				}
			}
		});
	};
	const deleteDispatchRecord = (recordId, index) => {
		if (dispatchRecords.value.length == 1) {
			uni.showModal({
				title: '确认删除',
				content: '删除将会取消工单，确认要删除吗？',
				success: (res) => {
					if (res.confirm) {
						cancelWorkOrder(index);
					} else {
						// 用户取消删除，什么都不做
					}
				}
			});
		} else {
			api.callEbikeInfo("deleteDispatchRecord?recordId=" + recordId, {}, "get").then(res => {
				if (res.code == 200) {
					dispatchRecords.value.splice(index, 1);
				}
			})
		}

	}

	const cancelWorkOrder = (index) => {
		api.callEbikeInfo("canCellWorkOrder?orderId=" + orderId.value + "&orderType=3", {}, "get").then((res) => {
			if (res.code == 200) {
				uni.showToast({
					title: "成功！",
					icon: "success",
					duration: 1000,
					mask: true,
					success: () => {
						dispatchRecords.value.splice(index, 1);
						setTimeout(() => {
							// 返回上一页
							uni.navigateBack({
								delta: 1 // 返回上一页
							});
						}, 1000);
					}
				});
			} else {
				uni.showToast({
					title: "取消工单失败！",
					icon: "error",
					duration: 1000,
					mask: true
				});
			}
		})
	}
	const bikeCodeScanChange = (bikeCode) => {
		api.callEbikeInfo("getBikeINfoData?bikeCode=" + bikeCode).then((res) => {

			if (res.code == 200) {
				const ecuSn = res.data.ecuSn;
				const ecuId = res.data.ecuId;
				const bikeId = res.data.bikeId;
				//获取车辆经纬度
				api.callCoreApi("gps?ecuId=" + ecuSn + "&bikeId=" + bikeId, {}, 'get')
					.then((res) => {
						api.callCoreApi("gpsMsg" + "?ecuSn=" + ecuSn, {}, 'get').then((res) => {

							if (res.code == 200) {
								const latitude = res.data.latitude;
								const longitude = res.data.longitude;
								const params = {
									"orderId": orderId.value,
									"bikeCode": bikeCode,
									"dispatchState": 0,
									"startVehicleLat": latitude,
									"startVehicleLng": longitude
								}
								newbikeCode.value = bikeCode;
								api.callEbikeInfo("createDispatchRecord", params)
									.then(re => {
										if (re.code == "200") {
											dispatchRecords.value.push(re.data)
										} else {
											showModelMessage(re.msg)
										}

									})
							} else {
								showModelMessage("车辆经纬度获取失败！");
							}
						})


					});

			} else {
				showModelMessage("车辆不存在！");
			}
		});
	};

	//批量出库事件按钮
	const navButtonClick = (res) => {
		const {
			index,
			content
		} = res;
		if (index == 0) //完成投放
		{
			if (!scheduleExtension.value.siteId) {
				uni.showToast({
					title: '请选择站点',
					icon: 'none'
				});
				return;
			} 
			if(!fileLists.value.length){ 
					uni.showToast({
						title: '请上传投放的照片',
						icon: 'none'
					});
					return;
			}
			const params = {
				"orderId": orderId.value,
				"siteId":  scheduleExtension.value.siteId,
				"fileLists": fileLists.value
			}
			api.callEbikeInfo("completeDeployment", params).then(res => {
				if (res.code == 200) {

					showModelMessage("已完成投放!").then(res => {
						// 返回上一页
						uni.navigateBack({
							delta: 1 // 返回上一页
						});
					})
				}

			})
		}
	}
	const unlockHandler = () => {
		dispatchRecords.value.forEach(ebbikeinfo => {
			uni.showLoading({
				title: "指令下发中...",
				mask: true
			})
			api.callEbikeInfo("getBikeINfoData?bikeCode=" + ebbikeinfo.bikeCode).then((res) => {
				if (res.code == 200) {
					const ecuId = res.data.ecuId;
					const bikeId = res.data.bikeId;
					// 处理开锁逻辑
					api.callCoreApi("unlock?ecuId=" + ecuId + "&bikeId=" + bikeId, {}, 'get').then((
						res) => {
						uni.hideLoading();
						var title = res.data.message;
						var icon = "";
						if (res.data.code == 200) {
							icon = "success"
						} else {
							icon = "error"
						}
						uni.showToast({
							title: title,
							icon: icon,
							duration: 1000,
							mask: true
						});
					});
				}
			});
		})
	}
	const pushCarHandler = () => {
		// 处理推车逻辑
		console.log("推车操作");
	}
	const onRingClick = (bikeCode) => {
		uni.showLoading({
			title: "指令下发中...",
			mask: true
		})
		api.callEbikeInfo("getBikeINfoData?bikeCode=" + bikeCode).then((res) => {
			if (res.code == 200) {
				const ecuId = res.data.ecuId;
				const bikeId = res.data.bikeId;
				// 处理开锁逻辑
				api.callCoreApi("findEbike?ecuId=" + ecuId + "&bikeId=" + bikeId, {}, 'get').then((
					res) => {
					uni.hideLoading();
					var title = res.data.message;
					var icon = "";
					if (res.data.code == 200) {
						icon = "success"
					} else {
						icon = "error"
					}
					uni.showToast({
						title: title,
						icon: icon,
						duration: 1000,
						mask: true
					});
				});
			}
		});
	}
</script>

<style scoped>
	.container {
		padding: 10px
	}

	.button-group button {
		width: 48%;
	}

	.table-container {
		height: 400px;
		width: 100%;
		padding: 5px;

	}

	.nav-panel {
		position: fixed;
		bottom: 0rpx;
		width: 100%;
		padding-bottom: 20px;
		z-index: 999;
		background-color: #fff;
	}
</style>