From 3e63889dfce344a7d22528b0ecbeb078a437f81d Mon Sep 17 00:00:00 2001
From: shijing <sj_mzw@163.com>
Date: Thu, 5 Jun 2025 14:31:13 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E5=85=89=E8=8A=AF->=E7=BB=9F=E8=AE=A1?=
 =?UTF-8?q?=E5=88=86=E6=9E=90->=E5=B7=A5=E5=BA=8F=E5=90=88=E6=A0=BC?=
 =?UTF-8?q?=E6=95=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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

diff --git a/src/views/statistics/ppass_num_gx.vue b/src/views/statistics/ppass_num_gx.vue
new file mode 100644
index 00000000..06609c33
--- /dev/null
+++ b/src/views/statistics/ppass_num_gx.vue
@@ -0,0 +1,356 @@
+<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"
+					style="width: 100%"
+				>
+				</el-date-picker>
+				<el-date-picker
+					v-if="queryType == '年'"
+					v-model="queryDate"
+					type="year"
+					placeholder="查询年份"
+					value-format="YYYY"
+					style="width: 100%"
+				>
+				</el-date-picker>
+				<el-button
+					type="primary"
+					icon="el-icon-search"
+					@click="handleQuery"
+				></el-button>
+				<el-button
+					@click="handleExport"
+					type="primary"
+					>导出</el-button
+				>
+			</div>
+		</el-header>
+		<el-main id="elMain">
+			<el-row :gutter="10">
+				<el-col >
+					<el-card shadow="never">
+						<scEcharts id="bachart1" :option="option"></scEcharts>
+					</el-card>
+				</el-col>
+				<el-col>
+					<el-card shadow="never" style="position: relative">
+						<el-table
+							:data="tableData"
+							:height="tableHeight"
+							id="exportDiv"
+							:summary-method="getSummaries" 
+							show-summary
+						>
+							<el-table-column type="index" width="50" />
+							<el-table-column label="工段" prop="工段">
+								<!-- :filters="mgroupFilters"
+								:filter-method="filterMgroup"
+								filter-placement="bottom-end" -->
+							</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">
+									<span>{{(scope.row.合格率).toFixed(2)}}%</span>
+								</template>
+							</el-table-column>
+						</el-table>
+					</el-card>
+				</el-col>
+			</el-row>
+		</el-main>
+	</el-container>
+</template>
+
+<script>
+import scEcharts from "@/components/scEcharts";
+export default {
+	name: "chart",
+	components: {
+		scEcharts,
+	},
+	data() {
+		return {
+			tableHeight: 0,
+			queryType: "月",
+			queryDate: "",
+			start_date: "",
+			end_date: "",
+			currentYear: "",
+			currentMonth: "",
+			typeOptions: ["月", "年"],
+			option: {
+				color: ["rgb(64,158,255)", "rgb(54,206,158)", "rgb(254,110,106)", "rgb(250,200,88)"],
+				title: {
+					text: "生产数量",
+				},
+				grid: {
+					top: "80px",
+				},
+				tooltip: {
+					trigger: "axis",
+				},
+				xAxis: {
+					type: "category",
+					data: ['外协白片抛','扫边A','黑化','退火','减薄A','减薄B','平磨','精雕','外协出司检','外协一次抛','磨抛一次抛','外扫','扫边B','倒角','成品抛','一次超洗','尺寸检验','二次超洗','外观检验','三次超洗'],
+				},
+				yAxis: [
+					{
+						type: 'value',
+						name: '数量',
+						axisLine: {
+							lineStyle: {
+								color: '#fff',
+							}
+						},
+						axisLabel: {
+							fontSize: 10,
+							color: '#fff',
+						},
+					},
+					{
+						type: "value",
+						name: "合格率",
+						position: "right",
+						alignTicks: true,
+						offset: 0,
+						axisLine: {
+							lineStyle: {
+								fontSize: 8,
+								color: "rgb(250,200,88)",
+							},
+						},
+						axisLabel: {
+							formatter: "{value}",
+						},
+					}
+				],
+				series: [
+					{
+						name:'生产数',
+						type: "bar",
+						yAxisIndex: 0,
+						barWidth: "15px",
+						label:{
+							show: true,
+							position: "top",
+							formatter: "{c}",
+							color: "rgb(64,158,255)",
+						},
+						itemStyle: {
+							borderRadius: [5, 5, 1, 1],
+						},
+						data:[],
+					},
+					{
+						name:'合格数',
+						type: "bar",
+						yAxisIndex: 0,
+						barWidth: "15px",
+						label:{
+							show: true,
+							position: "right",
+							formatter: "{c}",
+							color: "rgb(54,206,158)",
+						},
+						itemStyle: {
+							borderRadius: [5, 5, 1, 1],
+						},
+						data:[],
+					},
+					{
+						name:'不合格数',
+						type: "bar",
+						yAxisIndex: 0,
+						barWidth: "15px",
+						label:{
+							show: true,
+							position: "right",
+							formatter: "{c}",
+							color: "rgb(254,110,106)",
+						},
+						itemStyle: {
+							borderRadius: [5, 5, 1, 1],
+						},
+						data:[],
+					},
+					{
+						name:'合格率',
+						type: "line",
+						yAxisIndex: 1,
+						label:{
+							show: true,
+							position: "top",
+							formatter: "{c}",
+							color: "rgb(250,200,88)",
+						},
+						data:[],
+					},
+				],
+			},
+			nameFilters: [],
+			mgroupFilters: [],
+			processData: [],
+			xAxisData: [],
+			tableData: [],
+		};
+	},
+	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;
+		month = month > 9 ? month : "0" + month;
+		that.start_date = year + "-" + month + "-01";
+		that.end_date =year + "-" + month + "-" + days;
+		that.queryDate = year + "-" + month;
+		let height = document.getElementById("elMain").clientHeight - 60;
+		that.tableHeight = height/3*2;
+		document.getElementById('bachart1').style.height = height/3 + 'px';
+		that.getData();
+	},
+	methods: {
+		queryTypeChange(value) {
+			console.log(value);
+			this.queryDate = "";
+		},
+		getData() {
+			let that = this;
+			that.nameFilters = [];
+			that.mgroupFilters = [];
+			let obj = {
+				query: {
+					start_date: that.start_date,
+					end_date: that.end_date,
+					mgroup_name: "",
+				},
+				raise_exception: true,
+			};
+			let xAxisData = [];
+			that.$API.bi.dataset.exec.req("mlog_okrate", obj).then((res) => {
+				let data = res.data2.ds0;
+				that.tableData = data;
+				data.forEach((item) => {
+					let indexs = xAxisData.indexOf(item.工段); //判断是否已存在
+					if (indexs> -1) {} else {
+						indexs = xAxisData.length;
+						xAxisData.push(item.工段);
+						that.option.series[0].data[indexs] = item.生产数;
+						that.option.series[1].data[indexs] = item.合格数;
+						that.option.series[2].data[indexs] = item.不合格数;
+						that.option.series[3].data[indexs] = item.合格率.toFixed(2);
+					}
+				});
+				console.log('that.option',that.option);
+				console.log('xAxisData',xAxisData);
+				that.xAxisData = xAxisData;
+				that.option.xAxis.data = xAxisData;
+			});
+		},
+		handleQuery() {
+			if (this.queryDate !== "" && this.queryDate !== null) {
+				if (this.queryType == "月") {
+					this.start_date = this.queryDate + "-01";
+					let arr = this.queryDate.split("-");
+					this.end_date =this.queryDate +"-" +new Date(arr[0], arr[1], 0).getDate();
+				} else {
+					this.start_date = this.queryDate + "-01-01";
+					this.end_date = this.queryDate + "-12-31";
+				}
+			} else {
+				if (this.queryType == "月") {
+					this.start_date =
+						this.currentYear + "-" + this.currentMonth + "-01";
+					this.end_date =
+						this.currentYear +
+						"-" +
+						this.currentMonth +
+						"-" +
+						new Date(
+							this.currentYear,
+							this.currentMonth,
+							0
+						).getDate();
+				} else {
+					this.start_date = this.currentYear + "-01-01";
+					this.end_date = this.currentYear + "-12-31";
+				}
+			}
+			this.getData6();
+		},
+		getSummaries({ columns, data }) {
+			const sums = [];
+			columns.forEach((column, index) => {
+				if (index === 0) {
+					sums[index] = "合计";
+					return;
+				}
+				if (index == 3||index == 4||index == 5||index == 6) {
+					const values = data.map((item) =>
+						Number(item[column.property])
+					);
+					if (!values.every((value) => Number.isNaN(value))) {
+						sums[index] = values.reduce((prev, curr) => {
+							const value = Number(curr); //Number转换为数值
+							let sum = Number(
+								Number(prev) + Number(curr)
+							).toFixed(2); //toFixed(2)数据项保留两位小数
+							if (!isNaN(value)) {
+								return sum;
+							} else {
+								return prev;
+							}
+						}, 0);
+					} 
+				}
+			});
+			return sums;
+		},
+		filterName(value, row) {
+            return row.物料名 === value;
+        },
+		filterMgroup(value, row) {
+            return row.工段 === value;
+        },
+		handleExport() {
+			this.exportLoading = true;
+			this.$XLSX("#exportDiv", "工序合格数");
+			this.exportLoading = false;
+		},
+	},
+};
+</script>
+
+<style scoped>
+.tables {
+	position: absolute;
+	top: 6px;
+	left: 4px;
+	z-index: 10;
+}
+</style>