<template>
	<div>
		<scEcharts height="600px" :option="option6" style="margin-top: 10px;"></scEcharts>
		<el-table :data="tableData6" class="exportTables">
			<el-table-column type="index" width="50" />
			<el-table-column label="日期" prop="date">
				<template #default="scope">
					{{ scope.row.年 }}-{{ scope.row.月 }}
				</template>
			</el-table-column>
			<el-table-column label="操作人" prop="操作人">
			</el-table-column>
			<el-table-column label="工段" prop="工段">
			</el-table-column>
			<el-table-column label="车间" prop="dept_name">
			</el-table-column>
			<el-table-column label="生产数" prop="生产数">
			</el-table-column>
			<el-table-column label="合格数" prop="合格数">
			</el-table-column>
			<el-table-column label="不合格数" prop="不合格数">
			</el-table-column>
			<el-table-column label="合格率" prop="合格率">
				<template #default="scope">
					{{ Math.round(scope.row.合格率) }}%
				</template>
			</el-table-column>
		</el-table>
		<scEcharts height="500px" :option="option7" style="margin-top: 10px;"></scEcharts>
		<el-table :data="tableData7" class="exportTables">
			<el-table-column type="index" width="50" />
			<el-table-column label="日期" prop="date">
				<template #default="scope">
					{{ scope.row.年 }}-{{ scope.row.月 }}
				</template>
			</el-table-column>
			<el-table-column label="操作人" prop="操作人">
			</el-table-column>
			<el-table-column label="工段" prop="工段">
			</el-table-column>
			<el-table-column label="车间" prop="dept_name">
			</el-table-column>
			<el-table-column label="生产数" prop="生产数">
			</el-table-column>
			<el-table-column label="合格数" prop="合格数">
			</el-table-column>
			<el-table-column label="不合格数" prop="不合格数">
			</el-table-column>
			<el-table-column label="合格率" prop="合格率">
				<template #default="scope">
					{{ Math.round(scope.row.合格率) }}%
				</template>
			</el-table-column>
		</el-table>
		<scEcharts height="300px" :option="option10" style="margin-top: 10px;"></scEcharts>
		<el-table :data="tableData10" class="exportTables">
			<el-table-column type="index" width="50" />
			<el-table-column label="日期" prop="date">
				<template #default="scope">
					{{ scope.row.年 }}-{{ scope.row.月 }}
				</template>
			</el-table-column>
			<el-table-column label="操作人" prop="操作人">
			</el-table-column>
			<el-table-column label="工段" prop="工段">
			</el-table-column>
			<el-table-column label="车间" prop="dept_name">
			</el-table-column>
			<el-table-column label="生产数" prop="生产数">
			</el-table-column>
			<el-table-column label="合格数" prop="合格数">
			</el-table-column>
			<el-table-column label="不合格数" prop="不合格数">
			</el-table-column>
			<el-table-column label="合格率" prop="合格率">
				<template #default="scope">
					{{ Math.round(scope.row.合格率) }}%
				</template>
			</el-table-column>
		</el-table>
	</div>
</template>

<script>
import scEcharts from "@/components/scEcharts";
export default {
	name: "all_jx",
	components: {
		scEcharts,
	},
	props: {
		queryType:{
			type: String,
			default: "月"
		},
		queryDate:{
			type: String,
			default: ""
		},
		start_date:{
			type: String,
			default: ""
		},
		end_date:{
			type: String,
			default: ""
		},
	},
	data() {
		return {
			queryBelongDept: "",
			currentYear: "",
			currentMonth: "",
			deptData: [],
			tableData: [],
			option6:{
				title: {
					text: "6车间人员绩效统计",
					left: "center",
				},
				grid: {
					top: "80px",
				},
				tooltip: {
					trigger: "axis",
				},
				xAxis: {
					type: "value",
					position: "top",
					axisLine: {
						show: true,
					},
				},
				yAxis: {
					type: "category",
					data: [],
				},
				series: {
					data: [],
					type: "bar",
					barWidth: "15px",
				},
			},
			option7:{
				title: {
					text: "7车间人员绩效统计",
					left: "center",
				},
				grid: {
					top: "80px",
				},
				tooltip: {
					trigger: "axis",
				},
				xAxis: {
					type: "value",
					position: "top",
					axisLine: {
						show: true,
					},
				},
				yAxis: {
					type: "category",
					data: [],
				},
				series: {
					data: [],
					type: "bar",
					barWidth: "15px",
				},
			},
			option10:{
				title: {
					text: "10车间人员绩效统计",
					left: "center",
				},
				grid: {
					top: "80px",
				},
				tooltip: {
					trigger: "axis",
				},
				xAxis: {
					type: "value",
					position: "top",
					axisLine: {
						show: true,
					},
				},
				yAxis: {
					type: "category",
					data: [],
				},
				series: {
					data: [],
					type: "bar",
					barWidth: "15px",
				},
			},
			tableData6: [],
			tableData7: [],
			tableData10: [],
			chartHeight: 0,
		};
	},
	mounted() {
		this.$nextTick(() => {
		    this.getData();
		})
	},
	methods: {
		deepCopy(obj) {
			return JSON.parse(JSON.stringify(obj));
		},
		getData() {
			let that = this;
			let obj6 = {
				query: {
					start_date: this.start_date,
					end_date: this.end_date,
					dept_name: '6车间',
				},
			};
			that.$API.bi.dataset.exec.req("performance", obj6).then((res) => {
				console.log("绩效统计6:", res);
				let data = res.data2.ds0;
				let seriesData = [],yAxisData = [];
				data.forEach((item) => {
					item.dept_name = "6车间";
					seriesData.push(item.合格数);
					yAxisData.push(item.操作人 + "∙" + item.工段);
				});
				that.tableData6 = data;
				that.option6.yAxis.data = yAxisData;
				that.option6.series.data = seriesData;
			});
			let obj7 = {
				query: {
					start_date: this.start_date,
					end_date: this.end_date,
					dept_name: '7车间',
				},
			};
			that.$API.bi.dataset.exec.req("performance", obj7).then((res) => {
				console.log("绩效统计7:", res);
				let data = res.data2.ds0;
				let seriesData = [],yAxisData = [];
				data.forEach((item) => {
					item.dept_name = "7车间";
					seriesData.push(item.合格数);
					yAxisData.push(item.操作人 + "∙" + item.工段);
				});
				that.tableData7 = data;
				that.option7.yAxis.data = yAxisData;
				that.option7.series.data = seriesData;
			});
			let obj10 = {
				query: {
					start_date: this.start_date,
					end_date: this.end_date,
					dept_name: '10车间',
				},
			};
			that.$API.bi.dataset.exec.req("performance", obj10).then((res) => {
				console.log("绩效统计10:", res);
				let data = res.data2.ds0;
				let seriesData = [],yAxisData = [];
				data.forEach((item) => {
					item.dept_name = "10车间";
					seriesData.push(item.合格数);
					yAxisData.push(item.操作人 + "∙" + item.工段);
				});
				that.tableData10 = data;
				that.option10.yAxis.data = yAxisData;
				that.option10.series.data = seriesData;
			});
		},
	},
};
</script>

<style scoped>
.tables {
	position: absolute;
	top: 4px;
	left: 4px;
	z-index: 10;
}
</style>
