<!--
 * @Author: zwq
 * @Date: 2021-11-18 14:16:25
 * @LastEditors: DY
 * @LastEditTime: 2023-10-24 18:34:07
 * @Description:
-->
<template>
	<el-form
		:model="dataForm"
		:rules="dataRule"
		ref="dataForm"
		@keyup.enter.native="dataFormSubmit()"
		label-width="80px">
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="物料名称" prop="materialId">
					<el-select
						v-model="dataForm.materialId"
						placeholder="请选择物料"
						@change="setMaterialCode">
						<el-option
							v-for="dict in materialList"
							:key="dict.id"
							:label="dict.name"
							:value="dict.id" />
					</el-select>
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="物料编码" prop="materialCode">
					<el-input
						v-model="dataForm.materialCode"
						disabled
						placeholder="请输入物料编码" />
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="批次号" prop="code">
					<el-input v-model="dataForm.code" clearable placeholder="请输入批次号" />
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="批次名称" prop="name">
					<el-input v-model="dataForm.name" clearable placeholder="请输入批次名称" />
				</el-form-item>
			</el-col>
		</el-row>
		<el-form-item label="备注" prop="remark">
			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" />
		</el-form-item>
	</el-form>
</template>

<script>
import basicAdd from '../../core/mixins/basic-add';
import { createMaterialDate, updateMaterialDate, getMaterialDate, getCode } from "@/api/base/materialDate";
import { getMaterialList } from "@/api/base/material";

export default {
	mixins: [basicAdd],
	data() {
		return {
			urlOptions: {
			  isGetCode: true,
        codeURL: getCode,
				createURL: createMaterialDate,
				updateURL: updateMaterialDate,
				infoURL: getMaterialDate,
			},
			dataForm: {
        id: undefined,
        code: undefined,
        name: undefined,
        materialId: undefined,
				materialCode: undefined,
        remark: undefined,
			},
			materialList: [],
			dataRule: {
				materialId: [{ required: true, message: "物料不能为空", trigger: "blur" }],
        code: [{ required: true, message: "工厂编码不能为空", trigger: "blur" }],
        name: [{ required: true, message: "工厂名称不能为空", trigger: "blur" }],
      }
		};
	},
	mounted() {
		this.getDict()
		console.log('我看看', this.dataForm)
	},
	methods: {
		async getDict() {
			// 物料列表
			const res = await getMaterialList();
			this.materialList = res.data;
		},
		setMaterialCode() {
			const chooseM = this.materialList.filter(item => {
				return item.id === this.dataForm.materialId
			})
			this.dataForm.materialCode = chooseM[0].code
		}
	},
};
</script>
