ebike-ui/ebike-maintenance/pages/warehouse/vehicledispatch/vehicledispatch.vue

<template>
	<view class="container">

		<view>
			<uni-forms>
				<uni-forms-item label="车辆编号">
					<bikeCodeScan ref="childComponent" @scan-change="bikeCodeScanChange" :codeValue="newbikeCode" />
				</uni-forms-item>
			</uni-forms>
		</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 newbikeCode = ref("");

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


	onLoad((options) => {
		orderId.value = options.orderId;
	});

	onMounted(() => {

		getInfoList();
	})
	const getInfoList = () => {
		api.callEbikeInfo("getDispatchVehicleByOrderId?orderId=" + orderId.value, {}, "get").then(
			res => {
				if (res.code == 200) {

					dispatchRecords.value = res.data.dispatchRecords;
				}
			})
	}

	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 params = {
					"orderId": orderId.value,
					"bikeCode": bikeCode,
					"dispatchState": 0
				}
				newbikeCode.value = bikeCode;
				api.callEbikeInfo("createDispatchRecord", params)
					.then(re => {
						if (re.code == "200") {
							dispatchRecords.value.push(re.data)
						} else {
							showModelMessage(re.msg)
						}

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

	//批量出库事件按钮
	const navButtonClick = (res) => {
		const {
			index,
			content
		} = res;
		if (index == 0) //完成投放
		{
			const params = {
				"orderId": orderId.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>