From b9b275df0a3e5b59258e98e2e31073e7bbdc11c2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Wed, 20 Jul 2022 13:30:41 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../resources/static/css/autoscroll-table.css |  11 +-
 .../resources/static/js/autoscroll-table.js   |  12 +-
 .../main/resources/static/js/echartsCommon.js |  13 +-
 .../main/resources/templates/broad/fp.html    | 165 +++++++-----------
 4 files changed, 85 insertions(+), 116 deletions(-)

diff --git a/ruoyi-admin/src/main/resources/static/css/autoscroll-table.css b/ruoyi-admin/src/main/resources/static/css/autoscroll-table.css
index 030103d..4813861 100644
--- a/ruoyi-admin/src/main/resources/static/css/autoscroll-table.css
+++ b/ruoyi-admin/src/main/resources/static/css/autoscroll-table.css
@@ -8,14 +8,9 @@
     padding: 0.6% 0;
 }
 
-.autoscroll-table td {
-    font-size: 88%;
-    text-align: center;
-    padding: 0.8% 0;
-}
 
 .autoscroll-table > thead {
-    position: fixed;
+    position: sticky;
     background-color: #103BBD;
     color: #FFFFFF;
     outline: #103BBD solid 1px;
@@ -90,12 +85,14 @@
 /* Font size readjust */
 
 .autoscroll-table th {
-    font-size: 10%;
+    font-size: 0.85vw;
 }
 
 .autoscroll-table td {
     font-size: 0.75vw;
     white-space:nowrap;
+    text-align: center;
+    padding: 0;
 }
 
 .autoscroll-table caption {
diff --git a/ruoyi-admin/src/main/resources/static/js/autoscroll-table.js b/ruoyi-admin/src/main/resources/static/js/autoscroll-table.js
index ecd3144..ecdb7e0 100644
--- a/ruoyi-admin/src/main/resources/static/js/autoscroll-table.js
+++ b/ruoyi-admin/src/main/resources/static/js/autoscroll-table.js
@@ -234,6 +234,7 @@ class AutoScrollTable {
     }
 
     resize() {
+        const parent = this.el.querySelector(".autoscroll-table").parentNode
         const thead = this.el.querySelector(".autoscroll-table .autoscroll-table_thead");
         const theadRow = thead.children[0]
         let tbody = this.el.querySelector(".autoscroll-table .autoscroll-table_tbody1");
@@ -256,14 +257,19 @@ class AutoScrollTable {
         }
 
         thead.style.width = window.getComputedStyle(tbody).width
-        shadow.style.height = window.getComputedStyle(theadRow).height
-        thead.style.top = window.getComputedStyle(this.el).top
+        let tr = this.el.querySelectorAll(".autoscroll-table .autoscroll-table_tbody1 tr")
+        tr.forEach(val => {
+            val.style.lineHeight = `${(parseFloat(window.getComputedStyle(parent).height) - parseFloat(window.getComputedStyle(theadRow).height))/5}px`
+        })
+
+        shadow.style.display ='none'
+        thead.style.top = '0'
 
         if (caption) {
             caption.style.width = thead.style.width
             const captionHeight = parseFloat(window.getComputedStyle(caption).height)
 
-            thead.style.top = `${parseFloat(thead.style.top) + captionHeight}px`
+            thead.style.top = '0'
             shadow.style.height = `${parseFloat(shadow.style.height) + captionHeight}px`
         }
     }
diff --git a/ruoyi-admin/src/main/resources/static/js/echartsCommon.js b/ruoyi-admin/src/main/resources/static/js/echartsCommon.js
index f4c2cf2..de9e7b2 100644
--- a/ruoyi-admin/src/main/resources/static/js/echartsCommon.js
+++ b/ruoyi-admin/src/main/resources/static/js/echartsCommon.js
@@ -1412,12 +1412,12 @@ const multipleBrokenLineAreaDiagram = (data, ids) => {
             xData: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
             yDataOne: new Fun().randomNum(),
             yDataTwo: new Fun().randomNum(),
-            yDataThree: new Fun().randomNum(),
             yDataOneName: '制氢量',
             yDataTwoName: '发电量',
-            yDataThreeName: '充装量',
         }
     }
+    let max = Math.round(Math.max(...data.yDataOne,...data.yDataTwo))
+    let min = Math.round(Math.min(...data.yDataOne,...data.yDataTwo))
 
     let option = {
         tooltip: {
@@ -1459,7 +1459,8 @@ const multipleBrokenLineAreaDiagram = (data, ids) => {
                 },
                 axisLabel: {
                     show: true,
-                    color: '#fff'
+                    color: '#fff',
+                    interval:0,
                 },
                 data: data.xData,
             },
@@ -1470,7 +1471,8 @@ const multipleBrokenLineAreaDiagram = (data, ids) => {
                 axisTick: {
                     show: false,
                 },
-                min:15,
+                max:max+0.5,
+                min:min - 1,
                 axisLine: {
                     lineStyle: {
                         color: "#57617B",
@@ -1478,7 +1480,8 @@ const multipleBrokenLineAreaDiagram = (data, ids) => {
                 },
                 axisLabel: {
                     show: true,
-                    color: '#fff'
+                    color: '#fff',
+                    interval:0.5,
                 },
                 splitLine: {
                     show: false,
diff --git a/ruoyi-admin/src/main/resources/templates/broad/fp.html b/ruoyi-admin/src/main/resources/templates/broad/fp.html
index 9c61784..be7575e 100644
--- a/ruoyi-admin/src/main/resources/templates/broad/fp.html
+++ b/ruoyi-admin/src/main/resources/templates/broad/fp.html
@@ -38,15 +38,7 @@
         left: 3.4%;
     }
 
-    #bottom-left {
-        position: absolute;
-        border: 0px solid red;
-        width: 68%;
-        height: 25%;
-        top: 66.4%;
-        left: 3.5%;
-        font-size: 1vw;
-    }
+
 
     .total {
         flex-wrap: nowrap;
@@ -197,22 +189,24 @@
         height: 100%;
     }
 
-    #bottom-left .autoscroll-table td {
-        padding-top: 0.3%;
-        padding-bottom: 0.3%;
+
+
+    .my-transition{
+        position: absolute;
+        border: 0px solid red;
+        width: 68%;
+        height: 25%;
+        top: 66.4%;
+        left: 3.5%;
+        transform: scale(0.5, 0.5);
+        opacity: 0;
+        transition: transform 0.5s linear, opacity 0.5s linear;
     }
-
-    #bottom-left-2 .autoscroll-table td {
-        padding-top: 0.3%;
-        padding-bottom: 0.3%;
-    }
-
-
     .my-transition2 {
         position: absolute;
         border: 0px solid red;
         width: 68%;
-        height: 29.6%;
+        height: 25%;
         top: 66.4%;
         left: 3.5%;
         transform: scale(0.5, 0.5);
@@ -222,6 +216,7 @@
 
     .my-click-transiton {
         opacity: 1;
+        z-index: 2  ;
         transform: scale(1, 1);
     }
 </style>
@@ -243,14 +238,12 @@
 <!--生产统计数据-->
 
 
-<div class="my-transition">
-    <div id="bottom-left"></div>
-    <div class="total" id="total"></div>
+<div class="my-transition" id="my-transition">
 </div>
 
-<!--<div class="my-transition2">-->
-<!--    <div id="bottom-left-2"></div>-->
-<!--</div>-->
+<div class="my-transition2" id="my-transition2">
+</div>
+<div class="total" id="total"></div>
 
 <!--中间数据-->
 <div id="top-mid">
@@ -359,21 +352,21 @@
 <script src="../../static/js/auto-update.js" th:src="@{/js/auto-update.js}"></script>
 <script>
     //夹具生产计划切换
-    // showalert();
-    //
-    // window.setInterval(showalert, 1000 * 30);
-    //
-    // function showalert() {
-    //     var myTransition = $('.my-transition');
-    //     var myTransition2 = $('.my-transition2');
-    //     if (myTransition.hasClass('my-click-transiton')) {
-    //         // myTransition.removeClass('my-click-transiton');
-    //         $('.my-transition2').addClass('my-click-transiton');
-    //     } else {
-    //         // myTransition2.removeClass('my-click-transiton');
-    //         $('.my-transition').addClass('my-click-transiton');
-    //     }
-    // }
+    showalert();
+
+    window.setInterval(showalert, 1000 * 30);
+
+    function showalert() {
+        var myTransition = $('.my-transition');
+        var myTransition2 = $('.my-transition2');
+        if (myTransition.hasClass('my-click-transiton')) {
+            myTransition.removeClass('my-click-transiton');
+            $('.my-transition2').addClass('my-click-transiton');
+        } else {
+            myTransition2.removeClass('my-click-transiton');
+            $('.my-transition').addClass('my-click-transiton');
+        }
+    }
 
 
     const orderInfColumns = [
@@ -400,13 +393,13 @@
     }
 
     // 生产统计数据
-    // const planInfo = new AutoScrollTable(document.getElementById("bottom-left"), ['工位', '型号', '状态', '目标', '计划','累计','达成率','8:00','9:00','10:00','11:00','12:00','13:00','14:00','15:00','16:00','17:00','18:00','19:00'], {
-    //     width: ["5%", null, "7%", "5%", "5%", "5%", "8%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%"],
-    // })
+    const planInfo = new AutoScrollTable(document.getElementById("my-transition"), ['工位', '型号', '状态', '目标', '计划', '累计', '达成率', '8:30', '9:30', '10:30', '11:30', '12:30', '13:30', '14:30', '15:30', '16:30', '17:30', '18:30', '19:00'], {
+        width: ["5%", '10%', "7%", "5%", "5%", "5%", "8%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%"],
+    })
 
-    // const planInfo2 = new AutoScrollTable(document.getElementById("bottom-left-2"), [], {
-    //     width: ["5%", null, "7%", "5%", "5%", "5%", "8%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%"],
-    // })
+    const planInfo2 = new AutoScrollTable(document.getElementById("my-transition2"), ['工位', '型号', '状态', '目标', '计划', '累计', '达成率', '8:30', '9:30', '10:30', '11:30', '12:30', '13:30', '14:30', '15:30', '16:30', '17:30', '18:30', '19:00'], {
+        width: ["5%", '10%', "7%", "5%", "5%", "5%", "8%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%"],
+    })
 
     // 切换中心运行状态
     function updateStatus(id, status) {
@@ -467,23 +460,22 @@
         // ]
         // 生产统计数据
         autoUpdate('/broad/fp/selectStationHourInfo', INTERVAL, data => {
-            $('#bottom-left').remove()
-            $('.my-transition').append('<div class="bottom-left" id="bottom-left"></div>')
-            dynamicTable({
-                el: '#bottom-left',
-                rowNum: 7,
-                timeout: 0,
-                header: ['工位', '型号', '状态', '目标', '计划', '累计', '达成率', '8:30', '9:30', '10:30', '11:30', '12:30', '13:30', '14:30', '15:30', '16:30', '17:30', '18:30', '19:00'],
-                data: data.map(value => [value.station_no, value.name, value.status, value.target, value.plan_number, value.qty, `${value.rate}%`, value.h1, value.h2, value.h3, value.h4, value.h5, value.h6, value.h7, value.h8, value.h9, value.h10, value.h11, value.h12]),
-                index: false,
-                fontColor: '#B4B7BF ',
-                indexBGC: '#86F3FF',
-                headerBGC: 'rgba(8,36,75,0.2)',
-                oddRowBGC: 'rgba(8,36,75,0.2)',
-                evenRowBGC: 'rgba(6,25,57,0.2)',
-                colWidth: ["5%", '10%', "7%", "5%", "5%", "5%", "8%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%"]
-            });
-            // orderInf.loadData(data, Object.keys(orderInfColumns))
+            // $('#bottom-left').remove()
+            // $('.my-transition').append('<div class="bottom-left" id="bottom-left"></div>')
+            // dynamicTable({
+            //     el: '#bottom-left',
+            //     rowNum: 7,
+            //     timeout: 0,
+            //     header: ['工位', '型号', '状态', '目标', '计划', '累计', '达成率', '8:30', '9:30', '10:30', '11:30', '12:30', '13:30', '14:30', '15:30', '16:30', '17:30', '18:30', '19:00'],
+            //     data: data.map(value => [value.station_no, value.name, value.status, value.target, value.plan_number, value.qty, `${value.rate}%`, value.h1, value.h2, value.h3, value.h4, value.h5, value.h6, value.h7, value.h8, value.h9, value.h10, value.h11, value.h12]),
+            //     index: false,
+            //     fontColor: '#B4B7BF ',
+            //     indexBGC: '#86F3FF',
+            //     headerBGC: 'rgba(8,36,75,0.2)',
+            //     oddRowBGC: 'rgba(8,36,75,0.2)',
+            //     evenRowBGC: 'rgba(6,25,57,0.2)',
+            //     colWidth: ["5%", '10%', "7%", "5%", "5%", "5%", "8%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%", "4%"]
+            // });
             // let consolidatedRow = ["", "合计", ""]
             //
             // for (let i = 3; i < 19; i++) {
@@ -508,47 +500,18 @@
             //
             //     consolidatedRow.push(sum.toString())
             // }
-
+            //
             // data.push(consolidatedRow)
 
-            // planInfo.loadData(data.map(value => [value.station_no, value.name, '正常', '0', value.plan_number,value.qty,`${value.rate}%`,value.h1,value.h2,value.h3,value.h4,value.h5,value.h6,value.h7,value.h8,value.h9,value.h10,value.h11,value.h12]), Object.keys( ['工位', '型号', '状态', '目标', '计划','累计','达成率','8:00','9:00','10:00','11:00','12:00','13:00','14:00','15:00','16:00','17:00','18:00','19:00']))
-            //data.map(value => [value.orderType, value.plannedProduction, value.actualProduction, value.plannedProduction - value.actualProduction, `${(value.actualProduction / value.plannedProduction * 100).toFixed(2)}%`]
+            planInfo.loadData(data.map(value => [value.station_no, value.name, value.status, value.target, value.plan_number, value.qty, `${value.rate}%`, value.h1, value.h2, value.h3, value.h4, value.h5, value.h6, value.h7, value.h8, value.h9, value.h10, value.h11, value.h12]), Object.keys( ['工位', '型号', '状态', '目标', '计划','累计','达成率','8:00','9:00','10:00','11:00','12:00','13:00','14:00','15:00','16:00','17:00','18:00','19:00']))
+            data.map(value => [value.orderType, value.plannedProduction, value.actualProduction, value.plannedProduction - value.actualProduction, `${(value.actualProduction / value.plannedProduction * 100).toFixed(2)}%`])
         })
-        flip('#bottom-left')
+        // flip('#bottom-left')
 
-        // autoUpdate('/system/FoamerMes/getPlanHourInfo2', INTERVAL, data => {
-        //     // orderInf.loadData(data, Object.keys(orderInfColumns))
-        //     let consolidatedRow = ["", "合计", ""]
-        //
-        //     for (let i = 3; i < 19; i++) {
-        //         if (i === 6) {
-        //             consolidatedRow.push(`${(consolidatedRow[5] / consolidatedRow[4] * 100).toFixed(1)}%`)
-        //             continue
-        //         }
-        //
-        //         let sum = 0
-        //
-        //         for (let j = 1; j < data.length; j++) {
-        //             let d = data[j][i]
-        //             if (!d || d === '') {
-        //                 continue
-        //             }
-        //             if (typeof d === 'string') {
-        //                 d = parseInt(d)
-        //             }
-        //
-        //             sum += d
-        //         }
-        //
-        //         consolidatedRow.push(sum.toString())
-        //     }
-        //
-        //     data.push(consolidatedRow)
-        //
-        //     planInfo2.loadData(data, 19, {
-        //         includeHead: true,
-        //     })
-        // })
+        autoUpdate('/broad/fp/selectStationHourInfo', INTERVAL, data => {
+
+            planInfo2.loadData(data.map(value => [value.station_no, value.name, value.status, value.target, value.plan_number, value.qty, `${value.rate}%`, value.h1, value.h2, value.h3, value.h4, value.h5, value.h6, value.h7, value.h8, value.h9, value.h10, value.h11, value.h12]), Object.keys( ['工位', '型号', '状态', '目标', '计划','累计','达成率','8:00','9:00','10:00','11:00','12:00','13:00','14:00','15:00','16:00','17:00','18:00','19:00']))
+        })
 
 
         // 右侧压力 + 右侧温度

From d8aaaa7893310463f159753f4e2c68ce698ad573 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Wed, 20 Jul 2022 13:37:23 +0800
Subject: [PATCH 2/3] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-admin/src/main/resources/templates/broad/box.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ruoyi-admin/src/main/resources/templates/broad/box.html b/ruoyi-admin/src/main/resources/templates/broad/box.html
index d600804..3fbe1b0 100644
--- a/ruoyi-admin/src/main/resources/templates/broad/box.html
+++ b/ruoyi-admin/src/main/resources/templates/broad/box.html
@@ -364,7 +364,7 @@
 <script src="../../static/js/data-merger.js" th:src="@{/js/data-merger.js}"></script>
 <script>
     const occupancy = (val1=0,val2=0) => {
-        const html = `内胆库库存占有率：${val1}%,箱壳库库存占有率${val2}%`
+        const html = `内胆库存占用率：${val1}% &nbsp;&nbsp;&nbsp;&nbsp;  箱壳库存占用率${val2}%`
         $('#occupancy').html(html)
     }
     const planWorkOrderColumns = [

From 495bbfd602b55d7175e15ca8d4eba376669037b2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Wed, 20 Jul 2022 13:38:50 +0800
Subject: [PATCH 3/3] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-admin/src/main/resources/templates/broad/box.html | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/ruoyi-admin/src/main/resources/templates/broad/box.html b/ruoyi-admin/src/main/resources/templates/broad/box.html
index 3fbe1b0..61e8b29 100644
--- a/ruoyi-admin/src/main/resources/templates/broad/box.html
+++ b/ruoyi-admin/src/main/resources/templates/broad/box.html
@@ -18,6 +18,9 @@
 
     <style>
 
+        .hide-scrollbar .autoscroll-table td:nth-child(6n + 2){
+            text-align: left;
+        }
         .mid {
             background: url(../img/mid.png) no-repeat;
             background-size: 100% 100%;
@@ -368,7 +371,7 @@
         $('#occupancy').html(html)
     }
     const planWorkOrderColumns = [
-        "序号", "型号","计划数量", "完成数量", "完成率", "时间",
+        "序号", "型号","计划数量", "完成数量", "生产进度", "开始时间",
     ]
     const planWorkOrderTable = new AutoScrollTable(document.getElementById("plan-work-order"), planWorkOrderColumns, {width: ['10%','40%', '10%', '10%', '10%', '20%']})
     // const planTable = new AutoScrollTable(document.getElementById("plan-table"), [], {