From a30f8c8696ca204144e0407eec61af64716143c1 Mon Sep 17 00:00:00 2001
From: cagataycivici <cagatay.civici@gmail.com>
Date: Fri, 3 Jul 2020 14:22:58 +0300
Subject: [PATCH] Cleanup subscription

---
 src/views/chart/BarChartDemo.vue       |  3 +++
 src/views/chart/ComboChartDemo.vue     |  3 +++
 src/views/chart/DoughnutChartDemo.vue  |  3 +++
 src/views/chart/LineChartDemo.vue      |  3 +++
 src/views/chart/PieChartDemo.vue       |  3 +++
 src/views/chart/PolarAreaChartDemo.vue |  3 +++
 src/views/chart/RadarChartDemo.vue     |  3 +++
 src/views/tabview/TabViewDemo.vue      | 24 ++++++++++++++++++++----
 8 files changed, 41 insertions(+), 4 deletions(-)

diff --git a/src/views/chart/BarChartDemo.vue b/src/views/chart/BarChartDemo.vue
index b0f6de8e2..98eaaf0c3 100755
--- a/src/views/chart/BarChartDemo.vue
+++ b/src/views/chart/BarChartDemo.vue
@@ -50,6 +50,9 @@ export default {
             this.applyDarkTheme();
         }
     },
+    beforeDestroy() {
+        EventBus.$off('change-theme');
+    },
     data() {
         return {
             basicData: {
diff --git a/src/views/chart/ComboChartDemo.vue b/src/views/chart/ComboChartDemo.vue
index 96d6d43c7..c54ace9f1 100755
--- a/src/views/chart/ComboChartDemo.vue
+++ b/src/views/chart/ComboChartDemo.vue
@@ -34,6 +34,9 @@ export default {
             this.applyDarkTheme();
         }
     },
+    beforeDestroy() {
+        EventBus.$off('change-theme');
+    },
     data() {
         return {
             chartData: {
diff --git a/src/views/chart/DoughnutChartDemo.vue b/src/views/chart/DoughnutChartDemo.vue
index 177f162d0..30a80d35e 100755
--- a/src/views/chart/DoughnutChartDemo.vue
+++ b/src/views/chart/DoughnutChartDemo.vue
@@ -30,6 +30,9 @@ export default {
                 this.chartOptions = this.getLightTheme();
         });
     },
+    beforeDestroy() {
+        EventBus.$off('change-theme');
+    },
     data() {
         return {
             chartData: {
diff --git a/src/views/chart/LineChartDemo.vue b/src/views/chart/LineChartDemo.vue
index 35391f3c9..b4bef666b 100755
--- a/src/views/chart/LineChartDemo.vue
+++ b/src/views/chart/LineChartDemo.vue
@@ -45,6 +45,9 @@ export default {
             this.applyDarkTheme();
         }
     },
+    beforeDestroy() {
+        EventBus.$off('change-theme');
+    },
     data() {
         return {
             basicData: {
diff --git a/src/views/chart/PieChartDemo.vue b/src/views/chart/PieChartDemo.vue
index 59d2c284d..88abf8fc0 100755
--- a/src/views/chart/PieChartDemo.vue
+++ b/src/views/chart/PieChartDemo.vue
@@ -30,6 +30,9 @@ export default {
                 this.chartOptions = this.getLightTheme();
         });
     },
+    beforeDestroy() {
+        EventBus.$off('change-theme');
+    },
     data() {
         return {
             chartData: {
diff --git a/src/views/chart/PolarAreaChartDemo.vue b/src/views/chart/PolarAreaChartDemo.vue
index a3e581c62..22a1f39a9 100755
--- a/src/views/chart/PolarAreaChartDemo.vue
+++ b/src/views/chart/PolarAreaChartDemo.vue
@@ -30,6 +30,9 @@ export default {
                 this.chartOptions = this.getLightTheme();
         });
     },
+    beforeDestroy() {
+        EventBus.$off('change-theme');
+    },
     data() {
         return {
             chartData: {
diff --git a/src/views/chart/RadarChartDemo.vue b/src/views/chart/RadarChartDemo.vue
index cc4435af3..acf4310f1 100755
--- a/src/views/chart/RadarChartDemo.vue
+++ b/src/views/chart/RadarChartDemo.vue
@@ -30,6 +30,9 @@ export default {
                 this.chartOptions = this.getLightTheme();
         });
     },
+    beforeDestroy() {
+        EventBus.$off('change-theme');
+    },
     data() {
         return {
             chartData: {
diff --git a/src/views/tabview/TabViewDemo.vue b/src/views/tabview/TabViewDemo.vue
index 8452fe750..badec11c1 100755
--- a/src/views/tabview/TabViewDemo.vue
+++ b/src/views/tabview/TabViewDemo.vue
@@ -10,7 +10,7 @@
         <div class="content-section implementation">
             <div class="card">
                 <h5>Default</h5>
-                <TabView>
+                <TabView ref="tabview1">
                     <TabPanel header="Header I">
                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
                             ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
@@ -37,7 +37,7 @@
                     <Button @click="activate(2)" class="p-button-text" label="Activate 3rd" />
                 </div>
 
-                <TabView>
+                <TabView ref="tabview2">
                     <TabPanel header="Header I" :active.sync="active[0]">
                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
                             ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
@@ -58,7 +58,7 @@
 
             <div class="card">
                 <h5>Disabled</h5>
-                <TabView>
+                <TabView ref="tabview3">
                     <TabPanel header="Header I">
                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
                             ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
@@ -80,7 +80,7 @@
 
             <div class="card">
                 <h5>Custom Headers</h5>
-                <TabView class="tabview-custom">
+                <TabView class="tabview-custom" ref="tabview4">
                     <TabPanel>
                         <template slot="header">
                             <i class="pi pi-calendar"></i>
@@ -119,6 +119,7 @@
 
 <script>
 import TabViewDoc from './TabViewDoc';
+import EventBus from '@/EventBus';
 
 export default {
     data() {
@@ -126,6 +127,21 @@ export default {
             active: [true, false, false]
         }
     },
+    timeout: null,
+    mounted() {
+        EventBus.$on('change-theme', event => {
+            this.timeout = setTimeout(() => {
+                this.$refs.tabview1.updateInkBar();
+                this.$refs.tabview2.updateInkBar();
+                this.$refs.tabview3.updateInkBar();
+                this.$refs.tabview4.updateInkBar();
+            }, 50);
+        });
+    },
+    beforeDestroy() {
+        clearTimeout(this.timeout);
+        EventBus.$off('change-theme');
+    },
     methods: {
         activate(index) {
             let activeArray = [...this.active];