<template>
	<el-dialog
		:title="titleMap[mode]"
		v-model="visible"
		:size="1000"
		destroy-on-close
		@closed="$emit('closed')"
	>
		<el-container v-loading="loading">
			<el-main style="padding: 0 20px 20px 20px">
				<el-form
					ref="dialogForm"
					:model="form"
					:rules="rules"
					label-position="right"
					label-width="100px"
				>
					<el-row>
						<el-col :md="12" :sm="24">
							<el-form-item label="工序" prop="process">
								<el-select
									v-model="form.process"
									placeholder="工序"
									clearable
									style="width: 100%"
									:disabled="updateDisable"
								>
									<el-option
										v-for="item in options"
										:key="item.id"
										:label="item.name"
										:value="item.id"
									>
									</el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :md="12" :sm="24">
							<el-form-item label="出材率" prop="out_rate">
								<el-input-number
									v-model="form.out_rate"
									:max="100"
									:precision="1"
									:step="0.1"
									style="width: 100%"
								/>
							</el-form-item>
						</el-col>
						<!-- <el-col :md="12" :sm="24">
							<el-form-item label="指定工段">
								<el-select
									v-model="form.mgroup"
									placeholder="物料"
									clearable
									filterable
									style="width: 100%"
								>
									<el-option
										v-for="item in mgroups"
										:key="item.id"
										:label="item.name"
										:value="item.id"
									>
									</el-option>
								</el-select>
							</el-form-item>
						</el-col> -->
						<el-col :md="12" :sm="24">
							<el-form-item label="输入物料" prop="material_in">
								<el-select
									v-model="form.material_in"
									placeholder="输入物料"
									clearable
									filterable
									:value-on-clear="null"
									style="width: 100%"
									@clear="clearHandle('material_in')"
								>
									<el-option
										v-for="item in materialsIn"
										:key="item.id"
										:label="item.full_name"
										:value="item.id"
									>
										<span style="float: left">{{
											item.full_name
										}}</span>
										<span
											style="
												float: right;
												color: '#E6A23C';
												font-size: 13px;
											"
											v-if="item.is_hidden"
											>隐</span
										>
									</el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :md="12" :sm="24">
							<el-form-item label="输出物料" prop="material_out">
								<el-select
									v-model="form.material_out"
									placeholder="输出物料"
									clearable
									filterable
									:value-on-clear="null"
									style="width: 100%"
									@clear="clearHandle('material_out')"
								>
									<el-option
										v-for="item in materialsOut"
										:key="item.id"
										:label="item.full_name"
										:value="item.id"
									>
									</el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<!-- <el-col :md="12" :sm="24">
							<el-form-item label="统计工序">
								<el-switch v-model="form.is_count_utask" />
							</el-form-item>
						</el-col>
						<el-col :md="12" :sm="24">
							<el-form-item label="自动排产" prop="is_autotask">
								<el-switch v-model="form.is_autotask" />
							</el-form-item>
						</el-col> -->
						<el-col :md="12" :sm="24"  v-if="project_code=='bxerp'">
							<el-form-item label="切分数量">
								<el-input-number
									v-model="form.div_number"
									:min="0"
									style="width: 100%"
								/>
							</el-form-item>
						</el-col>
						<el-col :md="12" :sm="24">
							<el-form-item label="计划时长" prop="hour_work">
								<el-input-number
									v-model="form.hour_work"
									:min="0"
									style="width: 100%"
								/>
							</el-form-item>
						</el-col>
						<el-col :md="12" :sm="24">
							<el-form-item label="排序">
								<el-input-number
									v-model="form.sort"
									:min="1"
									style="width: 100%"
								/>
							</el-form-item>
						</el-col>
						<el-col :md="12" :sm="24" v-if="project_code!=='bxerp'">
							<el-form-item label="批次校验">
								<el-switch v-model="form.batch_bind" />
							</el-form-item>
						</el-col>
					</el-row>
					<el-row v-if="project_code=='bxerp'&&mode=='edit'">
						<sc-form-table
							hideDelete
							ref="routematTable"
							:tableHeight="300"
							v-model="routemats"
							:addTemplate="addTemplate"
							placeholder="暂无数据"
						>
							<el-table-column prop="number" label="辅料编号">
								<template #default="scope">
									<el-select
											v-model="scope.row.material"
											placeholder="辅料编号"
											clearable
											style="width: 100%"
										>
											<el-option
												v-for="item in materialOptions"
												:key="item.id"
												:label="item.full_name"
												:value="item.id"
											>
											</el-option>
										</el-select>
								</template>
							</el-table-column>
							<el-table-column prop="open" label="操作" width="125" align="center">
								<template #default="scope">
									<el-button
										text
										v-if="scope.row.id==''"
										type="primary"
										size="small"
										@click="formTableSave(scope.row)"
										>保存</el-button
									>
									<el-button
										text
										v-else
										type="danger"
										size="small"
										@click="formTableDel(scope.row)"
										>删除</el-button
									>
									
								</template>
							</el-table-column>
						</sc-form-table>
					</el-row>
				</el-form>
			</el-main>
			<el-footer>
				<el-button type="primary" :loading="isSaveing" @click="submit">提交</el-button>
				<el-button @click="visible = false">取消</el-button>
			</el-footer>
		</el-container>
	</el-dialog>
</template>

<script>
const defaultForm = {
	process: null,
	sort: 1,
	out_rate: 100,
	material_in:'',
	material_out:'',
	hour_work:0,
	div_number:1,
	batch_bind: false,
	is_autotask: true,
};
export default {
	props: {
		routepack: { type: String, default: "" },
	},
	emits: ["success", "closed"],
	data() {
		return {
			loading: false,
			mode: "add",
			//表单数据
			form: Object.assign({}, defaultForm),
			//验证规则
			rules: {
				process: [
					{ required: true, message: "请选择工序", trigger: "blur" },
				],
			},
			visible: false,
			isSaveing: false,
			materialsIn: [],
			materialsOut: [],
			mgroups: [],
			options: [],
			routemats:[],
			materialOptions:[],
			titleMap: { add: "新增", edit: "编辑" },
			setFiltersVisible: false,
			routeId: "",
			project_code: "",
			addTemplate:{
				id:'',
				material:'',
				route:'',
				
			}
		};
	},
	mounted() {
		this.getMgroup();
		this.getProcess();
		this.getMaterialIn();
		this.getMaterialOut();
		this.getMaterialOptions();
		this.project_code = this.$TOOL.data.get("BASE_INFO").base.base_code;
		this.form.routepack = this.routepack;
	},
	methods: {
		clearHandle(key) {
			this.form[key] = null;
		},
		getMgroup() {
			let that = this;
			that.$API.mtm.mgroup.list.req({ page: 0 }).then((res) => {
				that.mgroups = res;
			});
		},
		getMaterialOptions() {
			let that = this;
			that.$API.mtm.material.list.req({ page: 0, type__in: "20,30"}).then((res) => {
				that.materialOptions = res;
			});
		},
		getMaterialIn() {
			let that = this;
			that.$API.mtm.material.list
				.req({ page: 0, type__in: "10,20,30" })
				.then((res) => {
					that.materialsIn = res;
				});
		},
		getMaterialOut() {
			let that = this;
			that.$API.mtm.material.list
				.req({ page: 0, type__in: "10,20" })
				.then((res) => {
					that.materialsOut = res;
				});
		},
		getProcess() {
			let that = this;
			that.$API.mtm.process.list.req({ page: 0 }).then((res) => {
				that.options = res;
			});
		},
		getroutemats(){
			let that = this;
			that.$API.mtm.routemat.list.req({ route: that.routeId,page: 0}).then((res) => {
				that.routemats = res;
			});
		},
		formTableSave(row){
			let that = this;
			that.$API.mtm.routemat.create.req(row).then((res) => {
				that.getroutemats();
			});
		},
		formTableDel(row){
			this.$confirm(`确定删除吗？`, "提示", {
				type: "warning",
			}).then(() => {
				this.$API.mtm.routemat.delete.req(row.id).then((res) => {
					let index = this.routemats.findIndex((item) => item.id === row.id);
					this.routemats.splice(index, 1);
					this.$message.success("删除成功");
					that.getroutemats();
				}).catch((err) => {
					return err;
				});
			}).catch(() => {});
		},
		//显示
		open(mode = "add") {
			this.mode = mode;
			this.visible = true;
			return this;
		},
		//表单注入数据
		setData(data) {
			Object.assign(this.form, data);
			this.routeId = data.id;
			this.addTemplate.route = data.id;
			this.getroutemats();
		},
		//表单提交方法
		submit() {
			let that = this;
			that.$refs.dialogForm.validate(async (valid) => {
				if (valid) {
					that.isSaveing = true;
					if (that.mode === "add") {
						that.$API.mtm.route.create
							.req(that.form)
							.then((res) => {
								that.isSaveing = false;
								that.$emit("success", that.form, that.mode);
								that.visible = false;
								that.$message.success("操作成功");
							})
							.catch((res) => {
								that.isSaveing = false;
							});
					} else {
						that.$API.mtm.route.update
							.req(that.form.id, that.form)
							.then((res) => {
								that.isSaveing = false;
								that.$emit("success", that.form, that.mode);
								that.visible = false;
								that.$message.success("操作成功");
							})
							.catch((res) => {
								that.isSaveing = false;
							});
					}
				}
			});
		},

		//设置过滤项
		setFilters(filters) {
			this.selectionFilters = filters;
			this.setFiltersVisible = true;
		},
	},
};
</script>

<style></style>
