fix: change tab via url

frontend/src/components/Activities.vue

@@ -950,6 +950,10 @@ const props = defineProps({
     type: String,
     default: 'CRM Lead',
   },
+  tabs: {
+    type: Array,
+    default: () => [],
+  },
 })
 
 const doc = defineModel()
@@ -1078,7 +1082,7 @@ const defaultActions = computed(() => {
     {
       icon: h(WhatsAppIcon, { class: 'h-4 w-4' }),
       label: __('New WhatsApp Message'),
-      onClick: () => (tabIndex.value = 5),
+      onClick: () => (tabIndex.value = getTabIndex('WhatsApp')),
       condition: () => whatsappEnabled.value,
     },
   ]
@@ -1354,6 +1358,10 @@ function scroll(hash) {
   }, 500)
 }
 
+function getTabIndex(name) {
+  return props.tabs.findIndex((tab) => tab.name === name)
+}
+
 defineExpose({ emailBox })
 
 const route = useRoute()

frontend/src/pages/Lead.vue

@@ -45,6 +45,7 @@
         ref="activities"
         doctype="CRM Lead"
         :title="tab.name"
+        :tabs="tabs"
         v-model:reload="reload"
         v-model:tabIndex="tabIndex"
         v-model="lead"
@@ -304,13 +305,14 @@ import {
   Breadcrumbs,
   call,
 } from 'frappe-ui'
-import { ref, computed, onMounted } from 'vue'
-import { useRouter } from 'vue-router'
+import { ref, computed, onMounted, watch } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
 
 const { $dialog, makeCall } = globalStore()
 const { getContactByName, contacts } = contactsStore()
 const { organizations } = organizationsStore()
 const { statusOptions, getLeadStatus } = statusesStore()
+const route = useRoute()
 const router = useRouter()
 
 const props = defineProps({
@@ -449,6 +451,17 @@ const tabs = computed(() => {
   return tabOptions.filter((tab) => (tab.condition ? tab.condition() : true))
 })
 
+watch(tabs, (value) => {
+  if (value && route.params.tabName) {
+    let index = value.findIndex(
+      (tab) => tab.name.toLowerCase() === route.params.tabName.toLowerCase()
+    )
+    if (index !== -1) {
+      tabIndex.value = index
+    }
+  }
+})
+
 function validateFile(file) {
   let extn = file.name.split('.').pop().toLowerCase()
   if (!['png', 'jpg', 'jpeg'].includes(extn)) {

frontend/src/router.js

@@ -15,7 +15,7 @@ const routes = [
     meta: { scrollPos: { top: 0, left: 0 } },
   },
   {
-    path: '/leads/:leadId',
+    path: '/leads/:leadId/:tabName?',
     name: 'Lead',
     component: () => import('@/pages/Lead.vue'),
     props: true,
@@ -27,7 +27,7 @@ const routes = [
     meta: { scrollPos: { top: 0, left: 0 } },
   },
   {
-    path: '/deals/:dealId',
+    path: '/deals/:dealId/:tabName?',
     name: 'Deal',
     component: () => import('@/pages/Deal.vue'),
     props: true,