<template>
	<view>
		<uni-collapse>
			<uni-forms :modelValue="jobInForm" ref="jobInForm" :rules="rules">
				<uni-collapse-item title="完工转移单" :open="true">
					<uni-forms-item label="工单" :labelWidth='90' name="pwoCode">
						<uni-easyinput suffixIcon="scan" @iconClick="scanBar" type="text" @confirm="scanJobCode"
							v-model="jobInForm.pwoCode"></uni-easyinput>
					</uni-forms-item>
					<uni-forms-item label="转移单类型" :labelWidth='90' name="type">
						<uni-easyinput type="text" disabled v-model="jobInForm.type"></uni-easyinput>
					</uni-forms-item>
					<uni-forms-item label="备注" :labelWidth='90' name="remark">
						<uni-easyinput autoHeight type="textarea" v-model="jobInForm.remark"></uni-easyinput>
					</uni-forms-item>
				</uni-collapse-item>
				<uni-collapse-item title="完工转移单明细" :open="true">
					<!-- <u-button type="primary" @click="addDetail">新增</u-button>
			  <u-button type="primary" @click="submit">确认</u-button> -->
					<uni-swipe-action>
						<uni-swipe-action-item :rightOptions="rightOptions" :key="index"
							v-for="(item, index) in jobInForm.mesPwoJobCvDetailList"
							@click="(data) => clickDetail(index,data)" @change="swipChange">
							<uni-badge :text="index+1" type="primary"></uni-badge>
							<uni-forms-item label="物料编码" :labelWidth='90'
								:name="'mesPwoJobCvDetailList.'+ index +'.materialCode'">
								<uni-easyinput type="text" disabled v-model="item.materialCode"></uni-easyinput>
							</uni-forms-item>
							<uni-forms-item label="物料名称" :labelWidth='90'
								:name="'mesPwoJobCvDetailList.'+ index +'.materialName'">
								<uni-easyinput type="text" disabled v-model="item.materialName"></uni-easyinput>
							</uni-forms-item>
							<!-- <uni-forms-item label="目标仓库" :name="'mesPwoJobCvDetailList.'+ index +'.whCodeDest'">
				  <uni-easyinput type="text" v-model="item.whCodeDest"></uni-easyinput>
				</uni-forms-item>
				<uni-forms-item label="目标库位" :name="'mesPwoJobCvDetailList.'+ index +'.locCodeDest'">
				  <uni-easyinput type="text" v-model="item.locCodeDest"></uni-easyinput>
				</uni-forms-item> -->
							<uni-forms-item label="转移数量" :labelWidth='90' :rules="rules.number"
								:name="'mesPwoJobCvDetailList.'+ index +'.number'">
								<u-number-box inputWidth="120" button-size="36" v-model="item.number"
									min="0"></u-number-box>
							</uni-forms-item>
						</uni-swipe-action-item>
					</uni-swipe-action>
				</uni-collapse-item>
			</uni-forms>
		</uni-collapse>
		<u-button type="primary" @click="jobInSubmit">提交</u-button>
	</view>
</template>

<script>
	import {
		getInMat,
		addConversion
	} from "@/api/mes/pwoIn.js";

	export default {
		data() {
			return {
				jobInForm: {
					mesPwoJobCvDetailList: [],
				},
				rightOptions: [{
					text: '删除',
					style: {
						backgroundColor: '#ff2a17'
					}
				}, ],
				rules: {
					materialCode: [{
						required: true,
						errorMessage: '请输入物料编码!'
					}],
					materialName: [{
						required: true,
						errorMessage: '请输入物料名称!'
					}],
					number: [{
						required: true,
						errorMessage: '请输入转移数量!'
					}],
				}
			}
		},
		methods: {
			addDetail() {
				this.jobInForm.mesPwoJobCvDetailList.push({});
			},
			deleteDetail(index) {
				this.jobInForm.mesPwoJobCvDetailList.splice(index, 1);
			},
			clickDetail(itemIndex, {
				position,
				index
			}) {
				if (index == 0) {
					this.deleteDetail(itemIndex);
				}
			},
			submit() {},
			reset(code) {
				this.jobInForm = {
					pwoCode: code,
					mesPwoJobCvDetailList: [],
				};
			},
			scanJobCode(code) {
				if (code) {
					getInMat(code).then(res => {
						this.reset(code);
						console.log(res);
						this.jobInForm.type = 3;
						for (let i = 0; i < res.rows.length; i++) {
							let obj = {};
							obj.materialCode = res.rows[i].materialCode;
							obj.materialName = res.rows[i].materialName;
							obj.number = res.rows[i].number;
							this.jobInForm.mesPwoJobCvDetailList.push(obj);
						}
					})
				}
			},
			jobInSubmit() {
				this.$refs["jobInForm"].validate().then(valid => {
					this.$modal.loading('提交中')
					addConversion(this.jobInForm).then(response => {
						this.$modal.closeLoading();
						this.$modal.msgSuccess("工单领料成功!");
						setTimeout(() => {
							this.$tab.switchTab("/pages/work/index");
						}, 500);
					});
				});
			},
			scanBar() {
				const _this = this;
				uni.scanCode({
					scanType: ['barCode', 'qrCode'],
					success: function(res) {
						_this.jobInForm.pwoCode = res.result;
						_this.scanJobCode(_this.jobInForm.pwoCode);
					}
				});
			}
		}
	}
</script>

<style>
</style>