From f810b751dd1115c6afc2f3694497f3c84a97108a Mon Sep 17 00:00:00 2001
From: shijing <sj_mzw@163.com>
Date: Mon, 26 Aug 2024 10:58:50 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E5=85=89=E5=AD=90=E5=90=88=E6=A0=BC?=
 =?UTF-8?q?=E6=95=B0=E7=BB=9F=E8=AE=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/statistics/pass_num_gx.vue | 260 +++++++++++++++++++++++++++
 1 file changed, 260 insertions(+)
 create mode 100644 src/views/statistics/pass_num_gx.vue

diff --git a/src/views/statistics/pass_num_gx.vue b/src/views/statistics/pass_num_gx.vue
new file mode 100644
index 00000000..79d2f7f8
--- /dev/null
+++ b/src/views/statistics/pass_num_gx.vue
@@ -0,0 +1,260 @@
+<template>
+	<el-container>
+		<el-header>
+			<div class="right-panel">
+				<el-select v-model="query.mgroup_name" 
+				placeholder="请选择工段">
+					<el-option
+						v-for="item in options"
+						:key="item"
+						:label="item"
+						:value="item"
+					>
+					</el-option>
+				</el-select>
+				<el-date-picker
+					v-model="query.start_date"
+					type="date"
+					placeholder="查询日期"
+					value-format="YYYY-MM-DD"
+					style="width: 160px"
+				>
+				</el-date-picker>
+				<el-button
+					type="primary"
+					icon="el-icon-search"
+					@click="handleQuery"
+				></el-button>
+			</div>
+		</el-header>
+		<el-main>
+			<el-card shadow="never" style="margin-bottom: 8px">
+				<el-row :gutter="10">
+					<el-col :lg="12">
+						<el-card shadow="never">
+							<div id="bachart1"></div>
+						</el-card>
+					</el-col>
+					<el-col :lg="12">
+						<el-card shadow="never" style="position: relative">
+							<el-button
+								@click="handleExport()"
+								class="tables"
+								type="primary"
+								>导出</el-button
+							>
+							<el-table
+								:data="tableData"
+								id="exportDiv"
+								:height="300"
+							>
+								<el-table-column type="index" width="50" />
+								<el-table-column
+									label="物料名"
+									prop="物料名"
+									min-width="100"
+								>
+								</el-table-column>
+								<el-table-column
+									label="月份"
+									prop="月"
+									width="50"
+								>
+								</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="合格率">
+									<template #default="scope">
+										{{ Math.round(scope.row.合格率) }}%
+									</template>
+								</el-table-column>
+							</el-table>
+						</el-card>
+					</el-col>
+				</el-row>
+			</el-card>
+		</el-main>
+	</el-container>
+</template>
+<script>
+import * as echarts from "echarts";
+import T from "@/components/scEcharts/echarts-theme-T.js";
+echarts.registerTheme("T", T);
+import scEcharts from "@/components/scEcharts";
+function deepCopy(obj) {
+	return JSON.parse(JSON.stringify(obj));
+}
+export default {
+	name: "chart",
+	components: {
+		scEcharts,
+	},
+	data() {
+		return {
+			query: {
+				mgroup_name:'',
+				start_date:'',
+				end_date:'',
+				group_bys_material: "",
+				order_bys_material: "",
+				select_cols_material: ""
+			},
+			currentYear: "",
+			currentMonth: "",
+			xAxisData: [],
+			basicOption: {
+				backgroundColor: "transparent",
+				title: {
+					text: "",
+				},
+				grid: {
+					top: "80px",
+				},
+				tooltip: {
+					trigger: "axis",
+				},
+				xAxis: {
+					type: "category",
+					data: [],
+				},
+				yAxis: {
+					type: "value",
+				},
+				lenged: [],
+				series: [
+					{
+						data: [],
+						stack: "Ad",
+						type: "bar",
+						barWidth: "15px",
+					},
+				],
+			},
+			tableData: [],
+			options:[],
+		};
+	},
+	mounted() {
+		let that = this;
+		let date = new Date();
+		let year = date.getFullYear();
+		let month = date.getMonth() + 1;
+		let day = date.getDate();
+		that.currentYear = year;
+		that.currentMonth = month;
+		month = month < 10 ? "0" + month : month;
+		day = day < 10 ? "0" + day : day;
+		that.query.start_date = that.query.end_date = year + "-" + month + "-" + day;
+
+		let days = new Date(year, month, 0).getDate();
+		for (let i = 0; i < that.days; i++) {
+			let day = i + 1;
+			let text = day + "日";
+		}
+		that.getMgroup();
+		// that.getData();
+	},
+	methods: {
+		setChart(name, option = null) {
+			// 根据name 渲染数据, option需填写，否则option为模拟数据
+			var myChart = echarts.getInstanceByDom(
+				document.getElementById(name)
+			);
+			if (myChart == undefined) {
+				myChart = echarts.init(document.getElementById(name), "T");
+			}
+			if (option == null) {
+				option = Object.assign({}, this.basicOption);
+			}
+			setTimeout(() => {
+				try {
+					myChart.setOption(option);
+				} catch (error) {}
+			}, 500);
+		},
+		getMgroup(){
+			let that = this;
+			that.$API.mtm.mgroup.list.req({ page: 0}).then((res) => {
+				let arr = [];
+				res.forEach(item=>{
+					arr.push(item.name)
+				})
+				that.query.mgroup_name = arr[0];
+				that.options = arr;
+			});
+		},
+		getData() {
+			let that = this;
+			let option = deepCopy(that.basicOption);
+			let obj = {};
+			obj.query = that.query;
+			that.$API.bi.dataset.exec.req('lineDay_m', obj).then((res) => {
+				let tableData = res.data2.ds0 ? res.data2.ds0 : [];
+				that.tableData = tableData;
+				if (tableData.length > 0) {
+					let seriesData = [],
+						nameList = [];
+					tableData.forEach((ite) => {
+						if (nameList.indexOf(ite.物料名) > -1) {
+						} else {
+							nameList.push(ite.物料名);
+							seriesData.push(0);
+						}
+					});
+					tableData.forEach((item) => {
+						let indexX = nameList.indexOf(item.物料名);
+						seriesData[indexX] += item.合格数;
+					});
+					ption.xAxis.data = nameList;
+					ption.series[0].data = serisData;
+					that.setChart("bachart1", option);
+				} else {
+					that.setChart("bachart1", option);
+				}
+			});
+		},
+		handleQuery() {
+			let that = this;
+			that.query.end_date = that.query.start_date ; 
+			that.getData();
+		},
+		handleExport(val) {
+			this.exportLoading = true;
+			let id = "#exportDiv" + val;
+			let name =
+				val == "AVG" ? val + "合格数统计" : val + "车间合格数统计";
+			this.$XLSX(id, name);
+			this.exportLoading = false;
+		},
+	},
+};
+</script>
+
+<style scoped>
+#bachart1,
+#bachart2,
+#bachart3,
+#bachart4 {
+	width: 100%;
+	height: 300px;
+}
+.tables {
+	position: absolute;
+	top: 6px;
+	left: 4px;
+	z-index: 10;
+}
+</style>