diff --git a/src/views/modules/haianWarehouse/dashboard/autoSortingBoard54.vue b/src/views/modules/haianWarehouse/dashboard/autoSortingBoard54.vue index a7e5ff3..b008581 100644 --- a/src/views/modules/haianWarehouse/dashboard/autoSortingBoard54.vue +++ b/src/views/modules/haianWarehouse/dashboard/autoSortingBoard54.vue @@ -38,7 +38,8 @@ -
+ +
@@ -96,7 +97,10 @@ export default { // connecting 黄、connected 绿、disconnected 红，只表示 STOMP 连接，不表示立库有没有任务 - rqrq connectionState: 'connecting', // 位置1和位置2合在一张表，按拣选口排列 - rqrq - boardList: [] + boardList: [], + scrollTimer: null, + scrollPaused: false, + scrollResumeAt: 0 } }, computed: { @@ -123,6 +127,8 @@ export default { this.configTimer = setInterval(() => { this.checkBoardConfig() }, 30000) + // 和人工分拣一样每 60 毫秒走 1 像素；内容没超出时方法内直接返回 - rqrq + this.scrollTimer = setInterval(this.scrollTable, 60) }, beforeDestroy() { @@ -137,6 +143,9 @@ export default { if (this.configTimer) { clearInterval(this.configTimer) } + if (this.scrollTimer) { + clearInterval(this.scrollTimer) + } }, methods: { @@ -287,6 +296,18 @@ export default { */ getStatusClass(status) { return status === '已完成' ? 'status-success' : 'status-pending' + }, + // 到底停留 2 秒再回顶。没有数据或表格没超出可视高度时不滚 - rqrq + scrollTable () { + const viewport = this.$refs.tableViewport + if (!viewport || this.scrollPaused || !this.boardList.length || Date.now() < this.scrollResumeAt) return + if (viewport.scrollHeight <= viewport.clientHeight) return + if (viewport.scrollTop + viewport.clientHeight >= viewport.scrollHeight - 1) { + viewport.scrollTop = 0 + this.scrollResumeAt = Date.now() + 2000 + } else { + viewport.scrollTop += 1 + } } } } @@ -555,6 +576,10 @@ export default { } th { + position: sticky; + top: 0; + z-index: 2; + background: #1b6676; padding: 5px 6px; color: #fcfdfd; font-size: 16px; diff --git a/src/views/modules/haianWarehouse/dashboard/errorAreaBoard54.vue b/src/views/modules/haianWarehouse/dashboard/errorAreaBoard54.vue index 447d8cf..1fd3187 100644 --- a/src/views/modules/haianWarehouse/dashboard/errorAreaBoard54.vue +++ b/src/views/modules/haianWarehouse/dashboard/errorAreaBoard54.vue @@ -38,7 +38,8 @@ -
+ +
@@ -88,7 +89,10 @@ export default { queryLoading: false, // 第一次请求中为黄，查询成功为绿，失败为红。没有栈板也保持绿灯 - rqrq connectionState: 'connecting', - boardList: [] + boardList: [], + scrollTimer: null, + scrollPaused: false, + scrollResumeAt: 0 } }, computed: { @@ -115,6 +119,8 @@ export default { this.pollTimer = setInterval(() => { this.getDataList() }, 5000) + // 和人工分拣一样每 60 毫秒走 1 像素；内容没超出时方法内直接返回 - rqrq + this.scrollTimer = setInterval(this.scrollTable, 60) }, beforeDestroy() { @@ -127,6 +133,9 @@ export default { if (this.pollTimer) { clearInterval(this.pollTimer) } + if (this.scrollTimer) { + clearInterval(this.scrollTimer) + } }, methods: { @@ -172,6 +181,18 @@ export default { const weekDays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'] const weekDay = weekDays[now.getDay()] this.currentTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds} ${weekDay}` + }, + // 到底停留 2 秒再回顶。没有数据或表格没超出可视高度时不滚 - rqrq + scrollTable () { + const viewport = this.$refs.tableViewport + if (!viewport || this.scrollPaused || !this.boardList.length || Date.now() < this.scrollResumeAt) return + if (viewport.scrollHeight <= viewport.clientHeight) return + if (viewport.scrollTop + viewport.clientHeight >= viewport.scrollHeight - 1) { + viewport.scrollTop = 0 + this.scrollResumeAt = Date.now() + 2000 + } else { + viewport.scrollTop += 1 + } } } } @@ -440,6 +461,10 @@ export default { } th { + position: sticky; + top: 0; + z-index: 2; + background: #1b6676; padding: 5px 6px; color: #fcfdfd; font-size: 16px; diff --git a/src/views/modules/haianWarehouse/dashboard/palletOutboundBoard54.vue b/src/views/modules/haianWarehouse/dashboard/palletOutboundBoard54.vue index 4c2fe76..4dd589a 100644 --- a/src/views/modules/haianWarehouse/dashboard/palletOutboundBoard54.vue +++ b/src/views/modules/haianWarehouse/dashboard/palletOutboundBoard54.vue @@ -38,14 +38,21 @@ -
-
+ +
+
+ + + + + + - - - - + + + + @@ -85,7 +92,10 @@ export default { queryLoading: false, // 第一次请求中为黄，立库 200 为绿，非 200 或调用失败为红 - rqrq connectionState: 'connecting', - boardList: [] + boardList: [], + scrollTimer: null, + scrollPaused: false, + scrollResumeAt: 0 } }, computed: { @@ -112,6 +122,8 @@ export default { this.pollTimer = setInterval(() => { this.getDataList() }, 5000) + // 和人工分拣一样每 60 毫秒走 1 像素；内容没超出时方法内直接返回 - rqrq + this.scrollTimer = setInterval(this.scrollTable, 60) }, beforeDestroy() { @@ -124,6 +136,9 @@ export default { if (this.pollTimer) { clearInterval(this.pollTimer) } + if (this.scrollTimer) { + clearInterval(this.scrollTimer) + } }, methods: { @@ -179,6 +194,18 @@ export default { const weekDays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'] const weekDay = weekDays[now.getDay()] this.currentTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds} ${weekDay}` + }, + // 到底停留 2 秒再回顶。没有数据或表格没超出可视高度时不滚 - rqrq + scrollTable () { + const viewport = this.$refs.tableViewport + if (!viewport || this.scrollPaused || !this.boardList.length || Date.now() < this.scrollResumeAt) return + if (viewport.scrollHeight <= viewport.clientHeight) return + if (viewport.scrollTop + viewport.clientHeight >= viewport.scrollHeight - 1) { + viewport.scrollTop = 0 + this.scrollResumeAt = Date.now() + 2000 + } else { + viewport.scrollTop += 1 + } } } } @@ -441,12 +468,20 @@ export default { border-collapse: separate; border-spacing: 0; + &.outbound-table { + table-layout: fixed; + } + thead { tr { background: linear-gradient(135deg, rgba(23, 179, 163, 0.25) 0%, rgba(23, 179, 163, 0.15) 100%); } th { + position: sticky; + top: 0; + z-index: 2; + background: #1b6676; padding: 5px 6px; color: #fcfdfd; font-size: 16px;
托盘码物料编码数量状态托盘码物料编码数量状态