From 123868ba8a471efd38402f5eee06098c1712048a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Tue, 23 Jul 2024 13:57:02 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=88=86=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../resources/templates/board/board1.html     |   2 +-
 .../resources/templates/board/board3.html     | 127 +++++++++++++++---
 2 files changed, 106 insertions(+), 23 deletions(-)

diff --git a/haiwei-admin/src/main/resources/templates/board/board1.html b/haiwei-admin/src/main/resources/templates/board/board1.html
index 2878883..d6a6d30 100644
--- a/haiwei-admin/src/main/resources/templates/board/board1.html
+++ b/haiwei-admin/src/main/resources/templates/board/board1.html
@@ -145,7 +145,7 @@
             '<input type="checkbox" checked onchange="tableHeadChange(\'一体机A机头温度\',this)"/> 一体机A机头温度',
             '<input type="checkbox" checked onchange="tableHeadChange(\'一体机A切刀电流\',this)"/> 一体机A切刀电流',
             '<input type="checkbox" checked onchange="tableHeadChange(\'一体机A切刀转速\',this)"/> 一体机A切刀转速'],
-          data: data.map((val, i) => [i, val.recordTime, val['speedA'],
+          data: data.map((val, i) => [i+1, val.recordTime, val['speedA'],
             val['currentA'], val['pressureHead'], val['tempHead'], val['currentCutter'], val['speedCutter']]),
           index: true,
           fontColor: '#03BCD4',
diff --git a/haiwei-admin/src/main/resources/templates/board/board3.html b/haiwei-admin/src/main/resources/templates/board/board3.html
index 99c9254..19a6c9f 100644
--- a/haiwei-admin/src/main/resources/templates/board/board3.html
+++ b/haiwei-admin/src/main/resources/templates/board/board3.html
@@ -12,6 +12,9 @@
 <script src="../../js/tableAnimation.js"></script>
 <script>
 
+  let pageSize = 10
+  let pageNum = 1
+  let pagesNum = 0
   let status = {
     rightInfoS: false,
     bottomBtn1S: false,
@@ -79,6 +82,10 @@
         $(el).css({
           backgroundImage: status.bottomBtn2S ? 'url("../../board/img/btn1bg.png")' : 'url("../../board/img/btnbg.png")'
         })
+        pageSize = 10
+        pageNum = 1
+        pagesNum = 0
+        $("#chart2").empty()
         break
 
       case 3:
@@ -104,25 +111,18 @@
         $('#chart1').remove()
         $("#modal1 .centerModal .centerModalInfo").append('<div class="chart1" id="chart1"></div>')
         chart = null
-        chart1(document.getElementById('chart1'), e.data)
+        chart1(document.getElementById('chart1'), data)
       } else {
         $("#chart1").html(`<div style="width: 100%;height: 100%;text-align: center;line-height:35vw;color: #fff ">暂无数据</div>`)
       }
     })
   }
-  const Modal2Search = () => {
-    let params = {}
-    params.timeInterval=$('#timeInterval').val();
-    if ($('#startTime2').val()) {
-      params.beginTime = new Date($('#startTime2').val())
-    }
-    if ($('#endTime2').val()) {
-      params.endTime = new Date($('#endTime2').val())
-    }
-    console.log(params)
-    $.get(ctx + 'broad/home/queryParamDataB', params, (e) => {
+  const Modal2SearchReq = async (params) => {
+    await $.get(ctx + 'broad/home/queryParamDataB', {...params,pageSize,pageNum}, (e) => {
+      pagesNum = Math.ceil(e.total / 10)
+      let data = e.rows
       $("#chart2").empty()
-      tableHeadChangeArr =[
+      tableHeadChangeArr = [
         "采集时间",
         "一体机B转速",
         "一体机B电流",
@@ -131,7 +131,7 @@
         "一体机B切刀电流",
         "一体机B切刀转速"
       ]
-      if (e.data.length > 0) {
+      if (data.length > 0) {
         dynamicTable({
           el: '#chart2',
           rowNum: 10,
@@ -143,19 +143,98 @@
             '<input type="checkbox" checked onchange="tableHeadChange(\'一体机B机头温度\',this)"/> 一体机B机头温度',
             '<input type="checkbox" checked onchange="tableHeadChange(\'一体机B切刀电流\',this)"/> 一体机B切刀电流',
             '<input type="checkbox" checked onchange="tableHeadChange(\'一体机B切刀转速\',this)"/> 一体机B切刀转速'],
-          data: e.data.map((val, i) => [i, val.time, val['一体机B转速'],
-            val['一体机B电流'], val['一体机B机头压力'], val['一体机B机头温度'], val['一体机B切刀电流'], val['一体机B切刀转速']]),
+          data: data.map((val, i) => [i+1, val.recordTime, val['speedA'],
+            val['currentA'], val['pressureHead'], val['tempHead'], val['currentCutter'], val['speedCutter']]),
           index: true,
           fontColor: '#03BCD4 ',
           indexBGC: '#86F3FF',
           headerBGC: '#092A77',
           oddRowBGC: '#092A77',
           evenRowBGC: '#092A77',
+        });
+        $("#Pagination").empty()
+        $("#Pagination").append(`
+            <li onclick="pre()">
+              <a aria-label="Previous" href="#">
+                <span aria-hidden="true">&laquo;</span>
+              </a>
+            </li>
+          `)
+        new Array(Math.ceil(e.total / 10)).fill(1).map((i,k)=>{
+          $("#Pagination").append(`
+          <li  pageId="${k+1}" class="page" onclick="pageClick(this,${k+1})"><a href="#">${k+1}</a></li>
+          `)
         })
+        $("#Pagination").append(`
+            <li onclick="Next()">
+              <a aria-label="Next" href="#">
+                <span aria-hidden="true">&raquo;</span>
+              </a>
+            </li>
+          `)
       } else {
         $("#chart2").html(`<div style="width: 100%;height: 100%;text-align: center;line-height:35vw;color: #fff ">暂无数据</div>`)
       }
     })
+
+  }
+  const Modal2Search = async () => {
+    let params = {}
+    params.timeInterval = $('#timeInterval').val();
+    if ($('#startTime2').val()) {
+      params.beginTime = new Date($('#startTime2').val())
+    }
+    if ($('#endTime2').val()) {
+      params.endTime = new Date($('#endTime2').val())
+    }
+    await Modal2SearchReq(params)
+    $($(".page")[0]).addClass('active')
+    $($(".page")[0]).siblings().removeClass('active')
+    console.log(params)
+  }
+  const pageClick = (e,i) =>{
+    $(e).addClass('active')
+    $(e).siblings().removeClass('active')
+    pageNum = i
+    let params = {}
+    params.timeInterval = $('#timeInterval').val();
+    if ($('#startTime2').val()) {
+      params.beginTime = new Date($('#startTime2').val())
+    }
+    if ($('#endTime2').val()) {
+      params.endTime = new Date($('#endTime2').val())
+    }
+    Modal2SearchReq(params)
+  }
+  const pre = () =>{
+    pageNum -= 1
+    if (pageNum < 1) {
+      pageNum = 1
+    }
+    let params = {}
+    params.timeInterval = $('#timeInterval').val();
+    if ($('#startTime2').val()) {
+      params.beginTime = new Date($('#startTime2').val())
+    }
+    if ($('#endTime2').val()) {
+      params.endTime = new Date($('#endTime2').val())
+    }
+    Modal2SearchReq(params)
+  }
+  const Next = () =>{
+    pageNum += 1
+    if (pageNum > pagesNum) {
+      pageNum = pagesNum
+    }
+    let params = {}
+    params.timeInterval = $('#timeInterval').val();
+    if ($('#startTime2').val()) {
+      params.beginTime = new Date($('#startTime2').val())
+    }
+    if ($('#endTime2').val()) {
+      params.endTime = new Date($('#endTime2').val())
+    }
+    Modal2SearchReq(params)
   }
   const derive = () => {
     let canvasNode = $("#chart1 div canvas")[0]
@@ -168,10 +247,10 @@
   }
   const derive2 = () => {
     let params = {
-      colms:tableHeadChangeArr.toString()
+      colms: tableHeadChangeArr.toString()
     }
 
-    params.timeInterval=$('#timeInterval').val();
+    params.timeInterval = $('#timeInterval').val();
     if ($('#startTime2').val()) {
       params.beginTime = new Date($('#startTime2').val())
     }
@@ -206,7 +285,7 @@
   </div>
   <div id="statusD">
   </div>
-  <div id="centerInfoDiv" class="centerInfoDiv" >
+  <div class="centerInfoDiv" id="centerInfoDiv">
 
   </div>
 
@@ -235,7 +314,7 @@
       <div class="centerModalInfo">
         <div style="display: inline-block">
           <span style="font-size: 1vw;color: #fff">时间间隔:</span>
-          <select id="timeInterval1" class="form-control m-b" style="width: 10vw;height:2vw;display: inline-block"
+          <select class="form-control m-b" id="timeInterval1" style="width: 10vw;height:2vw;display: inline-block"
                   th:with="type=${@dict.getType('time_interval')}">
             <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
           </select>
@@ -281,7 +360,7 @@
           </div>
           <div style="display: inline-block">
             <span style="font-size: 1vw;color: #fff">时间间隔:</span>
-            <select id="timeInterval" class="form-control m-b" style="width: 10vw;height:2vw;display: inline-block"
+            <select class="form-control m-b" id="timeInterval" style="width: 10vw;height:2vw;display: inline-block"
                     th:with="type=${@dict.getType('time_interval')}">
               <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
             </select>
@@ -290,7 +369,11 @@
                   class="fa fa-search"></i>&nbsp;搜索</a>
           <a class="btn btn-warning btn-rounded btn-sm" onclick="derive2()"><i class="fa fa-download"></i>&nbsp;导出</a>
         </div>
-        <div class="chart1" id="chart2" style="position:relative;top:2%;left: 0;height: 92%"></div>
+        <div class="chart1" id="chart2" style="position:relative;top:2%;left: 0;height: 80%"></div>
+        <nav aria-label="Page navigation">
+          <ul class="pagination pagination-lg" id="Pagination">
+          </ul>
+        </nav>
       </div>
     </div>
   </div>