fix: go back to scroll position when go back to list

frontend/src/components/ListViews/CallLogsListView.vue

@@ -12,7 +12,7 @@
     row-key="name"
   >
     <ListHeader class="mx-5" />
-    <ListRows>
+    <ListRows id="list-rows">
       <ListRow
         class="mx-5"
         v-for="row in rows"

frontend/src/components/ListViews/ContactsListView.vue

@@ -13,7 +13,7 @@
     row-key="name"
   >
     <ListHeader class="mx-5" />
-    <ListRows>
+    <ListRows id="list-rows">
       <ListRow
         class="mx-5"
         v-for="row in rows"

frontend/src/components/ListViews/DealsListView.vue

@@ -10,7 +10,7 @@
     row-key="name"
   >
     <ListHeader class="mx-5" />
-    <ListRows>
+    <ListRows id="list-rows">
       <ListRow
         class="mx-5"
         v-for="row in rows"

frontend/src/components/ListViews/LeadsListView.vue

@@ -10,7 +10,7 @@
     row-key="name"
   >
     <ListHeader class="mx-5" />
-    <ListRows>
+    <ListRows id="list-rows">
       <ListRow
         class="mx-5"
         v-for="row in rows"

frontend/src/components/ListViews/OrganizationsListView.vue

@@ -12,7 +12,7 @@
     row-key="name"
   >
     <ListHeader class="mx-5" />
-    <ListRows>
+    <ListRows id="list-rows">
       <ListRow
         class="mx-5"
         v-for="row in rows"

frontend/src/router.js

@@ -12,6 +12,7 @@ const routes = [
     path: '/leads',
     name: 'Leads',
     component: () => import('@/pages/Leads.vue'),
+    meta: { scrollPos: { top: 0, left: 0 } },
   },
   {
     path: '/leads/:leadId',
@@ -23,6 +24,7 @@ const routes = [
     path: '/deals',
     name: 'Deals',
     component: () => import('@/pages/Deals.vue'),
+    meta: { scrollPos: { top: 0, left: 0 } },
   },
   {
     path: '/deals/:dealId',
@@ -39,6 +41,7 @@ const routes = [
     path: '/contacts',
     name: 'Contacts',
     component: () => import('@/pages/Contacts.vue'),
+    meta: { scrollPos: { top: 0, left: 0 } },
   },
   {
     path: '/contacts/:contactId',
@@ -50,6 +53,7 @@ const routes = [
     path: '/organizations',
     name: 'Organizations',
     component: () => import('@/pages/Organizations.vue'),
+    meta: { scrollPos: { top: 0, left: 0 } },
   },
   {
     path: '/organizations/:organizationId',
@@ -61,6 +65,7 @@ const routes = [
     path: '/call-logs',
     name: 'Call Logs',
     component: () => import('@/pages/CallLogs.vue'),
+    meta: { scrollPos: { top: 0, left: 0 } },
   },
   {
     path: '/call-logs/:callLogId',
@@ -85,9 +90,29 @@ const routes = [
   },
 ]
 
+const scrollBehavior = (to, from, savedPosition) => {
+  if (to.name === from.name) {
+    to.meta?.scrollPos && (to.meta.scrollPos.top = 0)
+    return { left: 0, top: 0 }
+  }
+  const scrollpos = to.meta?.scrollPos || { left: 0, top: 0 }
+
+  if (scrollpos.top > 0) {
+    setTimeout(() => {
+      let el = document.querySelector('#list-rows')
+      el.scrollTo({
+        top: scrollpos.top,
+        left: scrollpos.left,
+        behavior: 'smooth',
+      })
+    }, 300)
+  }
+}
+
 let router = createRouter({
   history: createWebHistory('/crm'),
   routes,
+  scrollBehavior,
 })
 
 router.beforeEach(async (to, from, next) => {
@@ -97,11 +122,18 @@ router.beforeEach(async (to, from, next) => {
 
   await users.promise
 
+  if (from.meta?.scrollPos) {
+    from.meta.scrollPos.top = document.querySelector('#list-rows')?.scrollTop
+  }
+
   if (to.path === '/') {
     const defaultView = getDefaultView()
     if (defaultView?.route_name) {
       if (defaultView.is_view) {
-        next({ name: defaultView.route_name, query: { view: defaultView.name } })
+        next({
+          name: defaultView.route_name,
+          query: { view: defaultView.name },
+        })
       } else {
         next({ name: defaultView.route_name })
       }