<template>
	<el-dialog
		:title="titleMap[mtype]"
		v-model="visible"
		width="1000px"
		:size="1000"
		destroy-on-close
		@closed="$emit('closed')"
	>
		<el-form
			ref="dialogForm"
			:model="form"
			:rules="rules"
			label-width="80px"
		>
			<el-row>
				<el-col>
					<span>交接物料：{{codeText}}</span>
					<span style="margin: 0 20px;">物料总数：{{totalCount}} </span>
					<el-button type="primary" @click="batchAdd">分批</el-button>
				</el-col>
				<el-form-item label="剩余可分配数量：" label-width="130">
					{{saveCount}}
				</el-form-item>
				
			</el-row>
			<el-row v-for="(listItem,$index) in form.handoverb" :key="listItem">
				<el-col :span="10">
					<el-form-item label="批次号">
						<el-input  v-model="listItem.batch"></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="7">
					<el-form-item label="数量">
						<el-input-number
							v-model="listItem.count"
							controls-position="right"
							:min="0"
							step="1"
							:max="batchOrign.count"
							:step-strictly="true"
							style="width: 100%"
							placeholder="交接数量"
							@change="countChange($index)"
						>
						</el-input-number>
					</el-form-item>
				</el-col>
				<el-col :span="2" v-if="mode!=='show'">
					<el-button type="danger" icon="el-icon-delete" @click="delMaterial($index)"></el-button>
				</el-col>
			</el-row>
			<el-row>
				<el-col :md="12" :sm="24">
					<el-form-item label="交送日期" prop="send_date">
						<el-date-picker
							v-model="form.send_date"
							type="date"
							placeholder="选择时间"
							format="YYYY-MM-DD"
							value-format="YYYY-MM-DD"
							style="width: 100%"
						/>
					</el-form-item>
				</el-col>
				<el-col :md="12" :sm="24">
					<el-form-item label="处理备注">	
						<el-input v-model="form.note" placeholder="处理备注"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
		<el-footer v-if="mode!=='show'">
			<el-button type="primary" v-loading="isSaveing" @click="submit">确定</el-button>
			<el-button @click="visible = false">取消</el-button>
		</el-footer>
	</el-dialog>
</template>
<script>
import scanDialog from "./../template/scan.vue";
export default {
	emits: ["success", "closed"],
	props: {
		type: {
			type: Number,
			default: 10,
		},
		mgroupId: {
			type: String,
			default: "",
		},
		process:{
			type:String,
			default:""

		}
	},
	components: {
		scanDialog
	},
	data() {
		return {
			selectItems:[],
			loading: false,
			mode: "add",
			titleMap: {
				20: "分批",
				30: "合批",
			},
			mtype:20,
			saveCount:0,
			form: {
				send_date: null,
				send_user: null,
				send_mgroup: null,
				recive_user: null,
				recive_mgroup: null,
				handoverb:[],
			},
			rules: {
				batch: [
					{
						required: true,
						message: "请输入批次号",
						trigger: "blur",
					},
				],
				wm: {
					required: true,
					message: "请选择物料",
					trigger: "blur",
				},
			},
			batchOrign:{},
			totalCount: 0,
			materialOptions: [],
			visible: false,
			isSaveing: false,
			setFiltersVisible: false,
		};
	},
	mounted() {
		let that  = this;
		that.form.type = that.type;
		that.form.handle_date = that.form.send_date = that.$TOOL.dateFormat2(new Date());
		that.form.send_mgroup = that.form.recive_mgroup = that.mgroupId;
		let userInfo = that.$TOOL.data.get("USER_INFO");
		that.form.send_user = that.form.recive_user= userInfo.id;
	},
	methods: {
		//显示
		open(mode = "add",data,mtype) {
			this.mode = mode;
			this.form.mtype = mtype;
			this.codeText = data.batch;
			this.batchOrign = data;
			this.totalCount = data.count;
			let obj = { };
			obj.wm = data.id;
			obj.batch = data.batch+"-1";
			obj.count = data.count;
			this.saveCount = 0;
			this.form.handoverb.push(obj)
			this.visible = true;
			return this;
		},
		batchAdd(){
			let that = this;
			if(that.saveCount>0){
				let indexs = that.form.handoverb.length+1;
				let count = 0;
				that.form.handoverb.forEach(item=>{
					count+=item.count;
				})
				let obj = { };
				obj.wm = that.batchOrign.id;
				obj.batch = that.codeText+"-"+indexs;
				obj.count = that.batchOrign.count - count;
				that.saveCount = 0;
				that.form.handoverb.push(obj)
			}else{
				that.$message.warning("已无可分配数量");
			}
		},
		delMaterial(index){
			this.form.handoverb.splice(index,1);
			this.countChange();
		},
		
		countChange(index){
			let that = this;
			let totalCount = 0;
			if(this.form.handoverb.length>0){
				this.form.handoverb.forEach(item=>{
					totalCount += item.count;
				})
				let saveCount = that.batchOrign.count-totalCount;
				if(saveCount<0){//数量不能大于总数量
					this.form.handoverb[index].count = 0;
					let total = 0;
					this.form.handoverb.forEach(item=>{
						total += item.count;
					})
					this.form.handoverb[index].count = that.batchOrign.count-total;
					that.saveCount = 0;
				}else{
					that.saveCount = that.batchOrign.count-totalCount;
					
				}
				
			}
		},
		//提交
		submit() {
			let that = this;
			that.$refs.dialogForm.validate(async (valid) => {
				if (valid) {
					let total = 0;
					if(this.form.handoverb.length>0){
						this.form.handoverb.forEach(item=>{
							total += item.count;
						})
					}
					if(total>that.totalCount){
						that.$message.error("分配数量不能大于总数量");
					}else{
						that.form.wm = that.batchOrign.id;
						if (that.mode == "add") {
							that.$API.wpm.handover.create.req(that.form).then((res) => {
								that.$API.wpm.handover.submit.req(res.id).then((res1) => {
									that.isSaveing = false;
									that.$emit("success");
									that.visible = false;
									that.$message.success("操作成功");
								});
							}).catch((err) => {
								//可以处理校验错误
								that.isSaveing = false;
								return err;
							});
						} 
					}
				}
			});
		},
		//表单注入数据
		setData(data) {
			Object.assign(this.form, data);
			console.log('this.form',this.form);
		},
		//设置过滤项
		setFilters(filters) {
			this.selectionFilters = filters;
			this.setFiltersVisible = true;
		},
	},
};
</script>
<style scoped>
.formTitle {
	margin-bottom: 10px;
	font-weight: 600;
}
.total-count{
	width: 100%;
    text-align: right;
    height: 50px;
    line-height: 50px;
}
</style>
