<template>
	<view>
		<u-navbar back-text="返回" title="散料盘点" :background="background"></u-navbar>
		<view>
			<table style="width: 100%; margin-top: 1ch;">
				<tr>
					<td>条 码:</td>
					<td>
						<u-input placeholder="请扫描条码" :border="true" v-model="barCode" :focus="focusBarCode"
							@confirm="searchByBarcode" />
					</td>
				</tr>
				<tr>
					<td>物料编码:</td>
					<td>
						<u-input placeholder="" :disabled="true" :border="true" v-model="materialCode" />
					</td>
				</tr>
				<tr>
					<td>物料描述:</td>
					<td>
						<u-input placeholder="" :disabled="true" :border="true" v-model="materialDescription" />
					</td>
				</tr>
				<tr>
					<td>账面数量:</td>
					<td>
						<u-input placeholder="" :disabled="true" :border="true" v-model="QTY" />
					</td>
				</tr>
				<tr>
					<td>库位编码:</td>
					<td>
						<u-input placeholder="" :disabled="true" :border="true" v-model="Kw" />
					</td>
				</tr>
				<tr>
					<td>新库位:</td>
					<td>
						<u-input placeholder="" :border="true" v-model="newKw" :focus="focusNewKw" />
					</td>
				</tr>
				<tr>
					<td>盘点数量:</td>
					<td>
						<u-input placeholder="" :border="true" v-model="checkQty" :focus="focusQty" />
					</td>
				</tr>
				<tr>
					<td><button type="warn" size="mini" @click="clear">清除</button></td>
					<td><button type="primary" size="mini" @click="submit">确认</button></td>
				</tr>
			</table>
		</view>


	</view>
</template>

<script>
	import {
		getdata
	} from '../../../common/api.js'
	export default {
		data() {
			return {
				background: {
					backgroundImage: 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))'
				}, //返回按钮的样式
				//分栏器的样式
				styles: [{
						value: 'button',
						text: '按钮',
						checked: true
					},
					{
						value: 'text',
						text: '文字'
					}
				],
				colors: ['#007aff', '#4cd964', '#dd524d'],

				colorIndex: 0,
				activeColor: '#007aff',
				styleType: 'text',
				//---------------------------------------- 分割线上方都是引用的外部的组件使用的样式，下方才是是使用的数据
				checkPlanDescription: "", //盘点描述
				newKw: "", //新库位
				checkQty: "", //盘点数量
				checkPlanName: "", //盘点单号
				barCode: "", //条码
				focusBarCode: false, //条码焦点 
				focusNewKw: false, //新库位焦点
				focusQty: false, //盘点数量焦点
				//---------------------------仅展示的数据 
				materialCode: "", //物料编码
				materialDescription: "", //物料描述
				QTY: "", //账面数量
				Kw: "", //库位编码 
				siteName:"",
				userId:""
			}
		},
		mounted() {
			this.GetMaxBillNo(); //获取最大单据号
			let that=this
			uni.getStorage({
				key:"sitename",
				success(res) {
					that.siteName=res.data
				}
			})
			uni.getStorage({
				key:"userid",
				success(res) {
					that.userId=res.data
				}
			})		
		},
		methods: {
			//焦点初始化，让页面所有的焦点同时只能存在一个
			initfocus() {
				this.focusCheckPlanName = false //单号焦点
				this.focusBarCode = false //条码焦点
				this.focusNewKw = false //新库位焦点
				this.focusQty = false //盘点数量焦点
			},

			//获取焦点的公共方法
			getfocus(nextfocus) {
				this.initfocus()
				this[nextfocus] //不能用this.nextfocus
				this.$nextTick(() => { //vue是数据全部修改后才进行的视图更新，使用nextTick函数就是为了在下次dom节点更新之前拿到最新的数据，还不懂的可以去百度
					this[nextfocus] = true
				})
			},
			//扫描条码回车搜索
			searchByBarcode() {
				if (this.barCode != "") {
					this.getBarCodeInfo() //获取该条码的全部信息		
				} else {
					this.$showMessage("条码不能为空")
					this.getfocus('focusBarCode') //重新聚焦到条码框
					return
				}
			},
			//通过单个条码搜索信息
			getBarCodeInfo() {
				this.$MyRequest('/check/getbarcode', {
					materialPackingName: this.barCode 
				}).then(res => {
					if (res.data.success) {
						this.materialCode = res.data.resultObj[0]["MATERIALSPECNAME"] //物料编码
						this.materialDescription = res.data.resultObj[0]["DESCRIPTION"] //物料描述
						this.QTY = res.data.resultObj[0]["MATERIALQUANTITY"] //账面数量
						this.Kw = res.data.resultObj[0]["SYSLOCATION"] //库位
					} else {
						this.$showMessage(res.data.message)
					}
				}).catch(err => {
					this.$showMessage(err) //提示错误
				})
			},

			//确认按钮的提交事件
			submit() {
				if (this.checkQty < 0 || this.checkQty == "") {
					this.$showMessage("盘点数量不能为空或负")
					this.checkQty = "" //清空盘点数量
					this.getfocus('focusQty') //重新聚焦
					return
				} else {
					if (this.newKw == "") {
						let oldkw = this.Kw //当新库位为空的时候传旧的库位编码进去
						this.sendCheckedPlan(oldkw) //调用方法
					} else {
						this.sendCheckedPlan(this.newKw) //传新的库位编码
					}
				}
			},
			//清除按钮
			clear() {
				this.barCode = ""
				this.QTY = ""
				this.Kw = ""
				this.materialCode = ""
				this.materialDescription = ""
				this.newKw = ""
				this.checkQty = ""
				this.getfocus('focusBarCode') //重新聚焦
			},
			
			GetMaxBillNo() {
				this.$MyRequest('/check/MaxBillNo', {
					billType: 'BitsPD' //散料盘点单据类型
				}).then(res => {
					if (res.data.success) {
						//console.log(res.data.resultObj);
						this.checkPlanName = res.data.resultObj;
						console.log(this.checkPlanName);
					} else {
						this.$showMessage(res.data.message)
					}
				}).catch(err => {
					this.$showMessage(err);
				})
			},

			//盘点结果发送
			sendCheckedPlan(kw) {
				this.$MyRequest('/check/BitsCheckConfirm', {
					siteName:  this.siteName, //工厂名
					checkPlanName: this.checkPlanName, //盘点单号
					materialPackingName: this.barCode, //物料编号
					actLocation: kw, //新库位或者是旧库位
					materialQuantity: this.checkQty, //盘点数量
					operatorId:  this.userId //登录用户
				},'POST',true).then(res => {
					if (res.data.success) {
						this.barCode = "" //清空条码
						this.newKw = "" //清空库位
						this.checkQty = "" //清空盘点数量
						//只读输入框的清空
						this.materialCode = ""
						this.materialDescription = ""
						this.QTY = ""
						this.Kw = ""
						//下面重聚焦
						this.getfocus('focusBarCode')
						this.$showMessage(res.data.message)
					} else {
						this.$showMessage(res.data.message)
					}
				}).catch(err => {
					this.$showMessage("err")
				})
			}

		}
		}
</script>

<style lang="scss">

</style>