From 1c4b5aa720463a085ebf41de37593f194d96d947 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Wed, 26 Feb 2025 10:40:06 +0100
Subject: [PATCH 1/3] feat: refs #8242 remove teleport

---
 src/components/common/VnCardBeta.vue | 17 ++++++++++-------
 1 file changed, 10 insertions(+), 7 deletions(-)

diff --git a/src/components/common/VnCardBeta.vue b/src/components/common/VnCardBeta.vue
index 7c82316dc..56b12f67f 100644
--- a/src/components/common/VnCardBeta.vue
+++ b/src/components/common/VnCardBeta.vue
@@ -1,10 +1,9 @@
 <script setup>
 import { onBeforeMount } from 'vue';
-import { useRouter, onBeforeRouteUpdate } from 'vue-router';
+import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave } from 'vue-router';
 import { useArrayData } from 'src/composables/useArrayData';
 import { useStateStore } from 'stores/useStateStore';
 import useCardSize from 'src/composables/useCardSize';
-import LeftMenu from 'components/LeftMenu.vue';
 import VnSubToolbar from '../ui/VnSubToolbar.vue';
 
 const props = defineProps({
@@ -27,7 +26,13 @@ const arrayData = useArrayData(props.dataKey, {
     oneRecord: true,
 });
 
+onBeforeRouteLeave((to, from) => {
+    stateStore.cardDescriptorChangeValue(null);
+});
+
 onBeforeMount(async () => {
+    stateStore.cardDescriptorChangeValue(props.descriptor);
+
     const route = router.currentRoute.value;
     try {
         await fetch(route.params.id);
@@ -39,6 +44,9 @@ onBeforeMount(async () => {
 });
 
 onBeforeRouteUpdate(async (to, from) => {
+    // if (to.matched.length < from.matched.length) {
+    //     stateStore.cardDescriptorChangeValue(null);
+    // }
     if (hasRouteParam(to.params)) {
         const { matched } = router.currentRoute.value;
         const { name } = matched.at(-3);
@@ -62,11 +70,6 @@ function hasRouteParam(params, valueToCheck = ':addressId') {
 }
 </script>
 <template>
-    <Teleport to="#left-panel" v-if="stateStore.isHeaderMounted()">
-        <component :is="descriptor" />
-        <QSeparator />
-        <LeftMenu source="card" />
-    </Teleport>
     <VnSubToolbar />
     <div :class="[useCardSize(), $attrs.class]">
         <RouterView :key="$route.path" />
-- 
2.40.1


From 82faba62ca9b775a2719795645e22826e76ce165 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Wed, 26 Feb 2025 10:40:17 +0100
Subject: [PATCH 2/3] feat: refs #8242 use stateStore

---
 src/components/common/VnModule.vue | 12 +++++++++---
 src/stores/useStateStore.js        |  6 ++++++
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/components/common/VnModule.vue b/src/components/common/VnModule.vue
index 038ee1d60..747a7c951 100644
--- a/src/components/common/VnModule.vue
+++ b/src/components/common/VnModule.vue
@@ -12,7 +12,7 @@ const $props = defineProps({
     },
 });
 onMounted(
-    () => (stateStore.leftDrawer = useQuasar().screen.gt.xs ? $props.leftDrawer : false)
+    () => (stateStore.leftDrawer = useQuasar().screen.gt.xs ? $props.leftDrawer : false),
 );
 
 const teleportRef = ref({});
@@ -35,8 +35,14 @@ onMounted(() => {
 <template>
     <QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
         <QScrollArea class="fit text-grey-8">
-            <div id="left-panel" ref="teleportRef"></div>
-            <LeftMenu v-if="!hasContent" />
+            <div id="left-panel" ref="teleportRef">
+                <template v-if="stateStore.cardDescriptor">
+                    <component :is="stateStore.cardDescriptor" />
+                    <QSeparator />
+                    <LeftMenu source="card" />
+                </template>
+                <template v-else> <LeftMenu /></template>
+            </div>
         </QScrollArea>
     </QDrawer>
     <QPageContainer>
diff --git a/src/stores/useStateStore.js b/src/stores/useStateStore.js
index e48b67279..ca447bc11 100644
--- a/src/stores/useStateStore.js
+++ b/src/stores/useStateStore.js
@@ -7,7 +7,11 @@ export const useStateStore = defineStore('stateStore', () => {
     const rightDrawer = ref(false);
     const rightAdvancedDrawer = ref(false);
     const subToolbar = ref(false);
+    const cardDescriptor = ref(null);
 
+    function cardDescriptorChangeValue(descriptor) {
+        cardDescriptor.value = descriptor;
+    }
     function toggleLeftDrawer() {
         leftDrawer.value = !leftDrawer.value;
     }
@@ -49,6 +53,8 @@ export const useStateStore = defineStore('stateStore', () => {
     }
 
     return {
+        cardDescriptor,
+        cardDescriptorChangeValue,
         leftDrawer,
         rightDrawer,
         rightAdvancedDrawer,
-- 
2.40.1


From 2427fed2e88cde0e9deee47c11d88c68eca97301 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Wed, 26 Feb 2025 11:54:14 +0100
Subject: [PATCH 3/3] fix: refs #8242 workerDepartmentTree bug

---
 src/components/common/VnCardBeta.vue  | 5 +----
 src/pages/Worker/WorkerDepartment.vue | 9 +--------
 2 files changed, 2 insertions(+), 12 deletions(-)

diff --git a/src/components/common/VnCardBeta.vue b/src/components/common/VnCardBeta.vue
index 56b12f67f..620dc2ad2 100644
--- a/src/components/common/VnCardBeta.vue
+++ b/src/components/common/VnCardBeta.vue
@@ -26,7 +26,7 @@ const arrayData = useArrayData(props.dataKey, {
     oneRecord: true,
 });
 
-onBeforeRouteLeave((to, from) => {
+onBeforeRouteLeave(() => {
     stateStore.cardDescriptorChangeValue(null);
 });
 
@@ -44,9 +44,6 @@ onBeforeMount(async () => {
 });
 
 onBeforeRouteUpdate(async (to, from) => {
-    // if (to.matched.length < from.matched.length) {
-    //     stateStore.cardDescriptorChangeValue(null);
-    // }
     if (hasRouteParam(to.params)) {
         const { matched } = router.currentRoute.value;
         const { name } = matched.at(-3);
diff --git a/src/pages/Worker/WorkerDepartment.vue b/src/pages/Worker/WorkerDepartment.vue
index baf6db154..e1411250b 100644
--- a/src/pages/Worker/WorkerDepartment.vue
+++ b/src/pages/Worker/WorkerDepartment.vue
@@ -1,16 +1,9 @@
 <script setup>
-import VnSection from 'src/components/common/VnSection.vue';
 import WorkerDepartmentTree from './WorkerDepartmentTree.vue';
 </script>
 
 <template>
-    <VnSection data-key="WorkerDepartment" :search-bar="false">
-        <template #body>
-            <div class="flex flex-center q-pa-md">
-                <WorkerDepartmentTree />
-            </div>
-        </template>
-    </VnSection>
+    <QPage class="q-pa-md flex justify-center"> <WorkerDepartmentTree /> </QPage>
 </template>
 
 <i18n>
-- 
2.40.1