<template>
	<view>
		<u-navbar
		 title="车主查询" 
		 title-color="#fff" 
		 :custom-back="customBack" 
		 :border-bottom="false" 
		 back-icon-color="#CCE8FF" 
		 :background="{background: 'linear-gradient(145deg, #41AFF9 0%, #2D8CFB 100%)' }"></u-navbar>
		<view class="taking-pictures" @click="getPic">点击拍照</view>
		<view class="wrap">
			<view class="title">手输车牌号</view>
			<view class="new-plate-number">
				<view class="message-input-wrap" @click="messageInputClick">
					<u-message-input :maxlength="8" width="70" font-size="50" :disabled-keyboard="true" v-model="newPlateNumber"></u-message-input>
				</view>				
				<u-keyboard ref="uKeyboard" mode="car" @change="keyboardChange" @backspace="backspace" v-model="keyboardshow"></u-keyboard>
			</view>
			<view class="bottom-btn" @click="submit">确认</view>
		</view>
		
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	//#ifdef APP-PLUS
	let ocr = uni.requireNativePlugin("OcrPlug");
	//#endif
	export default{
		data(){
			return{
				keyboardshow:false,
				newPlateNumber:'',
				vehicleClor:''
			}
		},
		onLoad(page){
			
		},
		methods:{
			customBack(){
				this.$u.route({
					// type:'switchTab',
					url: 'pages/index/index'
				});
			},
			getPic(){
				let that = this;
				ocr.ocrVehicleNo((ret) => {
					if (ret.success){
						that.newPlateNumber = ret.vehicleNo;
					}else {
						plus.nativeUI.toast('识别失败');
					}
				});
				// uni.chooseImage({
				// 	count: 1, //默认9
				// 	sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
				// 	sourceType: ['camera'], //
				// 	success: function (res) {
				// 		// console.log('img',res)
				// 		uni.showLoading({});
				// 		const tempFilePaths = res.tempFilePaths;
				// 		// 若多选，需循环调用uni.uploadFile ，因微信小程序只支持单文件上传
				// 		uni.uploadFile({
				// 			url: `${that.config.fileUrl}/baidu/ocr`,
				// 			filePath: tempFilePaths[0],
				// 			name: 'file',
				// 			formData: {
				// 				'isUpload': 0  // 上传附带参数
				// 			},
				// 			success: (res) => {
				// 				// 根据接口具体返回格式   赋值具体对应url
				// 				// alert(uploadFileRes.data);
				// 				let resobj=eval("("+res.data+")");
				// 				uni.hideLoading();
				// 				if(resobj.code==200){
				// 					console.log(resobj);
				// 					that.newPlateNumber = resobj.data.vehicleNo;
				// 					// that.vehicleClor = resobj.data.vehicleClor;
				// 				}else{
				// 					that.$refs.uToast.show({
				// 						title: resobj.msg,
				// 						type: 'error'
				// 					});
				// 				}
								
				// 				console.log(res);
				// 			},
				// 			fail: (err) => {
				// 				that.$refs.uToast.show({
				// 					title:err.msg,
				// 					type: 'error'
				// 				});
				// 				uni.hideLoading();
				// 			}
				// 		});
				// 	}
				// });
					
				
			},
			messageInputClick(){
				this.keyboardshow = true;
			},
			// 按键被点击(点击退格键不会触发此事件)
			keyboardChange(val) {
				// 将每次按键的值拼接到value变量中，注意+=写法
				this.newPlateNumber += val;
				console.log(this.newPlateNumber);
			},
			// 退格键被点击
			backspace() {
				// 删除value的最后一个字符
				if(this.newPlateNumber.length) this.newPlateNumber = this.newPlateNumber.substr(0, this.newPlateNumber.length - 1);
				console.log(this.newPlateNumber);
			},
			submit(){
				this.$u.route({
					url: 'pages/ownersquery/ownersinfo/ownersinfo',
					params: {
						vehicleNo: this.newPlateNumber
					}
				});
			}
			
		}
	}
</script>

<style lang="scss">
	@import "./ownersquery.scss";
</style>