From 5463c8aec08dfa07a01f95646e44a3b4bee070fe Mon Sep 17 00:00:00 2001
From: Vitalii Lysak <v.lysak@dunice.net>
Date: Fri, 26 Aug 2022 14:50:55 +0300
Subject: optimization for dynamic

---
 src/views/_sila/Power/Dynamic/CurrentInput.vue     | 13 +++++---
 src/views/_sila/Power/Dynamic/CurrentOutput.vue    | 13 +++++++-
 src/views/_sila/Power/Dynamic/PowerDynamicPage.vue | 38 ++++++++++++----------
 src/views/_sila/Power/Dynamic/PowerInput.vue       | 13 +++++---
 src/views/_sila/Power/Dynamic/PowerOutput.vue      | 12 ++++++-
 src/views/_sila/Power/Dynamic/PowerTemp.vue        | 14 ++++++--
 src/views/_sila/Power/Dynamic/VoltInput.vue        | 13 +++++---
 src/views/_sila/Power/Dynamic/VoltOutput.vue       | 14 +++++---
 8 files changed, 91 insertions(+), 39 deletions(-)

(limited to 'src/views/_sila/Power/Dynamic')

diff --git a/src/views/_sila/Power/Dynamic/CurrentInput.vue b/src/views/_sila/Power/Dynamic/CurrentInput.vue
index dace6a82..34e2c166 100644
--- a/src/views/_sila/Power/Dynamic/CurrentInput.vue
+++ b/src/views/_sila/Power/Dynamic/CurrentInput.vue
@@ -108,6 +108,7 @@ export default {
       warning: Infinity,
       shutdown: Infinity,
       isBusy: true,
+      opened: false,
       fields: [
         {
           key: 'name',
@@ -162,26 +163,30 @@ export default {
   },
   watch: {
     timeScale() {
+      if (!this.opened) {
+        return;
+      }
+
       this.loadData();
     },
   },
-  created() {
-    this.loadData();
-  },
   methods: {
     onOpened(state) {
       if (state) {
         this.loadData();
       }
+      this.opened = state;
     },
     loadData() {
       let payload = { metricsName: 'psu_current', lastHour: false };
       if (this.timeScale === 'hour') {
         payload.lastHour = true;
       }
+
+      this.$root.$emit('psu-current-input', true);
       this.startLoader();
       this.$store.dispatch('powerSupply/getPsu', payload).finally(() => {
-        this.$root.$emit('psu-current');
+        this.$root.$emit('psu-current-output', false);
         this.isBusy = false;
         this.endLoader();
       });
diff --git a/src/views/_sila/Power/Dynamic/CurrentOutput.vue b/src/views/_sila/Power/Dynamic/CurrentOutput.vue
index d796b3e7..a51c1fe6 100644
--- a/src/views/_sila/Power/Dynamic/CurrentOutput.vue
+++ b/src/views/_sila/Power/Dynamic/CurrentOutput.vue
@@ -108,6 +108,7 @@ export default {
       warning: Infinity,
       shutdown: Infinity,
       isBusy: true,
+      opened: false,
       fields: [
         {
           key: 'name',
@@ -162,6 +163,13 @@ export default {
     },
   },
   watch: {
+    timeScale() {
+      if (!this.opened) {
+        return;
+      }
+
+      this.loadData();
+    },
     items() {
       this.items.length ? (this.isBusy = false) : (this.isBusy = true);
     },
@@ -171,15 +179,18 @@ export default {
       if (state) {
         this.loadData();
       }
+      this.opened = state;
     },
     loadData() {
       let payload = { metricsName: 'psu_current', lastHour: false };
       if (this.timeScale === 'hour') {
         payload.lastHour = true;
       }
+
+      this.$root.$emit('psu-current-output', true);
       this.startLoader();
       this.$store.dispatch('powerSupply/getPsu', payload).finally(() => {
-        this.$root.$emit('psu-current');
+        this.$root.$emit('psu-current-output', false);
         this.isBusy = false;
         this.endLoader();
       });
diff --git a/src/views/_sila/Power/Dynamic/PowerDynamicPage.vue b/src/views/_sila/Power/Dynamic/PowerDynamicPage.vue
index 45e7eaf9..6a3c3433 100644
--- a/src/views/_sila/Power/Dynamic/PowerDynamicPage.vue
+++ b/src/views/_sila/Power/Dynamic/PowerDynamicPage.vue
@@ -1,7 +1,11 @@
 <template>
   <b-container fluid="xl">
     <page-title :description="$t('appPageTitle.dynamicInformation')" />
-    <table-date-picker :time-scale="timeScale" @changePeriod="onChangePeriod" />
+    <table-date-picker
+      :class="{ disabledDiv: loading }"
+      :time-scale="timeScale"
+      @changePeriod="onChangePeriod"
+    />
     <power-temp :time-scale="timeScale"></power-temp>
     <volt-input :time-scale="timeScale"></volt-input>
     <volt-output :time-scale="timeScale"></volt-output>
@@ -16,7 +20,9 @@ import PageTitle from '@/components/_sila/Global/PageTitle';
 
 import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin';
 import TableDatePicker from '@/components/_sila/Global/TableDatePicker';
-import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin';
+import LoadingBarMixin, {
+  loading,
+} from '@/components/_sila/Mixins/LoadingBarMixin';
 import TableFilterMixin from '@/components/_sila/Mixins/TableFilterMixin';
 
 import PowerTemp from './PowerTemp';
@@ -42,6 +48,7 @@ export default {
   mixins: [DataFormatterMixin, LoadingBarMixin, TableFilterMixin],
   data() {
     return {
+      loading,
       timeScale: 'hour',
     };
   },
@@ -55,6 +62,7 @@ export default {
       if (!resetButton) {
         return;
       }
+
       resetButton.dispatchEvent(new Event('click'));
     },
 
@@ -65,23 +73,19 @@ export default {
     },
     startProgress() {
       this.startLoader();
-      const psuTemp = new Promise((resolve) => {
-        this.$root.$on('psu-temp', () => resolve());
-      });
-      const psuVolt = new Promise((resolve) => {
-        this.$root.$on('psu-volt', () => resolve());
-      });
-      const psuPower = new Promise((resolve) => {
-        this.$root.$on('psu-power', () => resolve());
-      });
-      const psuCurrent = new Promise((resolve) => {
-        this.$root.$on('psu-current', () => resolve());
-      });
-
-      Promise.all([psuTemp, psuVolt, psuPower, psuCurrent]).finally(() =>
-        this.endLoader()
+      this.$root.$on('psu-temp', (loading) => this.onLoading(loading));
+      this.$root.$on('psu-volt-input', (loading) => this.onLoading(loading));
+      this.$root.$on('psu-volt-output', (loading) => this.onLoading(loading));
+      this.$root.$on('psu-power-input', (loading) => this.onLoading(loading));
+      this.$root.$on('psu-power-output', (loading) => this.onLoading(loading));
+      this.$root.$on('psu-current-input', (loading) => this.onLoading(loading));
+      this.$root.$on('psu-current-output', (loading) =>
+        this.onLoading(loading)
       );
     },
+    onLoading(loading) {
+      loading ? this.startLoader() : this.endLoader();
+    },
   },
 };
 </script>
diff --git a/src/views/_sila/Power/Dynamic/PowerInput.vue b/src/views/_sila/Power/Dynamic/PowerInput.vue
index 676f236c..bfbf9953 100644
--- a/src/views/_sila/Power/Dynamic/PowerInput.vue
+++ b/src/views/_sila/Power/Dynamic/PowerInput.vue
@@ -107,6 +107,7 @@ export default {
       warning: Infinity,
       shutdown: Infinity,
       isBusy: true,
+      opened: false,
       fields: [
         {
           key: 'name',
@@ -162,17 +163,19 @@ export default {
   },
   watch: {
     timeScale() {
+      if (!this.opened) {
+        return;
+      }
+
       this.loadData();
     },
   },
-  created() {
-    this.loadData();
-  },
   methods: {
     onOpened(state) {
       if (state) {
         this.loadData();
       }
+      this.opened = state;
     },
 
     loadData() {
@@ -180,9 +183,11 @@ export default {
       if (this.timeScale === 'hour') {
         payload.lastHour = true;
       }
+
+      this.$root.$emit('psu-power-input', true);
       this.startLoader();
       this.$store.dispatch('powerSupply/getPsu', payload).finally(() => {
-        this.$root.$emit('psu-power');
+        this.$root.$emit('psu-power-input', false);
         this.isBusy = false;
         this.endLoader();
       });
diff --git a/src/views/_sila/Power/Dynamic/PowerOutput.vue b/src/views/_sila/Power/Dynamic/PowerOutput.vue
index 851606d1..842cdd59 100644
--- a/src/views/_sila/Power/Dynamic/PowerOutput.vue
+++ b/src/views/_sila/Power/Dynamic/PowerOutput.vue
@@ -107,6 +107,7 @@ export default {
       warning: Infinity,
       shutdown: Infinity,
       isBusy: true,
+      opened: false,
       fields: [
         {
           key: 'name',
@@ -161,6 +162,13 @@ export default {
     },
   },
   watch: {
+    timeScale() {
+      if (!this.opened) {
+        return;
+      }
+
+      this.loadData();
+    },
     items() {
       this.items.length ? (this.isBusy = false) : (this.isBusy = true);
     },
@@ -170,6 +178,7 @@ export default {
       if (state) {
         this.loadData();
       }
+      this.opened = state;
     },
 
     loadData() {
@@ -178,9 +187,10 @@ export default {
         payload.lastHour = true;
       }
 
+      this.$root.$emit('psu-power-output', true);
       this.startLoader();
       this.$store.dispatch('powerSupply/getPsu', payload).finally(() => {
-        this.$root.$emit('psu-power');
+        this.$root.$emit('psu-power-output', false);
         this.isBusy = false;
         this.endLoader();
       });
diff --git a/src/views/_sila/Power/Dynamic/PowerTemp.vue b/src/views/_sila/Power/Dynamic/PowerTemp.vue
index 89799c5a..1a8a4b58 100644
--- a/src/views/_sila/Power/Dynamic/PowerTemp.vue
+++ b/src/views/_sila/Power/Dynamic/PowerTemp.vue
@@ -1,7 +1,9 @@
 <template>
   <collapse
     id="collapse_psuTempp"
+    :class="{ disabledDiv: loading && opened }"
     :title="$t('pagePowerSup.temperature')"
+    :opened="true"
     @opened="onOpened"
   >
     <template #image>
@@ -147,6 +149,7 @@ export default {
       warning: null,
       critical: null,
       isBusy: true,
+      opened: false,
       fields: [
         {
           key: 'name',
@@ -244,12 +247,14 @@ export default {
   },
   watch: {
     timeScale() {
+      if (!this.opened) {
+        return;
+      }
+
       this.loadData();
     },
   },
-  created() {
-    this.loadData();
-  },
+
   methods: {
     saveLimit() {
       this.$v.$touch();
@@ -269,17 +274,20 @@ export default {
       if (state) {
         this.loadData();
       }
+      this.opened = state;
     },
     loadData() {
       let payload = { metricsName: 'psu_temp', lastHour: false };
       if (this.timeScale === 'hour') {
         payload.lastHour = true;
       }
+      this.$root.$emit('psu-temp', true);
       this.startLoader();
       this.$store.dispatch('powerSupply/getPsu', payload).finally(() => {
         this.$store.dispatch('powerSupply/getLimitsTemp').finally(() => {
           this.warning = this.warningLimit;
           this.critical = this.criticalLimit;
+          this.$root.$emit('psu-temp', false);
           this.endLoader();
           this.isBusy = false;
         });
diff --git a/src/views/_sila/Power/Dynamic/VoltInput.vue b/src/views/_sila/Power/Dynamic/VoltInput.vue
index 6baf5e47..7012f11b 100644
--- a/src/views/_sila/Power/Dynamic/VoltInput.vue
+++ b/src/views/_sila/Power/Dynamic/VoltInput.vue
@@ -1,6 +1,7 @@
 <template>
   <collapse
     id="collapse_InputVolt"
+    :class="{ disabledDiv: loading && opened }"
     :title="$t('pagePowerSup.InputVolt')"
     @opened="onOpened"
   >
@@ -147,6 +148,7 @@ export default {
       warning: null,
       critical: null,
       isBusy: true,
+      opened: false,
       fields: [
         {
           key: 'name',
@@ -246,12 +248,13 @@ export default {
   },
   watch: {
     timeScale() {
+      if (!this.opened) {
+        return;
+      }
+
       this.loadData();
     },
   },
-  created() {
-    this.loadData();
-  },
   methods: {
     saveLimit() {
       this.$v.$touch();
@@ -271,6 +274,7 @@ export default {
       if (state) {
         this.loadData();
       }
+      this.opened = state;
     },
     loadData() {
       let payload = { metricsName: 'psu_voltage', lastHour: false };
@@ -278,12 +282,13 @@ export default {
         payload.lastHour = true;
       }
 
+      this.$root.$emit('psu-volt-input', true);
       this.startLoader();
       this.$store.dispatch('powerSupply/getPsu', payload).finally(() => {
         this.$store.dispatch('powerSupply/getLimitsVol').finally(() => {
           this.warning = this.warningLimit;
           this.critical = this.criticalLimit;
-          this.$root.$emit('psu-volt');
+          this.$root.$emit('psu-volt-input', false);
           this.endLoader();
           this.isBusy = false;
         });
diff --git a/src/views/_sila/Power/Dynamic/VoltOutput.vue b/src/views/_sila/Power/Dynamic/VoltOutput.vue
index c31e89a8..c5de746f 100644
--- a/src/views/_sila/Power/Dynamic/VoltOutput.vue
+++ b/src/views/_sila/Power/Dynamic/VoltOutput.vue
@@ -1,6 +1,7 @@
 <template>
   <collapse
     id="collapse_OutputVolt"
+    :class="{ disabledDiv: loading && opened }"
     :title="$t('pagePowerSup.OutputVolt')"
     @opened="onOpened"
   >
@@ -147,6 +148,7 @@ export default {
       warning: null,
       critical: null,
       isBusy: true,
+      opened: false,
       fields: [
         {
           key: 'name',
@@ -260,14 +262,14 @@ export default {
     },
 
     timeScale() {
+      if (!this.opened) {
+        return;
+      }
+
       this.loadData();
     },
   },
 
-  /*created() {
-    this.loadData();
-  },*/
-
   methods: {
     saveLimit() {
       this.$v.$touch();
@@ -288,6 +290,7 @@ export default {
       if (state) {
         this.loadData();
       }
+      this.opened = state;
     },
     loadData() {
       let payload = { metricsName: 'psu_voltage', lastHour: false };
@@ -295,12 +298,13 @@ export default {
         payload.lastHour = true;
       }
 
+      this.$root.$emit('psu-volt-input', true);
       this.startLoader();
       this.$store.dispatch('powerSupply/getPsu', payload).finally(() => {
         this.$store.dispatch('powerSupply/getLimitsVol').finally(() => {
           this.warning = this.warningLimit;
           this.critical = this.criticalLimit;
-          this.$root.$emit('psu-volt');
+          this.$root.$emit('psu-volt-output', false);
           this.isBusy = false;
           this.endLoader();
         });
-- 
cgit v1.2.3