<template>
  <view class="printconfig">
		<view v-if="hasPrinter!='1'" class="initPrint">
			<view class="title" style="font-size: 20rpx;margin-bottom: 30rpx;">使用须知</view>
			<view class="tips" style="font-size: 16rpx;margin-bottom: 20rpx;color: chocolate;">使用前先连接wifi打印机ip地址,输入后点完成确认</view>
			<uni-easyinput style="margin-bottom: 20rpx;" class="input" type="text" confirmType="done" v-model="printInfo.ip" placeholder="请输入打印机ip地址" @confirm="connectPrint"></uni-easyinput>
		</view>
		<view v-else class="initPrint">
			<view class="title" style="font-size: 20rpx;margin-bottom: 30rpx;">已经连接打印机</view>
			<view style="font-size: 16rpx;margin-bottom: 10rpx;color: chocolate;">当前连接打印机IP</view>
			<uni-easyinput style="margin-bottom: 20rpx;" disabled v-model="printInfo.ip" placeholder="请输入打印机ip地址"></uni-easyinput>
			<button @click.native="resetPrint" type="primary">断开连接</button>
		</view>
  </view>
</template>

<script>
  export default {
    name: 'printConfig'
  }
</script>

<script setup>
import { onMounted, ref } from 'vue'
import { setIp } from '@/static/js/api.js'

const plug= uni.requireNativePlugin('Html5app-Gprinter');
const hasPrinter = ref('')
const printInfo = ref({
	ip:'',
	port:'9100'
})
onMounted(() => {
 hasPrinter.value = uni.getStorageSync('hasPrinter')
 printInfo.value.ip = uni.getStorageSync('printerIp')
 console.log('printInfo.value.ip', printInfo.value.ip)
})

const emit = defineEmits(['emitClose'])

const connectPrint = ()=>{
	console.log('connectPrint>>printInfo.value.ip', printInfo.value.ip)
	const ipReg = /^(\d+)\.(\d+)\.(\d+)\.(\d+)$/
	if(ipReg.test(printInfo.value.ip)){
		if(RegExp.$1<256 && RegExp.$2<256 && RegExp.$3<256 && RegExp.$4<256){
			plug.connectIP({"ip":printInfo.value.ip,"port":printInfo.value.port},(ret)=>{
				console.log('connectPrint>>ret',ret)
				const res = JSON.parse(JSON.stringify(ret))
				console.log('connectPrint>>res',res.code)
				if(res.code==3){
					// initPrint.value = true
					uni.setStorageSync('hasPrinter', '1')
					uni.setStorageSync('printerIp', printInfo.value.ip)
					// _this.tip=JSON.stringify(ret);
					// console.log(_this.tip);	
					// 关闭配置页操作
					// 保持ip和端口
					
					console.log('hasPrinter', uni.getStorageSync('hasPrinter'))
					console.log('printerIp', uni.getStorageSync('printerIp'))
					emit('emitClose')
				} else{
					// uni.$showMsg('打印机连接失败，请重试！', 500)
					console.log('plug.connectIP打印机连接失败，请重试??>>', res)
				}
				
			});
		} else{
			uni.$showMsg('ip地址有误，请重试！', 2000)
		}
		const param = {userId:uni.getStorageSync('userId')+'',ip:printInfo.value.ip,port:printInfo.value.port}
		console.log('before setIp param',param)
		const res2 =  setIp({
			token: uni.getStorageSync('token'),
			data: JSON.stringify(param)
		})
		if (res2.code !== 200){
			// uni.$showMsg(res2.data.msg, 2000)
			console.log('conectPrinter error>>>', res2.data)
		}
	}
}

const resetPrint = async()=>{
	plug.disconnect({},ret=>{
		uni.$showMsg(ret.msg, 3000)
		hasPrinter.value = ''
		printInfo.value.ip = ''
		uni.setStorageSync('hasPrinter', '')
		uni.setStorageSync('printerIp', '')
		// console.log(_this.tip);
	})
	const param = {userId:uni.getStorageSync('userId')+'',ip:'',port:printInfo.value.port}
	const res2 = await setIp({
		token: uni.getStorageSync('token'),
		data: JSON.stringify(param)
	})
	console.log('setIp》》》', res2)
	if (res2.code !== 200){
		// uni.$showMsg(res2.data.msg, 2000)
		console.log('setIP callback', res2.data)
	}
}


</script>

<style lang="scss">
  .printconfig{
		background-color: #fff;
		width: 500rpx;
		// height: 300rpx;
		padding: 20rpx;
		.initPrint{
			.title{
				font-size: 20rpx;
			}
			.tips{
				font-size: 16rpx;
			}
			.input{
				width: 300rpx;
			}
		}
	}
</style>