<template>
	<view id="view">
		<div>
			<table>
				<tr>
					<td>工&emsp;&emsp;单：</td><td>{{from.body.pwoCode}}</td>
				</tr>
				<tr>
					<td>物料编码：</td><td>{{from.body.ptNoTar}}</td>
				</tr>
				<tr>
					<td>物料名称：</td><td>{{from.body.ptTitleTar}}</td>
				</tr>
				<tr>
					<td>物料规格：</td><td>{{from.body.specification1}}</td>
				</tr>
				<tr>
					<td>物料图号：</td><td>{{from.body.dynamicField1 === null ? null : from.body.dynamicField1.drawingid}}</td>
				</tr>
				<tr>
					<td>客户名称：</td><td>{{from.body.dynamicField1 === null ? null : from.body.dynamicField1.ks_name}}</td>
				</tr>
				<tr>
					<td>是否冲孔：</td><td>{{from.body.dynamicField1 === null ? null : from.body.dynamicField1.zdy5}}</td>
				</tr>
				<tr>
					<td>总&thinsp;数&thinsp;量&nbsp;:</td><td>{{from.body.num}}</td>
				</tr>
				<tr>
					<td>部&emsp;&emsp;门:</td><td>
					<!-- <uni-easyinput type="text" v-model="from.body.deptCode" /> -->
						<uni-data-select
					      v-model="from.body.deptCode"
					      :localdata="department"
					    ></uni-data-select>
					</td>
				</tr>
				<tr>
					<td>接受仓库:</td><td>
					<!-- <uni-easyinput type="text" v-model="from.body.whCode" /> -->
						<uni-data-select
					     v-model="from.body.whCode"
					     :localdata="listWarehouse"
						></uni-data-select>
					</td>
				</tr>
			</table>
			<p>物料转移单明细信息</p>
		</div>
		<scroll-view  scroll-y="true" class="scroll" >
			<view v-for="(item,index) in from.list" :key="index">
				<table>
					<tr>
						<td>物料编码：</td><td>{{item.materialCode}}</td>
					</tr>
					<tr>
						<td>物料名称：</td><td>{{item.materialName}}</td>
					</tr>
					<tr>
						<td>物料规格：</td><td>{{item.specification1}}</td>
					</tr>
					<tr>
						<td>物料类型：</td><td>{{item.typeText}}</td>
					</tr>
					<tr>
						<td>总&thinsp;数&thinsp;量&nbsp;:</td><td>{{item.inNumber}}</td>
					</tr>
					<tr>
						<td>入库数量</td><td><uni-easyinput type="number" v-model="item.number" @input="inputInNumber($event,item)" :key="item.number+item.materialCode"/></td>
					</tr>
					
				</table>	
				
			</view>
		</scroll-view>
		<button id="button" type="primary" @click="submit" :disabled="!getOpen">提交</button>
		<uni-popup ref="message" type="message">
			<uni-popup-message :type="message.msgType" :message="message.messageText" :duration="2000"></uni-popup-message>
		</uni-popup>
	</view>
</template>

<script>
	import {
		addConversion
	} from "@/api/mes/pwoIn.js";
	export default {
		data() {
			return {
				from:{
					body:{
					},
					list:{}
				},
				department:[],
				listWarehouse:[],
				message:{
					msgType:'warn',
					messageText:'请先查询设备信息'
				},
			}
		},
		/**
		 * 挂载前执行
		 */
		beforeMount() {
			//把查询页面查询到的数据放入进来
			//处理详情数据
			const {body, list} = this.$store.state.pwo.data
			const typeObj = {
				1:'合格品',
				2:'不良品',
				3:'报废品'
			}
			for(let i in list){
				list[i].inNumber = list[i].number
				list[i].typeText =typeObj[list[i].type]
			}
			this.from = Object.assign({},{body,list})
			console.log(this.from)
			this.from.body.dynamicField1 = JSON.parse(this.from.body.dynamicField1)
			//接收完后清空vuex里面的数据清空
			this.$store.commit('updatData',{})
			
			//处理部门数据
			const department = this.$store.state.pwo.department
			for(let i in department){
				const item =  department[i]
				item.value = item.departmentCode
				item.text = item.departmentCode + "-" + item.departmentTitle
			}
			this.department = department
			
			//处理仓库数据
			const listWarehouse = this.$store.state.pwo.listWarehouse
			for(let i in listWarehouse){
				const item  = listWarehouse[i]
				item.value = item.warehouseCode
				item.text = item.warehouseCode + '-' + item.warehouseName
			}
			this.listWarehouse = listWarehouse
		},
		mounted() {
		    //获取屏幕宽高
			updateCss(resSize())
		},
		computed:{
			getOpen(){
				return Boolean(this.from.list.length)
			}
		},
		methods: {
			/**
			 * 提交按钮点击事件
			 */
			async submit(){
				try{
					const  {body,list} = this.from;
					const { pwoCode ,id ,status,deptCode, whCode} = body 
					const data = {
						deptCode,
						whCode,
						type:"3",
						delStatus:"0",
						genRedraw: false,
						mesPwoJobCvDetailList:list,
						dynamicField1:JSON.stringify(body.dynamicField1),
						pwoCode:pwoCode,
						pwoId:id,
						status,
					}
					addConversion(data).then(res => {
						if(res.code === 200){
							this.messageType({
								msgType:'success',
								messageText:'提交成功' 
							})
							setTimeout(function() {
								uni.navigateBack({
									delta: 1
								});
							}, 2100); // 3000毫秒 = 3秒
							
						}
					})
				}catch(e){
					this.messageType({
						msgType:'error',
						messageText:'提交失败，失败原因‘' + e +'’' 
					})
				}
			},
			/**
			 * 提示信息
			 * @param {Object|undefined} value
			 * {msgType,messageText} 参数里面需要包含这两个键
			 */
			messageType(obj){
				const _self = this;
				let message ={}
				if(obj === undefined){
					message = {
						msgType:'error',
						messageText:'请填写设备代码'
					}	
				}else{
					message = {
						msgType:obj.msgType,
						messageText:obj.messageText
					}
				}
				_self.message = Object.assign({},message)
				return _self.$refs.message.open()
			},
			/**
			 * 入库数量输入事件
			 * @param {number} value,输入的值
			 * @param {Object} item,当前的明细信息
			 */
			inputInNumber(value,item){
				const { number } = item
				if(number > value){
					item.inNumber = number
				}
			}
		}
	}
	
	/**
	 *  获取屏幕宽高
	 */
	function resSize(){
		let width = 0;
		let height = 0;
		uni.getSystemInfo({
			success: function (res) {
				width = res.windowWidth;   // 窗口宽度
				height = res.windowHeight; // 窗口高度
			}
		});
		return {width,height}
	}
	/**
	 * 设置元素高度
	 * @param {Object} size
	 */
	function updateCss(size){
		document.querySelector("#view>div").style.height = size.height * 0.35 + 'px'
		document.querySelector(".scroll").style.height = size.height * 0.65 - 46 + 'px'
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #ffffff;
		padding-top: 1vw;
		#view {
			--heightSize : 0;
			width: 100%;
			& > div {
				width: 100%;
			};
			& > .scroll {
				width: 100%;
			}
		}
	}
	table {
		border-collapse: collapse; 
		width: 95%;
		border: 1px solid #ccc; 
		font-size: 14px;
		margin:0 auto;
		tr td:first-child{
			width: 30%;
		}
	};
	p {
		text-align:center;
	}
</style>
