<template>
	<el-container>
		<el-header>
			<div class="left-panel">
				<el-button type="primary" @click="tomio('do_out')" v-auth="'mio.do'" v-if="route_code=='qingxi'">领料</el-button>
				<el-button type="primary" v-auth="'handover.create'" @click="table_add(40)">报废</el-button>
				<el-button type="primary" v-auth="'handover.create'" @click="batchConcat()">合批</el-button>
			</div>
			<div class="right-panel">
				<el-select
					v-model="query.state"
					placeholder="物料状态"
					clearable
					@change="searchStateChange"
					style="width: 250px"
				>
					<el-option
						v-for="item in stateOptions"
						:key="item.value"
						:label="item.name"
						:value="item.value"
					/>
				</el-select>
				<el-input
					style="margin-right: 5px"
					v-model="query.search"
					placeholder="名称"
					clearable
				></el-input>
				<el-button
					type="primary"
					icon="el-icon-search"
					@click="handleQuery"
				></el-button>
			</div>
		</el-header>
		<el-main class="nopadding">
			<scTable
				ref="table"
				:apiObj="apiObj"
				row-key="id"
				:params="params"
				:query="query"
				@selection-change="selectionChange"
			>
				<el-table-column type="selection" width="50"></el-table-column>
				<el-table-column label="状态" prop="state" width="100" >
					<template #default="scope">
						<el-tag :type="wmState[scope.row.state]?.type">
							{{wmState[scope.row.state]?.text}}
						</el-tag>
					</template>
				</el-table-column>
				<el-table-column
					label="物料名称"
					prop="material_name"
					min-width="150"
				>
					<template #default="scope">
						{{ scope.row.material_name }}
						<span v-if="scope.row.material_origin != null">
							（{{ scope.row.material_origin_name }}）
						</span>
					</template>
				</el-table-column>
				<el-table-column
					label="物料已到工序"
					prop="material_name"
					min-width="100"
				>
					<template #default="scope">
						{{ scope.row.material_name.split('|').at(-1) }}
					</template>
				</el-table-column>
				<el-table-column
					label="原始物料"
					prop="material_ofrom_name"
					min-width="120"
				></el-table-column>
				<el-table-column
					label="批次号"
					prop="batch"
					min-width="120"
				></el-table-column>
				<el-table-column
					label="部门/工段"
					prop="belong_dept_name"
				>
				<template #default="scope">
					{{scope.row.belong_dept_name}}/{{scope.row.mgroup_name}}
				</template>
				</el-table-column>
				<el-table-column
					label="数量"
					prop="count"
					min-width="80"
				>
				<template #default="scope">
					<span v-if="scope.row.material_&&scope.row.material_.tracking==10">{{scope.row.count}}</span>
					<el-link v-else :underline="false" type="primary" @click="showWpr(scope.row)">{{scope.row.count}}</el-link>
				</template>
				</el-table-column>
				<el-table-column
					label="备注"
					prop="note"
				></el-table-column>
				<el-table-column
					label="生产中"
					prop="count_working"
					min-width="80"
				></el-table-column>
				<el-table-column
					label="不合格标记"
					prop="defect_name"
				></el-table-column>
				<el-table-column
					label="创建时间"
					prop="create_time"
					width="150"
				></el-table-column>
				<el-table-column
					label="操作"
					fixed="right"
					align="center"
					width="120"
				>
					<template #default="scope">
						<el-link :underline="false"  @click="printMaterial(scope.row,'wm')" type="primary">物料标签</el-link>
						<el-link :underline="false" v-if="scope.row.material_&&scope.row.material_.tracking==10&&scope.row.state!==20"  @click="tableCheckList(scope.row)" type="primary">检验记录</el-link>
						<el-link 
							v-if="scope.row.material_&&scope.row.material_.tracking==10&&scope.row.state!==20"
							:underline="false"  
							@click="inmCheck(scope.row)" 
							type="primary" 
							style="margin-left: 10px;"
						>检验</el-link>
						<el-link :underline="false"  type="primary" 
							@click="handleWatch(scope.row)"
						>流程图</el-link>
					</template>
				</el-table-column>
			</scTable>
		</el-main>
		<el-dialog title="选择物料" v-model="materialsVisible" width="90%">
			<materials
				style="height: 500px"
				:materialType="materialType"
				ref="materialsChose"
				@choseChange="choseChange"
			></materials>
		</el-dialog>
		<check-dialog
			v-if="dialog.check"
			ref="checkDialog"
			:itemObj = "checkItem"
			@success="handleSaveSuccess"
			@closed="dialog.check = false"
		>
		</check-dialog>
		<scrap-dialog
			v-if="dialog.scrap"
			ref="scrapDialog"
			:type="type"
			:mgroupName="mgroup_name"
			:mgroupId="mgroupId"
			@success="handleScrapSuccess"
			@closed="dialog.scrap = false"
		>
		</scrap-dialog>
		<showDrawer
			ref="showDrawer"
			v-if="visibleDrawer"
			:wm="wm"
			:material="wmMaterial"
			@closed="visibleDrawer = false"
		>
		</showDrawer>
		<save-dialog
			v-if="dialog.inmRecord"
			ref="inmRecordDialog"
			:cate = "cate_type"
			:process = "process"
			:mgroupId = "params.mgroupx"
			:deptId = " params.belong_dept"
			@success="handleinmSuccess"
		>
		</save-dialog>
		<el-drawer v-model="wprVisibleDrawer" :size="'70%'">
			<template #header>
				<h4>关联产品</h4>
			</template>
			<template #default>
				<scTable ref="wprTable" hidePagination :data="wprList">
					<el-table-column label="产品编号" prop="number" min-width="100px"></el-table-column>
					<el-table-column label="记录数据" prop="oinfo">
						<template #default="scope">
							<div v-for="(item,index) in scope.row.oinfo" :key="item.id">
								{{ item.name }}:{{ item.val}}
								<span v-if="index<(scope.row.oinfo.length-1)">,</span>
							</div>
						</template>
					</el-table-column>
					<el-table-column label="缺陷项"  min-width="200px">
						<template #default="scope">
							<span v-for="item in scope.row.wprdefect" :key="item.id">
								<el-tag
								 	type="warning"
								>{{ item.defect_name }}</el-tag>
							</span>
						</template>
					</el-table-column>
					<el-table-column
						label="操作"
						fixed="right"
						align="center"
						width="120"
					>
						<template #default="scope">
							<el-link :underline="false"  @click="printMaterial(scope.row,'wpr')" type="primary">打印标签</el-link>
						</template>
					</el-table-column>
				</scTable>
			</template>
			<template #footer>
			<div style="flex: auto">
				<el-button @click="wprVisibleDrawer=false">关闭</el-button>
			</div>
			</template>
		</el-drawer>
		<el-drawer v-model="limitedWatch" title="工艺路线流程图" size="80%" @closeDialog="limitedWatch = false">
			<scDegra
				v-if="limitedWatch" 
				ref="degraDialogs" 
				:nodes="nodes"
				:edges="edges"
				:rankdir="'LR'"
				>
			</scDegra>
		</el-drawer>
	</el-container>
</template>
<script>
import { wmState } from "@/utils/enum.js";
import materials from "./../mtm/materials.vue";
import checkDialog from "./check_form.vue";
import showDrawer from "./check_drawer.vue";
import scrapDialog from "./handover_form.vue";
import saveDialog from "./inm_record.vue";
export default {
	props: {
		deptId: {
			type: String,
			default: "",
		},
		mgroupId: {
			type: String,
			default: "",
		},
		mgroupName: {
			type: String,
			default: "",
		},
		mgroup_code: {
			type: String,
			default: "",
		},
		process: {
			type: String,
			default: "",
		},
	},
	components: {
		saveDialog,
		materials,
		checkDialog,
		showDrawer,
		scrapDialog
	},
	name: "wmaterial",
	data() {
		return {
			wmState,
			apiObj: null,
			params: {
				tag : 'todo',
				mgroup: "",
				belong_dept:''
			},
			wmtype:0,
			query: {
				search: "",
				state: null,
			},
			dialog: {
				save: false,
				check: false,
				scrap: false,
				permission: false,
				inmRecord:false,
			},
			nodes:[],
			edges:[],
			wprList:[],
			tableData: [],
			selection: [],
			stateOptions:[
				{ value: 10, name: "合格"},
				{ value: 20, name: "不合格"},
				{ value: 30, name: "返工"},
			],
			queryWm: {
				search: "",
				material: "",
			},
			wprParams:{ 
				page:0,
				wm: "" 
			},
			route_code:"",
			showBatch: "",
			wmMaterial:'',
			cate_type:'',
			materialType: "wm",
			limitedWatch:false,
			materialsVisible:false,
			visibleDrawer: false,
			wprVisibleDrawer:false,
			wprApiObj:this.$API.wpm.wpr.list,
			apiObjPrint:this.$API.cm.labelmat.fromWm,
			printer_name:localStorage.getItem("printer_name"),
			mgroup_name:'',
			ofrom_name:'',
			ofrom_batch	:'',
			checkItem:{},
		};
	},
	mounted() {
		let that = this;
		let paths = that.$route.path;
		let arr = paths.split("/");
		that.route_code = arr[2];
		that.params.mgroup = that.mgroupId;
		that.$TOOL.data.set('bx_deptID',that.deptId);
		that.apiObj = that.$API.wpm.wmaterial.list;
	},
	methods: {
		handleWatch(row) {
			let that = this;
			that.$API.wpm.batchlog.dag.req({batch:row.batch}).then((res) => {
			    that.nodes = res.nodes;
				that.edges = res.edges;
				that.limitedWatch = true;
				that.$nextTick(() => {
					that.$refs.degraDialogs.open();
				});
			})
		},
		add() {
			this.dialog.save = true;
			this.$nextTick(() => {
				this.$refs.saveDialog.open("add");
			});
		},
		materialsChoses(str) {
			this.materialType = str;
			this.materialsVisible = true;
		},
		choseChange(data) {
			this.queryWm.material = data;
			this.$refs.table_wm.queryData(this.queryWm);
			this.materialsVisible = false;
		},
		tomio(type) {
			let that = this;
			that.cate_type=type;
			that.dialog.inmRecord = true;
			that.$nextTick(() => {
				that.$refs.inmRecordDialog.open("add");
			});
		},
		//获取当前批次车间物料的检验记录
		tableCheckList(row){
			this.wm = row.id;
			this.wmMaterial = row.material;
			this.visibleDrawer = true;
			this.$nextTick(() => {
				this.$refs.showDrawer.open();
			});
		},
		//表格选择后回调事件
		selectionChange(selection) {
			let that = this;
			that.selection = selection;
			//合批
			if(selection.length>0){
				let material = selection[0].material;
				selection.forEach((item)=>{
					if(item.material!==material){
						that.$refs.table.toggleRowSelection(item, false);
						that.$message.warning("该批次物料与前面的不一样");
					}
				})
			}
		},
		//添加报废
		table_add(type) {
			this.dialog.scrap = true;
			this.type = type;
			this.$nextTick(() => {
				this.$refs.scrapDialog.open("add");
			});
		},
		//合批
		batchConcat(){
			this.changebatch = true;
			let handoverb = [];
			if(this.selection.length>0){
				this.selection.forEach(item=>{
					let obj = {};
					obj.wm = item.id;
					obj.batch = item.batch;
					obj.process = item.material_.process_name;
					obj.count_cando = item.count_cando;
					obj.count = item.count_cando;
					handoverb.push(obj)
				})
			}
			this.type = 10;
			this.dialog.scrap = true;
			this.$nextTick(() => {
				this.$refs.scrapDialog.open("add",handoverb,30);
			});
		},
		handleScrapSuccess(){
			this.dialog.scrap = false;
			this.$refs.table.refresh();
		},
		//出入库后刷新页面
		handleinmSuccess(){
			this.$refs.table.refresh();
		},
		//搜索
		handleQuery() {
			this.$refs.table.queryData(this.query);
		},
		showWpr(row){
			let that = this;
			that.ofrom_name = row.material_ofrom_name;
			that.ofrom_batch = row.batch;
			that.wprParams.wm = row.id;
			that.wprVisibleDrawer = true;
			this.$API.wpm.wpr.list.req(that.wprParams).then((res) => {
			    that.wprList = res;
			})
		},
		//本地更新数据
		handleSaveSuccess(data, mode) {
			this.dialog.save = false;
			this.$refs.table.refresh();
		},
		//打印物料标签
		printMaterial(row,type){
			let that = this;
			if(that.printer_name!==''&&that.printer_name!==null&&that.printer_name!==undefined){
				if(type=='wm'){
					let params = {};
					params.tid = row.id;
					if(that.route_code=='reyatuihuo'||that.route_code=='banduangunyuan'){	
						params.label_template_name = '工序带板段号打印模板';
						that.wprParams.wm = row.id;
						let numbers = ['','','','','','',''];
						this.$API.wpm.wpr.list.req(that.wprParams).then((res) => {
							let leng = res.length;
							let slice_count = null;//获取这批板段一个板段能切几片？
							let wprItem = res[0].oinfo;
							for(let key in wprItem){
								if(wprItem[key].name=='切片数'){
									slice_count = wprItem[key].val;
								}
							}
							if(leng>0){
								let nums = leng/3;
								for(let i=0;i<nums;i++){
									let index = i*3;
									if(index+2<leng){
										numbers[i] =res[index].number+'('+slice_count+')、'+res[index+1].number+'('+slice_count+')、'+res[index+2].number+'('+slice_count+')';
									}else if(index+1<leng){
										numbers[i] =res[index].number+'('+slice_count+')、'+res[index+1].number+'('+slice_count+')';
									}else{
										numbers[i] =res[index].number+'('+slice_count+')';
									}
								}
							}
							params.extra_data={count:row.count,slicecount:slice_count,numbers0:numbers[0],numbers1:numbers[1],numbers2:numbers[2],numbers3:numbers[3],numbers4:numbers[4],numbers5:numbers[5],numbers6:numbers[6]};
							that.apiObjPrint.req(params).then((res) => {
								let obj = {};
								obj.printer_commands = res.commands;
								obj.printer_name = that.printer_name;
								that.$API.wpm.prints.req(obj).then((response) => {
									that.$message.success("打印成功");
								});
							})
						})
					}else{
						if(that.route_code=='paiyicibang'){
							params.label_template_name = '排一次棒打印模板';
						}else{
							params.extra_data={count:row.count};
							params.label_template_name = '其他工序打印模板';
						}
						that.apiObjPrint.req(params).then((res) => {
							let obj = {};
							obj.printer_commands = res.commands;
							obj.printer_name = that.printer_name;
							that.$API.wpm.prints.req(obj).then((response) => {
								that.$message.success("打印成功");
							});
						})
					}
					
				}else if(type=='wpr'){
					let params = {};
					let name = row.material_name.split('|')[0];
					if(that.route_code=='paiban'||that.route_code=='zhuangmo'||that.route_code=='zlybcl'||that.route_code=='tuomoceliang'||
						that.route_code=='reyatuihuo'||that.route_code=='banduangunyuan'||that.route_code=='banduangunyuanhoudama'||that.route_code=='banduangunyuantuihuo'
					){
						let oinfo = [];
						for(let key in row.oinfo){
						    oinfo.push(row.oinfo[key])
						}
						let data = {sigao:'',duibian:'',moban:'',istest:'否',number:row.number,name:name,ofrom_name:that.ofrom_name,ofrom_batch:that.ofrom_batch};
						if(that.route_code=='zhuangmo'||that.route_code=='zlybcl'||that.route_code=='tuomoceliang'||that.route_code=='reyatuihuo'||that.route_code=='banduangunyuan'){
							params.label_template_name = '脱膜测量单件标签模板';
						}else{
							params.label_template_name = '排扳单件打印模板';
						}
						if(oinfo.length>0){
							oinfo.forEach((item)=>{
							    if(item.name=="丝高"){
									data.sigao = item.val;
								}else if(item.name=="对边"){
									data.duibian = item.val;
								}else if(item.name=="模具号"){
									data.moban = item.val;
								}else if(item.name=="实验板段"){
									data.istest = item.val?'是':'否';
								}
							})
						}
						params.data = data;
					}else{
						params.label_template_name = '单件打印模板';
						params.data = {number:row.number,name:name};
					}
					that.$API.cm.labeltemplate.commands.req(params).then((res) => {
						let obj = {};
						obj.printer_commands = res.commands;
						obj.printer_name = that.printer_name;
						that.$API.wpm.prints.req(obj).then((response) => {
							that.$message.success("打印成功");
						});
					});
				}
			}else{
				that.$message.warning("请先设置打印机");
			}
		},
		inmCheck(row){
			let that = this;
			that.checkItem = row;
			that.dialog.check = true;
			that.$nextTick(() => {
				that.$refs.checkDialog.open("add");
			
			})
		},
	},
};
</script>
<style scoped></style>
