<!--
 * @Author: zwq
 * @Date: 2023-08-01 13:52:10
 * @LastEditors: zwq
 * @LastEditTime: 2025-03-05 15:23:30
 * @Description:
-->
<template>
	<el-form
		:model="dataForm"
		:rules="dataRule"
		ref="dataForm"
		v-if="visible"
		@keyup.enter.native="dataFormSubmit()"
		label-width="100px"
		label-position="top">
		<el-row :gutter="20">
			<el-col :span="12">
				<el-form-item label="原料名称" prop="materialId">
					<el-select
						v-model="dataForm.materialId"
						filterable
						@change="setCode"
						:style="{ width: '100%' }"
						placeholder="请选择原料名称">
						<el-option
							v-for="item in MaterialList"
							:key="item.id"
							:label="item.name"
							:value="item.id"></el-option>
					</el-select>
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="原料编码" prop="code">
					<el-input v-model="dataForm.code" clearable readonly />
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="生效开始时间" prop="startTime">
					<el-date-picker
						v-model="dataForm.startTime"
						type="date"
						value-format="timestamp"
						:style="{ width: '100%' }"
						placeholder="选择开始时间"></el-date-picker>
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="生效结束时间" prop="endTime">
					<el-date-picker
						v-model="dataForm.endTime"
						type="date"
						value-format="timestamp"
						:style="{ width: '100%' }"
						placeholder="选择结束时间"></el-date-picker>
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="单价" prop="price">
					<el-input-number
						:min="0"
						style="width: 75%"
						v-model="dataForm.price"
						clearable
						placeholder="请输入单价" />
					{{ unit }}
				</el-form-item>
			</el-col>
			<el-col :span="12">
				<el-form-item label="备注" prop="remark">
					<el-input
						v-model="dataForm.remark"
						clearable
						placeholder="请输入备注" />
				</el-form-item>
			</el-col>
		</el-row>
	</el-form>
</template>

<script>
import basicAdd from '@/mixins/basic-add';
import {
	createMaterialPricing,
	updateMaterialPricing,
	getMaterialPricing,
} from '@/api/base/materialPricing';
import { getMaterialPage } from '@/api/base/material';

export default {
	mixins: [basicAdd],
	data() {
		return {
			urlOptions: {
				createURL: createMaterialPricing,
				updateURL: updateMaterialPricing,
				infoURL: getMaterialPricing,
				optionArrUrl: [getMaterialPage], //需要获取下拉框的方法数组
				dictNameList: ['unit_dict'], //数据字典name数组
			},
			dataForm: {
				id: null,
				code: '',
				materialId: '',
				price: '',
				startTime: new Date().getTime(),
				endTime: null,
				remark: '',
			},
			setData: true,
			MaterialList: [],
			unit: '元/吨',
			dataRule: {
				materialId: [
					{ required: true, message: '原料不能为空', trigger: 'blur' },
				],
				price: [{ required: true, message: '单价不能为空', trigger: 'blur' }],
				startTime: [
					{
						required: true,
						message: '生效开始时间不能为空',
						trigger: 'change',
					},
				],
			},
		};
	},
	created() {},
	methods: {
		getArr() {
			getMaterialPage({ pageSize: 100, pageNo: 1 }).then((response) => {
				this.MaterialList = response.data.list;
			});
		},
		setDataForm() {
			if (this.MaterialList.length > 0) {
				this.setCode();
			} else {
				setTimeout(this.setCode(), 1000);
			}
		},
		setCode() {
			this.MaterialList.forEach((item) => {
				if (item.id === this.dataForm.materialId) {
					this.dataForm.code = item.code;
					this.unit =
						'元/' +
						this.urlOptions.dictArr.dict0.find((d) => d.value === item.unit)
							.label;
				}
			});
		},
	},
};
</script>
