<!--
 * @Author: zwq
 * @Date: 2021-11-18 14:16:25
 * @LastEditors: DY
 * @LastEditTime: 2023-10-26 09:43:51
 * @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="请选择物料"
						clearable
						filterable
						@change="setCode"
					>
						<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"
						clearable
						disabled
						placeholder="请输入物料编码" />
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="批次号" prop="materialDateId">
					<el-select
						v-model="dataForm.materialDateId"
						clearable
						filterable
						placeholder="请选择物料批次"
					>
						<el-option
							v-for="dict in materialDateList"
							:key="dict.id"
							:label="dict.code"
							:value="dict.id" />
					</el-select>
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="使用设备" prop="equipmentId">
					<el-select
						v-model="dataForm.equipmentId"
						clearable
						filterable
						placeholder="请选择使用设备">
						<el-option
							v-for="dict in eqList"
							:key="dict.id"
							:label="dict.name"
							:value="dict.id" />
					</el-select>
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="使用时间" prop="useTime">
					<el-date-picker
						v-model="dataForm.useTime"
						type="datetime"
						format='yyyy-MM-dd HH:mm:ss'
         		value-format='timestamp'
						placeholder="选择日期时间" />
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="操作员" prop="userNames">
					<el-select
						v-model="dataForm.userNames"
						clearable
						filterable
						multiple
						placeholder="请选择操作员">
						<el-option
							v-for="dict in workersList"
							:key="dict.id"
							:label="dict.name"
							:value="dict.name" />
					</el-select>
				</el-form-item>
			</el-col>
		</el-row>
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="使用数量" prop="num">
					<el-input-number v-model="dataForm.num" clearable placeholder="请输入使用数量" />
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="数据来源" prop="source">
					<el-select
						v-model="dataForm.source"
						clearable
						placeholder="请选择数据来源">
						<el-option
							v-for="dict in this.dataSourceList"
							:key="dict.id"
							:label="dict.name"
							:value="dict.id" />
					</el-select>
				</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 { createMaterialLog, updateMaterialLog, getMaterialLog, getEqListAll, getworkerAll } from "@/api/base/materialUseLog";
import { getMaterialList } from "@/api/base/material"
import { getMaterDateList } from "@/api/base/materialDate"

export default {
	mixins: [basicAdd],
	data() {
		return {
			urlOptions: {
				createURL: createMaterialLog,
				updateURL: updateMaterialLog,
				infoURL: getMaterialLog
			},
			dataForm: {
        id: undefined,
				materialId: undefined,
        materialCode: undefined,
				materialDateId: undefined,
				equipmentId: undefined,
        userName: undefined,
				userNames: [],
				useTime: undefined,
        address: undefined,
				num: 0,
				source: undefined,
        remark: undefined
			},
			dataSourceList: [
				{
					id: 1,
					name: '手动'
				},
				{
					id: 2,
					name: '自动'
				}
			],
			materialList: [],
			materialDateList: [],
			eqList: [],
			workersList: [],
			dataRule: {
        materialId: [{ required: true, message: "物料不能为空", trigger: "blur" }],
        materialDateId: [{ required: true, message: "批次号不能为空", trigger: "blur" }],
				useTime: [{ required: true, message: "使用时间不能为空", trigger: "blur" }],
				userNames: [{ required: true, message: "操作员不能为空", trigger: "blur" }],
				num: [{ required: true, message: "使用数量不能为空", trigger: "blur" }]
      }
		};
	},
	mounted() {
		this.getDictData()
	},
	methods: {
		async getDictData() {
			const materRes = await getMaterialList()
			this.materialList = materRes.data
			console.log('你好', this.materialList)
			const dateRes = await getMaterDateList()
			this.materialDateList = dateRes.data
			const eqRes = await getEqListAll()
			this.eqList = eqRes.data
			const workerRes = await getworkerAll()
			this.workersList = workerRes.data
		},
		// 表单提交
    dataFormSubmit() {
			this.dataForm.userName = this.dataForm.userNames.join(',')
      this.$refs["dataForm"].validate((valid) => {
        if (!valid) {
          return false;
        }
        // 修改的提交
        if (this.dataForm.id) {
          this.urlOptions.updateURL(this.dataForm).then(response => {
            this.$modal.msgSuccess("修改成功");
            this.visible = false;
            this.$emit("refreshDataList");
          });
          return;
        }
        // 添加的提交
        this.urlOptions.createURL(this.dataForm).then(response => {
          this.$modal.msgSuccess("新增成功");
          this.visible = false;
          this.$emit("refreshDataList");
        });
      });
    },
		init(id) {
      this.dataForm.id = id || undefined;
      this.visible = true;

      this.$nextTick(() => {
        this.$refs["dataForm"].resetFields();
        if (this.dataForm.id) {
          this.urlOptions.infoURL(id).then(response => {
            this.dataForm.id = response.data.id
						this.dataForm.materialCode = response.data.materialCode
						this.dataForm.materialId = response.data.materialId
						this.dataForm.materialDateId = response.data.materialDateId
						this.dataForm.equipmentId = response.data.equipmentId
						this.dataForm.useTime = response.data.useTime
						// this.dataForm.userName = response.data.userName
						this.dataForm.num = response.data.num
						this.dataForm.source = response.data.source
						this.dataForm.remark = response.data.remark
						this.dataForm.userNames = response.data.userName.split(',')
						console.log('打印', this.dataForm)
          });
        } else {
          if (this.urlOptions.isGetCode) {
            this.getCode()
          }
				}
      });
    },
		setCode() {
			const tempMaterial = this.materialList.filter(item =>{
				return item.id === this.dataForm.materialId
			})
			this.dataForm.materialCode = tempMaterial[0].code
		}
	},
};
</script>
