feat: Load only visible timeseries (#62)

flxdot · May 8, 2024 · 7aa2899 · 7aa2899
1 parent 7046d85
commit 7aa2899
Showing 1 changed file with 9 additions and 3 deletions.
diff --git a/services/frontend/src/pages/devices/devices-detail.vue b/services/frontend/src/pages/devices/devices-detail.vue
@@ -62,14 +62,19 @@
         :duration="timeRange"
       />
     </div>
-    <prm-accordion>
+    <prm-accordion
+      :multiple="true"
+      :active-index="activeHiddenDrivers"
+    >
       <prm-accordion-tab
-        v-for="driver in deviceDriver?.filter((d) => !d.isVisibleOnDashboard) || []"
+        v-for="(driver, index) in deviceDriver?.filter((d) => !d.isVisibleOnDashboard) || []"
         :key="driver.driverIdentifier"
         :header="driver.displayName"
       >
         <driver-timeseries
-          v-if="deviceSignals !== undefined && deviceSignals.get(driver.driverIdentifier) !== undefined"
+          v-if="deviceSignals !== undefined
+            && deviceSignals.get(driver.driverIdentifier) !== undefined
+            && activeHiddenDrivers.includes(index)"
           :driver="driver"
           :signal-list="deviceSignals.get(driver.driverIdentifier) || []"
           :duration="timeRange"
@@ -130,6 +135,7 @@ const deviceDriver = ref<TGetDeviceDriversResponse | undefined>();
 const deviceSignals = reactive<Map<string, TGetDeviceDriversSignalsResponse | undefined>>(new Map());
 
 const timeRange = ref<Duration>(dayjs.duration(7, 'days'));
+const activeHiddenDrivers = ref<number[]>([]);
 
 function updateDevice() {
   getDeviceDetail(