feat:车间看板公共模板添加直通率和工序余料

src/views/bigScreen/gxerp/index_com.vue

@@ -21,7 +21,7 @@
 			<div class="kpi-row">
 				<div class="kpi-card kpi-c2">
 					<div class="kpi-meta">
-						<div class="kpi-label">昨日加工数</div>
+						<div class="kpi-label">昨日流转量</div>
 						<div class="kpi-sub">PROCESSED</div>
 					</div>
 					<div class="kpi-value">{{ sctj.rjgs }}</div>
@@ -59,6 +59,14 @@
 					<div class="kpi-value">{{ sctj.rhgl }}</div>
 					<div class="kpi-bar"></div>
 				</div>
+				<div class="kpi-card kpi-c1">
+					<div class="kpi-meta">
+						<div class="kpi-label">昨日生产直通率</div>
+						<div class="kpi-sub">DAILY QUALITY RATE</div>
+					</div>
+					<div class="kpi-value">{{ sctj.rztls }}</div>
+					<div class="kpi-bar"></div>
+				</div>
 			</div>
 
 			<!-- Top row: 2 panels -->
@@ -80,11 +88,22 @@
 						<i class="corner bl"></i><i class="corner br"></i>
 					</div>
 				</el-col>
-				<el-col :span="12" class="col-full">
+				<el-col :span="4" class="col-full">
+					<div class="panel">
+						<div class="panel-head">
+							<span class="panel-title">工序余料</span>
+						</div>
+						<div class="panel-body" ref="processBox">
+							<dv-scroll-board :config="configDataProcess" class="board" />
+						</div>
+						<i class="corner tl"></i><i class="corner tr"></i>
+						<i class="corner bl"></i><i class="corner br"></i>
+					</div>
+				</el-col>
+				<el-col :span="8" class="col-full">
 					<div class="panel">
 						<div class="panel-head">
 							<span class="panel-title">昨日损耗分析</span>
-							<span class="panel-sub">LOSS ANALYSIS</span>
 						</div>
 						<div class="panel-body chart-body" id="chart2"></div>
 						<i class="corner tl"></i><i class="corner tr"></i>
@@ -99,7 +118,6 @@
 					<div class="panel">
 						<div class="panel-head">
 							<span class="panel-title">生产统计</span>
-							<span class="panel-sub">DAILY STATISTICS</span>
 						</div>
 						<div class="panel-body">
 							<dv-scroll-board :config="configDatas" class="board" />
@@ -112,7 +130,6 @@
 					<div class="panel">
 						<div class="panel-head">
 							<span class="panel-title">车间库存</span>
-							<span class="panel-sub">INVENTORY</span>
 						</div>
 						<div class="panel-body">
 							<dv-scroll-board :config="configDataInm" class="board" />
@@ -175,6 +192,8 @@ export default {
 				rhgs: 0,
 				rbhgs: 0,
 				rhgl: 0,
+				rztls: 0,
+				rlzls: 0,
 			},
 			dayInterval: null,
 			chartInterval2: null,
@@ -190,6 +209,17 @@ export default {
 				data: [],
 				waitTime: 1500,
 			},
+			configDataProcess: {
+			    headerBGC: 'rgba(0, 229, 255, 0.16)',
+				oddRowBGC: 'rgba(0, 229, 255, 0.04)',
+				evenRowBGC: 'rgba(0, 229, 255, 0.10)',
+				header: ['物料名', '数量(个)'],
+				headerHeight: 38,
+				rowNum: 8,
+				align: 'center',
+				columnWidth: [],
+				data: []
+			},
 			//设备
 			configDataEq: {
 				headerBGC: 'rgba(0, 229, 255, 0.16)',
@@ -232,6 +262,13 @@ export default {
 		that.configDataInm.data = [];
 		//表格table的高度
 		this.tableHeight = document.getElementById("scrollContainer").clientHeight;
+		this.$nextTick(() => {
+			const box = this.$refs.processBox;
+			if (box) {
+				const w = box.clientWidth - 16;
+				this.configDataProcess.columnWidth = [Math.max(50, w - 100), 100];
+			}
+		});
 		this.showTime();
 		this.dayInterval = setInterval(() => {
 			this.showTime();
@@ -272,6 +309,7 @@ export default {
 					this.getMaterials(that.page);
 					this.getProductLine();
 					this.getCountnotok();
+					this.getProcessLeft();
 				})
 			});
 		},
@@ -312,6 +350,23 @@ export default {
 			}, 500);
 			return myChart;
 		},
+		getProcessLeft() {
+			let that = this;
+			let obj = {
+				query: { mgroup_name: that.mgroupName },
+			};
+			that.$API.bi.dataset.exec.req("mgroup_yuliao", obj).then((res) => {
+				let list = res.data2.ds0;
+				if (list.length > 0) {
+					list.forEach((item) => {
+						let arr = [];
+						arr[0] = item.物料名+'('+item.状态+')';
+						arr[1] = item.数量;
+						that.configDataProcess.data.push(arr);
+					})
+				}
+		    })
+		},
 		//生产统计
 		getProductLine() {
 			let that = this;
@@ -324,12 +379,10 @@ export default {
 					list.forEach((item) => {
 						let dateYes = that.yesterday.split('-')[2];
 						if (item.日 == dateYes) {
-							that.sctj.rtcs = item.总重量;
+							that.sctj.rjgs += item.生产数;
-							that.sctj.rjgs = item.生产数;
+							that.sctj.rjgqbls += item.加工前不良;
-							that.sctj.rjgqbls = item.生产数 - item.不合格数 - item.合格数;
+							that.sctj.rhgs += item.合格数;
-							that.sctj.rhgs = item.合格数;
+							that.sctj.rbhgs += item.不合格数;
-							that.sctj.rbhgs = item.不合格数;
-							that.sctj.rhgl = Number((item.合格率).toFixed(2));
 						}
 						let arr = [];
 						arr[0] = item.年 + '-' + item.月 + '-' + item.日;
@@ -340,6 +393,9 @@ export default {
 						arr[5] = item.交送数;
 						that.configDatas.data.push(arr);
 					});
+					that.sctj.rhgl = Number((that.sctj.rhgs / that.sctj.rjgs * 100).toFixed(2));
+					let total = that.sctj.rjgs+that.sctj.rjgqbls;
+					that.sctj.rztls = Number((that.sctj.rhgs / total * 100).toFixed(2));
 				}
 			});
 		},
@@ -600,7 +656,7 @@ export default {
 /* ============= KPI Strip ============= */
 .kpi-row {
 	display: grid;
-	grid-template-columns: repeat(5, 1fr);
+	grid-template-columns: repeat(6, 1fr);
 	gap: 10px;
 	flex: 0 0 92px;
 	min-height: 0;