<template>
	<view class="container">
		<uni-forms :label-width="90">
			<uni-card>
				<uni-section title="车辆" type="line">
					<uni-forms-item label="车辆编号:">
						<bikeCodeScan v-model="bikeCode" @scan-change="getBikeInfo" />
					</uni-forms-item>
					<uni-forms-item label="原头盔编号:">
						<div class="divCenter">{{ebikeInfo.helmetCode}}</div>
					</uni-forms-item>
					<uni-forms-item label="头盔在位:">
						<div class="divCenter">{{ebikeInfo.helmetExit}}</div>
					</uni-forms-item>
					<uni-forms-item label="更新时间:">
						<div class="divCenter">{{ebikeInfo.updatedAt}}</div>
					</uni-forms-item>
					<!-- <div class="b-btn-blue" style="text-align: center;" @click="refresh">刷新</div> -->

					<button @click="refresh" class="cu-btn  lines-blue buttonclass">刷新</button>

				</uni-section>
			</uni-card>
			<uni-card>
				<uni-section title="头盔" type="line">
					<uni-forms-item label="新头盔编号" name="newtkbh">
						<scanCode v-model="newhelmetCode" @scan-change="getHelmetInfo" />
					</uni-forms-item>
				</uni-section>
			</uni-card>
		</uni-forms>
	</view>
	<view class="nav-panel">
		<uni-goods-nav :fill="true" :options="[]" :buttonGroup="navButtonGroup" @buttonClick="btnBind" />
	</view>
</template>

<script setup>
	import {
		ref
	} from "vue";
	import * as api from '@/utils/api.js';
	import * as tools from "@/utils/tools.js";
	import {
		onLoad
	} from '@dcloudio/uni-app';
	const bikeCode = ref(); //车辆编号
	const ebikeInfo = ref({
		bikeId: "",
		bikeCode: "",
		helmetId: "",
		helmetCode: "",
		helmetExit: "",
		updatedAt: ""
	});
	const newhelmetInfo = ref(null);
	const newhelmetCode = ref("");
	const scrollHeight = ref(0);
	const userInfo = ref(null);
	//车辆二维码
	const getBikeInfo = (res) => {
		bikeCode.value = res;
		const params = {
			bikeCode: res
		};
		getDataInfo(params, (data) => {
			ebikeInfo.value = data;
		});
	};
	const navButtonGroup = [{
		text: '确定绑定',
		backgroundColor: '#0078D4',
		color: '#fff'
	}];
	//刷新
	const refresh = () => {
		if (!checkscan()) {
			return
		}
		getBikeInfo(bikeCode.value);
	}

	const getHelmetInfo = (res) => { //扫码头盔 
		const params = {
			helmetCode: res
		};
		getDataInfo(params, (data) => {
			newhelmetInfo.value = data;
		});
	}

	//绑定头盔 
	const btnBind = (index, content) => {
		if (!checkscan()) {
			return
		}
		if (!newhelmetCode.value) {
			tools.showModelMessage("请先扫头盔码或输入头盔码");
			return false;
		}
		const params = {
			"bikeId": ebikeInfo.value.bikeId,
			"bikeCode": bikeCode.value,
			"nhelmetId": newhelmetInfo.value.helmetId,
			"ohelmetId": ebikeInfo.value.helmetId,
			"nhelmetCode": newhelmetInfo.value.helmetCode,
			"ohelmetCode": ebikeInfo.value.helmetCode,
			"helmetReign": ebikeInfo.value.helmetExit
		};
		uni.showModal({
			title: '确认提交',
			content: '您确定要进行提交操作吗？',
			success: (res) => {
				if (res.confirm) {
					api.callEbikeInfo("updateEbikeHelmet", params).then(res => {
						const {
							code,
							data,
							message
						} = res;
						if (code == 200) {
							uni.showToast({
								title: '绑定成功',
								icon: 'success',
								duration: 1000,
								success: function() {
									setTimeout(function() {
										uni.switchTab({
											url: "/pages/mine/mine"
										});
									}, 1000); // 这里设置与 duration 相同的时间，确保提示框弹出后再跳转
								}
							});
						} else {

							tools.showModelMessage(message);
						}
					})
				} else if (res.cancel) {
					console.log('用户取消出库');
				}

			}
		});

	}
	//获取信息
	const getDataInfo = (params, callback) => {
		api.callEbikeInfo("getHelmetINfoData", params).then(res => {
			const {
				code,
				data,
				message
			} = res;
			if (code == 200) {
				callback(data);
			} else {
				tools.showModelMessage(message);
			}
		});
	}
	const checkscan = () => {
		if (!bikeCode.value) {
			tools.showModelMessage("请先扫车辆码或输入车辆码");
			return false;
		}
		if (!ebikeInfo.value.bikeId) {
			tools.showModelMessage("车辆信息不存在");
			return false;
		}

		return true;
	}

	onLoad((options) => {
		userInfo.value = uni.getStorageSync('userInfo');
		const systemInfo = uni.getSystemInfoSync();
		const screenHeight = systemInfo.screenHeight;
		const statusBarHeight = systemInfo.statusBarHeight;
		scrollHeight.value = screenHeight - statusBarHeight - 130;
	})
</script>

<style>
	.container {
		background-color: b-body-gray;
		height: 100vh;
		background-color: #fff;
		position: relative;
	}

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

	.divCenter {
		display: flex;
		align-items: center;
		height: 35px
	}

	.uni-section .uni-section-header {
		padding: 10px 0px !important;
	}

	.buttonclass {
		width: 100%;
		background-color: rgba(243, 249, 255, 0.9) !important;
	}
</style>