<template>
	<el-container>
		<el-aside style="width: 45%; background: #ffffff">
			<el-container>
				<el-header>
					<div class="left-panel">
						<span style="font-size: 14px">人员生产统计</span>
					</div>
					<div class="right-panel">
						<!-- 工段 -->
						<el-select
							v-model="query.mgroup_name"
						>
							<el-option
								v-for="item in options"
								:key="item.name"
								:label="item.name"
								:value="item.name"
							>
							</el-option>
						</el-select>
						<!-- 日期 -->
						<el-date-picker
							v-model="queryData"
							type="date"
							placeholder="查询日期"
							value-format="YYYY-MM-DD"
							style="width: 160px"
							@change="dateChange"
						>
						</el-date-picker>
						<el-button
							type="primary"
							icon="el-icon-search"
							@click="searchHandle"
						></el-button>

						<el-button @click="handleExport('1')" type="primary"
						>导出</el-button>
					</div>
				</el-header>
				<el-main>
					<scTable
						ref="tables1"
						:data="tableData"
						id="exportDiv1"
						@row-click="rowClick"
						stripe
						hideDo
						hidePagination
					>
						<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="合格数"></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>
					</scTable>
				</el-main>
			</el-container>
		</el-aside>
		<el-main class="nopadding">
			<el-container>
				<el-header>
					<div class="left-panel">
						<span style="font-size: 14px">人员生产统计详情</span>
					</div>
					<div class="right-panel">
						<el-button @click="handleExport('2')" type="primary"
							>导出</el-button
						>
					</div>
				</el-header>
				<el-main>
					<scTable
						ref="tables2"
						:data="tableData2"
						id="exportDiv2"
						stripe
						hideDo
						hidePagination
					>
						<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="规格"></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="不合格数"></el-table-column>
						<el-table-column label="合格率" prop="合格率"></el-table-column>
						<el-table-column label="日期" prop="日期"></el-table-column>
					</scTable>
				</el-main>
			</el-container>
		</el-main>
	</el-container>
</template>
<script>
import { mioTypeEnum } from "@/utils/enum.js";
function deepCopy(obj) {
	return JSON.parse(JSON.stringify(obj));
}
const ondDayTime = 86400000;
export default {
	name: "chart",
	data() {
		return {
			query:{
				start_date:"",
				end_date:''
			},
			start_date: "",
			end_date: "",
			options:[],
			tableData: [],
			tableData2: [],
			queryData:'',
		};
	},
	mounted() {
		let that = this;
		let date = new Date();
		that.query.start_date = that.start_date = that.queryData =
		that.query.end_date = that.end_date = date.toISOString().split('T')[0];
		// let week = date.getDay(); //当前时间的week数
		// let weekFirst = week - 1; //第一天对应的天数
		// let weekLast = 7 - week; //最后一天对应的天数
		// if (week == 0) {
		// 	weekFirst = 6;
		// 	weekLast = 0; //周日特殊处理
		// } else {
		// 	weekFirst = week - 1;
		// 	weekLast = 7 - week;
		// }
		// let first = new Date(new Date(date.getTime() - weekFirst * ondDayTime)); //本周周一
		// let last = new Date(new Date(date.getTime() + weekLast * ondDayTime)); //本周周日
		// this.query.start_date = this.start_date = first.toISOString().split('T')[0];
		// this.query.end_date = this.end_date = last.toISOString().split('T')[0];
		this.getMgroup();
	},
	methods: {
		getWeekDate(dateTime) {
			let date = new Date(dateTime);
			let week = date.getDay(); //当前时间的week数
			let weekFirst = week - 1; //第一天对应的天数
			let weekLast = 7 - week; //最后一天对应的天数
			if (week == 0) {
				weekFirst = 6;
				weekLast = 0; //周日特殊处理
			} else {
				weekFirst = week - 1;
				weekLast = 7 - week;
			}
			let first = new Date(new Date(date.getTime() - weekFirst * ondDayTime)); //本周周一
			let last = new Date(new Date(date.getTime() + weekLast * ondDayTime)); //本周周日
			this.query.start_date = first.toISOString().split('T')[0];
			this.query.end_date = last.toISOString().split('T')[0];
		},
		getMgroup(){
			let that = this;
			this.$API.mtm.mgroup.list.req({page:0}).then((res) => {
			    that.options = res;
				that.query.mgroup_name = res[0].name;
				that.getTableData();
			})
		},
		searchHandle() {
			let that = this;
			that.tableData = [];
			that.getTableData();
		},
		dateChange(){
			this.query.start_date = this.query.end_date = this.queryData;
		},
		//获取表格数据
		getTableData() {
			let that = this;
			let obj = {};
			let query = deepCopy(that.query);
			query.group_by_material = "";
			query.select_col_material = "";
			obj.query = query;
			that.$API.bi.dataset.exec.req('ryjxtj', obj).then((res) => {
				if (res.data2.ds0) {
					that.tableData = res.data2.ds0;
				}
			});
		},
		rowClick(row){
			console.log(row);
			let that = this;
			let obj = {};
			let query = deepCopy(that.query);
			query.where_user = "and userd.name = '"+row.操作人+"'";
			obj.query = query;
			that.tableData2 = [];
			that.$API.bi.dataset.exec.req('ryjxtj', obj).then((res) => {
				if( res.data2.ds0){
					that.tableData2 = res.data2.ds0;
				}
			})
		},
		handleExport(val) {
			this.exportLoading = true;
			let id = "#exportDiv" + val;
			let name = val == "1" ? "库存统计" : "库存出入库统计";
			this.$XLSX(id, name);
			this.exportLoading = false;
		},
	},
};
</script>

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