From e70adce488fccb4077e2d51dcd9907472d00bef0 Mon Sep 17 00:00:00 2001
From: Jon <jon@verdnatura.es>
Date: Mon, 8 Jul 2024 13:15:14 +0200
Subject: [PATCH 01/17] feat: refs #7323 fix descriptors, added VnTable and
 minor changes

---
 src/components/ui/CardDescriptor.vue          |   2 +-
 src/components/ui/QCalendarMonthWrapper.vue   |  10 +-
 .../Department/Card/DepartmentDescriptor.vue  |   6 +-
 src/pages/Entry/Card/EntryDescriptor.vue      |   1 -
 .../InvoiceOut/Card/InvoiceOutDescriptor.vue  |   2 +-
 src/pages/Route/Card/RouteDescriptor.vue      |   1 -
 .../Shelving/Card/ShelvingDescriptor.vue      |   1 -
 src/pages/Travel/Card/TravelDescriptor.vue    |   1 -
 src/pages/Worker/Card/WorkerDescriptor.vue    |  34 ++++-
 src/pages/Worker/Card/WorkerTimeControl.vue   |   2 +-
 src/pages/Worker/Card/WorkerTimeForm.vue      |  10 +-
 src/pages/Worker/WorkerList.vue               | 141 +++++++++---------
 src/pages/Worker/locale/en.yml                |   5 +
 src/pages/Worker/locale/es.yml                |   5 +
 src/pages/Zone/Card/ZoneDescriptor.vue        |   1 -
 15 files changed, 132 insertions(+), 90 deletions(-)

diff --git a/src/components/ui/CardDescriptor.vue b/src/components/ui/CardDescriptor.vue
index 2bb5234ad..480cf3afb 100644
--- a/src/components/ui/CardDescriptor.vue
+++ b/src/components/ui/CardDescriptor.vue
@@ -115,7 +115,7 @@ const toModule = computed(() =>
                         :icon="iconModule"
                         color="white"
                         class="link"
-                        :to="toModule"
+                        :to="$attrs['to-module'] ?? toModule"
                     >
                         <QTooltip>
                             {{ t('globals.goToModuleIndex') }}
diff --git a/src/components/ui/QCalendarMonthWrapper.vue b/src/components/ui/QCalendarMonthWrapper.vue
index bced893fe..ed3b32509 100644
--- a/src/components/ui/QCalendarMonthWrapper.vue
+++ b/src/components/ui/QCalendarMonthWrapper.vue
@@ -52,8 +52,8 @@ const containerClasses = computed(() => {
     --calendar-border-current: #84d0e2 2px solid;
     --calendar-current-color-dark: #84d0e2;
     // Colores de fondo del calendario en dark mode
-    --calendar-outside-background-dark: #222;
-    --calendar-background-dark: #222;
+    --calendar-outside-background-dark: var(--vn-section-color);
+    --calendar-background-dark: var(--vn-section-color);
 }
 
 // Clases para modificar el color de fecha seleccionada en componente QCalendarMonth
@@ -68,10 +68,11 @@ const containerClasses = computed(() => {
 .q-calendar-month__head--weekday {
     // Transforma los nombres de los días de la semana a mayúsculas
     text-transform: capitalize;
+    color: var(--vn-label-color);
 }
 
 .transparent-background {
-    --calendar-background-dark: transparent;
+    // --calendar-background-dark: transparent;
     --calendar-background: transparent;
     --calendar-outside-background-dark: transparent;
 }
@@ -124,6 +125,7 @@ const containerClasses = computed(() => {
         height: 32px;
         display: flex;
         justify-content: center;
+        color: var(--vn-label-color);
     }
 
     .q-calendar__button--bordered {
@@ -147,7 +149,7 @@ const containerClasses = computed(() => {
     .q-calendar-month__head--workweek,
     .q-calendar-month__head--weekday.q-calendar__center.q-calendar__ellipsis {
         text-transform: capitalize;
-        color: $color-font-secondary;
+        color: var(--vn-label-color);
         font-weight: bold;
         font-size: 0.8rem;
         text-align: center;
diff --git a/src/pages/Department/Card/DepartmentDescriptor.vue b/src/pages/Department/Card/DepartmentDescriptor.vue
index b49f5f9e2..e914f6af6 100644
--- a/src/pages/Department/Card/DepartmentDescriptor.vue
+++ b/src/pages/Department/Card/DepartmentDescriptor.vue
@@ -24,7 +24,7 @@ const $props = defineProps({
 
 const route = useRoute();
 const router = useRouter();
-
+const DepartmentDescriptorRef = ref();
 const { t } = useI18n();
 const { notify } = useNotify();
 
@@ -55,18 +55,20 @@ const { openConfirmationModal } = useVnConfirm();
 </script>
 <template>
     <CardDescriptor
+        ref="DepartmentDescriptorRef"
         module="Department"
-        data-key="departmentData"
         :url="`Departments/${entityId}`"
         :title="data.title"
         :subtitle="data.subtitle"
         :summary="$props.summary"
+        :to-module="{ name: 'WorkerDepartment' }"
         @on-fetch="
             (data) => {
                 department = data;
                 setData(data);
             }
         "
+        data-key="department"
     >
         <template #menu="{}">
             <QItem
diff --git a/src/pages/Entry/Card/EntryDescriptor.vue b/src/pages/Entry/Card/EntryDescriptor.vue
index a55ad67cd..031251e00 100644
--- a/src/pages/Entry/Card/EntryDescriptor.vue
+++ b/src/pages/Entry/Card/EntryDescriptor.vue
@@ -115,7 +115,6 @@ watch;
         :subtitle="data.subtitle"
         @on-fetch="setData"
         data-key="entry"
-        :summary="$attrs"
     >
         <template #menu="{ entity }">
             <QItem v-ripple clickable @click="showEntryReport(entity)">
diff --git a/src/pages/InvoiceOut/Card/InvoiceOutDescriptor.vue b/src/pages/InvoiceOut/Card/InvoiceOutDescriptor.vue
index e01706e84..abe6859bd 100644
--- a/src/pages/InvoiceOut/Card/InvoiceOutDescriptor.vue
+++ b/src/pages/InvoiceOut/Card/InvoiceOutDescriptor.vue
@@ -84,7 +84,7 @@ const setData = (entity) => (data.value = useCardDescription(entity.ref, entity.
             />
         </template>
         <template #actions="{ entity }">
-            <QCardActions>
+            <QCardActions class="flex justify-center">
                 <QBtn
                     v-if="entity.client"
                     size="md"
diff --git a/src/pages/Route/Card/RouteDescriptor.vue b/src/pages/Route/Card/RouteDescriptor.vue
index 2fa0e77e0..cbabaf648 100644
--- a/src/pages/Route/Card/RouteDescriptor.vue
+++ b/src/pages/Route/Card/RouteDescriptor.vue
@@ -76,7 +76,6 @@ const setData = (entity) => (data.value = useCardDescription(entity.code, entity
         :subtitle="data.subtitle"
         data-key="routeData"
         @on-fetch="setData"
-        :summary="$attrs"
     >
         <template #body="{ entity }">
             <VnLv :label="t('Date')" :value="toDate(entity?.created)" />
diff --git a/src/pages/Shelving/Card/ShelvingDescriptor.vue b/src/pages/Shelving/Card/ShelvingDescriptor.vue
index 52b4896ad..6beca6d88 100644
--- a/src/pages/Shelving/Card/ShelvingDescriptor.vue
+++ b/src/pages/Shelving/Card/ShelvingDescriptor.vue
@@ -51,7 +51,6 @@ const setData = (entity) => (data.value = useCardDescription(entity.code, entity
         :subtitle="data.subtitle"
         data-key="Shelvings"
         @on-fetch="setData"
-        :summary="$attrs"
     >
         <template #body="{ entity }">
             <VnLv :label="t('shelving.summary.code')" :value="entity.code" />
diff --git a/src/pages/Travel/Card/TravelDescriptor.vue b/src/pages/Travel/Card/TravelDescriptor.vue
index b74761b37..bda29903b 100644
--- a/src/pages/Travel/Card/TravelDescriptor.vue
+++ b/src/pages/Travel/Card/TravelDescriptor.vue
@@ -65,7 +65,6 @@ const setData = (entity) => (data.value = useCardDescription(entity.ref, entity.
         :subtitle="data.subtitle"
         :filter="filter"
         data-key="travelData"
-        :summary="$attrs"
         @on-fetch="setData"
     >
         <template #menu="{ entity }">
diff --git a/src/pages/Worker/Card/WorkerDescriptor.vue b/src/pages/Worker/Card/WorkerDescriptor.vue
index 82a698878..4fac26d00 100644
--- a/src/pages/Worker/Card/WorkerDescriptor.vue
+++ b/src/pages/Worker/Card/WorkerDescriptor.vue
@@ -111,7 +111,6 @@ const refetch = async () => await cardDescriptorRef.value.getData();
         :filter="filter"
         :title="data.title"
         :subtitle="data.subtitle"
-        :summary="$attrs"
         @on-fetch="
             (data) => {
                 worker = data;
@@ -145,7 +144,12 @@ const refetch = async () => await cardDescriptorRef.value.getData();
             </QItem>
         </template>
         <template #before>
-            <VnImg :id="entityId" collection="user" size="160x160" class="photo">
+            <VnImg
+                :id="parseInt(entityId)"
+                collection="user"
+                size="160x160"
+                class="photo"
+            >
                 <template #error>
                     <div
                         class="absolute-full picture text-center q-pa-md flex flex-center"
@@ -182,6 +186,32 @@ const refetch = async () => await cardDescriptorRef.value.getData();
                 </template>
             </VnLv>
         </template>
+        <template #actions="{ entity }">
+            <QCardActions class="flex justify-center">
+                <QBtn
+                    :to="{
+                        name: 'CustomerCard',
+                        params: { id: entity.id },
+                    }"
+                    size="md"
+                    icon="vn:Person"
+                    color="primary"
+                >
+                    <QTooltip>{{ t('Go to client') }}</QTooltip>
+                </QBtn>
+                <QBtn
+                    :to="{
+                        name: 'AccountCard',
+                        params: { id: entity.user.id },
+                    }"
+                    size="md"
+                    icon="face"
+                    color="primary"
+                >
+                    <QTooltip>{{ t('Go to user') }}</QTooltip>
+                </QBtn>
+            </QCardActions>
+        </template>
     </CardDescriptor>
 </template>
 
diff --git a/src/pages/Worker/Card/WorkerTimeControl.vue b/src/pages/Worker/Card/WorkerTimeControl.vue
index f466c4f9a..172e3570a 100644
--- a/src/pages/Worker/Card/WorkerTimeControl.vue
+++ b/src/pages/Worker/Card/WorkerTimeControl.vue
@@ -410,7 +410,7 @@ const resendEmail = async () => {
             workerId: Number(route.params.id),
             state: 'SENDED',
         };
-        await axios.post('WorkerTimeControls/weekly-hour-hecord-email', params);
+        await axios.post('WorkerTimeControls/weekly-hour-record-email', params);
         await getMailStates(selectedDate.value);
         notify(t('Email sended'), 'positive');
     } catch (err) {
diff --git a/src/pages/Worker/Card/WorkerTimeForm.vue b/src/pages/Worker/Card/WorkerTimeForm.vue
index 0a58a04ca..64b1f7970 100644
--- a/src/pages/Worker/Card/WorkerTimeForm.vue
+++ b/src/pages/Worker/Card/WorkerTimeForm.vue
@@ -5,7 +5,7 @@ import { useRoute } from 'vue-router';
 
 import VnSelect from 'src/components/common/VnSelect.vue';
 import FormModelPopup from 'components/FormModelPopup.vue';
-import VnInputTime from 'components/common/VnInputTime.vue';
+import VnInputTime from 'src/components/common/VnInputTime.vue';
 
 const $props = defineProps({
     entryId: {
@@ -37,8 +37,9 @@ const entryDirections = [
 
 const closeButton = ref(null);
 
-const onDataSaved = () => {
-    emit('onDataSaved');
+const onDataSaved = (dataSaved) => {
+    console.log('formData: ', dataSaved);
+    emit('onDataSaved', dataSaved);
     closeForm();
 };
 
@@ -73,7 +74,7 @@ onBeforeMount(() => {
         :default-actions="false"
         :title="title"
         :url-create="urlCreate"
-        @on-data-saved="onDataSaved()"
+        @on-data-saved="onDataSaved"
     >
         <template #form-inputs="{ data }">
             <VnInputTime
@@ -91,7 +92,6 @@ onBeforeMount(() => {
                 option-value="code"
                 option-label="description"
                 hide-selected
-                :required="true"
             />
         </template>
     </FormModelPopup>
diff --git a/src/pages/Worker/WorkerList.vue b/src/pages/Worker/WorkerList.vue
index 8057e3e7c..1ffc85e3b 100644
--- a/src/pages/Worker/WorkerList.vue
+++ b/src/pages/Worker/WorkerList.vue
@@ -1,26 +1,68 @@
 <script setup>
+import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useRouter } from 'vue-router';
-import VnPaginate from 'src/components/ui/VnPaginate.vue';
-import WorkerSummary from './Card/WorkerSummary.vue';
-import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
-import WorkerFilter from './WorkerFilter.vue';
-import VnLv from 'src/components/ui/VnLv.vue';
-import CardList from 'src/components/ui/CardList.vue';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
-import RightMenu from 'src/components/common/RightMenu.vue';
+import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
+import VnTable from 'src/components/VnTable/VnTable.vue';
+import WorkerSummary from './Card/WorkerSummary.vue';
 
-const router = useRouter();
 const { t } = useI18n();
+const tableRef = ref();
 const { viewSummary } = useSummaryDialog();
 
-function navigate(id) {
-    router.push({ path: `/worker/${id}` });
-}
-
-const redirectToCreateView = () => {
-    router.push({ name: 'WorkerCreate' });
-};
+const columns = computed(() => [
+    {
+        align: 'left',
+        name: 'id',
+        label: t('tableColumns.id'),
+        chip: {
+            condition: () => true,
+        },
+        isId: true,
+    },
+    {
+        align: 'left',
+        name: 'nickname',
+        label: t('tableColumns.name'),
+        isTitle: true,
+    },
+    {
+        align: 'left',
+        name: 'department',
+        label: t('tableColumns.department'),
+        cardVisible: true,
+        component: 'select',
+        attrs: {
+            url: 'Departments',
+            fields: ['id', 'name'],
+        },
+        columnField: {
+            component: null,
+        },
+    },
+    {
+        align: 'left',
+        name: 'email',
+        label: t('tableColumns.email'),
+        component: 'input',
+        cardVisible: true,
+        columnField: {
+            component: null,
+        },
+    },
+    {
+        align: 'right',
+        label: '',
+        name: 'tableActions',
+        actions: [
+            {
+                title: t('InvoiceOutSummary'),
+                icon: 'preview',
+                action: (row) => viewSummary(row.id, WorkerSummary),
+            },
+        ],
+    },
+]);
 </script>
 <template>
     <VnSearchbar
@@ -28,59 +70,20 @@ const redirectToCreateView = () => {
         :label="t('Search worker')"
         :info="t('You can search by worker id or name')"
     />
-    <RightMenu>
-        <template #right-panel>
-            <WorkerFilter data-key="WorkerList" />
-        </template>
-    </RightMenu>
-    <QPage class="column items-center q-pa-md">
-        <div class="vn-card-list">
-            <VnPaginate
-                data-key="WorkerList"
-                url="Workers/filter"
-                order="id DESC"
-                auto-load
-            >
-                <template #body="{ rows }">
-                    <CardList
-                        v-for="row of rows"
-                        :key="row.id"
-                        :id="row.id"
-                        :title="row.nickname"
-                        @click="navigate(row.id)"
-                    >
-                        <template #list-items>
-                            <VnLv :label="t('worker.list.name')" :value="row.userName" />
-                            <VnLv :label="t('worker.list.email')" :value="row.email" />
-                            <VnLv
-                                :label="t('worker.list.department')"
-                                :value="row.department"
-                            />
-                        </template>
-                        <template #actions>
-                            <QBtn
-                                :label="t('components.smartCard.openCard')"
-                                @click.stop="navigate(row.id)"
-                                outline
-                            />
-                            <QBtn
-                                :label="t('components.smartCard.openSummary')"
-                                @click.stop="viewSummary(row.id, WorkerSummary)"
-                                color="primary"
-                                style="margin-top: 15px"
-                            />
-                        </template>
-                    </CardList>
-                </template>
-            </VnPaginate>
-        </div>
-        <QPageSticky :offset="[20, 20]">
-            <QBtn fab icon="add" color="primary" @click="redirectToCreateView()" />
-            <QTooltip>
-                {{ t('worker.list.newWorker') }}
-            </QTooltip>
-        </QPageSticky>
-    </QPage>
+    <VnTable
+        ref="tableRef"
+        data-key="worker"
+        url="Workers/filter"
+        :create="{
+            urlCreate: 'WorkerCreate',
+            title: t('Create worker'),
+            onDataSaved: (id) => tableRef.redirect(id),
+        }"
+        :columns="columns"
+        default-mode="table"
+        redirect="worker"
+        auto-load
+    />
 </template>
 
 <i18n>
diff --git a/src/pages/Worker/locale/en.yml b/src/pages/Worker/locale/en.yml
index f947b30e7..96df37919 100644
--- a/src/pages/Worker/locale/en.yml
+++ b/src/pages/Worker/locale/en.yml
@@ -1 +1,6 @@
 passwordRequirements: 'The password must have at least { length } length characters, {nAlpha} alphabetic characters, {nUpper} capital letters, {nDigits} digits and {nPunct} symbols (Ex: $%&.)\n'
+tableColumns:
+    id: ID
+    name: Name
+    department: Department
+    email: Email
diff --git a/src/pages/Worker/locale/es.yml b/src/pages/Worker/locale/es.yml
index d2478535a..41812345f 100644
--- a/src/pages/Worker/locale/es.yml
+++ b/src/pages/Worker/locale/es.yml
@@ -4,3 +4,8 @@ Locker: Taquilla
 Internal: Interno
 External: Externo
 passwordRequirements: 'La contraseña debe tener al menos { length } caracteres de longitud, {nAlpha} caracteres alfabéticos, {nUpper} letras mayúsculas, {nDigits} dígitos y {nPunct} símbolos (Ej: $%&.)'
+tableColumns:
+    id: ID
+    name: Nombre
+    department: Departamento
+    email: Email
diff --git a/src/pages/Zone/Card/ZoneDescriptor.vue b/src/pages/Zone/Card/ZoneDescriptor.vue
index 602fefde3..04fb22ba5 100644
--- a/src/pages/Zone/Card/ZoneDescriptor.vue
+++ b/src/pages/Zone/Card/ZoneDescriptor.vue
@@ -52,7 +52,6 @@ const setData = (entity) => {
         :filter="filter"
         @on-fetch="setData"
         data-key="zoneData"
-        :summary="$attrs"
     >
         <template #menu="{ entity }">
             <ZoneDescriptorMenuItems :zone="entity" />

From a4a9572c9680a8a60d47338ef266132cca9f8dd8 Mon Sep 17 00:00:00 2001
From: Jon <jon@verdnatura.es>
Date: Fri, 12 Jul 2024 09:16:32 +0200
Subject: [PATCH 02/17] feat: refs #7323 fixed tests, changed calendar styles
 and fix workerCreate

---
 src/components/common/VnInputTime.vue         |  13 +-
 src/components/ui/QCalendarMonthWrapper.vue   |  23 +-
 src/pages/Worker/Card/WorkerTimeControl.vue   |   1 +
 .../Worker/Card/WorkerTimeControlCalendar.vue |  20 +-
 src/pages/Worker/Card/WorkerTimeForm.vue      |   3 +-
 src/pages/Worker/WorkerList.vue               | 196 +++++++++++++++++-
 src/router/modules/worker.js                  |  38 ++--
 .../integration/worker/workerCreate.spec.js   |  17 +-
 .../integration/worker/workerList.spec.js     |  18 +-
 9 files changed, 274 insertions(+), 55 deletions(-)

diff --git a/src/components/common/VnInputTime.vue b/src/components/common/VnInputTime.vue
index 9344ff869..e10838672 100644
--- a/src/components/common/VnInputTime.vue
+++ b/src/components/common/VnInputTime.vue
@@ -2,6 +2,7 @@
 import { watch, computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { date } from 'quasar';
+import { nextTick } from 'vue';
 
 const model = defineModel({ type: String });
 const props = defineProps({
@@ -43,7 +44,7 @@ const formattedTime = computed({
             if (time?.length > 5) time = dateToTime(time);
             if (!props.timeOnly) {
                 const hours = time.split(':');
-                const date = new Date();
+                const date = Date.vnNew();
                 date.setHours(hours[0], hours[1], 0);
                 time = date.toISOString();
             }
@@ -55,17 +56,24 @@ const formattedTime = computed({
 function dateToTime(newDate) {
     return date.formatDate(new Date(newDate), dateFormat);
 }
-
+const timeField = ref();
 watch(
     () => model.value,
     (val) => (formattedTime.value = val),
     { immediate: true }
 );
+const focusField = () => {
+    nextTick(() => {
+        const input = timeField.value.$el.querySelector('input');
+        input.setSelectionRange(0, 0);
+    });
+};
 </script>
 
 <template>
     <div @mouseover="hover = true" @mouseleave="hover = false">
         <QInput
+            ref="timeField"
             class="vn-input-time"
             mask="##:##"
             placeholder="--:--"
@@ -74,6 +82,7 @@ watch(
             :class="{ required: $attrs.required }"
             style="min-width: 100px"
             :rules="$attrs.required ? [requiredFieldRule] : null"
+            @focus="focusField"
         >
             <template #append>
                 <QIcon
diff --git a/src/components/ui/QCalendarMonthWrapper.vue b/src/components/ui/QCalendarMonthWrapper.vue
index ed3b32509..07ca18bef 100644
--- a/src/components/ui/QCalendarMonthWrapper.vue
+++ b/src/components/ui/QCalendarMonthWrapper.vue
@@ -68,9 +68,27 @@ const containerClasses = computed(() => {
 .q-calendar-month__head--weekday {
     // Transforma los nombres de los días de la semana a mayúsculas
     text-transform: capitalize;
+}
+
+.q-calendar-month__head--workweek,
+.q-calendar-month__head--weekday,
+// .q-calendar-month__workweek.q-past-day,
+.q-calendar-month__week :nth-child(6),
+:nth-child(7) {
     color: var(--vn-label-color);
 }
 
+.q-calendar-month__head--weekdays > div[aria-label='miércoles'] > span {
+    /* color: transparent; */
+    visibility: hidden;
+    // position: absolute;
+}
+.q-calendar-month__head--weekdays > div[aria-label='miércoles'] > span:after {
+    content: 'X';
+    visibility: visible;
+    left: 33%;
+    position: absolute;
+}
 .transparent-background {
     // --calendar-background-dark: transparent;
     --calendar-background: transparent;
@@ -111,11 +129,6 @@ const containerClasses = computed(() => {
             cursor: pointer;
         }
     }
-    .q-calendar-month__week--days > div:nth-child(6),
-    .q-calendar-month__week--days > div:nth-child(7) {
-        // Cambia el color de los días sábado y domingo
-        color: #777777;
-    }
 
     .q-calendar-month__week--wrapper {
         margin-bottom: 4px;
diff --git a/src/pages/Worker/Card/WorkerTimeControl.vue b/src/pages/Worker/Card/WorkerTimeControl.vue
index 172e3570a..c11dd4522 100644
--- a/src/pages/Worker/Card/WorkerTimeControl.vue
+++ b/src/pages/Worker/Card/WorkerTimeControl.vue
@@ -575,6 +575,7 @@ onMounted(async () => {
                             <span class="q-mb-md text-sm text-body1">
                                 {{ secondsToHoursMinutes(day.dayData?.workedHours) }}
                             </span>
+                            {{ day.dayData?.dated }}
                             <QIcon
                                 name="add_circle"
                                 color="primary"
diff --git a/src/pages/Worker/Card/WorkerTimeControlCalendar.vue b/src/pages/Worker/Card/WorkerTimeControlCalendar.vue
index 20d02ca78..02b03bb75 100644
--- a/src/pages/Worker/Card/WorkerTimeControlCalendar.vue
+++ b/src/pages/Worker/Card/WorkerTimeControlCalendar.vue
@@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
 
 import { QCalendarMonth } from '@quasar/quasar-ui-qcalendar/src/index.js';
 import QCalendarMonthWrapper from 'src/components/ui/QCalendarMonthWrapper.vue';
-
+console.log(QCalendarMonth);
 const $props = defineProps({
     modelValue: {
         type: String,
@@ -119,6 +119,22 @@ const paintWorkWeeks = async () => {
         }
     }
 };
+
+// const w = computed(() => {
+//     const spanishWeekdays = ['L', 'M', 'X', 'J', 'V', 'S', 'D'];
+//     const englishWeekdays = [1, 2, 3, 4, 5, 6, 0];
+
+//     if (locale.value === 'es') return spanishWeekdays;
+//     return englishWeekdays;
+//     // return locale.value === 'en'
+//     //     ? englishWeekdays
+//     //     : spanishWeekdays.map((day) => (day === 3 ? 'X' : day.toString()));
+// });
+// const weekdays = computed(() => {
+//     return locale.value === 'es'
+//         ? console.log([1, 2, 3, 4, 5, 6, 0]) //{ 1: 'L', 2: 'M', 3: 'X', 4: 'J', 5: 'V', 6: 'S', 0: 'D' }
+//         : [1, 2, 3, 4, 5, 6, 0];
+// });
 </script>
 
 <template>
@@ -139,7 +155,9 @@ const paintWorkWeeks = async () => {
                 show-work-weeks
                 :weekdays="[1, 2, 3, 4, 5, 6, 0]"
                 :selected-dates="selectedDates"
+                :min-weekday-label="1"
                 :locale="locale"
+                animated
                 mini-mode
                 enable-outside-days
                 class="q-py-sm"
diff --git a/src/pages/Worker/Card/WorkerTimeForm.vue b/src/pages/Worker/Card/WorkerTimeForm.vue
index 64b1f7970..6778483a3 100644
--- a/src/pages/Worker/Card/WorkerTimeForm.vue
+++ b/src/pages/Worker/Card/WorkerTimeForm.vue
@@ -38,7 +38,6 @@ const entryDirections = [
 const closeButton = ref(null);
 
 const onDataSaved = (dataSaved) => {
-    console.log('formData: ', dataSaved);
     emit('onDataSaved', dataSaved);
     closeForm();
 };
@@ -77,6 +76,8 @@ onBeforeMount(() => {
         @on-data-saved="onDataSaved"
     >
         <template #form-inputs="{ data }">
+            {{ $props }}
+            {{ data }}
             <VnInputTime
                 v-if="!isEditMode"
                 :label="t('Hour')"
diff --git a/src/pages/Worker/WorkerList.vue b/src/pages/Worker/WorkerList.vue
index 1ffc85e3b..3eca02c8f 100644
--- a/src/pages/Worker/WorkerList.vue
+++ b/src/pages/Worker/WorkerList.vue
@@ -5,10 +5,24 @@ import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 import VnTable from 'src/components/VnTable/VnTable.vue';
 import WorkerSummary from './Card/WorkerSummary.vue';
+import VnRow from 'src/components/ui/VnRow.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+import VnRadio from 'src/components/common/VnRadio.vue';
+import VnSelect from 'src/components/common/VnSelect.vue';
+import VnInputDate from 'src/components/common/VnInputDate.vue';
+import VnLocation from 'src/components/common/VnLocation.vue';
+import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
+import CreateBankEntityForm from 'src/components/CreateBankEntityForm.vue';
+import FetchData from 'src/components/FetchData.vue';
 
 const { t } = useI18n();
 const tableRef = ref();
 const { viewSummary } = useSummaryDialog();
+const companiesOptions = ref([]);
+const workersOptions = ref([]);
+const payMethodsOptions = ref([]);
+const bankEntitiesOptions = ref([]);
+const postcodesOptions = ref([]);
 
 const columns = computed(() => [
     {
@@ -63,6 +77,14 @@ const columns = computed(() => [
         ],
     },
 ]);
+
+function handleLocation(data, location) {
+    const { town, code, provinceFk, countryFk } = location ?? {};
+    data.postcode = code;
+    data.city = town;
+    data.provinceFk = provinceFk;
+    data.countryFk = countryFk;
+}
 </script>
 <template>
     <VnSearchbar
@@ -70,20 +92,188 @@ const columns = computed(() => [
         :label="t('Search worker')"
         :info="t('You can search by worker id or name')"
     />
+    <FetchData
+        url="Companies"
+        @on-fetch="(data) => (companiesOptions = data)"
+        auto-load
+    />
+    <FetchData
+        url="Workers/search"
+        @on-fetch="(data) => (workersOptions = data)"
+        auto-load
+    />
+    <FetchData
+        url="Paymethods"
+        @on-fetch="(data) => (payMethodsOptions = data)"
+        auto-load
+    />
+    <FetchData
+        url="BankEntities"
+        @on-fetch="(data) => (bankEntitiesOptions = data)"
+        auto-load
+    />
     <VnTable
         ref="tableRef"
         data-key="worker"
         url="Workers/filter"
         :create="{
-            urlCreate: 'WorkerCreate',
+            urlCreate: 'Workers/new',
             title: t('Create worker'),
-            onDataSaved: (id) => tableRef.redirect(id),
+            onDataSaved: ({ id }) => tableRef.redirect(id),
+            formInitialData: {
+                isFreelance: false,
+            },
         }"
         :columns="columns"
         default-mode="table"
         redirect="worker"
+        :use-model="true"
         auto-load
-    />
+    >
+        <template #more-create-dialog="{ data }">
+            <div class="q-pa-lg full-width" style="max-width: 1200px">
+                <VnRadio
+                    v-model="data.isFreelance"
+                    :val="false"
+                    :label="`${t('Internal')}`"
+                    @update:model-value="data.payMethodFk = defaultPayMethod"
+                />
+                <VnRadio
+                    v-model="data.isFreelance"
+                    :val="true"
+                    :label="`${t('External')}`"
+                    @update:model-value="delete data.payMethodFk"
+                />
+                <VnRow>
+                    <VnInput v-model="data.firstName" :label="t('worker.create.name')" />
+                    <VnInput
+                        v-model="data.lastNames"
+                        :label="t('worker.create.lastName')"
+                    />
+                    <VnInput v-model="data.code" :label="t('worker.create.code')" />
+                </VnRow>
+                <VnRow>
+                    <VnInput v-model="data.name" :label="t('worker.create.webUser')" />
+                    <VnInput
+                        v-model="data.email"
+                        :label="t('worker.create.personalEmail')"
+                    />
+                </VnRow>
+                <VnRow>
+                    <VnSelect
+                        :label="t('worker.create.company')"
+                        v-model="data.companyFk"
+                        :options="companiesOptions"
+                        option-value="id"
+                        option-label="code"
+                        hide-selected
+                    />
+                    <VnSelect
+                        :label="t('worker.create.boss')"
+                        v-model="data.bossFk"
+                        :options="workersOptions"
+                        option-value="id"
+                        option-label="name"
+                        hide-selected
+                    >
+                        <template #option="scope">
+                            <QItem v-bind="scope.itemProps">
+                                <QItemSection>
+                                    <QItemLabel>{{ scope.opt.name }}</QItemLabel>
+                                    <QItemLabel caption
+                                        >{{ scope.opt.nickname }},
+                                        {{ scope.opt.code }}
+                                    </QItemLabel>
+                                </QItemSection>
+                            </QItem>
+                        </template>
+                    </VnSelect>
+                </VnRow>
+                <VnRow>
+                    <VnInput v-model="data.fi" :label="t('worker.create.fi')" />
+                    <VnInputDate
+                        v-model="data.birth"
+                        :label="t('worker.create.birth')"
+                        :disable="data.isFreelance"
+                    />
+                    <VnInput
+                        v-model="data.phone"
+                        :label="t('worker.create.phone')"
+                        :disable="data.isFreelance"
+                    />
+                </VnRow>
+                <VnRow>
+                    <VnLocation
+                        :roles-allowed-to-create="['deliveryAssistant']"
+                        :options="postcodesOptions"
+                        v-model="data.location"
+                        @update:model-value="(location) => handleLocation(data, location)"
+                        :disable="data.isFreelance"
+                    >
+                    </VnLocation>
+                </VnRow>
+                <VnRow>
+                    <VnInput
+                        :label="t('worker.create.street')"
+                        v-model="data.street"
+                        :disable="data.isFreelance"
+                    />
+                </VnRow>
+                <VnRow>
+                    <VnSelect
+                        :label="t('worker.create.payMethods')"
+                        v-model="data.payMethodFk"
+                        :options="payMethodsOptions"
+                        option-value="id"
+                        option-label="name"
+                        map-options
+                        hide-selected
+                        :disable="data.isFreelance"
+                        @update:model-value="(val) => !val && delete data.payMethodFk"
+                    />
+                    <VnInput
+                        v-model="data.iban"
+                        :label="t('worker.create.iban')"
+                        :disable="data.isFreelance"
+                    >
+                        <template #append>
+                            <QIcon name="info" class="cursor-info">
+                                <QTooltip>{{ t('components.iban_tooltip') }}</QTooltip>
+                            </QIcon>
+                        </template>
+                    </VnInput>
+                </VnRow>
+                <VnRow>
+                    <VnSelectDialog
+                        :label="t('worker.create.bankEntity')"
+                        v-model="data.bankEntityFk"
+                        :options="bankEntitiesOptions"
+                        option-label="name"
+                        option-value="id"
+                        hide-selected
+                        :roles-allowed-to-create="['salesAssistant', 'hr']"
+                        :disable="data.isFreelance"
+                    >
+                        <template #form>
+                            <CreateBankEntityForm
+                                @on-data-saved="(data) => bankEntitiesOptions.push(data)"
+                            />
+                        </template>
+                        <template #option="scope">
+                            <QItem v-bind="scope.itemProps">
+                                <QItemSection v-if="scope.opt">
+                                    <QItemLabel
+                                        >{{ scope.opt.bic }}
+                                        {{ scope.opt.name }}</QItemLabel
+                                    >
+                                </QItemSection>
+                            </QItem>
+                        </template>
+                    </VnSelectDialog>
+                </VnRow>
+            </div>
+        </template>
+    </VnTable>
 </template>
 
 <i18n>
diff --git a/src/router/modules/worker.js b/src/router/modules/worker.js
index 3fc71c2a3..fc0bf6afe 100644
--- a/src/router/modules/worker.js
+++ b/src/router/modules/worker.js
@@ -104,6 +104,25 @@ export default {
                         },
                     ],
                 },
+                {
+                    name: 'WorkerTimeControl',
+                    path: 'time-control',
+                    meta: {
+                        title: 'timeControl',
+                        icon: 'access_time',
+                    },
+                    component: () =>
+                        import('src/pages/Worker/Card/WorkerTimeControl.vue'),
+                },
+                {
+                    name: 'WorkerCalendar',
+                    path: 'calendar',
+                    meta: {
+                        title: 'calendar',
+                        icon: 'calendar_today',
+                    },
+                    component: () => import('src/pages/Worker/Card/WorkerCalendar.vue'),
+                },
                 {
                     name: 'WorkerPda',
                     path: 'pda',
@@ -150,25 +169,6 @@ export default {
                     },
                     component: () => import('src/pages/Worker/Card/WorkerLog.vue'),
                 },
-                {
-                    name: 'WorkerCalendar',
-                    path: 'calendar',
-                    meta: {
-                        title: 'calendar',
-                        icon: 'calendar_today',
-                    },
-                    component: () => import('src/pages/Worker/Card/WorkerCalendar.vue'),
-                },
-                {
-                    name: 'WorkerTimeControl',
-                    path: 'time-control',
-                    meta: {
-                        title: 'timeControl',
-                        icon: 'access_time',
-                    },
-                    component: () =>
-                        import('src/pages/Worker/Card/WorkerTimeControl.vue'),
-                },
                 {
                     name: 'WorkerLocker',
                     path: 'locker',
diff --git a/test/cypress/integration/worker/workerCreate.spec.js b/test/cypress/integration/worker/workerCreate.spec.js
index 26ce899c8..cfd2a8b03 100644
--- a/test/cypress/integration/worker/workerCreate.spec.js
+++ b/test/cypress/integration/worker/workerCreate.spec.js
@@ -1,5 +1,5 @@
 describe('WorkerCreate', () => {
-    const externalRadio = '.q-toolbar .q-radio:nth-child(2)';
+    const externalRadio = '.q-radio:nth-child(2)';
     const notification = '.q-notification__message';
     const developerBossId = 120;
 
@@ -9,6 +9,7 @@ describe('WorkerCreate', () => {
         Name: { val: 'Manolo' },
         'Last name': { val: 'Hurtado' },
         'Personal email': { val: 'manolo@mydomain.com' },
+        Company: { val: 'VNL', type: 'select' },
         Street: { val: 'S/ DEFAULTWORKERSTREET' },
         Location: { val: 1, type: 'select' },
         Phone: { val: '123456789' },
@@ -29,16 +30,14 @@ describe('WorkerCreate', () => {
     beforeEach(() => {
         cy.viewport(1280, 720);
         cy.login('hr');
-        cy.visit('/#/worker/create');
+        cy.visit('/#/worker/list');
+        cy.get('.q-page-sticky > div > .q-btn').click();
     });
 
     it('should throw an error if a pay method has not been selected', () => {
         cy.fillInForm(internal);
-        cy.saveCard();
-        cy.get(notification).should(
-            'contains.text',
-            'That payment method requires an IBAN'
-        );
+        cy.get('.q-mt-lg > .q-btn--standard').click();
+        cy.get(notification).should('contains.text', 'Payment method is required');
     });
 
     it('should create an internal', () => {
@@ -46,14 +45,14 @@ describe('WorkerCreate', () => {
             ...internal,
             'Pay method': { val: 'PayMethod one', type: 'select' },
         });
-        cy.saveCard();
+        cy.get('.q-mt-lg > .q-btn--standard').click();
         cy.get(notification).should('contains.text', 'Data created');
     });
 
     it('should create an external', () => {
         cy.get(externalRadio).click();
         cy.fillInForm(external);
-        cy.saveCard();
+        cy.get('.q-mt-lg > .q-btn--standard').click();
         cy.get(notification).should('contains.text', 'Data created');
     });
 });
diff --git a/test/cypress/integration/worker/workerList.spec.js b/test/cypress/integration/worker/workerList.spec.js
index 9808fd157..29df01f3b 100644
--- a/test/cypress/integration/worker/workerList.spec.js
+++ b/test/cypress/integration/worker/workerList.spec.js
@@ -1,25 +1,13 @@
 describe('WorkerList', () => {
-    const workerFieldNames =
-        '.card-list-body > .list-items > :nth-child(1) > .value > span';
     beforeEach(() => {
         cy.viewport(1280, 720);
         cy.login('developer');
         cy.visit('/#/worker/list');
     });
 
-    it('should load workers', () => {
-        cy.get(workerFieldNames).eq(2).should('have.text', 'jessicajones');
-        cy.get(workerFieldNames).eq(3).should('have.text', 'brucebanner');
-        cy.get(workerFieldNames).eq(4).should('have.text', 'charlesxavier');
-    });
-
     it('should open the worker summary', () => {
-        cy.openListSummary(2);
-        cy.get('.summaryHeader div').should('have.text', '1110 - Jessica Jones');
-        cy.get('.summary .header-link')
-            .eq(0)
-            .invoke('text')
-            .should('include', 'Basic data');
-        cy.get('.summary .header-link').eq(2).should('have.text', 'User data ');
+        cy.get('.bg-header > :nth-child(2) > .full-width > :nth-child(1) >').type(
+            'jessica jones{enter}'
+        );
     });
 });

From 74c36a28b2cd3952da40fc699c6ee345fc9c4afe Mon Sep 17 00:00:00 2001
From: Jon <jon@verdnatura.es>
Date: Fri, 12 Jul 2024 13:05:46 +0200
Subject: [PATCH 03/17] fix: workerCreate form street field to be always
 upperCase

---
 src/pages/Worker/WorkerList.vue | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/pages/Worker/WorkerList.vue b/src/pages/Worker/WorkerList.vue
index 3eca02c8f..27b4982ee 100644
--- a/src/pages/Worker/WorkerList.vue
+++ b/src/pages/Worker/WorkerList.vue
@@ -85,6 +85,15 @@ function handleLocation(data, location) {
     data.provinceFk = provinceFk;
     data.countryFk = countryFk;
 }
+
+function uppercaseStreetModel(data) {
+    return {
+        get: () => (data.street ? data.street.toUpperCase() : ''),
+        set: (value) => {
+            data.street = value.toUpperCase();
+        },
+    };
+}
 </script>
 <template>
     <VnSearchbar
@@ -215,7 +224,8 @@ function handleLocation(data, location) {
                 <VnRow>
                     <VnInput
                         :label="t('worker.create.street')"
-                        v-model="data.street"
+                        :model-value="uppercaseStreetModel(data).get()"
+                        @update:model-value="uppercaseStreetModel(data).set"
                         :disable="data.isFreelance"
                     />
                 </VnRow>

From 243a8cbdc69f7d3c83e8af64088503d99104b410 Mon Sep 17 00:00:00 2001
From: Jon <jon@verdnatura.es>
Date: Mon, 15 Jul 2024 12:42:14 +0200
Subject: [PATCH 04/17] fix: refs #7323 fix workerTimeControl form

---
 src/components/common/VnInputTime.vue           |  2 +-
 src/pages/Worker/Card/WorkerTimeControl.vue     |  1 -
 .../Worker/Card/WorkerTimeControlCalendar.vue   | 17 -----------------
 src/pages/Worker/Card/WorkerTimeForm.vue        |  2 --
 4 files changed, 1 insertion(+), 21 deletions(-)

diff --git a/src/components/common/VnInputTime.vue b/src/components/common/VnInputTime.vue
index e10838672..9475426ea 100644
--- a/src/components/common/VnInputTime.vue
+++ b/src/components/common/VnInputTime.vue
@@ -44,7 +44,7 @@ const formattedTime = computed({
             if (time?.length > 5) time = dateToTime(time);
             if (!props.timeOnly) {
                 const hours = time.split(':');
-                const date = Date.vnNew();
+                const date = model.value ?? Date.vnNew();
                 date.setHours(hours[0], hours[1], 0);
                 time = date.toISOString();
             }
diff --git a/src/pages/Worker/Card/WorkerTimeControl.vue b/src/pages/Worker/Card/WorkerTimeControl.vue
index c11dd4522..172e3570a 100644
--- a/src/pages/Worker/Card/WorkerTimeControl.vue
+++ b/src/pages/Worker/Card/WorkerTimeControl.vue
@@ -575,7 +575,6 @@ onMounted(async () => {
                             <span class="q-mb-md text-sm text-body1">
                                 {{ secondsToHoursMinutes(day.dayData?.workedHours) }}
                             </span>
-                            {{ day.dayData?.dated }}
                             <QIcon
                                 name="add_circle"
                                 color="primary"
diff --git a/src/pages/Worker/Card/WorkerTimeControlCalendar.vue b/src/pages/Worker/Card/WorkerTimeControlCalendar.vue
index 02b03bb75..2717a71f4 100644
--- a/src/pages/Worker/Card/WorkerTimeControlCalendar.vue
+++ b/src/pages/Worker/Card/WorkerTimeControlCalendar.vue
@@ -4,7 +4,6 @@ import { useI18n } from 'vue-i18n';
 
 import { QCalendarMonth } from '@quasar/quasar-ui-qcalendar/src/index.js';
 import QCalendarMonthWrapper from 'src/components/ui/QCalendarMonthWrapper.vue';
-console.log(QCalendarMonth);
 const $props = defineProps({
     modelValue: {
         type: String,
@@ -119,22 +118,6 @@ const paintWorkWeeks = async () => {
         }
     }
 };
-
-// const w = computed(() => {
-//     const spanishWeekdays = ['L', 'M', 'X', 'J', 'V', 'S', 'D'];
-//     const englishWeekdays = [1, 2, 3, 4, 5, 6, 0];
-
-//     if (locale.value === 'es') return spanishWeekdays;
-//     return englishWeekdays;
-//     // return locale.value === 'en'
-//     //     ? englishWeekdays
-//     //     : spanishWeekdays.map((day) => (day === 3 ? 'X' : day.toString()));
-// });
-// const weekdays = computed(() => {
-//     return locale.value === 'es'
-//         ? console.log([1, 2, 3, 4, 5, 6, 0]) //{ 1: 'L', 2: 'M', 3: 'X', 4: 'J', 5: 'V', 6: 'S', 0: 'D' }
-//         : [1, 2, 3, 4, 5, 6, 0];
-// });
 </script>
 
 <template>
diff --git a/src/pages/Worker/Card/WorkerTimeForm.vue b/src/pages/Worker/Card/WorkerTimeForm.vue
index 6778483a3..3250e3180 100644
--- a/src/pages/Worker/Card/WorkerTimeForm.vue
+++ b/src/pages/Worker/Card/WorkerTimeForm.vue
@@ -76,8 +76,6 @@ onBeforeMount(() => {
         @on-data-saved="onDataSaved"
     >
         <template #form-inputs="{ data }">
-            {{ $props }}
-            {{ data }}
             <VnInputTime
                 v-if="!isEditMode"
                 :label="t('Hour')"

From d467657928043bd8e20e98d81f3b2e5efac5cb0b Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Tue, 16 Jul 2024 12:21:36 +0200
Subject: [PATCH 05/17] feat: myEntries

---
 src/pages/Entry/MyEntries.vue                 | 124 ++++++++++++++++++
 src/router/modules/entry.js                   |  11 +-
 .../cypress/integration/entry/myEntry.spec.js |  20 +++
 3 files changed, 154 insertions(+), 1 deletion(-)
 create mode 100644 src/pages/Entry/MyEntries.vue
 create mode 100644 test/cypress/integration/entry/myEntry.spec.js

diff --git a/src/pages/Entry/MyEntries.vue b/src/pages/Entry/MyEntries.vue
new file mode 100644
index 000000000..d4b73b479
--- /dev/null
+++ b/src/pages/Entry/MyEntries.vue
@@ -0,0 +1,124 @@
+<script setup>
+import { computed, onMounted } from 'vue';
+import { useI18n } from 'vue-i18n';
+import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
+import { useStateStore } from 'stores/useStateStore';
+import { toDate } from 'src/filters/index';
+import { useQuasar } from 'quasar';
+import EntryBuysTableDialog from './EntryBuysTableDialog.vue';
+import VnTable from 'components/VnTable/VnTable.vue';
+import VnInput from 'src/components/common/VnInput.vue';
+
+const stateStore = useStateStore();
+const { t } = useI18n();
+const quasar = useQuasar();
+
+onMounted(async () => {
+    stateStore.rightDrawer = true;
+});
+
+const columns = computed(() => [
+    {
+        align: 'left',
+        name: 'id',
+        label: t('customer.extendedList.tableVisibleColumns.id'),
+        chip: {
+            condition: () => true,
+        },
+        isId: true,
+        isTitle: false,
+    },
+    {
+        align: 'left',
+        label: t('shipped'),
+        name: 'shipped',
+        isTitle: false,
+        create: true,
+        cardVisible: true,
+        component: 'date',
+        columnField: {
+            component: null,
+        },
+        format: ({ shipped }) => toDate(shipped),
+    },
+    {
+        align: 'left',
+        label: t('landed'),
+        name: 'landed',
+        isTitle: false,
+        create: true,
+        cardVisible: false,
+        component: 'date',
+        columnField: {
+            component: null,
+        },
+        format: ({ landed }) => toDate(landed),
+    },
+    {
+        align: 'left',
+        label: t('globals.wareHouseIn'),
+        name: 'warehouseInName',
+        isTitle: false,
+        cardVisible: true,
+        create: false,
+    },
+    {
+        align: 'right',
+        name: 'tableActions',
+        computed,
+        actions: [
+            {
+                title: t('printBuys'),
+                icon: 'print',
+                action: (row) => printBuys(row.id),
+            },
+        ],
+    },
+]);
+
+const printBuys = (rowId) => {
+    quasar.dialog({
+        component: EntryBuysTableDialog,
+        componentProps: {
+            id: rowId,
+        },
+    });
+};
+</script>
+<template>
+    <VnSearchbar
+        data-key="EntryList"
+        url="Entries/filter"
+        :label="t('Search entries')"
+        :info="t('You can search by entry reference')"
+    />
+    <QPage class="column items-center q-pa-md">
+        <div class="vn-card-list">
+            <VnTable
+                ref="myEntriesRef"
+                data-key="myEntriesList"
+                url="Entries/filter"
+                :order="['landed DESC', 'id DESC']"
+                :columns="columns"
+                default-mode="card"
+                auto-load
+                :right-search="true"
+            >
+                <template #moreFilterPanel="{ params }">
+                    <VnInput
+                        :label="t('globals.daysOnward')"
+                        v-model="params.days"
+                        class="q-px-xs row"
+                        dense
+                        filled
+                        outlined
+                    ></VnInput>
+                </template>
+            </VnTable>
+        </div>
+    </QPage>
+</template>
+
+<i18n>
+    You can search by entry reference: Puedes buscar por referencia de la entrada
+</i18n>
diff --git a/src/router/modules/entry.js b/src/router/modules/entry.js
index 67fc41824..4f5f05231 100644
--- a/src/router/modules/entry.js
+++ b/src/router/modules/entry.js
@@ -11,7 +11,7 @@ export default {
     component: RouterView,
     redirect: { name: 'EntryMain' },
     menus: {
-        main: ['EntryList', 'EntryLatestBuys'],
+        main: ['EntryList', 'MyEntries', 'EntryLatestBuys'],
         card: ['EntryBasicData', 'EntryBuys', 'EntryNotes', 'EntryDms', 'EntryLog'],
     },
     children: [
@@ -30,6 +30,15 @@ export default {
                     },
                     component: () => import('src/pages/Entry/EntryList.vue'),
                 },
+                {
+                    path: 'my',
+                    name: 'MyEntries',
+                    meta: {
+                        title: 'labeler',
+                        icon: 'sell',
+                    },
+                    component: () => import('src/pages/Entry/MyEntries.vue'),
+                },
                 {
                     path: 'create',
                     name: 'EntryCreate',
diff --git a/test/cypress/integration/entry/myEntry.spec.js b/test/cypress/integration/entry/myEntry.spec.js
new file mode 100644
index 000000000..8edd3a11c
--- /dev/null
+++ b/test/cypress/integration/entry/myEntry.spec.js
@@ -0,0 +1,20 @@
+describe('EntryMy when is supplier', () => {
+    beforeEach(() => {
+        cy.viewport(1920, 1080);
+        cy.login('supplier');
+        cy.visit(`/#/entry/my`, {
+            onBeforeLoad(win) {
+                cy.stub(win, 'open');
+            },
+        });
+        cy.waitForElement('.q-page', 6000);
+    });
+
+    it('should open buyLabel when is supplier', () => {
+        cy.get(
+            '[to="/null/2"] > .q-card > .column > .q-btn > .q-btn__content > .q-icon'
+        ).click();
+        cy.get('.q-card__actions > .q-btn').click();
+        cy.window().its('open').should('be.called');
+    });
+});

From 5fbbd27273f1f99271757da3b429d206b8fc4a9e Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Tue, 16 Jul 2024 12:21:50 +0200
Subject: [PATCH 06/17] fat: i18n

---
 src/i18n/locale/en.yml        | 2 ++
 src/i18n/locale/es.yml        | 2 ++
 src/pages/Entry/locale/en.yml | 1 +
 src/pages/Entry/locale/es.yml | 2 ++
 4 files changed, 7 insertions(+)

diff --git a/src/i18n/locale/en.yml b/src/i18n/locale/en.yml
index 59cd1170a..756da80de 100644
--- a/src/i18n/locale/en.yml
+++ b/src/i18n/locale/en.yml
@@ -46,6 +46,7 @@ globals:
     noPinnedModules: You don't have any pinned modules
     summary:
         basicData: Basic data
+    daysOnward: Days onward
     today: Today
     yesterday: Yesterday
     dateFormat: en-GB
@@ -107,6 +108,7 @@ globals:
         aliasUsers: Users
         subRoles: Subroles
         inheritedRoles: Inherited Roles
+        labeler: Labeler
     created: Created
     worker: Worker
     now: Now
diff --git a/src/i18n/locale/es.yml b/src/i18n/locale/es.yml
index e35e3d41c..726cb0832 100644
--- a/src/i18n/locale/es.yml
+++ b/src/i18n/locale/es.yml
@@ -45,6 +45,7 @@ globals:
     noPinnedModules: No has fijado ningún módulo
     summary:
         basicData: Datos básicos
+    daysOnward: Días adelante
     today: Hoy
     yesterday: Ayer
     dateFormat: es-ES
@@ -108,6 +109,7 @@ globals:
         subRoles: Subroles
         inheritedRoles: Roles heredados
         workers: Trabajadores
+        labeler: Etiquetas
     created: Fecha creación
     worker: Trabajador
     now: Ahora
diff --git a/src/pages/Entry/locale/en.yml b/src/pages/Entry/locale/en.yml
index 9a476c80c..677c3c055 100644
--- a/src/pages/Entry/locale/en.yml
+++ b/src/pages/Entry/locale/en.yml
@@ -8,3 +8,4 @@ entryFilter:
         reference: Reference
 landed: Landed
 shipped: Shipped
+printBuys: Print buys
diff --git a/src/pages/Entry/locale/es.yml b/src/pages/Entry/locale/es.yml
index fba6c5460..10b77c2ee 100644
--- a/src/pages/Entry/locale/es.yml
+++ b/src/pages/Entry/locale/es.yml
@@ -1,5 +1,6 @@
 Search entries: Buscar entradas
 You can search by entry reference: Puedes buscar por referencia de la entrada
+
 entryList:
     list:
         inventoryEntry: Es inventario
@@ -11,3 +12,4 @@ entryFilter:
 
 landed: F. llegada
 shipped: F. salida
+Print buys: Imprimir etiquetas

From ace529a4ba624f51bafcfb1f44e90626a308ed06 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Tue, 16 Jul 2024 12:22:01 +0200
Subject: [PATCH 07/17] feat: vnTable template

---
 src/components/VnTable/VnTable.vue | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/VnTable/VnTable.vue b/src/components/VnTable/VnTable.vue
index 493f1480e..94026721b 100644
--- a/src/components/VnTable/VnTable.vue
+++ b/src/components/VnTable/VnTable.vue
@@ -175,7 +175,7 @@ function columnName(col) {
 }
 
 function getColAlign(col) {
-    return 'text-' + (col.align ?? 'left')
+    return 'text-' + (col.align ?? 'left');
 }
 defineExpose({
     reload,
@@ -207,12 +207,12 @@ defineExpose({
                         v-model="params[columnName(col)]"
                         :search-url="searchUrl"
                     />
+                    <slot
+                        name="moreFilterPanel"
+                        :params="params"
+                        :columns="splittedColumns.columns"
+                    />
                 </template>
-                <slot
-                    name="moreFilterPanel"
-                    :params="params"
-                    :columns="splittedColumns.columns"
-                />
             </VnFilterPanel>
         </QScrollArea>
     </QDrawer>

From f7135008a2a6145a0aaa2450932da3a9e72b5782 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Tue, 16 Jul 2024 12:22:08 +0200
Subject: [PATCH 08/17] feat: entryBuys

---
 src/pages/Entry/EntryBuysTableDialog.vue | 120 +++++++++++++++++++++++
 1 file changed, 120 insertions(+)
 create mode 100644 src/pages/Entry/EntryBuysTableDialog.vue

diff --git a/src/pages/Entry/EntryBuysTableDialog.vue b/src/pages/Entry/EntryBuysTableDialog.vue
new file mode 100644
index 000000000..c2b04c291
--- /dev/null
+++ b/src/pages/Entry/EntryBuysTableDialog.vue
@@ -0,0 +1,120 @@
+<script setup>
+import { computed } from 'vue';
+import { useRoute } from 'vue-router';
+import { useI18n } from 'vue-i18n';
+import { QBtn } from 'quasar';
+
+import VnPaginate from 'src/components/ui/VnPaginate.vue';
+import { usePrintService } from 'composables/usePrintService';
+const { openReport } = usePrintService();
+
+const route = useRoute();
+const { t } = useI18n();
+const $props = defineProps({
+    id: {
+        type: String,
+        required: false,
+        default: null,
+    },
+});
+const entityId = computed(() => $props.id || route.params.id);
+
+const entriesTableColumns = computed(() => [
+    {
+        align: 'left',
+        name: 'itemFk',
+        field: 'itemFk',
+        label: t('globals.id'),
+    },
+    {
+        align: 'left',
+        name: 'item',
+        label: t('entry.summary.item'),
+        field: (row) => row.item.name,
+    },
+    {
+        align: 'left',
+        name: 'packagingFk',
+        label: t('entry.summary.package'),
+        field: 'packagingFk',
+    },
+    {
+        align: 'left',
+        name: 'stickers',
+        label: t('entry.summary.stickers'),
+        field: 'stickers',
+    },
+    {
+        align: 'left',
+        name: 'packing',
+        label: t('entry.summary.packing'),
+        field: 'packing',
+    },
+    {
+        align: 'left',
+        name: 'grouping',
+        label: t('entry.summary.grouping'),
+        field: 'grouping',
+    },
+]);
+</script>
+
+<template>
+    <QDialog ref="dialogRef">
+        <QCard style="min-width: 800px">
+            <QCardSection class="row items-center q-pb-none">
+                <QAvatar
+                    :icon="icon"
+                    color="primary"
+                    text-color="white"
+                    size="xl"
+                    v-if="icon"
+                />
+                <span class="text-h6 text-grey">{{ title }}</span>
+                <QSpace />
+                <QBtn icon="close" :disable="isLoading" flat round dense v-close-popup />
+            </QCardSection>
+            <QCardActions align="right">
+                <QBtn
+                    :label="t('Print buys')"
+                    color="primary"
+                    icon="print"
+                    :loading="isLoading"
+                    @click="openReport(`Entries/${entityId}/buy-label`)"
+                    unelevated
+                    autofocus
+                />
+            </QCardActions>
+            <QCardSection class="row items-center">
+                <VnPaginate
+                    ref="entryBuysPaginateRef"
+                    :limit="0"
+                    data-key="EntryBuys"
+                    :url="`Entries/${entityId}/getBuys`"
+                    auto-load
+                >
+                    <template #body="{ rows }">
+                        <QTable
+                            :rows="rows"
+                            :columns="entriesTableColumns"
+                            row-key="id"
+                            flat
+                            dense
+                            class="q-ml-lg"
+                            :grid="$q.screen.lt.md"
+                            :no-data-label="t('globals.noResults')"
+                        >
+                            <template #body="props">
+                                <QTr>
+                                    <QTd v-for="col in props.cols" :key="col.name">
+                                        {{ col.value }}
+                                    </QTd>
+                                </QTr>
+                            </template>
+                        </QTable>
+                    </template>
+                </VnPaginate>
+            </QCardSection>
+        </QCard>
+    </QDialog>
+</template>

From 86a84784b1362d0b54dd954a0b99cd3339e1ce33 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Tue, 16 Jul 2024 13:50:07 +0200
Subject: [PATCH 09/17] feat: userPanel

---
 public/no-image-dark.png        | Bin 0 -> 7038 bytes
 public/no-image.png             | Bin 0 -> 2181 bytes
 public/no-user.png              | Bin 0 -> 10119 bytes
 src/components/LeftMenu.vue     |   3 +--
 src/components/LeftMenuItem.vue |   2 +-
 src/components/NavBar.vue       |  15 +++++++--------
 src/components/UserPanel.vue    |   4 ++++
 src/components/ui/VnImg.vue     |  28 +++++++++++++++++++---------
 src/composables/useRole.js      |   4 ++++
 9 files changed, 36 insertions(+), 20 deletions(-)
 create mode 100644 public/no-image-dark.png
 create mode 100644 public/no-image.png
 create mode 100644 public/no-user.png

diff --git a/public/no-image-dark.png b/public/no-image-dark.png
new file mode 100644
index 0000000000000000000000000000000000000000..2a20d7eb4970509bc5f8e9a2bb2b5d33fee3c260
GIT binary patch
literal 7038
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

literal 0
HcmV?d00001

diff --git a/public/no-image.png b/public/no-image.png
new file mode 100644
index 0000000000000000000000000000000000000000..11d5317a90bbc35e52789e30afe20af7f6247a9e
GIT binary patch
literal 2181
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
O0|4*jj;(b3h4v?4J+RdP

literal 0
HcmV?d00001

diff --git a/public/no-user.png b/public/no-user.png
new file mode 100644
index 0000000000000000000000000000000000000000..e090bc2eb440cc53b9c3e3239a5e5b7f1afb0f5a
GIT binary patch
literal 10119
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
B)2{#k

literal 0
HcmV?d00001

diff --git a/src/components/LeftMenu.vue b/src/components/LeftMenu.vue
index 3cccd0d2f..206c5161b 100644
--- a/src/components/LeftMenu.vue
+++ b/src/components/LeftMenu.vue
@@ -66,9 +66,8 @@ function getRoutes() {
             const moduleDef = routes.find(
                 (route) => toLowerCamel(route.name) === item.module
             );
-            item.children = [];
-
             if (!moduleDef) continue;
+            item.children = [];
 
             addChildren(item.module, moduleDef, item.children);
         }
diff --git a/src/components/LeftMenuItem.vue b/src/components/LeftMenuItem.vue
index d12fb8428..f3f2315a3 100644
--- a/src/components/LeftMenuItem.vue
+++ b/src/components/LeftMenuItem.vue
@@ -21,7 +21,7 @@ const itemComputed = computed(() => {
 </script>
 <template>
     <QItem
-        active-class="bg-hover"
+        active-class="bg-vn-hover"
         class="min-height"
         :to="{ name: itemComputed.name }"
         clickable
diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
index c6722d875..3051e8b99 100644
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@@ -1,21 +1,19 @@
 <script setup>
 import { onMounted, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useSession } from 'src/composables/useSession';
 import { useState } from 'src/composables/useState';
 import { useStateStore } from 'stores/useStateStore';
 import { useQuasar } from 'quasar';
 import PinnedModules from './PinnedModules.vue';
 import UserPanel from 'components/UserPanel.vue';
 import VnBreadcrumbs from './common/VnBreadcrumbs.vue';
+import VnImg from 'src/components/ui/VnImg.vue';
 
 const { t } = useI18n();
 const stateStore = useStateStore();
 const quasar = useQuasar();
 const state = useState();
 const user = state.getUser();
-const { getTokenMultimedia } = useSession();
-const token = getTokenMultimedia();
 const appName = 'Lilium';
 
 onMounted(() => stateStore.setMounted());
@@ -83,11 +81,12 @@ const pinnedModulesRef = ref();
                     id="user"
                 >
                     <QAvatar size="lg">
-                        <QImg
-                            :src="`/api/Images/user/160x160/${user.id}/download?access_token=${token}`"
-                            spinner-color="primary"
-                        >
-                        </QImg>
+                        <VnImg
+                            :id="user.id"
+                            collection="user"
+                            size="160x160"
+                            :zoom-size="null"
+                        />
                     </QAvatar>
                     <QTooltip bottom>
                         {{ t('globals.userPanel') }}
diff --git a/src/components/UserPanel.vue b/src/components/UserPanel.vue
index 9c3b456b1..cc904f9cc 100644
--- a/src/components/UserPanel.vue
+++ b/src/components/UserPanel.vue
@@ -12,6 +12,7 @@ import VnRow from 'components/ui/VnRow.vue';
 import FetchData from 'components/FetchData.vue';
 import { useClipboard } from 'src/composables/useClipboard';
 import VnImg from 'src/components/ui/VnImg.vue';
+import { useRole } from 'src/composables/useRole';
 
 const state = useState();
 const session = useSession();
@@ -99,6 +100,7 @@ function saveUserData(param, value) {
     axios.post('UserConfigs/setUserConfig', { [param]: value });
     localUserData();
 }
+const isEmployee = computed(() => useRole().isEmployee());
 </script>
 
 <template>
@@ -109,12 +111,14 @@ function saveUserData(param, value) {
         auto-load
     />
     <FetchData
+        v-if="isEmployee"
         url="Companies"
         order="name"
         @on-fetch="(data) => (companiesData = data)"
         auto-load
     />
     <FetchData
+        v-if="isEmployee"
         url="Accountings"
         order="name"
         @on-fetch="(data) => (accountBankData = data)"
diff --git a/src/components/ui/VnImg.vue b/src/components/ui/VnImg.vue
index 37c1edefc..985c9cc53 100644
--- a/src/components/ui/VnImg.vue
+++ b/src/components/ui/VnImg.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed, onMounted } from 'vue';
+import { ref, computed } from 'vue';
 import { useSession } from 'src/composables/useSession';
 
 const $props = defineProps({
@@ -28,21 +28,29 @@ const $props = defineProps({
 const show = ref(false);
 const token = useSession().getTokenMultimedia();
 const timeStamp = ref(`timestamp=${Date.now()}`);
-const url = computed(
-    () =>
-        `/api/${$props.storage}/${$props.collection}/${$props.size}/${$props.id}/download?access_token=${token}&${timeStamp.value}`
-);
+import noImage from '/no-user.png';
+import { useRole } from 'src/composables/useRole';
+const url = computed(() => {
+    const isEmployee = useRole().isEmployee();
+    return isEmployee
+        ? `/api/${$props.storage}/${$props.collection}/${$props.size}/${$props.id}/download?access_token=${token}&${timeStamp.value}`
+        : noImage;
+});
 const reload = () => {
     timeStamp.value = `timestamp=${Date.now()}`;
 };
 defineExpose({
     reload,
 });
-
-onMounted(() => {});
 </script>
 <template>
-    <QImg :src="url" v-bind="$attrs" @click="show = !show" spinner-color="primary" />
+    <QImg
+        :class="{ zoomIn: $props.zoomSize }"
+        :src="url"
+        v-bind="$attrs"
+        @click="show = !show"
+        spinner-color="primary"
+    />
     <QDialog v-model="show" v-if="$props.zoomSize">
         <QImg
             :src="url"
@@ -56,7 +64,9 @@ onMounted(() => {});
 
 <style lang="scss" scoped>
 .q-img {
-    cursor: zoom-in;
+    &.zoomIn {
+        cursor: zoom-in;
+    }
     min-width: 50px;
 }
 .rounded {
diff --git a/src/composables/useRole.js b/src/composables/useRole.js
index 95b585283..d1a6d6ef3 100644
--- a/src/composables/useRole.js
+++ b/src/composables/useRole.js
@@ -27,8 +27,12 @@ export function useRole() {
 
         return false;
     }
+    function isEmployee() {
+        return hasAny(['employee']);
+    }
 
     return {
+        isEmployee,
         fetch,
         hasAny,
         state,

From c7c6f0f1c6d0b7fb32a025811d776b7d57dc3619 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Tue, 16 Jul 2024 13:50:16 +0200
Subject: [PATCH 10/17] filter: vnfilterPanel

---
 src/components/ui/VnFilterPanel.vue | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/ui/VnFilterPanel.vue b/src/components/ui/VnFilterPanel.vue
index 9eff3d322..332e83d3c 100644
--- a/src/components/ui/VnFilterPanel.vue
+++ b/src/components/ui/VnFilterPanel.vue
@@ -10,7 +10,7 @@ const { t } = useI18n();
 const $props = defineProps({
     modelValue: {
         type: Object,
-        default: () => {}
+        default: () => {},
     },
     dataKey: {
         type: String,
@@ -67,9 +67,9 @@ const arrayData = useArrayData($props.dataKey, {
 });
 const route = useRoute();
 const store = arrayData.store;
-const userParams = ref({})
+const userParams = ref({});
 onMounted(() => {
-    userParams.value = $props.modelValue ?? {}
+    userParams.value = $props.modelValue ?? {};
     emit('init', { params: userParams.value });
 });
 
@@ -92,6 +92,11 @@ watch(
     (val) => setUserParams(val)
 );
 
+watch(
+    () => $props.modelValue,
+    (val) => (userParams.value = val ?? {})
+);
+
 const isLoading = ref(false);
 async function search(evt) {
     if (evt && $props.disableSubmitEvent) return;

From 901a9e1f6d3aef759f7571b8593bfad4e4f32ee4 Mon Sep 17 00:00:00 2001
From: Jon <jon@verdnatura.es>
Date: Thu, 18 Jul 2024 12:13:38 +0200
Subject: [PATCH 11/17] fix: refs #7323 fix department & email table filter

---
 src/components/common/VnInputTime.vue |  1 -
 src/pages/Worker/WorkerList.vue       | 23 ++++++++++++-----------
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/components/common/VnInputTime.vue b/src/components/common/VnInputTime.vue
index 82458e21b..a59f0e9e8 100644
--- a/src/components/common/VnInputTime.vue
+++ b/src/components/common/VnInputTime.vue
@@ -2,7 +2,6 @@
 import { watch, computed, ref, nextTick } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { date } from 'quasar';
-import { nextTick } from 'vue';
 
 const model = defineModel({ type: String });
 const props = defineProps({
diff --git a/src/pages/Worker/WorkerList.vue b/src/pages/Worker/WorkerList.vue
index 27b4982ee..91f2a61d7 100644
--- a/src/pages/Worker/WorkerList.vue
+++ b/src/pages/Worker/WorkerList.vue
@@ -42,26 +42,27 @@ const columns = computed(() => [
     },
     {
         align: 'left',
-        name: 'department',
+        name: 'departmentFk',
         label: t('tableColumns.department'),
         cardVisible: true,
-        component: 'select',
-        attrs: {
-            url: 'Departments',
-            fields: ['id', 'name'],
-        },
-        columnField: {
-            component: null,
+        columnFilter: {
+            component: 'select',
+            inWhere: true,
+            alias: 'wd',
+            attrs: {
+                url: 'Departments',
+            },
         },
+        format: (row, dashIfEmpty) => dashIfEmpty(row.department),
     },
     {
         align: 'left',
         name: 'email',
         label: t('tableColumns.email'),
-        component: 'input',
         cardVisible: true,
-        columnField: {
-            component: null,
+        columnFilter: {
+            alias: 'mu',
+            inWhere: true,
         },
     },
     {

From 5833b4d856db5b44dfe81775d48a4ad85efb9db4 Mon Sep 17 00:00:00 2001
From: alexm <alexm@verdnatura.es>
Date: Thu, 18 Jul 2024 13:53:57 +0200
Subject: [PATCH 12/17] fix(VnTable): autoload when has url parameters

---
 src/components/VnTable/VnTable.vue | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/components/VnTable/VnTable.vue b/src/components/VnTable/VnTable.vue
index 97053184a..22fd3acaf 100644
--- a/src/components/VnTable/VnTable.vue
+++ b/src/components/VnTable/VnTable.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted, computed, watch } from 'vue';
+import { ref, onBeforeMount, onMounted, computed, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute, useRouter } from 'vue-router';
 import { useQuasar } from 'quasar';
@@ -96,6 +96,7 @@ const DEFAULT_MODE = 'card';
 const TABLE_MODE = 'table';
 const mode = ref(DEFAULT_MODE);
 const selected = ref([]);
+const hasParams = ref(false);
 const routeQuery = JSON.parse(route?.query[$props.searchUrl] ?? '{}');
 const params = ref({ ...routeQuery, ...routeQuery.filter?.where });
 const orders = ref(parseOrder(routeQuery.filter?.order));
@@ -117,11 +118,14 @@ const tableModes = [
         disable: $props.disableOption?.card,
     },
 ];
+onBeforeMount(() => {
+    setUserParams(route.query[$props.searchUrl]);
+    hasParams.value = Object.keys(params.value).length !== 0;
+});
 
 onMounted(() => {
     mode.value = quasar.platform.is.mobile ? DEFAULT_MODE : $props.defaultMode;
     stateStore.rightDrawer = true;
-    setUserParams(route.query[$props.searchUrl]);
     columnsVisibilitySkiped.value = [
         ...splittedColumns.value.columns
             .filter((c) => c.visible == false)
@@ -295,6 +299,7 @@ defineExpose({
             :disable-infinite-scroll="isTableMode"
             @save-changes="reload"
             :has-sub-toolbar="$attrs['hasSubToolbar'] ?? isEditable"
+            :auto-load="hasParams || $attrs['auto-load']"
         >
             <template
                 v-for="(_, slotName) in $slots"

From f8026dd3f6f0eabdb9e93e5e54acd46c1b0df8e8 Mon Sep 17 00:00:00 2001
From: alexm <alexm@verdnatura.es>
Date: Thu, 18 Jul 2024 13:54:22 +0200
Subject: [PATCH 13/17] feat: improve VnSelectCache add find by Object

---
 src/components/VnTable/VnFilter.vue     | 23 +++++++++++++----------
 src/components/common/VnSelect.vue      |  3 ++-
 src/components/common/VnSelectCache.vue | 21 +++++++++++++++++----
 src/pages/Route/Cmr/CmrList.vue         |  5 +----
 src/pages/Route/RouteList.vue           | 22 ++++++++++++++++------
 5 files changed, 49 insertions(+), 25 deletions(-)

diff --git a/src/components/VnTable/VnFilter.vue b/src/components/VnTable/VnFilter.vue
index 15e1cc947..285e2338e 100644
--- a/src/components/VnTable/VnFilter.vue
+++ b/src/components/VnTable/VnFilter.vue
@@ -48,6 +48,17 @@ const forceAttrs = {
     label: $props.showTitle ? '' : $props.column.label,
 };
 
+const selectComponent = {
+    component: markRaw(VnSelect),
+    event: updateEvent,
+    attrs: {
+        class: 'q-px-sm q-pb-xs q-pt-none fit',
+        dense: true,
+        filled: !$props.showTitle,
+    },
+    forceAttrs,
+};
+
 const components = {
     input: {
         component: markRaw(VnInput),
@@ -97,16 +108,8 @@ const components = {
         },
         forceAttrs,
     },
-    select: {
-        component: markRaw(VnSelect),
-        event: updateEvent,
-        attrs: {
-            class: 'q-px-sm q-pb-xs q-pt-none fit',
-            dense: true,
-            filled: !$props.showTitle,
-        },
-        forceAttrs,
-    },
+    select: selectComponent,
+    rawSelect: selectComponent,
 };
 
 async function addFilter(value) {
diff --git a/src/components/common/VnSelect.vue b/src/components/common/VnSelect.vue
index e3bda6c8e..3cba466a3 100644
--- a/src/components/common/VnSelect.vue
+++ b/src/components/common/VnSelect.vue
@@ -125,7 +125,8 @@ function filter(val, options) {
             });
         }
 
-        const id = row.id;
+        if (!row) return;
+        const id = row[$props.optionValue];
         const optionLabel = String(row[$props.optionLabel]).toLowerCase();
 
         return id == search || optionLabel.includes(search);
diff --git a/src/components/common/VnSelectCache.vue b/src/components/common/VnSelectCache.vue
index 51873ef6e..a9acd7b9f 100644
--- a/src/components/common/VnSelectCache.vue
+++ b/src/components/common/VnSelectCache.vue
@@ -8,18 +8,31 @@ const $props = defineProps({
         default: null,
     },
     find: {
-        type: String,
+        type: [String, Object],
         default: null,
     },
 });
 const options = ref([]);
+
 onBeforeMount(async () => {
-    const { url } = useAttrs();
+    const { url, optionValue, optionLabel } = useAttrs();
     const findBy = $props.find ?? url?.charAt(0)?.toLocaleLowerCase() + url?.slice(1, -1);
-    if (findBy) options.value = [$props.row[findBy]];
+    if (!findBy || !$props.row) return;
+    // is object
+    if (typeof findBy == 'object') {
+        const { value, label } = findBy;
+        if (!$props.row[value] || !$props.row[label]) return;
+        return (options.value = [
+            {
+                [optionValue ?? 'id']: $props.row[value],
+                [optionLabel ?? 'name']: $props.row[label],
+            },
+        ]);
+    }
+    // is string
+    if ($props.row[findBy]) options.value = [$props.row[findBy]];
 });
 </script>
-
 <template>
     <VnSelect v-bind="$attrs" :options="$attrs.options ?? options" />
 </template>
diff --git a/src/pages/Route/Cmr/CmrList.vue b/src/pages/Route/Cmr/CmrList.vue
index 6dfd3a1e5..0cc0adcf3 100644
--- a/src/pages/Route/Cmr/CmrList.vue
+++ b/src/pages/Route/Cmr/CmrList.vue
@@ -72,10 +72,7 @@ const columns = computed(() => [
         label: t('globals.warehouse'),
         component: 'select',
         attrs: {
-            url: 'warehouses',
-            fields: ['id', 'name'],
-            optionLabel: 'name',
-            optionValue: 'id',
+            options: warehouses.value,
         },
     },
     {
diff --git a/src/pages/Route/RouteList.vue b/src/pages/Route/RouteList.vue
index 55bcdabb0..0f7c06de9 100644
--- a/src/pages/Route/RouteList.vue
+++ b/src/pages/Route/RouteList.vue
@@ -57,9 +57,13 @@ const columns = computed(() => [
         component: 'select',
         attrs: {
             url: 'Workers/activeWithInheritedRole',
-            fields: ['id', 'nickname'],
-            optionValue: 'id',
-            optionLabel: 'nickname',
+            fields: ['id', 'name'],
+            useLike: false,
+            optionFilter: 'firstName',
+            find: {
+                value: 'workerFk',
+                label: 'workerUserName',
+            },
         },
         useLike: false,
         cardVisible: true,
@@ -76,8 +80,10 @@ const columns = computed(() => [
         attrs: {
             url: 'agencyModes',
             fields: ['id', 'name'],
-            optionLabel: 'name',
-            optionValue: 'id',
+            find: {
+                value: 'agencyModeFk',
+                label: 'agencyName',
+            },
         },
     },
     {
@@ -91,7 +97,10 @@ const columns = computed(() => [
             url: 'vehicles',
             fields: ['id', 'numberPlate'],
             optionLabel: 'numberPlate',
-            optionValue: 'id',
+            find: {
+                value: 'vehicleFk',
+                label: 'vehiclePlateNumber',
+            },
         },
     },
     {
@@ -248,6 +257,7 @@ const openTicketsDialog = (id) => {
         :is-editable="true"
         :filter="routeFilter"
         redirect="route"
+        :row-click="false"
         :create="{
             urlCreate: 'Routes',
             title: t('Create route'),

From f171774605129b3529cd75891302ebb1e6f24fc1 Mon Sep 17 00:00:00 2001
From: Jon <jon@verdnatura.es>
Date: Fri, 19 Jul 2024 07:42:58 +0200
Subject: [PATCH 14/17] fix: refs #7323 fixed left filter

---
 src/components/ui/VnFilterPanel.vue  | 17 +++++++++++++----
 src/pages/Worker/Card/WorkerCard.vue |  2 +-
 src/pages/Worker/WorkerList.vue      | 12 +++++++++---
 3 files changed, 23 insertions(+), 8 deletions(-)

diff --git a/src/components/ui/VnFilterPanel.vue b/src/components/ui/VnFilterPanel.vue
index b93ca7121..348ec8eea 100644
--- a/src/components/ui/VnFilterPanel.vue
+++ b/src/components/ui/VnFilterPanel.vue
@@ -108,11 +108,20 @@ const isLoading = ref(false);
 async function search(evt) {
     if (evt && $props.disableSubmitEvent) return;
 
-    store.filter.where = {};
+    store.filter.where = Object.entries($props.modelValue).reduce((acc, [key, val]) => {
+        if (key.indexOf('.') > 0) {
+            acc[key] = val;
+        }
+        return acc;
+    }, {});
     isLoading.value = true;
-    const filter = { ...userParams.value };
+    const filter = {
+        ...userParams.value,
+    };
     store.userParamsChanged = true;
-    const { params: newParams } = await arrayData.addFilter({ params: userParams.value });
+    const { params: newParams } = await arrayData.addFilter({
+        params: userParams.value,
+    });
     userParams.value = newParams;
 
     if (!$props.showAll && !Object.values(filter).length) store.data = [];
@@ -197,7 +206,7 @@ function formatValue(value) {
         color="primary"
         style="position: fixed; z-index: 1; right: 0; bottom: 0"
         icon="search"
-        @click="search()"
+        @click="search($event)"
     ></QBtn>
     <QForm @submit="search" id="filterPanelForm">
         <QList dense>
diff --git a/src/pages/Worker/Card/WorkerCard.vue b/src/pages/Worker/Card/WorkerCard.vue
index fb9ab9666..1a5bacf2f 100644
--- a/src/pages/Worker/Card/WorkerCard.vue
+++ b/src/pages/Worker/Card/WorkerCard.vue
@@ -5,7 +5,7 @@ import WorkerFilter from '../WorkerFilter.vue';
 </script>
 <template>
     <VnCard
-        data-key="Worker"
+        data-key="Workers"
         base-url="Workers"
         :descriptor="WorkerDescriptor"
         :filter-panel="WorkerFilter"
diff --git a/src/pages/Worker/WorkerList.vue b/src/pages/Worker/WorkerList.vue
index 91f2a61d7..498ad74e6 100644
--- a/src/pages/Worker/WorkerList.vue
+++ b/src/pages/Worker/WorkerList.vue
@@ -29,6 +29,10 @@ const columns = computed(() => [
         align: 'left',
         name: 'id',
         label: t('tableColumns.id'),
+        columnFilter: {
+            alias: 'w',
+            inWhere: true,
+        },
         chip: {
             condition: () => true,
         },
@@ -39,6 +43,9 @@ const columns = computed(() => [
         name: 'nickname',
         label: t('tableColumns.name'),
         isTitle: true,
+        columnFilter: {
+            name: 'search',
+        },
     },
     {
         align: 'left',
@@ -98,7 +105,7 @@ function uppercaseStreetModel(data) {
 </script>
 <template>
     <VnSearchbar
-        data-key="WorkerList"
+        data-key="Worker"
         :label="t('Search worker')"
         :info="t('You can search by worker id or name')"
     />
@@ -124,7 +131,7 @@ function uppercaseStreetModel(data) {
     />
     <VnTable
         ref="tableRef"
-        data-key="worker"
+        data-key="Worker"
         url="Workers/filter"
         :create="{
             urlCreate: 'Workers/new',
@@ -137,7 +144,6 @@ function uppercaseStreetModel(data) {
         :columns="columns"
         default-mode="table"
         redirect="worker"
-        :use-model="true"
         auto-load
     >
         <template #more-create-dialog="{ data }">

From 26cdae23840e8d45cd7802e89dec6ac4d183e4b9 Mon Sep 17 00:00:00 2001
From: Jon <jon@verdnatura.es>
Date: Fri, 19 Jul 2024 08:18:41 +0200
Subject: [PATCH 15/17] refactor: refs #7323 hidden column filter proposal

---
 src/components/ui/VnFilterPanel.vue | 17 ++++-------------
 src/pages/Worker/WorkerList.vue     |  1 +
 2 files changed, 5 insertions(+), 13 deletions(-)

diff --git a/src/components/ui/VnFilterPanel.vue b/src/components/ui/VnFilterPanel.vue
index 348ec8eea..b93ca7121 100644
--- a/src/components/ui/VnFilterPanel.vue
+++ b/src/components/ui/VnFilterPanel.vue
@@ -108,20 +108,11 @@ const isLoading = ref(false);
 async function search(evt) {
     if (evt && $props.disableSubmitEvent) return;
 
-    store.filter.where = Object.entries($props.modelValue).reduce((acc, [key, val]) => {
-        if (key.indexOf('.') > 0) {
-            acc[key] = val;
-        }
-        return acc;
-    }, {});
+    store.filter.where = {};
     isLoading.value = true;
-    const filter = {
-        ...userParams.value,
-    };
+    const filter = { ...userParams.value };
     store.userParamsChanged = true;
-    const { params: newParams } = await arrayData.addFilter({
-        params: userParams.value,
-    });
+    const { params: newParams } = await arrayData.addFilter({ params: userParams.value });
     userParams.value = newParams;
 
     if (!$props.showAll && !Object.values(filter).length) store.data = [];
@@ -206,7 +197,7 @@ function formatValue(value) {
         color="primary"
         style="position: fixed; z-index: 1; right: 0; bottom: 0"
         icon="search"
-        @click="search($event)"
+        @click="search()"
     ></QBtn>
     <QForm @submit="search" id="filterPanelForm">
         <QList dense>
diff --git a/src/pages/Worker/WorkerList.vue b/src/pages/Worker/WorkerList.vue
index 498ad74e6..0c2656597 100644
--- a/src/pages/Worker/WorkerList.vue
+++ b/src/pages/Worker/WorkerList.vue
@@ -71,6 +71,7 @@ const columns = computed(() => [
             alias: 'mu',
             inWhere: true,
         },
+        hidden: true,
     },
     {
         align: 'right',

From 55c8de78fc3ada450e6390ef12356de3fdbc161e Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Fri, 19 Jul 2024 09:20:33 +0200
Subject: [PATCH 16/17] perf: VnFilterPanel

---
 src/components/ui/VnFilterPanel.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/ui/VnFilterPanel.vue b/src/components/ui/VnFilterPanel.vue
index b93ca7121..27b6e7b34 100644
--- a/src/components/ui/VnFilterPanel.vue
+++ b/src/components/ui/VnFilterPanel.vue
@@ -110,9 +110,11 @@ async function search(evt) {
 
     store.filter.where = {};
     isLoading.value = true;
-    const filter = { ...userParams.value };
+    const filter = { ...userParams.value, ...$props.modelValue };
     store.userParamsChanged = true;
-    const { params: newParams } = await arrayData.addFilter({ params: userParams.value });
+    const { params: newParams } = await arrayData.addFilter({
+        params: filter,
+    });
     userParams.value = newParams;
 
     if (!$props.showAll && !Object.values(filter).length) store.data = [];

From 50c8b3c672cdaac1507854f4d95a180d6685b2fb Mon Sep 17 00:00:00 2001
From: guillermo <guillermo@verdnatura.es>
Date: Fri, 19 Jul 2024 13:07:30 +0200
Subject: [PATCH 17/17] fix: refs #7648 Fix order property

---
 src/pages/Entry/MyEntries.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/Entry/MyEntries.vue b/src/pages/Entry/MyEntries.vue
index d4b73b479..45990235d 100644
--- a/src/pages/Entry/MyEntries.vue
+++ b/src/pages/Entry/MyEntries.vue
@@ -98,7 +98,6 @@ const printBuys = (rowId) => {
                 ref="myEntriesRef"
                 data-key="myEntriesList"
                 url="Entries/filter"
-                :order="['landed DESC', 'id DESC']"
                 :columns="columns"
                 default-mode="card"
                 auto-load