From 1f4903411dd41223554e62bc3b134b7ec4d42975 Mon Sep 17 00:00:00 2001 From: yangfeng <wanwan926_4@163.com> Date: 星期一, 04 十二月 2023 16:13:42 +0800 Subject: [PATCH] 设置订单完成比率和工单进度统计动态显示 --- src/views/cockpitPage/components/WorkOrderProgress.vue | 137 ++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 134 insertions(+), 3 deletions(-) diff --git a/src/views/cockpitPage/components/WorkOrderProgress.vue b/src/views/cockpitPage/components/WorkOrderProgress.vue index a2b870d..0763725 100644 --- a/src/views/cockpitPage/components/WorkOrderProgress.vue +++ b/src/views/cockpitPage/components/WorkOrderProgress.vue @@ -9,7 +9,12 @@ </div> </div> <div class="table-box"> - <el-table :data="tableData" style="width: 100%"> + <el-table + ref="table" + :data="tableData" + style="width: 100%" + height="100%" + > <el-table-column prop="workOrderId" label="宸ュ崟缂栧彿" @@ -149,12 +154,130 @@ ], delayWarning: 0, }, + { + workOrderId: "A5435", + product: "浜у搧1", + productSpecs: "瑙勬牸", + amount: "2000", + planTime: "02-23~05-23", + completeProgerss: [ + { status: 1 }, + { status: 1 }, + { status: 2 }, + { status: 0 }, + ], + delayWarning: 0, + }, + { + workOrderId: "A5435", + product: "浜у搧1", + productSpecs: "瑙勬牸", + amount: "2000", + planTime: "02-23~05-23", + completeProgerss: [ + { status: 1 }, + { status: 1 }, + { status: 2 }, + { status: 0 }, + ], + delayWarning: 0, + }, + { + workOrderId: "A5435", + product: "浜у搧1", + productSpecs: "瑙勬牸", + amount: "2000", + planTime: "02-23~05-23", + completeProgerss: [ + { status: 1 }, + { status: 1 }, + { status: 2 }, + { status: 0 }, + ], + delayWarning: 0, + }, + { + workOrderId: "A5435", + product: "浜у搧1", + productSpecs: "瑙勬牸", + amount: "2000", + planTime: "02-23~05-23", + completeProgerss: [ + { status: 1 }, + { status: 1 }, + { status: 2 }, + { status: 0 }, + ], + delayWarning: 0, + }, + { + workOrderId: "A5435", + product: "浜у搧1", + productSpecs: "瑙勬牸", + amount: "2000", + planTime: "02-23~05-23", + completeProgerss: [ + { status: 1 }, + { status: 1 }, + { status: 2 }, + { status: 0 }, + ], + delayWarning: 0, + }, + { + workOrderId: "BA5435", + product: "浜у搧1", + productSpecs: "瑙勬牸", + amount: "2000", + planTime: "02-23~05-23", + completeProgerss: [ + { status: 1 }, + { status: 1 }, + { status: 2 }, + { status: 0 }, + ], + delayWarning: 0, + }, + { + workOrderId: "BA5435", + product: "浜у搧1", + productSpecs: "瑙勬牸", + amount: "2000", + planTime: "02-23~05-23", + completeProgerss: [ + { status: 1 }, + { status: 1 }, + { status: 2 }, + { status: 0 }, + ], + delayWarning: 0, + }, ], }; }, - mounted() {}, + mounted() { + this.setAutoScroll(); + }, watch: {}, - methods: {}, + methods: { + // 瀹炵幇鑷姩婊氬姩鐨勬柟娉� + setAutoScroll() { + // 鎷垮埌琛ㄦ牸鎸傝浇鍚庣殑鐪熷疄DOM + const table = this.$refs.table; + // 鎷垮埌琛ㄦ牸涓壙杞芥暟鎹殑div鍏冪礌 + const divData = table.bodyWrapper; + // 鎷垮埌鍏冪礌鍚庯紝瀵瑰厓绱犺繘琛屽畾鏃跺鍔犺窛绂婚《閮ㄨ窛绂伙紝瀹炵幇婊氬姩鏁堟灉(姝ら厤缃负姣�100姣绉诲姩1鍍忕礌) + setInterval(() => { + // 鍏冪礌鑷璺濈椤堕儴1鍍忕礌 + divData.scrollTop += 1; + // 鍒ゆ柇鍏冪礌鏄惁婊氬姩鍒板簳閮�(鍙楂樺害+璺濈椤堕儴=鏁翠釜楂樺害) + if (divData.clientHeight + divData.scrollTop == divData.scrollHeight) { + // 閲嶇疆table璺濈椤堕儴璺濈 + divData.scrollTop = 0; + } + }, 200); // 婊氬姩閫熷害 + }, + }, }; </script> @@ -192,6 +315,8 @@ } .table-box { padding: 20px 15px; + height: calc(100% - 75px); + overflow: hidden; .progerss-bg { width: 100%; height: 22px; @@ -251,6 +376,7 @@ // 淇敼琛ㄦ牸瀛椾綋棰滆壊 .el-table__body td { color: #00ffff; + padding: 8px 0; } // 璁剧疆琛ㄦ牸鑳屾櫙閫忔槑 .el-table th { @@ -285,5 +411,10 @@ .el-table::before { display: none; } + // 淇濈暀鍨傜洿婊氬姩涓旈殣钘忔粴鍔ㄦ潯 + .el-table__body-wrapper::-webkit-scrollbar { + width: 0px; + height: 0px; + } } </style> -- Gitblit v1.8.0