<template>
	<el-dialog
		v-model="visible"
		:title="title"
		width="1500px"
		draggable
		:close-on-click-modal="false"
		@close="close"
	>
		<FoodPurchaseForm
			ref="foodPurchaseForm"
			@refreshDataList="handleRefresh"
		/>
		<template #footer>
			<span class="dialog-footer">
				<el-button @click="close()" icon="el-icon-circle-close"
					>关闭</el-button
				>
				<el-button
					v-if="method !== 'view'"
					type="primary"
					icon="el-icon-circle-check"
					v-noMoreClick
					@click="submit"
				>
					确定
				</el-button>
			</span>
		</template>
	</el-dialog>
</template>

<script>
import FoodPurchaseForm from "./FoodPurchaseForm";

export default {
	components: {
		FoodPurchaseForm,
	},
	data() {
		return {
			visible: false,
			method: "view",
			title: "",
		};
	},
	methods: {
		init(method, id) {
			this.method = method;
			this.title =
				method === "edit"
					? "修改食材采购单"
					: method === "view"
					? "查看食材采购单"
					: "新增食材采购单";
			this.visible = true;
			this.$nextTick(() => {
				this.$refs.foodPurchaseForm.init(method, id);
			});
		},
		submit() {
			this.$refs.foodPurchaseForm.doSubmit();
		},
		handleRefresh() {
			this.visible = false;
			this.$emit("refreshList");
		},
		close() {
			this.visible = false;
			if (this.$refs.foodPurchaseForm) {
				this.$refs.foodPurchaseForm.close();
			}
		},
	},
};
</script>
