Kaynağa Gözat

修改首页故障报警 、关键路口数据能够滚动

画安 3 hafta önce
ebeveyn
işleme
0bdf4a94a5
1 değiştirilmiş dosya ile 22 ekleme ve 4 silme
  1. 22 4
      src/views/Home.vue

+ 22 - 4
src/views/Home.vue

@@ -33,8 +33,12 @@
           </PanelContainer>
         </div>
         <div class="panel-item">
-          <PanelContainer title="故障报警">
-            <AlarmMessageList :listData="alarmData" @ignore="onAlarmIgnore" @view="onAlarmView" />
+          <PanelContainer title="故障报警" class="alarm-panel">
+            <SeamlessScroll :data="alarmData" :limit="3" measureSelector=".alarm-list-container">
+              <template #default="{ list }">
+                <AlarmMessageList :listData="list" @ignore="onAlarmIgnore" @view="onAlarmView" />
+              </template>
+            </SeamlessScroll>
           </PanelContainer>
         </div>
       </div>
@@ -85,8 +89,12 @@
         </div>
         <div class="panel-item">
           <PanelContainer title="关键路口" class="table-panel">
-            <TechTable :columns="keyIntersectionColumns" :data="keyIntersectionData" height="263px"
-              @row-click="onIntersectionRowClick" />
+            <SeamlessScroll :data="keyIntersectionData" :limit="4">
+              <template #default="{ list }">
+                <TechTable :columns="keyIntersectionColumns" :data="list"
+                  @row-click="onIntersectionRowClick" />
+              </template>
+            </SeamlessScroll>
           </PanelContainer>
         </div>
       </div>
@@ -291,4 +299,14 @@ export default {
   max-height: none !important;
   overflow: visible !important;
 }
+
+.alarm-panel ::v-deep .alarm-list-container {
+  height: auto !important;
+  overflow: visible !important;
+  padding: 0 15px !important;
+}
+
+.alarm-panel ::v-deep .panel-content {
+  padding: 0;
+}
 </style>