From 3c1f809e9fd8b8a95493eb144fa386868dcaa539 Mon Sep 17 00:00:00 2001
From: Junjie <DELL@qq.com>
Date: 星期三, 03 十二月 2025 13:55:13 +0800
Subject: [PATCH] #

---
 src/main/webapp/components/WatchCrnCard.js |   40 ++++++++++++++++++++++++++++++++++++----
 1 files changed, 36 insertions(+), 4 deletions(-)

diff --git a/src/main/webapp/components/WatchCrnCard.js b/src/main/webapp/components/WatchCrnCard.js
index a394a6e..96a8574 100644
--- a/src/main/webapp/components/WatchCrnCard.js
+++ b/src/main/webapp/components/WatchCrnCard.js
@@ -19,8 +19,9 @@
                 <div style="margin-bottom: 10px;"><el-button @click="controlCommandTaskComplete()" size="mini">浠诲姟瀹屾垚</el-button></div>
             </div>
         </div>
-        <el-collapse v-model="activeNames">
-          <el-collapse-item v-for="(item) in crnList" :name="item.crnNo">
+        <div style="max-height: 55vh; overflow:auto;">
+          <el-collapse v-model="activeNames" accordion>
+            <el-collapse-item v-for="(item) in displayCrnList" :name="item.crnNo">
             <template slot="title">
                 <div style="width: 100%;display: flex;">
                    <div style="width: 50%;">{{ item.crnNo }}鍙峰爢鍨涙満</div>
@@ -55,8 +56,20 @@
                 <el-descriptions-item label="鏁呴殰浠g爜">{{ item.warnCode }}</el-descriptions-item>
                 <el-descriptions-item label="鏁呴殰鎻忚堪">{{ item.alarm }}</el-descriptions-item>
             </el-descriptions>
-          </el-collapse-item>
-        </el-collapse>
+            </el-collapse-item>
+          </el-collapse>
+        </div>
+        <div style="display:flex; justify-content:flex-end; margin-top:8px;">
+          <el-pagination
+            @current-change="handlePageChange"
+            @size-change="handleSizeChange"
+            :current-page="currentPage"
+            :page-size="pageSize"
+            :page-sizes="[10,20,50,100]"
+            layout="total, prev, pager, next"
+            :total="crnList.length">
+          </el-pagination>
+        </div>
     </div>
     `,
   props: ["param"],
@@ -71,6 +84,8 @@
         sourceLocNo: "",
         targetLocNo: "",
       },
+      pageSize: 25,
+      currentPage: 1,
     };
   },
   created() {
@@ -78,11 +93,20 @@
       this.getCrnStateInfo();
     }, 1000);
   },
+  computed: {
+    displayCrnList() {
+      const start = (this.currentPage - 1) * this.pageSize;
+      const end = start + this.pageSize;
+      return this.crnList.slice(start, end);
+    }
+  },
   watch: {
     param: {
       handler(newVal, oldVal) {
         if (newVal.crnNo != 0) {
           this.activeNames = newVal.crnNo;
+          const idx = this.crnList.findIndex(i => i.crnNo == newVal.crnNo);
+          if (idx >= 0) { this.currentPage = Math.floor(idx / this.pageSize) + 1; }
         }
       },
       deep: true, // 娣卞害鐩戝惉宓屽灞炴��
@@ -90,6 +114,13 @@
     },
   },
   methods: {
+    handlePageChange(page) {
+      this.currentPage = page;
+    },
+    handleSizeChange(size) {
+      this.pageSize = size;
+      this.currentPage = 1;
+    },
     getCrnStateInfo() {
       let that = this;
       $.ajax({
@@ -113,6 +144,7 @@
                 }
               });
               that.crnList = tmp;
+              that.currentPage = 1;
             }
           }
         },

--
Gitblit v1.9.1