1 files changed, 21 insertions, 3 deletions
diff --git a/src/views/_sila/Processors/Dynamic/ProcessorsDynamicPage.vue b/src/views/_sila/Processors/Dynamic/ProcessorsDynamicPage.vue
index ff9feb2e..e92ee8fb 100644
--- a/src/views/_sila/Processors/Dynamic/ProcessorsDynamicPage.vue
+++ b/src/views/_sila/Processors/Dynamic/ProcessorsDynamicPage.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"
+    />
     <cpu-temp :time-scale="timeScale"></cpu-temp>
     <cpu-power :time-scale="timeScale"></cpu-power>
   </b-container>
@@ -11,7 +15,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 CpuPower from './CpuPower';
@@ -27,10 +33,13 @@ export default {
   mixins: [DataFormatterMixin, LoadingBarMixin, TableFilterMixin],
   data() {
     return {
+      loading,
       timeScale: 'hour',
     };
   },
-
+  created() {
+    this.startProgress();
+  },
   methods: {
     resetZoom() {
       const resetButton = document.querySelector('.highcharts-reset-zoom');
@@ -42,8 +51,17 @@ export default {
     },
     onChangePeriod(period) {
       this.timeScale = period;
+      this.startProgress();
       this.resetZoom();
     },
+    startProgress() {
+      this.startLoader();
+      this.$root.$on('cpu-temp', (loading) => this.onLoading(loading));
+      this.$root.$on('cpu-power', (loading) => this.onLoading(loading));
+    },
+    onLoading(loading) {
+      loading ? this.startLoader() : this.endLoader();
+    },
   },
 };
 </script>