<!--扫描组件-->
<template>
	<!-- <page-meta root-font-size="18px"></page-meta> -->
	<view>
		<view class="pop_tab">
			<view class="tab_info">
				<view class="conbox">
					<textarea inputmode="none" v-model="scanMsg" trim="all" maxlength="1000"
						style="margin-left: 5px;width: 90%;" :focus="boxfocus" :placeholder="placeholderValue"
						@focus="getfocus" @blur="losefocus" @input="handelScanMsg" :cursor="cursorIndex"></textarea>
				</view>

				<view class="uni-flex uni-row space-between u-col-center">
					<view class="uni-flex" style="padding: 10px ; color: #3C9CFF; font-weight: bold; font-size: 15px; ">
						{{customerItemCode}}
					</view>
					<view class="uni-flex">
						<button class="clean_scan_btn" @click="clearScanValue()">清空</button>
						<button class="scan_btn" @click="clickScanMsg()">扫描</button>
					</view>
				</view>
			</view>
		</view>
		<comMessage ref="comMessage"></comMessage>
	</view>
</template>
<script>
	export default {
		name: "winComScan",
		emits: ["getResult"],
		components: {},
		props: {
			placeholder: {
				type: String,
				default: '请扫描标签'
			},
			clearResult: {
				type: Boolean,
				default: true
			},
			boxFocus: {
				type: Boolean,
				default: true
			},
			isShowHistory: {
				type: Boolean,
				default: true
			},
			headerType: {
				type: String,
				default: 'HPQ' //HLB   HMQ   HCQ HPQ
			}
		},
		data() {
			return {
				// scanMsg: "HPQ;V1.0;ICE115F11161AG;PP20230427000027;B20230427002;Q100",
				scanMsg: "",
				boxfocus: false,
				placeholderValue: '',
				scanResult: {},
				scanList: [],
				expand: true,
				expendIcon: 'arrow-down',
				cursorIndex: 0,
				customerItemCode: ''
			}
		},
		mounted() {
			this.boxfocus = true;
			uni.hideKeyboard();

			// #ifdef H5
			if (document.querySelector('textarea') != null) {
				document.querySelector('textarea').setAttribute('inputmode', 'none')
			}
			// #endif 
			this.hide()
			// #ifdef APP-PLUS
			// 
			// this.hide()
			// uni.onKeyboardHeightChange(res => {
			//   console.log(res.height)
			//   if(res.height>0){
			// 	  // uni.hideKeyboard();
			// 	  plus.key.hideSoftKeybord();
			//   }
			// })
			// 
			// uni.onWindowResize((res) => {
			// 	plus.key.hideSoftKeybord()
			// })
			// plus.key.hideSoftKeybord();
			// setInterval(function(){
			// 	plus.key.hideSoftKeybord();
			//         // uni.hideKeyboard();//隐藏软键盘
			//         // plus.key.hideSoftKeybord();
			//     },60);

			// #endif 

			// if (this.$el.querySelector('textarea') != null) {
			// 	this.$el.querySelector('textarea').setAttribute('inputmode', 'none')
			// }
		},
		watch: {
			placeholder() {
				this.placeholderValue = '请扫描' + this.placeholder;
			}
		},
		created() {
			this.placeholderValue = '请扫描' + this.placeholder;
		},
		methods: {
			hide() {
				// #ifdef APP-PLUS
				// 只是解决软键盘的闪现
				var interval = setInterval(function() {
					uni.hideKeyboard(); //隐藏软键盘
					console.log('刷新')
				}, 5);
				setTimeout(() => {
					clearInterval(interval);
					console.log('停止刷新')
				}, 1000);
				// #endif 
			},
			getValue() {
				return this.scanMsg
			},
			setValue(val) {
				this.scanMsg = val
			},
			clearScanValue() {
				this.scanMsg = ''
				this.getfocus();
			},
			clickScanMsg() {
				this.scanMsg = this.scanMsg + "\n";
				this.handelScanMsg();
			},
			handelScanMsg() {
				let that = this;
				let index = that.scanMsg.indexOf('\n');
				if (index >= 0) {
					setTimeout(() => {
						that.losefocus();
						let content = uni.$u.trim(that.scanMsg)
						if (content == "") {
							that.getfocus();
							this.$refs.comMessage.showErrorMessage("扫描内容为空,请重新扫描", res => {
								if (res) {
									that.scanMsg = ""
									that.getfocus();
								}
							})
							return;
						}
						let items = that.scanMsg.split('*');
						this.customerItemCode = items[1];
						that.$emit("getResult", this.customerItemCode);
					}, 500);
				}
			},
			getfocus() {
				let that = this;
				this.$nextTick(r => {
					that.boxfocus = true;
				});
				this.hide()
			},
			losefocus() {
				let that = this;
				this.$nextTick(r => {
					that.boxfocus = false;
				});
			},
			clear() {
				if (this.clearResult) {
					this.cursorIndex = 0;
					this.scanMsg = ''
				}
			},
			iconClick(type) {
				this.$emit("clearResult", this.scanMsgk);
			},
			expands() {
				this.expand = !this.expand;
				this.expendIcon = this.expand == true ? "arrow-down" : "arrow-up"
			},
			scanClick() {
				this.handelScanMsg();
			},
			cancelClick() {
				this.clear();
				this.getfocus();
			},
			showItem(item) {
				this.$refs.comMessage.showMessage(item, res => {
					if (res) {
						// this.$refs.modal.cancelClose();
					}
				})
			},

			scanQRCode() {
				let that = this;
				uni.scanCode({
					onlyFromCamera: true,
					success: (res) => {
						that.scanMsg = res.result;
						that.$emit("getResult", res.result);
						console.log('扫描二维码成功,结果:' + res.result);
					},
					fail: (res) => {
						that.showItem('扫描出现错误:' + res.result);
						console.log('扫描出现错误:' + res.result);
					}
				});
			}
		}
	}
</script>

<script module="textarea" lang="renderjs">
	export default {
		mounted() {
			document.querySelector('textarea').setAttribute('inputmode', 'none')
		},
	}
</script>

<style scoped lang="scss">

</style>