From 98a7a7999c533d54c92af97e4422b5247db2d846 Mon Sep 17 00:00:00 2001
From: Peter Olu <pemeraldy@gmail.com>
Date: Sun, 24 Apr 2022 16:35:40 +0100
Subject: [PATCH] scroll works on other pages

---
 src/components/FullVue.vue           | 13 +++++++++----
 src/views/dashboard/controls/Tab.vue |  2 +-
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/components/FullVue.vue b/src/components/FullVue.vue
index 801ec7d7..28366232 100644
--- a/src/components/FullVue.vue
+++ b/src/components/FullVue.vue
@@ -31,7 +31,7 @@ limitations under the License. -->
   </div>
 </template>
 <script lang="ts">
-import { ref, watch, reactive, defineComponent } from "vue";
+import { ref, watch, onMounted, defineComponent } from "vue";
 import { useI18n } from "vue-i18n";
 import { useRoute } from "vue-router";
 import { useDashboardStore } from "@/store/modules/dashboard";
@@ -50,7 +50,7 @@ export default defineComponent({
   components: { ...Configuration, ...controls },
   setup() {
     const dashboardStore = useDashboardStore();
-    const tobewatched = reactive(dashboardStore);
+    // const tobewatched = reactive(dashboardStore);
     // const appStore = useAppStoreWithOut();
     const { t } = useI18n();
     const p = useRoute().params;
@@ -58,20 +58,22 @@ export default defineComponent({
     // setTemplate();
     const currentItem = ref("");
     watch(
-      () => tobewatched.layout,
+      () => dashboardStore.layout,
       () => {
+        // console.log('Watching:',currentItem.value)
         setTimeout(() => {
           observeItems();
         }, 500);
       }
     );
     function scrollToGraph(e: any) {
+      console.log(currentItem.value)
       document?.getElementById(`item${e}`)?.scrollIntoView();
     }
     function observeItems() {
       const observer = new IntersectionObserver((entries) => {
         entries.forEach((element) => {
-          if (element.intersectionRatio > 0) {
+          if (element.intersectionRatio > 0) {            
             currentItem.value = element.target.id;
           }
         });
@@ -80,6 +82,9 @@ export default defineComponent({
         observer.observe(element);
       });
     }
+    onMounted(()=>{
+      observeItems()
+    })
     return {
       t,
       dashboardStore,
diff --git a/src/views/dashboard/controls/Tab.vue b/src/views/dashboard/controls/Tab.vue
index 64ffa72a..bc49e225 100644
--- a/src/views/dashboard/controls/Tab.vue
+++ b/src/views/dashboard/controls/Tab.vue
@@ -248,7 +248,7 @@ export default defineComponent({
       () => {
         setTimeout(() => {
           observeItems();
-          console.log("Last Value:", lastItem.value);
+          // console.log("Last Value:", lastItem.value);
         }, 500);
       }
     );