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">开锁</button>
				<button class="cu-btn bg-blue margin-tb-sm lg"><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="plus" 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 class="dispatch-btn-container">
			<view class="cu-btn bg-blue" @click="getInfoList">
				调度
			</view>
		</view>

	</view>
</template>


<script setup>
	import {
		ref
	} 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([]);

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

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

	const deleteDispatchRecord = (recordId,index) => { 
		
		            // 使用 splice 删除指定索引的元素
		            dispatchRecords.value.splice(index, 1);
			// api.callEbikeInfo("deleteDispatchRecord?recordId=" + recordId, {}, "get").then(res=>{
			// 	if(res.code==200){
			// 		dispatchRecords.value.slice(index,1)
			// 	}
			// })

	}
	const bikeCodeScanChange = (bikeCode) => {
		api.callEbikeInfo("getBikeINfoData?bikeCode=" + bikeCode).then((res) => {
			if (res.code == 200) {
				const params = {
					"orderId": orderId.value,
					"bikeCode": bikeCode,
					"dispatchState": 0
				}
				debugger;
				newbikeCode.value = bikeCode;
				api.callEbikeInfo("createDispatchRecord", params)
					.then(re => {
						if (re.code == "200") {
							dispatchRecords.value.push(re.data)
						} else {
							showModelMessage(re.msg)
						}

					})
			} else {
				showModelMessage("车辆不存在！")
			}
		});
	};
</script>

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

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

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

	}
</style>