<template>
	<el-container>
		<el-header>
			<div class="right-panel">
				<el-select v-model="queryType" @change="queryTypeChange">
					<el-option
						v-for="item in typeOptions"
						:key="item"
						:label="item"
						:value="item"
					>
					</el-option>
				</el-select>
				<el-date-picker
					v-if="queryType == '月'"
					v-model="queryDate"
					type="month"
					placeholder="查询月期"
					value-format="YYYY-MM"
				>
				</el-date-picker>
				<el-date-picker
					v-if="queryType == '年'"
					v-model="queryDate"
					type="year"
					placeholder="查询年份"
					value-format="YYYY"
				>
				</el-date-picker>
				<el-button
					type="primary"
					icon="el-icon-search"
					@click="handleQuery"
				></el-button>
			</div>
		</el-header>
		<el-main id="elMain">
			<el-row :gutter="15">
				<table class="tables" border="1" cellspacing="0">
					<tr>
						<th class="tableTh tableHead" colspan="15">库存统计</th>
					</tr>
					<tr>
						<th class="tableTh">生产</th>
						<th class="tableTh" colspan="2">库房</th>
						<th class="tableTh" colspan="2">道边车间</th>
						<th class="tableTh" colspan="2">黑化车间</th>
						<th class="tableTh" colspan="2">减薄车间</th>
						<th class="tableTh" colspan="2">精雕车间</th>
						<th class="tableTh" colspan="2">倒角车间</th>
						<th class="tableTh" colspan="2">磨抛车间</th>
					</tr>
					<tr >
						<td class="tableTd">原料片库存</td>
						<td class="tableTd">大白片</td>
						<td class="tableTd"></td>
						<td class="tableTd">未处理大白片</td>
						<td class="tableTd">3</td>
						<td class="tableTd">2.5D白片待进炉</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
					</tr>
					<tr >
						<td class="tableTd">原料片库存</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">2.5D炉内黑化数</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
					</tr>
					<tr >
						<td class="tableTd">原料片库存</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">已处理白片</td>
						<td class="tableTd"></td>
						<td class="tableTd">2.5D炉内退火+待投</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
					</tr>
					
					
					<tr >
						<td class="tableTd" rowspan="2">DDG片</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">水纹片待进炉</td>
						<td class="tableTd"></td>
						<td class="tableTd">已加工</td>
						<td class="tableTd"></td>
						<td class="tableTd">已加工</td>
						<td class="tableTd"></td>
						<td class="tableTd">已加工</td>
						<td class="tableTd"></td>
						<td class="tableTd">精雕片已抛光</td>
						<td class="tableTd"></td>
					</tr>
					<tr >
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">未加工</td>
						<td class="tableTd"></td>
						<td class="tableTd">未加工</td>
						<td class="tableTd"></td>
						<td class="tableTd">未加工</td>
						<td class="tableTd"></td>
						<td class="tableTd">精雕片未抛光</td>
						<td class="tableTd"></td>
					</tr>

					<tr >
						<td class="tableTd" rowspan="2">外协百盛（一次抛黑料）</td>
						<td class="tableTd">外协抛光</td>
						<td class="tableTd">0</td>
						<td class="tableTd">外协待扫边</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">外协已抛光</td>
						<td class="tableTd"></td>
					</tr>
					<tr >
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">外协已扫边</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">外协未抛光</td>
						<td class="tableTd"></td>
					</tr>

					<tr >
						<td class="tableTd" rowspan="2">外协海富</td>
						<td class="tableTd">外协扫边</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">外扫已抛光</td>
						<td class="tableTd"></td>
					</tr>
					<tr >
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">外扫未抛光</td>
						<td class="tableTd"></td>
					</tr>
				</table>
			</el-row>
			<el-row :gutter="15">
				<table class="tables" border="1" cellspacing="0">
					<tr>
						<th class="tableTh tableHead" colspan="15">扫边车间数据汇总</th>
					</tr>
					<tr>
						<th class="tableTh">扫边车间</th>
						<th class="tableTh"></th>
						<th class="tableTh"></th>
						<th class="tableTh" colspan="4">8.20白班</th>
						<th class="tableTh"></th>
						<th class="tableTh" colspan="4">8.20夜班</th>
						<th class="tableTh"></th>
						<th class="tableTh"></th>
						<th class="tableTh"></th>
					</tr>
					<tr >
						<td class="tableTd">预处理片（扫边A）的产品</td>
						<td class="tableTd">机器号</td>
						<td class="tableTd">内置数</td>
						<td class="tableTd">加工数</td>
						<td class="tableTd">合格数</td>
						<td class="tableTd">破损数</td>
						<td class="tableTd">破损比</td>
						<td class="tableTd">操作人</td>
						<td class="tableTd">加工数</td>
						<td class="tableTd">合格数</td>
						<td class="tableTd">破损数</td>
						<td class="tableTd">破损比</td>
						<td class="tableTd">操作人</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
					</tr>
					<tr >
						<td class="tableTd">原料片库存</td>
						<td class="tableTd">2</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
						<td class="tableTd">3</td>
					</tr>
					
					<tr >
						<td class="tableTd" rowspan="2">DDG片</td>
						<td class="tableTd">已加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">已加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">已加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">已加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">已加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">已加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">已加工</td>
						<td class="tableTd">3</td>
					</tr>
					<tr >
						<td class="tableTd">未加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">未加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">未加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">未加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">未加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">未加工</td>
						<td class="tableTd">3</td>
						<td class="tableTd">未加工</td>
						<td class="tableTd">3</td>
					</tr>

					<tr >
						<td class="tableTd" rowspan="2">外协百盛（一次抛黑料）</td>
						<td class="tableTd">外协抛光</td>
						<td class="tableTd">0</td>
						<td class="tableTd">外协待扫边</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">外协已抛光</td>
						<td class="tableTd"></td>
					</tr>
					<tr >
						<td class="tableTd">外协抛光</td>
						<td class="tableTd">0</td>
						<td class="tableTd">外协待扫边</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">外协未抛光</td>
						<td class="tableTd"></td>
					</tr>

					<tr >
						<td class="tableTd" rowspan="2">外协海富</td>
						<td class="tableTd">外协扫边</td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">外扫已抛光</td>
						<td class="tableTd"></td>
					</tr>
					<tr >
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd"></td>
						<td class="tableTd">外扫未抛光</td>
						<td class="tableTd"></td>
					</tr>
				</table>
			</el-row>
		</el-main>
	</el-container>
</template>

<script>
function deepCopy(obj) {
	return JSON.parse(JSON.stringify(obj));
}
export default {
	name: "chart",
	data() {
		return {
			currentYear:'',
			currentMonth:'',
			start_date:'',
			end_date:'',
			queryDate:'',
		};
	},
	mounted() {
		let that = this;
		let date = new Date();
		let year = date.getFullYear();
		let month = date.getMonth() + 1;
		let days = new Date(year, month, 0).getDate();
		that.currentYear = year;
		that.currentMonth = month;
		that.start_date = year + "-" + month + "-01";
		that.end_date =
			year + "-" + month + "-" + new Date(year, month, 0).getDate();
		let month1 = month;
		if (month1 < 10) {
			month1 = "0" + month1;
		}
		that.queryDate = year + "-" + month1;
	},
	methods: {
		
	},
};
</script>

<style scoped>
.tables{
	width:
}
.tableHead {
	background:rgb(0,176,240);
	height:40px;
}
.tableTh{
	width:120px;
	height:36px;
}
.tableTd{
	width:120px;
	height:36px;
}
</style>
