zhywpt-sp/subpackage/after-sale/activation/activate.vue

<template>
	<view class="containers">
		<view class="sec_info">
			<view class="info_txt">信息确认</view>
			<view class="info_plate">
				<text>车牌号码</text>
				<text>{{ fileDataStrings.vehiclePlate }}</text>
			</view>
			<view class="info_plate">
				<text>车牌颜色</text>
				<text>{{ fileDataStrings.vehiclePlateColorStr }}</text>
			</view>
			<view class="info_plate">
				<text>手机号码</text>
				<text>{{ fileDataStrings.customerTel }}</text>
			</view>
			<view class="info_plate" style="border: none" v-if="fileDataStrings.cardId">
				<text>卡号</text>
				<text>{{ fileDataStrings.cardId }}</text>
			</view>
			<view class="info_plate" v-if="fileDataStrings.obuId">
				<text>OBU号</text>
				<text>{{ fileDataStrings.obuId }}</text>
			</view>
			<view class="info_plate">
				<text>收费车型</text>
				<text>{{ fileDataStrings.vehicleClassStr }}</text>
			</view>
		</view>
		<view class="up_btn" v-if="state.showBtn">
			<button aria-disabled="true" @click="btn" v-if="!state.isSuccess" :class="state.disabled?'button':'hui'">
				点击开始激活
			</button>
			<button aria-disabled="true" @click="back" v-else>
				点击返回首页
			</button>
		</view>
	</view>
	<!-- 激活成功popup -->
	<view v-if="state.showPopup" class="mask">
		<piaoyi-progress-bar canvasId="progressCanvas4" :progress="state.progressNum"
		    progressBackgroundColor="#07C160" :showText="true" textColor="#fff" :textSize="28" :height="22"
		    :isCircular="true" :diameter="300"></piaoyi-progress-bar>
	</view>
	
</template>

<script setup>
	import {
		reactive,
		ref
	} from "vue";
	import {
		formatTime,
		formatTime2,
		expireDate,
		expireDate2,
		getFormatDate,
		msg
	} from "@/utils/utils";
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		getItem
	} from "@/utils/storage";
	import {requestNew} from "@/utils/network/request.js";
	import {
		IntegerToHexString,
	} from "@/utils/util/fileData.js";
	import {
		issueApply,issueCallback,orderDetailQuery,errorLogAdd
	} from "@/utils/network/api";
	import {
		agentId
	} from "@/utils/network/difference";
	const cmd = require("../../../static/etcUtil/cmdConfig.js");
	const tools = require("../../../static/etcUtil/tools.js");
	const bluetoothUtil = require("../../../static/etcUtil/index.js");
	import activeSuccess from "./components/popup-device-active-success";
	const datas = require("../../../static/etcUtil/datas.js");
	import {
		getVehiclePlateColor
	} from "@/datas/vehiclePlateColor";
	import {
		searchVehicleInfoQuery
	} from "@/subpackage/after-sale/js/publicRequest";
	import {
		channelId
	} from "@/utils/network/difference";
	const state = reactive({
		orderId: "",
		id: "",
		cardStatus: "",
		obuStatus: "",
		isSuccess: false, //是否激活成功
		showPopup: false,
		transfer: 0, //0  是原来的激活   1  是过户激活
		showBtn: true,
		disabled: true,
		progressNum:0
	})

	onLoad((option) => {
		//读取传入 存储的数据orderInfo
		let orderData = getItem("orderInfo");
		state.id = orderData.id;
		console.log(state);
		state.transfer = Number(option.transfer)
		//获取订单详情
		getOrderDetails(state.id);
		console.log("state.transfer", state.transfer, state.transfer == 0, state.transfer == 1,getItem("orderInfo"))

	})

	const card = reactive({
		cardId: "",
		netId: "",
		cardType: "",
		startTime: "",
		endTime: "",
		userName: "",
		idNum: "",
		vehiclePlate: "",
		vehiclePlateColor: "",
		color: "",
		version: "",
		type: "",
		favourable: "",
		money: "",
		v_userType: "",
	});
	const obu = reactive({
		obuId: "",
		startTime: "",
		endTime: "",
		version: "",
		approvedCount: "",
		axleCount: "",
		axleDistance: "",
		engineNum: "",
		type: "",
		userType: "",
		contractNo: "",
		vehiclePlate: "",
		vehiclePlateColor: "",
		vin: "",
		wheelCount: 0,
		isJH: ""
	});
	let cmdRandNum = '';
	let orderInfo = {};

	const fileDataStrings = reactive({
		approvedCount: 0, //核载人数
		cardId: "", //卡号
		obuId: "", //obu号
		obuId: "", //obu号
		packageNum: "", //套餐编号
		axleCount: 0, //轴数
		axleDistance: "", //轴距
		engineNum: "", //发动机
		vehicleVin: "",
		vehicleEngineNum: "",
		cardStatus: "",
		obuStatus: "",
		type: 0, //类型
		userType: 0, //用户类型
		vehiclePlate: "", //车牌
		vehiclePlateColor: 0, //车牌颜色
		vehicleDimensions: "",
		wheelCount: 0, //车轮数
		vehicleIdNo: "", //车牌号
		vehiclePlateColorStr: "",
		customerTel: "",
		customerId: "",
		orderId: "",
		vehicleClassStr: ""
	});
	function cmdResult1() {
		// tools.showLoadingAlert('正在激活，请等待')
		const options = {
			type: 2, //type: 2,JSON格式提交数据(默认表单形式提交)
			showLoading: false,
			data: {
				orderId: orderInfo.orderNo,
				issueType: state.transfer ? 2 : 1, //1正常激活   2 过户激活
				cardId:card.cardId,
				obuId:obu.obuId
			}, //请求参数
			method: "POST", //提交方式(默认POST)
		};
		console.log("options==", options)
		
		//BDS-二发指令申请  
		requestNew(issueApply, options)
			.then((res) => {
				console.log("在线激活 请求");
				console.log(res);
				const datas =res;
				bluetoothUtil.transCmd(datas.cmd.split(','), datas.cmdType == 'CARD' ? '10' : '20', function(res) {
					implementCmd(datas.transOrderId, datas.cmd, res.toString(), datas.stepNo)
				}, (err) => {
					showModals('在线激活异常')
					console.log("err",err)
					errorLog(datas.cmd,JSON.stringify(err),datas.stepNo)
					tools.hideLoadingAlert();
					state.showPopup=false
				});
			})
			.catch((err) => {
				console.log(err);
				tools.hideLoadingAlert();
				state.showPopup=false
			});
	}

	function implementCmd(transOrderId, cmd, cmdResult, stepNo) {
		state.progressNum=state.progressNum+5
		const options = {
			type: 2, //type: 2,JSON格式提交数据(默认表单形式提交)
			showLoading: false,
			data: {
				transOrderId, //步骤号
				cmd,
				cmdResult,
				stepNo,
				mpOpenId:getItem('mpOpenId')//公众号openid
			}, //请求参数
			method: "POST", //提交方式(默认POST)
		};
		console.log("options2222", options)
		//BDS-二发指令回传 
		requestNew(issueCallback, options)
			.then((res) => {
				console.log("BDS-二发指令回传 ",res);
				const datas = res;
				console.log("在线激活 请求", datas);
				if (datas.stepNo == 100) {
					state.disabled = true
					tools.hideLoadingAlert();
					state.progressNum=100
					setTimeout(() => {
						state.showPopup=false
					},1000)
					setTimeout(() => {
						msg("激活成功", {
							'icon': 'success',
							'duration': 3000
						})
					},2000)
					setTimeout(() => {
						uni.navigateTo({
							url: "/subpackage/after-sale/deviceInfo/deviceInfo",
						});
					},5000)
				} else {
					console.log("datas.stepNo", datas.stepNo)
					bluetoothUtil.transCmd(datas.cmd.split(','), datas.cmdType == 'CARD' ? '10' : '20', function(res) {
						implementCmd(transOrderId, datas.cmd, res.toString(), datas.stepNo)
					}, (err) => {
						console.log("err",err)
						state.showPopup=false
						errorLog(datas.cmd,JSON.stringify(err),datas.stepNo)
						showModals('在线激活异常')
					});
				}
			})
			.catch((err) => {
				console.log(err);
				tools.hideLoadingAlert();
				state.showPopup=false
			});
	}

	//开始激活 按钮事件
	const btn = () => {
		state.disabled = false
		state.showPopup=true
		console.log('orderInfo参数', orderInfo, state.disabled)
		cmdResult1()
	};

	//获取订单详情
	const getOrderDetails = (id) => {
		console.log('======获取订单信息======')
		const options = {
			type: 2,
			data: {
				id: id,
			},
			method: "POST",
			showLoading: false,
		};
		state.disabled = false
		requestNew(orderDetailQuery, options).then((res) => {
			console.log("orderInfo", res);
			orderInfo = res.data;
			console.log("orderInfores", res);
			if (orderInfo) {
				fileDataStrings.userType = orderInfo.userType; //用户类型
				fileDataStrings.cardId = orderInfo.cardId;
				fileDataStrings.packageNum = orderInfo.packageNum;
				fileDataStrings.obuId = orderInfo.obuId;
				fileDataStrings.customerTel = orderInfo.customerTel;
				fileDataStrings.customerId = orderInfo.customerId;
				fileDataStrings.orderId = orderInfo.orderNo;
				fileDataStrings.vehiclePlateColorStr = getVehiclePlateColor(orderInfo
					.vehiclePlateColor);
				fileDataStrings.vehiclePlate = orderInfo.vehiclePlate; //车牌
				fileDataStrings.vehicleClassStr = orderInfo.vehicleClassStr;
			}
		});
		getObuId();
	};

	/**
	 * 获取OBU号 读OBU
	 */
	const getObuId = () => {
		console.log('======获取OBU号======')
		let cmdArray = [cmd.HOME_DIRECTORY, cmd.OBU_SYSTEM_FILE, cmd.RANDOM_NUMBER];
		bluetoothUtil.transCmd(cmdArray, "20", function(res) {
			var status = res[1].substring(res[1].length - 4, res[1].length);
			console.log('获取OBU号执行结果' + status, res)
			//第一次获取随机数
			if (status == "9000") {
				state.disabled = true
				obu.obuId = res[1].substring(20, 36);
				obu.vin = res[1].substring(18, 20);
				obu.version = res[1].substring(18, 19) >= 4 ? "4x" : "2x";
				cmdRandNum = res[2].substring(0, res[2].length - 4);
				getCardId()
			} else {
				showModals('获取设备信息错误！')
			}
		}, () => {
			showModals('获取设备信息错误')
		});
	};

	function showModals(msg) {
		uni.showModal({
			title: '提示',
			content: msg,
			showCancel: false,
			success: function(res) {
				if (res.confirm) {
					uni.navigateBack()
					console.log('用户点击确定1');
				} else if (res.cancel) {
					console.log('用户点击取消1');
				}
			}
		});
	}
	const back = () => {
		uni.switchTab({
			url: "/pages/index/index"
		});
	}
	const getCardId = () => {
		//执行0015文件
		tools.showLoadingAlert("执行指令");
	
		let cmdArr = [cmd.HOME_DIRECTORY, cmd.APPLICATION_DIRECTORY, cmd.CMD_READBINARY, cmd.CMD_GETBALANCE];
		console.log(cmdArr);
		console.log(bluetoothUtil);
		bluetoothUtil.transCmd(cmdArr, '10', function(res) { //10：写卡   20：写OBU
		console.log("5201",res)
			let str = res[2].substring(res[2].length - 4, res[2].length); //判断是否为9000
			let str3 = res[3].substring(res[3].length - 4, res[3].length); //判断是否为9000
			if (str == "9000" || str3 == "9000") {
				if (res[2].length > 86 || res[3] >= 12) {
					card.cardId = res[2].substring(20, 40);
					tools.hideLoadingAlert();
					state.showBtn = true
				} else {
					alertF("CMD_READBINARY指令长度不符" + res[2]);
				}
				return;
			}
			alertF("CMD_READBINARY指令长度不符" + res[2]);
	
		})
	};
	//获取订单详情
	const errorLog = (cmd,error,step) => {
		console.log('======获取订单信息======')
		const options = {
			type: 2,
			data: {
				cardId:card.cardId,
				obuId:obu.obuId,
				orderType:"1",
				factory:datas.getData("deviceName")+"_"+datas.getData("deviceNameZW"),
				orderNo:orderInfo.orderNo,
				cmd,
				error,
				step
				
			},
			method: "POST",
			showLoading: false,
		};
		requestNew(errorLogAdd, options).then((res) => {
			console.log("错误提交成功", res);
			
		});
	};
</script>

<style>
	.containers {
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
		box-sizing: border-box;
	}

	.sec_info {
		width: 90%;
		height: auto;
		margin: 0 auto;
		box-shadow: 0rpx 6rpx 25rpx 0rpx rgba(0, 0, 0, 0.2);
		margin-top: 50rpx;
		border-radius: 20rpx;
	}

	.info_txt {
		width: 100%;
		height: 120rpx;
		line-height: 120rpx;
		text-align: center;
		color: #000;
		font-size: 36rpx;
		margin-bottom: 20rpx;
	}

	.info_plate {
		display: flex;
		flex-direction: row;
		width: 94%;
		height: 100rpx;
		margin: 0 auto;

		border-bottom: 2rpx solid #f2f2f2;
	}

	.info_plate text:nth-child(1) {
		height: 100rpx;
		text-align: left;
		line-height: 100rpx;
		font-size: 32rpx;
		color: #999;
	}

	.info_plate text:nth-child(2) {
		flex: 1;
		height: 100rpx;
		line-height: 100rpx;
		font-size: 32rpx;
		color: #333;
		margin-left: 50rpx;
		text-align: right;
	}

	/*提交按钮样式*/
	.up_btn {
		width: 85%;
		height: 100rpx;
		margin: 0 auto;
		margin-top: 50rpx;
		margin-bottom: 100rpx;
	}

	.up_btn button {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		color: white;
		font-size: 32rpx;
		text-align: center;
		background: linear-gradient(to right,#01243A,#004576);
		border-radius: 40rpx;
		outline: none;
		border: #4cd95f;
	}

	.button {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		color: white;
		font-size: 32rpx;
		text-align: center;
		background: linear-gradient(to left, #43a1e0 0%, #13e7c1 100%);
		border-radius: 40rpx;
		outline: none;
		border: #4cd95f;
	}

	.hui {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		color: white;
		font-size: 32rpx;
		text-align: center;
		background: linear-gradient(to left, #b9b9b9 0%, #e7e7e7 100%) !important;
		border-radius: 40rpx;
		outline: none;
		border: #4cd95f;
	}

	.up_btn button[disabled] {
		background-color: rgba(0, 191, 112, 0.5);
		color: white;
		font-size: 34rpx;
		border-radius: 20rpx;
	}
	.mask{
		width: 100%;
		height:100vh;
		background:rgba(0,0,0,0.63);
		position: fixed;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		z-index: 999;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>