<template>
	<el-container>
		<el-header>
			<div class="left-panel">
				<el-button
					type="primary"
					icon="el-icon-plus"
					@click="add"
				>新增</el-button>
				<el-button type="primary" icon="el-icon-download" v-loading="exportLoading" @click="exportExcel">导出</el-button>
                <!-- <el-button type="primary" @click="handlePrint">打印</el-button> -->
			</div>
			<div class="right-panel">
				<el-date-picker
					v-model="query.date"
					type="date"
					value-format="YYYY-MM-DD"
				/>
				<el-button
					type="primary"
					icon="el-icon-search"
					@click="handleQuery"
					>查询</el-button
				>
			</div>
		</el-header>
		<el-main class="nopadding">
			<scTable
				ref="table"
				:apiObj="apiObj"
				row-key="id"
				stripe
				:params="query"
			>
				<el-table-column type="index" width="50" />
				<el-table-column label="日期" prop="test_date"></el-table-column>
				<el-table-column label="批次号" prop="batch"> </el-table-column>
				<el-table-column label="物料名" prop="material_name" show-overflow-tooltip> </el-table-column>
				<el-table-column label="总数" prop="count"> </el-table-column>
				<el-table-column label="抽检数" prop="count_sampling"> </el-table-column>
				<el-table-column label="抽检合格数" prop="count_sampling_ok"> </el-table-column>
				<el-table-column label="合格数" prop="count_ok"> </el-table-column>
				<el-table-column label="不合格数" prop="count_notok"> </el-table-column>
				<el-table-column label="操作" fixed="right" width="150">
					<template #default="scope">
						<el-link type="primary" @click="table_edit(scope.row)"
							>编辑</el-link
						>
						<el-divider direction="vertical"></el-divider>
						<el-link type="primary" @click="table_check(scope.row)"
							>检验</el-link
						>
						<el-divider direction="vertical"></el-divider>
						<el-link type="danger" @click="table_del(scope.row)"
							>删除</el-link
						>
					</template>
				</el-table-column>
			</scTable>
			<scTable
				ref="table"
				:apiObj="apiObj"
				row-key="id"
				stripe
				:params="query"
				 id="myTable" 
				 style="display: none;"
			>
				<el-table-column label="日期" prop="test_date"></el-table-column>
				<el-table-column label="批次号" prop="batch"> </el-table-column>
				<el-table-column label="物料名" prop="material_name"> </el-table-column>
				<el-table-column label="总数" prop="count"> </el-table-column>
				<el-table-column label="抽检数" prop="count_sampling"> </el-table-column>
				<el-table-column label="合格数" prop="count_ok"> </el-table-column>
				<el-table-column label="不合格数" prop="count_notok"> </el-table-column>
			</scTable>
		</el-main>
		<save-dialog
			v-if="dialog.save"
			ref="saveDialog"
			@success="handleSaveSuccess"
			@closed="dialog.save = false"
		>
		</save-dialog>
		<check-dialog
			ref="checkDialogs"
			v-if="dialog.check"
			:materialCate="materialCate"
			:ftestWork="ftestWork"
			@closed="handleCheckClose"
		>
		</check-dialog>
	</el-container>
</template>
<script>
import saveDialog from "./product_form.vue";
import checkDialog from "./productCheck.vue";
export default {
	name: "rparty",
	components: {
		saveDialog,
		checkDialog,
	},
	data() {
		return {
			apiObj: this.$API.qm.ftestwork.list,
			dialog: {
				save: false,
				check: false,
			},
			query: {
				page: 1,
				page_size: 20,
				type: 'prod',
				type2: 10,
			},
			ftestWork:'',
			materialCate:'',
			selection: [],
			exportLoading:false,
		};
	},
	methods: {
		add() {
			this.dialog.save = true;
			this.$nextTick(() => {
				this.$refs.saveDialog.open("add");
			});
		},
		table_edit(row) {
			this.dialog.save = true;
			this.$nextTick(() => {
				this.$refs.saveDialog.open("edit").setData(row);
			});
		},
		table_del(row) {
			this.$confirm(`确定删除吗？`, "提示", {
				type: "warning",
			})
				.then(() => {
					this.$API.qm.ftestwork.delete
						.req(row.id)
						.then((res) => {
							this.$message.success("删除成功");
							this.$refs.table.refresh();
							return res;
						})
						.catch((err) => {
							return err;
						});
				})
				.catch(() => {});
		},
		//查看
		table_show(row) {
			this.dialog.save = true;
			this.$nextTick(() => {
				this.$refs.saveDialog.open("show", 10).setData(row);
			});
		},
		table_check(row) {
			let that = this;
			that.materialCate = row.material_cate;
			that.ftestWork = row.id;
			that.dialog.check = true;
			this.$nextTick(() => {
				this.$refs.checkDialogs.open();
			});
		},
		handleQuery() {
			this.$refs.table.queryData(this.query);
		},
		handleCheckClose() {
			this.dialog.check = false;
			this.$refs.table.refresh();
		},
		resetQuery() {
			this.query = {};
		},
		handleSaveSuccess() {
			this.dialog.save = false;
			this.$refs.table.refresh();
		},
		handleCheckSuccess() {
			this.dialog.check = false;
		},
		exportExcel() {
            this.exportLoading = true;
            this.$XLSX('#myTable', "成品检验表")
            this.exportLoading = false;
        },
	},
};
</script>
