修改界面

ruoyi-admin/src/main/resources/templates/broad/fp.html

@@ -24,7 +24,7 @@
         height: 20%;
         top: 14.85%;
         left: 3.4%;
-        /*font-size: 12%;*/
+        font-size: 8%;
         /*padding-left: 1%;
         padding-top: 0.7%;*/
     }
@@ -226,8 +226,10 @@
 -->
 
 <!--订单执行-->
+<div class="topLeftDiv" id="topLeftDiv">
     <div id="top-left">
     </div>
+</div>
 
 <!--生产统计-->
 <div id="mid-left">
@@ -420,9 +422,9 @@
         "差异数",
         "执行进度"
     ];
-    const orderInf = new AutoScrollTable(document.getElementById("top-left"), orderInfColumns, {
-        width: ['30%', '14.5%', '14.5%', '14.5%', '14.5%']
-    })
+    // const orderInf = new AutoScrollTable(document.getElementById("top-left"), orderInfColumns, {
+    //     width: ['30%', '14.5%', '14.5%', '14.5%', '14.5%']
+    // })
 
     let selectors = []
     let tmp = []
@@ -474,9 +476,46 @@
         })
         // 订单执行 + 生产统计
         autoUpdate('/broad/fp/selectOrderExecutionPlan', INTERVAL, data => {
-            orderInf.loadData(data.map(value => [value.name, value.plan_number, value.actual_number, value.plan_number - value.actual_number, `${value.rate == 0 ? value.rate : value.rate + '%'}`]), Object.keys(orderInfColumns))
+
+            const tableFun = () => {
+                const tableRes = {
+                    data: data.map(value => [value.name, value.plan_number, value.actual_number, value.plan_number - value.actual_number, `${value.rate == 0 ? value.rate : value.rate + '%'}`]),
+                    header: [
+                        "型号",
+                        "计划数",
+                        "完成数",
+                        "差异数",
+                        "执行进度"
+                    ]
+                }
+                const getTable = () => {
+                    $('#top-left').remove()
+                    $('.topLeftDiv').html('<div class="top-left" id="top-left"></div>')
+                    dynamicTable({
+                        el: '#top-left',
+                        rowNum: 4,
+                        timeout: 0,
+                        header: tableRes.header,
+                        data: tableRes.data,
+                        index: false,
+                        fontColor: '#B4B7BF ',
+                        indexBGC: '#86F3FF',
+                        headerBGC: 'rgba(8,36,75,0.2)',
+                        oddRowBGC: 'rgba(8,36,75,0.2)',
+                        evenRowBGC: 'rgba(8,36,75,0.2)',
+                        colWidth: ['30%', '14%', '15%', '14%', '15%']
+                    });
+                }
+                getTable()
+                setInterval(() => {
+                    getTable()
+                }, 10000);
+            }
+            tableFun()
+            // orderInf.loadData(data.map(value => [value.name, value.plan_number, value.actual_number, value.plan_number - value.actual_number, `${value.rate == 0 ? value.rate : value.rate + '%'}`]), Object.keys(orderInfColumns))
 
         })
+        tableAnimation('#top-left')
         autoUpdate('/broad/fp/selectOrderExecution', INTERVAL, data => {
             modelChart.setOption({
                 xAxis: {
@@ -780,7 +819,7 @@
     })
 
     function resize() {
-        orderInf.resize()
+        // orderInf.resize()
         // planInfo.resize()
         // planInfo2.resize()
         modelChart.resize()