From aa8e052633ca66d4c9cb4e2d65d7cfe0193e6a65 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Thu, 21 Mar 2024 11:15:18 -0300
Subject: [PATCH 01/42] QCalendar implementation test

---
 package.json                         |  1 +
 pnpm-lock.yaml                       |  7 ++++
 src/components/common/VnCalendar.vue | 61 ++++++++++++++++++++++++++++
 3 files changed, 69 insertions(+)
 create mode 100644 src/components/common/VnCalendar.vue

diff --git a/package.json b/package.json
index a35020b66..94d6b556f 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "dependencies": {
         "@quasar/cli": "^2.3.0",
         "@quasar/extras": "^1.16.9",
+        "@quasar/quasar-ui-qcalendar": "4.0.0-beta.19",
         "axios": "^1.4.0",
         "chromium": "^3.0.3",
         "croppie": "^2.6.5",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f3fe7df55..9feb28aaa 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -11,6 +11,9 @@ dependencies:
   '@quasar/extras':
     specifier: ^1.16.9
     version: 1.16.9
+  '@quasar/quasar-ui-qcalendar':
+    specifier: 4.0.0-beta.19
+    version: 4.0.0-beta.19
   axios:
     specifier: ^1.4.0
     version: 1.6.7
@@ -939,6 +942,10 @@ packages:
       - vite
     dev: true
 
+  /@quasar/quasar-ui-qcalendar@4.0.0-beta.19:
+    resolution: {integrity: sha512-BT0G2JjgKl1bqNrY5utcYeoy8gK+U9k3Pz1YDi1OB265W/jHU6nFoWMEUdY3JdvMccwkXTL2DLVyl3eqAUyLyg==}
+    dev: false
+
   /@quasar/render-ssr-error@1.0.3:
     resolution: {integrity: sha512-A8RF99q6/sOSe1Ighnh5syEIbliD3qUYEJd2HyfFyBPSMF+WYGXon5dmzg4nUoK662NgOggInevkDyBDJcZugg==}
     engines: {node: '>= 16'}
diff --git a/src/components/common/VnCalendar.vue b/src/components/common/VnCalendar.vue
new file mode 100644
index 000000000..7403fc6ef
--- /dev/null
+++ b/src/components/common/VnCalendar.vue
@@ -0,0 +1,61 @@
+<template>
+    <QCalendarMonth
+        ref="calendarRef"
+        v-model="selectedDate"
+        v-bind="$attrs"
+        show-work-weeks
+        :weekdays="[1, 2, 3, 4, 5, 6, 0]"
+        animated
+        bordered
+        mini-mode
+        @change="onChange"
+        @moved="onMoved"
+        @click-date="onClickDate"
+        @click-day="onClickDay"
+        @click-workweek="onClickWorkweek"
+        @click-head-workweek="onClickHeadWorkweek"
+        @click-head-day="onClickHeadDay"
+        style="max-width: 300px"
+    />
+</template>
+<script setup>
+import { ref } from 'vue';
+import { QCalendarMonth, today } from '@quasar/quasar-ui-qcalendar/src/index.js';
+import '@quasar/quasar-ui-qcalendar/src/QCalendarVariables.sass';
+import '@quasar/quasar-ui-qcalendar/src/QCalendarTransitions.sass';
+import '@quasar/quasar-ui-qcalendar/src/QCalendarMonth.sass';
+
+const calendarRef = ref(null);
+const selectedDate = ref(today());
+
+const onToday = () => {
+    calendarRef.value.moveToToday();
+};
+const onPrev = () => {
+    calendarRef.value.prev();
+};
+const onNext = () => {
+    calendarRef.value.next();
+};
+const onMoved = (data) => {
+    console.log('onMoved', data);
+};
+const onChange = (data) => {
+    console.log('onChange', data);
+};
+const onClickDate = (data) => {
+    console.log('onClickDate', data);
+};
+const onClickDay = (data) => {
+    console.log('onClickDay', data);
+};
+const onClickWorkweek = (data) => {
+    console.log('onClickWorkweek', data);
+};
+const onClickHeadDay = (data) => {
+    console.log('onClickHeadDay', data);
+};
+const onClickHeadWorkweek = (data) => {
+    console.log('onClickHeadWorkweek', data);
+};
+</script>

From 3d1e34a5b049ff2f9bdcae402c34c6ca2f17f61c Mon Sep 17 00:00:00 2001
From: Kevin Martinez <kevin.martinez@mindshore.io>
Date: Sun, 24 Mar 2024 16:05:04 -0300
Subject: [PATCH 02/42] Create worker date label

---
 src/pages/Worker/Card/WorkerDateLabel.vue | 40 +++++++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 src/pages/Worker/Card/WorkerDateLabel.vue

diff --git a/src/pages/Worker/Card/WorkerDateLabel.vue b/src/pages/Worker/Card/WorkerDateLabel.vue
new file mode 100644
index 000000000..e087ccf72
--- /dev/null
+++ b/src/pages/Worker/Card/WorkerDateLabel.vue
@@ -0,0 +1,40 @@
+<script setup>
+defineProps({
+    color: {
+        type: String,
+        default: null,
+    },
+    avatarClass: {
+        type: String,
+        default: null,
+    },
+    selected: {
+        type: Boolean,
+        default: undefined,
+    },
+});
+defineEmits(['update:selected']);
+</script>
+
+<template>
+    <QChip
+        class="chip"
+        :selected="selected"
+        :style="selected ? { backgroundColor: color } : null"
+        :text-color="selected ? 'white' : null"
+        @update:selected="$emit('update:selected', $event)"
+    >
+        <QAvatar
+            :color="color"
+            :class="avatarClass"
+            :style="{ backgroundColor: color }"
+        />
+        <slot />
+    </QChip>
+</template>
+
+<style scoped lang="scss">
+.chip {
+    background-color: var(--vn-light-gray);
+}
+</style>

From 0dee7e8cc9f86721f11a61e36abf62e0cbb6501c Mon Sep 17 00:00:00 2001
From: Kevin Martinez <kevin.martinez@mindshore.io>
Date: Wed, 27 Mar 2024 16:51:44 -0300
Subject: [PATCH 03/42] Create worker calendar submodule

---
 src/pages/Worker/Card/WorkerCalendar.vue      |  95 +++++++
 .../Worker/Card/WorkerCalendarFilter.vue      | 240 ++++++++++++++++++
 src/pages/Worker/Card/WorkerCalendarItem.vue  |  41 +++
 src/router/modules/worker.js                  |  11 +-
 4 files changed, 386 insertions(+), 1 deletion(-)
 create mode 100644 src/pages/Worker/Card/WorkerCalendar.vue
 create mode 100644 src/pages/Worker/Card/WorkerCalendarFilter.vue
 create mode 100644 src/pages/Worker/Card/WorkerCalendarItem.vue

diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
new file mode 100644
index 000000000..aca65750a
--- /dev/null
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -0,0 +1,95 @@
+<script setup>
+import { useI18n } from 'vue-i18n';
+import { useStateStore } from 'stores/useStateStore';
+import WorkerCalendarFilter from 'pages/Worker/Card/WorkerCalendarFilter.vue';
+import FetchData from 'components/FetchData.vue';
+import { useRoute } from 'vue-router';
+import { ref } from 'vue';
+import WorkerCalendarItem from "pages/Worker/Card/WorkerCalendarItem.vue";
+
+const stateStore = useStateStore();
+const route = useRoute();
+const { t } = useI18n();
+
+const businessFk = ref(null);
+const absenceType = ref(null);
+const hasWorkCenter = ref(false);
+const isSubordinate = ref(false);
+const year = ref(Date.vnNew().getFullYear());
+
+const onFetchActiveContract = (data) => {
+    businessFk.value = data?.businessFk;
+    hasWorkCenter.value = Boolean(data?.workCenterFk);
+};
+</script>
+
+<template>
+    <FetchData
+        :url="`Workers/${route.params.id}/activeContract`"
+        @on-fetch="onFetchActiveContract"
+        auto-load
+    />
+    <FetchData
+        :url="`Workers/${route.params.id}/isSubordinate`"
+        @on-fetch="(data) => (isSubordinate = data)"
+        auto-load
+    />
+    <template v-if="stateStore.isHeaderMounted()">
+        <Teleport to="#actions-append">
+            <div class="row q-gutter-x-sm">
+                <QBtn
+                    flat
+                    @click="stateStore.toggleRightDrawer()"
+                    round
+                    dense
+                    icon="menu"
+                >
+                    <QTooltip bottom anchor="bottom right">
+                        {{ t('globals.collapseMenu') }}
+                    </QTooltip>
+                </QBtn>
+            </div>
+        </Teleport>
+    </template>
+    <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
+        <QScrollArea class="fit text-grey-8">
+            <WorkerCalendarFilter
+                v-model:business-fk="businessFk"
+                v-model:year="year"
+                v-model:absence-type="absenceType"
+            />
+        </QScrollArea>
+    </QDrawer>
+    <QPage class="column items-center q-pa-md">
+        <QCard v-if="!hasWorkCenter">
+            <QCardSection class="text-center">
+                {{ t('Autonomous worker') }}
+            </QCardSection>
+        </QCard>
+        <QCard class="full-width">
+            <QCardSection class="card-calendar">
+                <WorkerCalendarItem
+                    class="full-width"
+                    show-work-weeks
+                    animated
+                    bordered
+                    mini-mode
+                    :year="year"
+                    month="1"
+                />
+            </QCardSection>
+        </QCard>
+    </QPage>
+</template>
+<style lang="scss" scoped>
+.card-calendar{
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+</style>
+
+<i18n>
+es:
+    Search worker: Buscar trabajador
+    You can search by worker id or name: Puedes buscar por id o nombre del trabajador
+</i18n>
diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
new file mode 100644
index 000000000..d73305085
--- /dev/null
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -0,0 +1,240 @@
+<script setup>
+import WorkerDateLabel from 'pages/Worker/Card/WorkerDateLabel.vue';
+import FetchData from 'components/FetchData.vue';
+import { useI18n } from 'vue-i18n';
+import VnSelectFilter from 'components/common/VnSelectFilter.vue';
+import { useRoute } from 'vue-router';
+import { computed, ref, watch } from 'vue';
+import { toDateFormat } from '../../../filters/date';
+import axios from 'axios';
+
+const { t } = useI18n();
+const route = useRoute();
+
+const props = defineProps({
+    businessFk: {
+        type: Number,
+        default: null,
+    },
+    year: {
+        type: [Number, String],
+        default: null,
+    },
+    absenceType: {
+        type: Number,
+        default: null,
+    },
+});
+
+const emit = defineEmits(['update:businessFk', 'update:year', 'update:absenceType']);
+
+const selectedBusinessFk = computed({
+    get: () => props.businessFk,
+    set: (value) => {
+        console.log('businessFk', value);
+        emit('update:businessFk', value);
+    },
+});
+const selectedYear = computed({
+    get: () => props.year,
+    set: (value) => emit('update:year', value),
+});
+const selectedAbsenceType = computed({
+    get: () => props.absenceType,
+    set: (value) => emit('update:absenceType', value),
+});
+
+const generateYears = () => {
+    const now = Date.vnNew();
+    const maxYear = now.getFullYear() + 1;
+
+    return Array.from({ length: 5 }, (_, i) => String(maxYear - i));
+};
+
+const absenceTypeList = ref([]);
+const contractList = ref([]);
+const yearList = ref(generateYears());
+
+const contractHolidays = ref(null);
+const yearHolidays = ref(null);
+
+const getHolidays = async (params) => {
+    return axios
+        .get(`Workers/${route.params.id}/holidays`, { params })
+        .then((res) => res.data);
+};
+
+const updateContractHolidays = async () => {
+    contractHolidays.value = await getHolidays({
+        businessFk: selectedBusinessFk.value,
+        year: selectedYear.value,
+    });
+};
+
+const updateYearHolidays = async () => {
+    yearHolidays.value = await getHolidays({ year: selectedYear.value });
+};
+
+watch(selectedYear, () => {
+    updateYearHolidays();
+    updateContractHolidays();
+});
+
+watch(selectedBusinessFk, () => {
+    updateYearHolidays();
+    updateContractHolidays();
+});
+</script>
+
+<template>
+    <FetchData
+        url="AbsenceTypes"
+        @on-fetch="(data) => (absenceTypeList = data)"
+        auto-load
+    />
+    <FetchData
+        v-if="businessFk"
+        :url="`Workers/${route.params.id}/contracts`"
+        :filter="{
+            fields: ['businessFk', 'businessFk', 'started', 'ended'],
+            where: { businessFk },
+        }"
+        @on-fetch="(data) => (contractList = data)"
+        auto-load
+    />
+    <QItem v-if="contractHolidays" class="q-py-md">
+        <QItemSection class="text-center">
+            <p class="holiday-title q-mb-sm">
+                {{ t('Contract') }} #{{ selectedBusinessFk }}
+            </p>
+            <div>
+                {{ t('Used') }} {{ contractHolidays.holidaysEnjoyed || 0 }} {{ t('of') }}
+                {{ contractHolidays.totalHolidays || 0 }}
+                {{ t('days') }}
+            </div>
+            <div>
+                {{ t('Spent') }} {{ contractHolidays.hoursEnjoyed || 0 }} {{ t('of') }}
+                {{ contractHolidays.totalHours || 0 }} {{ t('hours') }}
+            </div>
+            <div>
+                {{ t('Paid holidays') }}
+                {{ contractHolidays.payedHolidays || 0 }}
+                {{ t('days') }}
+            </div>
+        </QItemSection>
+    </QItem>
+    <QSeparator />
+    <QItem v-if="yearHolidays" class="q-py-md">
+        <QItemSection class="text-center">
+            <p class="holiday-title q-mb-sm">{{ t('Year') }} {{ selectedYear }}</p>
+            <div>
+                {{ t('Used') }} {{ yearHolidays.holidaysEnjoyed || 0 }} {{ t('of') }}
+                {{ yearHolidays.totalHolidays || 0 }} {{ t('days') }}
+            </div>
+            <div>
+                {{ t('Spent') }} {{ yearHolidays.hoursEnjoyed || 0 }} {{ t('of') }}
+                {{ yearHolidays.totalHours || 0 }} {{ t('hours') }}
+            </div>
+        </QItemSection>
+    </QItem>
+    <QSeparator />
+    <QList dense class="list q-gutter-y-sm q-my-lg">
+        <QItem>
+            <QItemSection>
+                <VnSelectFilter
+                    :label="t('Year')"
+                    v-model="selectedYear"
+                    :options="yearList || []"
+                    dense
+                    outlined
+                    rounded
+                    use-input
+                    :is-clearable="false"
+                />
+            </QItemSection>
+        </QItem>
+        <QItem>
+            <QItemSection>
+                <VnSelectFilter
+                    :label="t('Contract')"
+                    v-model="selectedBusinessFk"
+                    :options="contractList || []"
+                    option-value="businessFk"
+                    option-label="businessFk"
+                    dense
+                    outlined
+                    rounded
+                    use-input
+                    :is-clearable="false"
+                >
+                    <template #option="scope">
+                        <QItem v-bind="scope.itemProps">
+                            <QItemSection>
+                                <QItemLabel># {{ scope.opt?.businessFk }}</QItemLabel>
+                                <QItemLabel caption>
+                                    {{ toDateFormat(scope.opt?.started) }} -
+                                    {{
+                                        scope.opt?.ended
+                                            ? toDateFormat(scope.opt?.ended)
+                                            : 'Indef.'
+                                    }}
+                                </QItemLabel>
+                            </QItemSection>
+                        </QItem>
+                    </template>
+                </VnSelectFilter>
+            </QItemSection>
+        </QItem>
+    </QList>
+    <QList dense class="list q-gutter-y-sm q-my-lg">
+        <QItem v-for="type in absenceTypeList" :key="type.id">
+            <WorkerDateLabel
+                :color="type.rgb"
+                :selected="selectedAbsenceType === type.id"
+                @click="selectedAbsenceType = type.id"
+            >
+                {{ type.name }}
+            </WorkerDateLabel>
+        </QItem>
+    </QList>
+    <QSeparator />
+    <QList dense class="list q-my-lg">
+        <QItem>
+            <WorkerDateLabel avatar-class="worker-calendar-festive">
+                Festive
+            </WorkerDateLabel>
+            <WorkerDateLabel avatar-class="worker-calendar-today">
+                Current day
+            </WorkerDateLabel>
+        </QItem>
+    </QList>
+</template>
+<style lang="scss">
+.worker-calendar-festive {
+    border: 2px solid $negative;
+}
+
+.worker-calendar-today {
+    border: 2px solid $info;
+}
+</style>
+<style lang="scss" scoped>
+.holiday-title {
+    font-size: 16px;
+    font-weight: bold;
+}
+</style>
+
+<i18n>
+es:
+    Used: Utilizados
+    Spent: Utilizadas
+    Paid holidays: Vacaciones pagadas
+    of: de
+    days: días
+    hours: horas
+    Year: Año
+    Contract: Contrato
+    Festive: Festivo
+    Current day: Día actual
+</i18n>
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
new file mode 100644
index 000000000..93b1d03c5
--- /dev/null
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -0,0 +1,41 @@
+<script setup>
+import {onBeforeMount, ref} from 'vue';
+import { QCalendarMonth, today } from '@quasar/quasar-ui-qcalendar/src/index.js';
+import '@quasar/quasar-ui-qcalendar/src/QCalendarVariables.sass';
+import '@quasar/quasar-ui-qcalendar/src/QCalendarTransitions.sass';
+import '@quasar/quasar-ui-qcalendar/src/QCalendarMonth.sass';
+
+const props = defineProps({
+    year: {
+        type: Number,
+        required: true,
+    },
+    month: {
+        type: Number,
+        required: true,
+    }
+})
+const calendarRef = ref(null);
+const selectedDate = ref(today());
+
+onBeforeMount(() => {
+    const date = Date.vnNew()
+    date.setFullYear(props.year)
+    date.setMonth(props.month - 1)
+    selectedDate.value = date.toDateString()
+})
+</script>
+<template>
+    {{selectedDate}}
+    <QCalendarMonth
+        ref="calendarRef"
+        v-model="selectedDate"
+        v-bind="$attrs"
+        show-work-weeks
+        no-outside-days
+        :disabled-weekdays="[0,6]"
+        animated
+        bordered
+        mini-mode
+    />
+</template>
diff --git a/src/router/modules/worker.js b/src/router/modules/worker.js
index 1c722afe8..1331e7169 100644
--- a/src/router/modules/worker.js
+++ b/src/router/modules/worker.js
@@ -12,7 +12,7 @@ export default {
     redirect: { name: 'WorkerMain' },
     menus: {
         main: ['WorkerList', 'WorkerDepartment'],
-        card: ['WorkerNotificationsManager', 'WorkerPda'],
+        card: ['WorkerNotificationsManager', 'WorkerCalendar', 'WorkerPda'],
         departmentCard: ['BasicData'],
     },
     children: [
@@ -76,6 +76,15 @@ export default {
                     component: () =>
                         import('src/pages/Worker/Card/WorkerNotificationsManager.vue'),
                 },
+                {
+                    name: 'WorkerCalendar',
+                    path: 'calendar',
+                    meta: {
+                        title: 'calendar',
+                        icon: 'calendar_today',
+                    },
+                    component: () => import('src/pages/Worker/Card/WorkerCalendar.vue'),
+                },
                 {
                     name: 'WorkerPda',
                     path: 'pda',

From 47a588fff42e2a6dedcb50ca7b47ccacda3ef17b Mon Sep 17 00:00:00 2001
From: Kevin Martinez <kevin.martinez@mindshore.io>
Date: Tue, 2 Apr 2024 09:00:15 -0300
Subject: [PATCH 04/42] Update WorkerCalendarItem

---
 src/pages/Worker/Card/WorkerCalendar.vue     | 35 ++++++++++++------
 src/pages/Worker/Card/WorkerCalendarItem.vue | 39 ++++++++++++++------
 2 files changed, 50 insertions(+), 24 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
index aca65750a..73111cafa 100644
--- a/src/pages/Worker/Card/WorkerCalendar.vue
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -5,7 +5,7 @@ import WorkerCalendarFilter from 'pages/Worker/Card/WorkerCalendarFilter.vue';
 import FetchData from 'components/FetchData.vue';
 import { useRoute } from 'vue-router';
 import { ref } from 'vue';
-import WorkerCalendarItem from "pages/Worker/Card/WorkerCalendarItem.vue";
+import WorkerCalendarItem from 'pages/Worker/Card/WorkerCalendarItem.vue';
 
 const stateStore = useStateStore();
 const route = useRoute();
@@ -67,25 +67,36 @@ const onFetchActiveContract = (data) => {
             </QCardSection>
         </QCard>
         <QCard class="full-width">
-            <QCardSection class="card-calendar">
-                <WorkerCalendarItem
-                    class="full-width"
-                    show-work-weeks
-                    animated
-                    bordered
-                    mini-mode
-                    :year="year"
-                    month="1"
-                />
+            <QCardSection class="calendar-container">
+                <div v-for="month in 12" :key="month" class="full-width full-height">
+                    <WorkerCalendarItem class="full-width" :year="year" :month="month" />
+                </div>
             </QCardSection>
         </QCard>
     </QPage>
 </template>
 <style lang="scss" scoped>
-.card-calendar{
+.calendar-container {
     display: grid;
+    gap: 32px;
     grid-template-columns: repeat(3, minmax(0, 1fr));
 }
+
+@media (max-width: $breakpoint-md) {
+    .calendar-container {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+    }
+}
+
+@media (max-width: $breakpoint-sm) {
+    .calendar-container {
+        grid-template-columns: repeat(1, minmax(0, 1fr));
+    }
+}
+
+.calendar-item {
+    max-width: 324px;
+}
 </style>
 
 <i18n>
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index 93b1d03c5..b06d8f028 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -1,9 +1,11 @@
 <script setup>
-import {onBeforeMount, ref} from 'vue';
+import { onBeforeMount, ref, watch } from 'vue';
 import { QCalendarMonth, today } from '@quasar/quasar-ui-qcalendar/src/index.js';
 import '@quasar/quasar-ui-qcalendar/src/QCalendarVariables.sass';
 import '@quasar/quasar-ui-qcalendar/src/QCalendarTransitions.sass';
 import '@quasar/quasar-ui-qcalendar/src/QCalendarMonth.sass';
+import { date } from 'quasar';
+import { useI18n } from 'vue-i18n';
 
 const props = defineProps({
     year: {
@@ -13,29 +15,42 @@ const props = defineProps({
     month: {
         type: Number,
         required: true,
-    }
-})
+    },
+});
+
+const { locale } = useI18n();
 const calendarRef = ref(null);
 const selectedDate = ref(today());
 
+const updateSelectedDate = (year) => {
+    const dateObject = Date.vnNew();
+    dateObject.setFullYear(year);
+    dateObject.setMonth(props.month - 1);
+    selectedDate.value = date.formatDate(dateObject, 'YYYY-MM-DD');
+    console.log(date.formatDate(dateObject, 'YYYY-MM-DD'));
+};
+
 onBeforeMount(() => {
-    const date = Date.vnNew()
-    date.setFullYear(props.year)
-    date.setMonth(props.month - 1)
-    selectedDate.value = date.toDateString()
-})
+    updateSelectedDate(props.year);
+});
+
+watch(
+    () => props.year,
+    (newValue) => {
+        updateSelectedDate(newValue);
+    }
+);
 </script>
 <template>
-    {{selectedDate}}
     <QCalendarMonth
         ref="calendarRef"
         v-model="selectedDate"
-        v-bind="$attrs"
         show-work-weeks
         no-outside-days
-        :disabled-weekdays="[0,6]"
+        :selected-dates="[]"
+        :disabled-weekdays="[0, 6]"
+        :locale="locale"
         animated
-        bordered
         mini-mode
     />
 </template>

From 146d3e87db272449b86f3554ef33cca1ebeea21e Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 2 Apr 2024 12:29:31 -0300
Subject: [PATCH 05/42] Change calendar extension

---
 package.json   |  2 +-
 pnpm-lock.yaml | 15 +++++++++++----
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index 94d6b556f..f4e0a0690 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,6 @@
     "dependencies": {
         "@quasar/cli": "^2.3.0",
         "@quasar/extras": "^1.16.9",
-        "@quasar/quasar-ui-qcalendar": "4.0.0-beta.19",
         "axios": "^1.4.0",
         "chromium": "^3.0.3",
         "croppie": "^2.6.5",
@@ -33,6 +32,7 @@
         "@intlify/unplugin-vue-i18n": "^0.8.1",
         "@pinia/testing": "^0.1.2",
         "@quasar/app-vite": "^1.7.3",
+        "@quasar/quasar-app-extension-qcalendar": "4.0.0-beta.15",
         "@quasar/quasar-app-extension-testing-unit-vitest": "^0.4.0",
         "@vue/test-utils": "^2.4.4",
         "autoprefixer": "^10.4.14",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 9feb28aaa..bdff559cc 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -11,9 +11,6 @@ dependencies:
   '@quasar/extras':
     specifier: ^1.16.9
     version: 1.16.9
-  '@quasar/quasar-ui-qcalendar':
-    specifier: 4.0.0-beta.19
-    version: 4.0.0-beta.19
   axios:
     specifier: ^1.4.0
     version: 1.6.7
@@ -52,6 +49,9 @@ devDependencies:
   '@quasar/app-vite':
     specifier: ^1.7.3
     version: 1.7.3(eslint@8.56.0)(pinia@2.1.7)(quasar@2.14.5)(vue-router@4.2.5)(vue@3.4.19)
+  '@quasar/quasar-app-extension-qcalendar':
+    specifier: 4.0.0-beta.15
+    version: 4.0.0-beta.15
   '@quasar/quasar-app-extension-testing-unit-vitest':
     specifier: ^0.4.0
     version: 0.4.0(@vue/test-utils@2.4.4)(quasar@2.14.5)(vite@5.1.4)(vitest@0.31.4)(vue@3.4.19)
@@ -915,6 +915,13 @@ packages:
     resolution: {integrity: sha512-SlOhwzXyPQHWgQIS2ncyDdYdksCJvUYNtgsDQqzAKEG3r3d/ejOxvThle79HTK3Q6HB+gQWFG21Ux00Osr5XSw==}
     dev: false
 
+  /@quasar/quasar-app-extension-qcalendar@4.0.0-beta.15:
+    resolution: {integrity: sha512-i6hQkcP70LXLfVMPZMKQjSg3681gjZmASV3vq6ULzc0LhtBiPneLdVNNtH2itkWxAmaUj+1heQDI5Pa0F7VKLQ==}
+    engines: {node: '>= 10.0.0', npm: '>= 5.6.0', yarn: '>= 1.6.0'}
+    dependencies:
+      '@quasar/quasar-ui-qcalendar': 4.0.0-beta.19
+    dev: true
+
   /@quasar/quasar-app-extension-testing-unit-vitest@0.4.0(@vue/test-utils@2.4.4)(quasar@2.14.5)(vite@5.1.4)(vitest@0.31.4)(vue@3.4.19):
     resolution: {integrity: sha512-eyzdUdmZiCueNS+5nedjMmzdbpCetSrtdGIwW6KplW1dTzRbLiNvYUjpBOxQGmJCgEhWy9zuswJ7MZ/bTql24Q==}
     engines: {node: '>= 12.22.1', npm: '>= 6.14.12', yarn: '>= 1.17.3'}
@@ -944,7 +951,7 @@ packages:
 
   /@quasar/quasar-ui-qcalendar@4.0.0-beta.19:
     resolution: {integrity: sha512-BT0G2JjgKl1bqNrY5utcYeoy8gK+U9k3Pz1YDi1OB265W/jHU6nFoWMEUdY3JdvMccwkXTL2DLVyl3eqAUyLyg==}
-    dev: false
+    dev: true
 
   /@quasar/render-ssr-error@1.0.3:
     resolution: {integrity: sha512-A8RF99q6/sOSe1Ighnh5syEIbliD3qUYEJd2HyfFyBPSMF+WYGXon5dmzg4nUoK662NgOggInevkDyBDJcZugg==}

From fc87bb8293e88a63fc7d6443448d4b84906c6ca0 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 2 Apr 2024 13:04:28 -0300
Subject: [PATCH 06/42] Add page title name

---
 src/i18n/en/index.js | 5 +++--
 src/i18n/es/index.js | 5 +++--
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index 80744b83d..34ce16aa7 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -837,6 +837,7 @@ export default {
             workerCreate: 'New worker',
             department: 'Department',
             pda: 'PDA',
+            calendar: 'Calendar',
         },
         list: {
             name: 'Name',
@@ -955,7 +956,7 @@ export default {
             roadmap: 'Roadmap',
             summary: 'Summary',
             basicData: 'Basic Data',
-            stops: 'Stops'
+            stops: 'Stops',
         },
     },
     roadmap: {
@@ -963,7 +964,7 @@ export default {
             roadmap: 'Roadmap',
             summary: 'Summary',
             basicData: 'Basic Data',
-            stops: 'Stops'
+            stops: 'Stops',
         },
     },
     route: {
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index 37ba8da85..fee08322c 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -837,6 +837,7 @@ export default {
             workerCreate: 'Nuevo trabajador',
             department: 'Departamentos',
             pda: 'PDA',
+            calendar: 'Calendario',
         },
         list: {
             name: 'Nombre',
@@ -955,7 +956,7 @@ export default {
             roadmap: 'Troncales',
             summary: 'Resumen',
             basicData: 'Datos básicos',
-            stops: 'Paradas'
+            stops: 'Paradas',
         },
     },
     roadmap: {
@@ -963,7 +964,7 @@ export default {
             roadmap: 'Troncales',
             summary: 'Resumen',
             basicData: 'Datos básicos',
-            stops: 'Paradas'
+            stops: 'Paradas',
         },
     },
     route: {

From bfee37b631c0c6d51d9ac42d91449e7ed809bcf9 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 3 Apr 2024 08:08:54 -0300
Subject: [PATCH 07/42] WIP

---
 quasar.extensions.json                        |  11 +-
 src/components/ui/QCalendarMonthWrapper.vue   |  23 ++
 src/css/app.scss                              |  12 ++
 src/i18n/en/index.js                          |  23 ++
 src/i18n/es/index.js                          |  23 ++
 src/pages/Worker/Card/WorkerCalendar.vue      |  64 ++++--
 .../Worker/Card/WorkerCalendarFilter.vue      | 102 ++++++++-
 src/pages/Worker/Card/WorkerCalendarItem.vue  | 202 +++++++++++++++---
 src/stores/useWeekdayStore.js                 |  95 ++++++++
 9 files changed, 496 insertions(+), 59 deletions(-)
 create mode 100644 src/components/ui/QCalendarMonthWrapper.vue
 create mode 100644 src/stores/useWeekdayStore.js

diff --git a/quasar.extensions.json b/quasar.extensions.json
index e5c5cbfaa..867769090 100644
--- a/quasar.extensions.json
+++ b/quasar.extensions.json
@@ -1,7 +1,6 @@
 {
-  "@quasar/testing-unit-vitest": {
-    "options": [
-      "scripts"
-    ]
-  }
-}
\ No newline at end of file
+    "@quasar/testing-unit-vitest": {
+        "options": ["scripts"]
+    },
+    "@quasar/qcalendar": {}
+}
diff --git a/src/components/ui/QCalendarMonthWrapper.vue b/src/components/ui/QCalendarMonthWrapper.vue
new file mode 100644
index 000000000..49acd0e7d
--- /dev/null
+++ b/src/components/ui/QCalendarMonthWrapper.vue
@@ -0,0 +1,23 @@
+<template>
+    <div :class="['main-container-background', $q.dark.isActive ? '--dark' : '--light']">
+        <div class="nav-container row"><slot name="header" /></div>
+        <slot name="calendar" />
+    </div>
+</template>
+
+<style lang="scss">
+.main-container-background {
+    &.--dark {
+        background-color: var(--calendar-background-dark);
+    }
+
+    &.--light {
+        background-color: var(--calendar-background);
+    }
+}
+
+.nav-container {
+    display: flex;
+    align-items: center;
+}
+</style>
diff --git a/src/css/app.scss b/src/css/app.scss
index 8e2853ab2..0e9ae66e2 100644
--- a/src/css/app.scss
+++ b/src/css/app.scss
@@ -1,5 +1,6 @@
 // app global css in SCSS form
 @import './icons.scss';
+@import '@quasar/quasar-ui-qcalendar/src/QCalendarMonth.sass';
 
 body.body--light {
     --fount-color: black;
@@ -120,3 +121,14 @@ input::-webkit-inner-spin-button {
     -webkit-appearance: none;
     -moz-appearance: none;
 }
+
+// Clases para modificar el color de fecha seleccionada en componente QCalendarMonth
+.q-dark div .q-calendar-mini .q-calendar-month__day.q-selected .q-calendar__button {
+    background-color: $primary !important;
+    color: white !important;
+}
+
+.q-calendar-mini .q-calendar-month__day.q-selected .q-calendar__button {
+    background-color: $primary !important;
+    color: white !important;
+}
diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index 34ce16aa7..5ca92df0a 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -1225,4 +1225,27 @@ export default {
         },
         iban_tooltip: 'IBAN: ES21 1234 5678 90 0123456789',
     },
+    weekdays: {
+        sun: 'Sunday',
+        mon: 'Monday',
+        tue: 'Tuesday',
+        wed: 'Wednesday',
+        thu: 'Thursday',
+        fri: 'Friday',
+        sat: 'Saturday',
+    },
+    months: {
+        jan: 'January',
+        feb: 'February',
+        mar: 'March',
+        apr: 'April',
+        may: 'May',
+        jun: 'June',
+        jul: 'July',
+        aug: 'August',
+        sep: 'September',
+        oct: 'October',
+        nov: 'November',
+        dec: 'December',
+    },
 };
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index fee08322c..0b63f3de5 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -1225,4 +1225,27 @@ export default {
         },
         iban_tooltip: 'IBAN: ES21 1234 5678 90 0123456789',
     },
+    weekdays: {
+        sun: 'Domingo',
+        mon: 'Lunes',
+        tue: 'Martes',
+        wed: 'Miércoles',
+        thu: 'Jueves',
+        fri: 'Viernes',
+        sat: 'Sábado',
+    },
+    months: {
+        jan: 'Enero',
+        feb: 'Febrero',
+        mar: 'Marzo',
+        apr: 'Abril',
+        may: 'Mayo',
+        jun: 'Junio',
+        jul: 'Julio',
+        aug: 'Agosto',
+        sep: 'Septiembre',
+        oct: 'Octubre',
+        nov: 'Noviembre',
+        dec: 'Diciembre',
+    },
 };
diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
index 73111cafa..859dedb57 100644
--- a/src/pages/Worker/Card/WorkerCalendar.vue
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -1,26 +1,35 @@
 <script setup>
+import { ref, reactive } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStateStore } from 'stores/useStateStore';
+import { useRoute } from 'vue-router';
+
 import WorkerCalendarFilter from 'pages/Worker/Card/WorkerCalendarFilter.vue';
 import FetchData from 'components/FetchData.vue';
-import { useRoute } from 'vue-router';
-import { ref } from 'vue';
 import WorkerCalendarItem from 'pages/Worker/Card/WorkerCalendarItem.vue';
 
+import { useStateStore } from 'stores/useStateStore';
+
 const stateStore = useStateStore();
 const route = useRoute();
 const { t } = useI18n();
 
+const workerCalendarFilterRef = ref(null);
+const workerCalendarRef = ref(null);
 const businessFk = ref(null);
 const absenceType = ref(null);
 const hasWorkCenter = ref(false);
 const isSubordinate = ref(false);
 const year = ref(Date.vnNew().getFullYear());
+const events = ref({});
 
 const onFetchActiveContract = (data) => {
     businessFk.value = data?.businessFk;
     hasWorkCenter.value = Boolean(data?.workCenterFk);
 };
+
+const onEventsUpdated = (ev) => (events.value = ev);
+
+const onHandleRefresh = () => workerCalendarFilterRef.value.refreshData();
 </script>
 
 <template>
@@ -35,7 +44,7 @@ const onFetchActiveContract = (data) => {
         auto-load
     />
     <template v-if="stateStore.isHeaderMounted()">
-        <Teleport to="#actions-append">
+        <!-- <Teleport to="#actions-append">
             <div class="row q-gutter-x-sm">
                 <QBtn
                     flat
@@ -49,14 +58,16 @@ const onFetchActiveContract = (data) => {
                     </QTooltip>
                 </QBtn>
             </div>
-        </Teleport>
+        </Teleport> -->
     </template>
     <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
         <QScrollArea class="fit text-grey-8">
             <WorkerCalendarFilter
+                ref="workerCalendarFilterRef"
                 v-model:business-fk="businessFk"
                 v-model:year="year"
                 v-model:absence-type="absenceType"
+                @update-events="onEventsUpdated"
             />
         </QScrollArea>
     </QDrawer>
@@ -66,15 +77,39 @@ const onFetchActiveContract = (data) => {
                 {{ t('Autonomous worker') }}
             </QCardSection>
         </QCard>
-        <QCard class="full-width">
-            <QCardSection class="calendar-container">
-                <div v-for="month in 12" :key="month" class="full-width full-height">
-                    <WorkerCalendarItem class="full-width" :year="year" :month="month" />
-                </div>
-            </QCardSection>
+        <QCard v-else class="full-width q-pa-xl">
+            <QIcon
+                v-if="isSubordinate"
+                name="info"
+                size="sm"
+                class="absolute"
+                style="top: 16px; right: 16px"
+            >
+                <QTooltip max-width="250px">
+                    {{
+                        t(
+                            'To start adding absences, click an absence type from the right menu and then on the day you want to add an absence'
+                        )
+                    }}
+                </QTooltip>
+            </QIcon>
+            <div class="calendar-container">
+                <WorkerCalendarItem
+                    ref="workerCalendarRef"
+                    v-for="month in 12"
+                    :key="month"
+                    :year="year"
+                    :month="month"
+                    :absence-type="absenceType"
+                    :business-fk="businessFk"
+                    :events="events"
+                    @refresh="onHandleRefresh"
+                />
+            </div>
         </QCard>
     </QPage>
 </template>
+
 <style lang="scss" scoped>
 .calendar-container {
     display: grid;
@@ -88,19 +123,16 @@ const onFetchActiveContract = (data) => {
     }
 }
 
-@media (max-width: $breakpoint-sm) {
+@media (max-width: $breakpoint-xs) {
     .calendar-container {
         grid-template-columns: repeat(1, minmax(0, 1fr));
     }
 }
-
-.calendar-item {
-    max-width: 324px;
-}
 </style>
 
 <i18n>
 es:
     Search worker: Buscar trabajador
     You can search by worker id or name: Puedes buscar por id o nombre del trabajador
+    To start adding absences, click an absence type from the right menu and then on the day you want to add an absence: Para empezar a añadir ausencias, haz clic en un tipo de ausencia desde el menu de la derecha y después en el día que quieres añadir la ausencia
 </i18n>
diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index d73305085..f8c1b2167 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -4,7 +4,7 @@ import FetchData from 'components/FetchData.vue';
 import { useI18n } from 'vue-i18n';
 import VnSelectFilter from 'components/common/VnSelectFilter.vue';
 import { useRoute } from 'vue-router';
-import { computed, ref, watch } from 'vue';
+import { computed, ref, watch, reactive } from 'vue';
 import { toDateFormat } from '../../../filters/date';
 import axios from 'axios';
 
@@ -26,7 +26,12 @@ const props = defineProps({
     },
 });
 
-const emit = defineEmits(['update:businessFk', 'update:year', 'update:absenceType']);
+const emit = defineEmits([
+    'update:businessFk',
+    'update:year',
+    'update:absenceType',
+    'updateEvents',
+]);
 
 const selectedBusinessFk = computed({
     get: () => props.businessFk,
@@ -35,13 +40,18 @@ const selectedBusinessFk = computed({
         emit('update:businessFk', value);
     },
 });
+
 const selectedYear = computed({
     get: () => props.year,
     set: (value) => emit('update:year', value),
 });
+
 const selectedAbsenceType = computed({
     get: () => props.absenceType,
-    set: (value) => emit('update:absenceType', value),
+    set: (value) => {
+        if (value === props.absenceType) value = null;
+        emit('update:absenceType', value);
+    },
 });
 
 const generateYears = () => {
@@ -57,11 +67,19 @@ const yearList = ref(generateYears());
 
 const contractHolidays = ref(null);
 const yearHolidays = ref(null);
+const events = reactive({});
+const calendar = ref(null);
 
 const getHolidays = async (params) => {
-    return axios
-        .get(`Workers/${route.params.id}/holidays`, { params })
-        .then((res) => res.data);
+    try {
+        const { data } = await axios.get(`Workers/${route.params.id}/holidays`, {
+            params,
+        });
+        return data;
+    } catch (error) {
+        console.error('Error fetching holidays:', error);
+        return null;
+    }
 };
 
 const updateContractHolidays = async () => {
@@ -75,14 +93,80 @@ const updateYearHolidays = async () => {
     yearHolidays.value = await getHolidays({ year: selectedYear.value });
 };
 
-watch(selectedYear, () => {
+const getAbsences = async () => {
+    try {
+        const params = {
+            workerFk: route.params.id,
+            businessFk: props.businessFk,
+            year: props.year,
+        };
+        const { data } = await axios.get('Calendars/absences', { params });
+        if (data) onAbsencesFetched(data);
+        return data;
+    } catch (error) {
+        console.error('Error fetching absences:', error);
+        return null;
+    }
+};
+
+const refreshData = () => {
     updateYearHolidays();
     updateContractHolidays();
+    getAbsences();
+};
+
+const onAbsencesFetched = (data) => {
+    calendar.value = data.calendar;
+
+    let addEvent = (day, newEvent) => {
+        const timestamp = new Date(day).getTime();
+        let event = events[timestamp];
+
+        if (event) {
+            const oldName = event.name;
+            Object.assign(event, newEvent);
+            event.name = `${oldName}, ${event.name}`;
+        } else events[timestamp] = newEvent;
+    };
+
+    if (data.holidays) {
+        data.holidays.forEach((holiday) => {
+            const holidayDetail = holiday.detail && holiday.detail.name;
+            const holidayType = holiday.type && holiday.type.name;
+            const holidayName = holidayDetail || holidayType;
+
+            addEvent(holiday.dated, {
+                name: holidayName,
+                className: 'festive',
+            });
+        });
+    }
+    if (data.absences) {
+        data.absences.forEach((absence) => {
+            let type = absence.absenceType;
+            addEvent(absence.dated, {
+                name: type.name,
+                color: type.rgb,
+                type: type.code,
+                absenceId: absence.id,
+            });
+        });
+    }
+
+    emit('updateEvents', events);
+    console.log('events:: ', events);
+};
+
+watch(selectedYear, () => {
+    refreshData();
 });
 
 watch(selectedBusinessFk, () => {
-    updateYearHolidays();
-    updateContractHolidays();
+    refreshData();
+});
+
+defineExpose({
+    refreshData,
 });
 </script>
 
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index b06d8f028..79c47063c 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -1,11 +1,17 @@
 <script setup>
 import { onBeforeMount, ref, watch } from 'vue';
-import { QCalendarMonth, today } from '@quasar/quasar-ui-qcalendar/src/index.js';
-import '@quasar/quasar-ui-qcalendar/src/QCalendarVariables.sass';
-import '@quasar/quasar-ui-qcalendar/src/QCalendarTransitions.sass';
-import '@quasar/quasar-ui-qcalendar/src/QCalendarMonth.sass';
-import { date } from 'quasar';
 import { useI18n } from 'vue-i18n';
+import { date } from 'quasar';
+import { useRoute } from 'vue-router';
+
+import QCalendarMonthWrapper from 'src/components/ui/QCalendarMonthWrapper.vue';
+import { QCalendarMonth } from '@quasar/quasar-ui-qcalendar/src/index.js';
+import '@quasar/quasar-ui-qcalendar/src/QCalendarVariables.sass';
+import '@quasar/quasar-ui-qcalendar/src/QCalendarMonth.sass';
+
+import { useWeekdayStore } from 'src/stores/useWeekdayStore';
+import useNotify from 'src/composables/useNotify.js';
+import axios from 'axios';
 
 const props = defineProps({
     year: {
@@ -16,41 +22,181 @@ const props = defineProps({
         type: Number,
         required: true,
     },
+    absenceType: {
+        type: Number,
+        default: null,
+    },
+    businessFk: {
+        type: Number,
+        default: null,
+    },
+    events: {
+        type: Object,
+        default: null,
+    },
 });
 
+const emit = defineEmits(['refresh']);
+
+const route = useRoute();
+const { t } = useI18n();
+const { notify } = useNotify();
 const { locale } = useI18n();
+
 const calendarRef = ref(null);
-const selectedDate = ref(today());
+const weekdayStore = useWeekdayStore();
+const selectedDate = ref(null);
+const calendarEventDates = [];
 
 const updateSelectedDate = (year) => {
-    const dateObject = Date.vnNew();
-    dateObject.setFullYear(year);
-    dateObject.setMonth(props.month - 1);
-    selectedDate.value = date.formatDate(dateObject, 'YYYY-MM-DD');
-    console.log(date.formatDate(dateObject, 'YYYY-MM-DD'));
+    const _date = new Date(year, props.month - 1, 1);
+    selectedDate.value = date.formatDate(_date, 'YYYY-MM-DD');
+};
+
+const createEvent = async (date) => {
+    try {
+        const params = {
+            dated: date,
+            absenceTypeId: props.absenceType,
+            businessFk: props.businessFk,
+        };
+
+        const { data } = await axios.post(
+            `Workers/${route.params.id}/createAbsence`,
+            params
+        );
+        console.log('data:: ', data);
+        // TODO: Agregar notify success
+        emit('refresh');
+    } catch (error) {
+        console.log('error creating event:: ', error);
+    }
+};
+
+const editEvent = async (event) => {
+    console.log('editEvent');
+};
+
+const deleteEvent = async (date, event) => {
+    console.log('deleteEvent');
+};
+
+const handleDateSelected = (date) => {
+    if (!props.absenceType) {
+        notify(t('Choose an absence type from the right menu'), 'warning');
+        return;
+    }
+
+    const { year, month, day } = date.scope.timestamp;
+    const _date = new Date(year, month - 1, day);
+    const stamp = _date.getTime();
+    const event = props.events[stamp];
+
+    if (event && event.absenceId) {
+        if (event.type == props.absenceType.code) deleteEvent(_date, event);
+        else editEvent(event);
+    } else createEvent(_date);
+};
+
+const getEventByTimestamp = ({ year, month, day }) => {
+    const stamp = date.formatDate(new Date(year, month - 1, day), 'x');
+    return props.events[stamp] || null;
+};
+
+const getEventAttrs = (timestamp) => {
+    const event = getEventByTimestamp(timestamp);
+    if (!event) return '';
+
+    const { name, color } = event;
+    return {
+        title: name,
+        style: `background-color: ${color};`,
+    };
 };
 
 onBeforeMount(() => {
     updateSelectedDate(props.year);
 });
 
-watch(
-    () => props.year,
-    (newValue) => {
-        updateSelectedDate(newValue);
-    }
-);
+watch(props.year, (newValue) => {
+    updateSelectedDate(newValue);
+});
 </script>
+
 <template>
-    <QCalendarMonth
-        ref="calendarRef"
-        v-model="selectedDate"
-        show-work-weeks
-        no-outside-days
-        :selected-dates="[]"
-        :disabled-weekdays="[0, 6]"
-        :locale="locale"
-        animated
-        mini-mode
-    />
+    <QCalendarMonthWrapper style="height: 200px">
+        <template #header>
+            <span class="full-width text-center text-body1 q-py-sm">{{
+                weekdayStore.getLocaleMonths[$props.month - 1].locale
+            }}</span>
+        </template>
+        <template #calendar>
+            <QCalendarMonth
+                ref="calendarRef"
+                v-model="selectedDate"
+                @click-date="handleDateSelected"
+                show-work-weeks
+                no-outside-days
+                :selected-dates="calendarEventDates"
+                no-active-date
+                :weekdays="[1, 2, 3, 4, 5, 6, 0]"
+                :disabled-weekdays="[0, 6]"
+                :locale="locale"
+                mini-mode
+            >
+                <template #day="{ scope: { timestamp } }">
+                    <QButton
+                        v-if="getEventByTimestamp(timestamp)"
+                        v-bind="{ ...getEventAttrs(timestamp) }"
+                        class="calendar-event"
+                    >
+                        {{ timestamp.day }}
+                    </QButton>
+                </template>
+            </QCalendarMonth>
+        </template>
+    </QCalendarMonthWrapper>
 </template>
+
+<style lang="scss">
+.q-calendar__button {
+    &:hover {
+        background-color: var(--vn-accent-color);
+        cursor: pointer;
+    }
+}
+
+.q-calendar-month__day--content {
+    position: absolute;
+    top: 0;
+    left: 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.q-outside .calendar-event {
+    display: none;
+}
+
+.calendar-event {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 20px;
+    height: 20px;
+    font-size: 0.75em;
+    line-height: 1.715em;
+    border-radius: 50%;
+    cursor: pointer;
+
+    &:hover {
+        opacity: 0.8;
+    }
+}
+</style>
+
+<i18n>
+es:
+    Choose an absence type from the right menu: Elige un tipo de ausencia desde el menú de la derecha
+</i18n>
diff --git a/src/stores/useWeekdayStore.js b/src/stores/useWeekdayStore.js
new file mode 100644
index 000000000..ad898c9a7
--- /dev/null
+++ b/src/stores/useWeekdayStore.js
@@ -0,0 +1,95 @@
+import { reactive, ref, computed } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { defineStore } from 'pinia';
+
+export const useWeekdayStore = defineStore('weekdayStore', () => {
+    const { t } = useI18n();
+
+    const weekdays = [
+        { code: 'sun', name: 'Sunday' },
+        { code: 'mon', name: 'Monday' },
+        { code: 'tue', name: 'Tuesday' },
+        { code: 'wed', name: 'Wednesday' },
+        { code: 'thu', name: 'Thursday' },
+        { code: 'fri', name: 'Friday' },
+        { code: 'sat', name: 'Saturday' },
+    ];
+
+    const monthCodes = [
+        'jan',
+        'feb',
+        'mar',
+        'apr',
+        'may',
+        'jun',
+        'jul',
+        'aug',
+        'sep',
+        'oct',
+        'nov',
+        'dec',
+    ];
+
+    const localeOrder = {
+        es: ['mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun'],
+        en: ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'],
+    };
+
+    const weekdaysMap = reactive({});
+    const localeWeekdays = ref([]);
+
+    const initStore = () => {
+        getWeekdaysMap();
+    };
+
+    const getWeekdaysMap = () => {
+        if (Object.keys(weekdaysMap).length > 0) return weekdaysMap;
+
+        weekdays.forEach((day, i) => {
+            const obj = {
+                ...day,
+                index: i,
+                char: day.name.substr(0, 1),
+                abr: day.name.substr(0, 3),
+            };
+            weekdaysMap[day.code] = obj;
+        });
+    };
+
+    const getLocales = computed(() => {
+        // El día de mañana esto permitirá ordenar los weekdays en base a el locale si se lo desea reemplazando localeOrder.es por localeOrder[locale]
+        const locales = [];
+        for (let code of localeOrder.es) {
+            const obj = {
+                ...weekdaysMap[code],
+                locale: t(`weekdays.${weekdaysMap[code].code}`),
+                localeChar: t(`weekdays.${weekdaysMap[code].code}`).substr(0, 1),
+                localeAbr: t(`weekdays.${weekdaysMap[code].code}`).substr(0, 3),
+            };
+            locales.push(obj);
+        }
+        return locales;
+    });
+
+    const getLocaleMonths = computed(() => {
+        const locales = [];
+        for (let code of monthCodes) {
+            const obj = {
+                code: code,
+                locale: t(`months.${code}`),
+            };
+            locales.push(obj);
+        }
+        return locales;
+    });
+
+    return {
+        initStore,
+        weekdaysMap,
+        localeWeekdays,
+        getLocales,
+        weekdays,
+        monthCodes,
+        getLocaleMonths,
+    };
+});

From 64b10836193750f23f809936dfbfd4be338dfe2e Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 3 Apr 2024 09:28:38 -0300
Subject: [PATCH 08/42] Add today date

---
 src/pages/Worker/Card/WorkerCalendarFilter.vue | 8 +-------
 src/pages/Worker/Card/WorkerCalendarItem.vue   | 8 +++++---
 2 files changed, 6 insertions(+), 10 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index f8c1b2167..41c5bb41c 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -157,13 +157,7 @@ const onAbsencesFetched = (data) => {
     console.log('events:: ', events);
 };
 
-watch(selectedYear, () => {
-    refreshData();
-});
-
-watch(selectedBusinessFk, () => {
-    refreshData();
-});
+watch([selectedYear, selectedBusinessFk], () => refreshData());
 
 defineExpose({
     refreshData,
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index 79c47063c..9fe02e8cd 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -45,8 +45,9 @@ const { locale } = useI18n();
 
 const calendarRef = ref(null);
 const weekdayStore = useWeekdayStore();
-const selectedDate = ref(null);
+const selectedDate = ref();
 const calendarEventDates = [];
+const today = ref(date.formatDate(Date.vnNew(), 'YYYY-MM-DD'));
 
 const updateSelectedDate = (year) => {
     const _date = new Date(year, props.month - 1, 1);
@@ -99,13 +100,13 @@ const handleDateSelected = (date) => {
 };
 
 const getEventByTimestamp = ({ year, month, day }) => {
-    const stamp = date.formatDate(new Date(year, month - 1, day), 'x');
+    const stamp = new Date(year, month - 1, day).getTime();
     return props.events[stamp] || null;
 };
 
 const getEventAttrs = (timestamp) => {
     const event = getEventByTimestamp(timestamp);
-    if (!event) return '';
+    if (!event) return {};
 
     const { name, color } = event;
     return {
@@ -142,6 +143,7 @@ watch(props.year, (newValue) => {
                 :weekdays="[1, 2, 3, 4, 5, 6, 0]"
                 :disabled-weekdays="[0, 6]"
                 :locale="locale"
+                :now="today"
                 mini-mode
             >
                 <template #day="{ scope: { timestamp } }">

From 60b146196f08ed901db8c1ee0f4b28d53a630262 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 3 Apr 2024 13:48:41 -0300
Subject: [PATCH 09/42] add calendar short-weekday-label

---
 src/pages/Worker/Card/WorkerCalendarItem.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index 9fe02e8cd..15063114b 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -141,7 +141,7 @@ watch(props.year, (newValue) => {
                 :selected-dates="calendarEventDates"
                 no-active-date
                 :weekdays="[1, 2, 3, 4, 5, 6, 0]"
-                :disabled-weekdays="[0, 6]"
+                short-weekday-label
                 :locale="locale"
                 :now="today"
                 mini-mode

From 0f6c6cde9153b64f50acef4bf67e35b2d236c0ec Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 3 Apr 2024 17:32:22 -0300
Subject: [PATCH 10/42] Improve visually WorkerDateLabel

---
 src/pages/Worker/Card/WorkerDateLabel.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerDateLabel.vue b/src/pages/Worker/Card/WorkerDateLabel.vue
index e087ccf72..4f2673be2 100644
--- a/src/pages/Worker/Card/WorkerDateLabel.vue
+++ b/src/pages/Worker/Card/WorkerDateLabel.vue
@@ -18,15 +18,15 @@ defineEmits(['update:selected']);
 
 <template>
     <QChip
-        class="chip"
+        class="chip glossy"
         :selected="selected"
         :style="selected ? { backgroundColor: color } : null"
-        :text-color="selected ? 'white' : null"
         @update:selected="$emit('update:selected', $event)"
     >
         <QAvatar
             :color="color"
             :class="avatarClass"
+            class="glossy"
             :style="{ backgroundColor: color }"
         />
         <slot />
@@ -35,6 +35,6 @@ defineEmits(['update:selected']);
 
 <style scoped lang="scss">
 .chip {
-    background-color: var(--vn-light-gray);
+    color: var(--vn-text-color);
 }
 </style>

From 503efb79c96dc7ac391553caf46f1322ad69c700 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Thu, 4 Apr 2024 08:39:52 -0300
Subject: [PATCH 11/42] WIP

---
 .../Worker/Card/WorkerCalendarFilter.vue      |  4 +-
 src/pages/Worker/Card/WorkerCalendarItem.vue  | 52 +++++++++++++++----
 2 files changed, 44 insertions(+), 12 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index 41c5bb41c..d52eb7a1c 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -268,8 +268,8 @@ defineExpose({
         <QItem v-for="type in absenceTypeList" :key="type.id">
             <WorkerDateLabel
                 :color="type.rgb"
-                :selected="selectedAbsenceType === type.id"
-                @click="selectedAbsenceType = type.id"
+                :selected="selectedAbsenceType?.id === type.id"
+                @click="selectedAbsenceType = type"
             >
                 {{ type.name }}
             </WorkerDateLabel>
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index 15063114b..846cdcedd 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -23,7 +23,7 @@ const props = defineProps({
         required: true,
     },
     absenceType: {
-        type: Number,
+        type: Object,
         default: null,
     },
     businessFk: {
@@ -58,7 +58,7 @@ const createEvent = async (date) => {
     try {
         const params = {
             dated: date,
-            absenceTypeId: props.absenceType,
+            absenceTypeId: props.absenceType.id,
             businessFk: props.businessFk,
         };
 
@@ -66,20 +66,41 @@ const createEvent = async (date) => {
             `Workers/${route.params.id}/createAbsence`,
             params
         );
-        console.log('data:: ', data);
-        // TODO: Agregar notify success
-        emit('refresh');
+        if (data) emit('refresh');
     } catch (error) {
         console.log('error creating event:: ', error);
     }
 };
 
 const editEvent = async (event) => {
-    console.log('editEvent');
+    try {
+        console.log('editEvent');
+        const absenceType = props.absenceType;
+        const params = {
+            absenceId: event.absenceId,
+            absenceTypeId: absenceType.id,
+        };
+
+        const { data } = await axios.patch(
+            `Workers/${route.params.id}/updateAbsence`,
+            params
+        );
+
+        if (data) emit('refresh');
+    } catch (error) {
+        console.log('error editing event:: ', error);
+    }
 };
 
 const deleteEvent = async (date, event) => {
     console.log('deleteEvent');
+    const params = { absenceId: event.absenceId };
+
+    const { data } = await axios.delete(`Workers/${route.params.id}/deleteAbsence`, {
+        params,
+    });
+
+    if (data) emit('refresh');
 };
 
 const handleDateSelected = (date) => {
@@ -93,10 +114,15 @@ const handleDateSelected = (date) => {
     const stamp = _date.getTime();
     const event = props.events[stamp];
 
-    if (event && event.absenceId) {
-        if (event.type == props.absenceType.code) deleteEvent(_date, event);
-        else editEvent(event);
-    } else createEvent(_date);
+    if (!event) createEvent(_date);
+};
+
+const handleEventSelected = (event, { year, month, day }) => {
+    console.log('event:: ', event);
+    const date = new Date(year, month - 1, day);
+    console.log('date:: ', date);
+    if (event.type == props.absenceType.code) deleteEvent(date, event);
+    else editEvent(event);
 };
 
 const getEventByTimestamp = ({ year, month, day }) => {
@@ -109,6 +135,8 @@ const getEventAttrs = (timestamp) => {
     if (!event) return {};
 
     const { name, color } = event;
+
+    // Atributos a asignar a cada slot que representa un evento en el calendario
     return {
         title: name,
         style: `background-color: ${color};`,
@@ -147,9 +175,13 @@ watch(props.year, (newValue) => {
                 mini-mode
             >
                 <template #day="{ scope: { timestamp } }">
+                    <!-- Este slot representa cada día del calendario y muestra un botón representando el correspondiente evento -->
                     <QButton
                         v-if="getEventByTimestamp(timestamp)"
                         v-bind="{ ...getEventAttrs(timestamp) }"
+                        @click="
+                            handleEventSelected(getEventByTimestamp(timestamp), timestamp)
+                        "
                         class="calendar-event"
                     >
                         {{ timestamp.day }}

From fd5ea8f6f58c9afe5eb51420db5841be51d102e9 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Thu, 4 Apr 2024 09:27:17 -0300
Subject: [PATCH 12/42] WIP

---
 src/pages/Worker/Card/WorkerCalendar.vue      | 45 +++++++++++++++--
 .../Worker/Card/WorkerCalendarFilter.vue      | 48 +------------------
 src/pages/Worker/Card/WorkerCalendarItem.vue  | 13 +++--
 3 files changed, 52 insertions(+), 54 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
index 859dedb57..e3c0edbf3 100644
--- a/src/pages/Worker/Card/WorkerCalendar.vue
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref, reactive } from 'vue';
+import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 
@@ -23,11 +23,50 @@ const year = ref(Date.vnNew().getFullYear());
 const events = ref({});
 
 const onFetchActiveContract = (data) => {
+    if (!data) return;
     businessFk.value = data?.businessFk;
     hasWorkCenter.value = Boolean(data?.workCenterFk);
 };
 
-const onEventsUpdated = (ev) => (events.value = ev);
+const addEvent = (day, newEvent) => {
+    const timestamp = new Date(day).getTime();
+    let event = events.value[timestamp];
+
+    if (event) {
+        const oldName = event.name;
+        Object.assign(event, newEvent);
+        event.name = `${oldName}, ${event.name}`;
+    } else events.value[timestamp] = newEvent;
+};
+
+const onFetchAbsences = (data) => {
+    if (!data) return;
+
+    if (data.holidays) {
+        data.holidays.forEach((holiday) => {
+            const holidayDetail = holiday.detail && holiday.detail.name;
+            const holidayType = holiday.type && holiday.type.name;
+            const holidayName = holidayDetail || holidayType;
+
+            addEvent(holiday.dated, {
+                name: holidayName,
+                className: 'festive',
+            });
+        });
+    }
+    if (data.absences) {
+        data.absences.forEach((absence) => {
+            let type = absence.absenceType;
+            addEvent(absence.dated, {
+                name: type.name,
+                color: type.rgb,
+                type: type.code,
+                absenceId: absence.id,
+            });
+        });
+    }
+    console.log('events:: ', events.value);
+};
 
 const onHandleRefresh = () => workerCalendarFilterRef.value.refreshData();
 </script>
@@ -67,7 +106,7 @@ const onHandleRefresh = () => workerCalendarFilterRef.value.refreshData();
                 v-model:business-fk="businessFk"
                 v-model:year="year"
                 v-model:absence-type="absenceType"
-                @update-events="onEventsUpdated"
+                @on-absences-fetched="onFetchAbsences"
             />
         </QScrollArea>
     </QDrawer>
diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index d52eb7a1c..e83a0f1f3 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -30,7 +30,7 @@ const emit = defineEmits([
     'update:businessFk',
     'update:year',
     'update:absenceType',
-    'updateEvents',
+    'onAbsencesFetched',
 ]);
 
 const selectedBusinessFk = computed({
@@ -67,8 +67,6 @@ const yearList = ref(generateYears());
 
 const contractHolidays = ref(null);
 const yearHolidays = ref(null);
-const events = reactive({});
-const calendar = ref(null);
 
 const getHolidays = async (params) => {
     try {
@@ -101,7 +99,7 @@ const getAbsences = async () => {
             year: props.year,
         };
         const { data } = await axios.get('Calendars/absences', { params });
-        if (data) onAbsencesFetched(data);
+        if (data) emit('onAbsencesFetched', data);
         return data;
     } catch (error) {
         console.error('Error fetching absences:', error);
@@ -115,48 +113,6 @@ const refreshData = () => {
     getAbsences();
 };
 
-const onAbsencesFetched = (data) => {
-    calendar.value = data.calendar;
-
-    let addEvent = (day, newEvent) => {
-        const timestamp = new Date(day).getTime();
-        let event = events[timestamp];
-
-        if (event) {
-            const oldName = event.name;
-            Object.assign(event, newEvent);
-            event.name = `${oldName}, ${event.name}`;
-        } else events[timestamp] = newEvent;
-    };
-
-    if (data.holidays) {
-        data.holidays.forEach((holiday) => {
-            const holidayDetail = holiday.detail && holiday.detail.name;
-            const holidayType = holiday.type && holiday.type.name;
-            const holidayName = holidayDetail || holidayType;
-
-            addEvent(holiday.dated, {
-                name: holidayName,
-                className: 'festive',
-            });
-        });
-    }
-    if (data.absences) {
-        data.absences.forEach((absence) => {
-            let type = absence.absenceType;
-            addEvent(absence.dated, {
-                name: type.name,
-                color: type.rgb,
-                type: type.code,
-                absenceId: absence.id,
-            });
-        });
-    }
-
-    emit('updateEvents', events);
-    console.log('events:: ', events);
-};
-
 watch([selectedYear, selectedBusinessFk], () => refreshData());
 
 defineExpose({
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index 846cdcedd..a853a95db 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -66,6 +66,8 @@ const createEvent = async (date) => {
             `Workers/${route.params.id}/createAbsence`,
             params
         );
+
+        console.log('CREATE data:: ', data);
         if (data) emit('refresh');
     } catch (error) {
         console.log('error creating event:: ', error);
@@ -85,20 +87,21 @@ const editEvent = async (event) => {
             `Workers/${route.params.id}/updateAbsence`,
             params
         );
-
+        console.log('edit data:: ', data);
         if (data) emit('refresh');
     } catch (error) {
         console.log('error editing event:: ', error);
     }
 };
 
-const deleteEvent = async (date, event) => {
-    console.log('deleteEvent');
+const deleteEvent = async (event) => {
+    console.log('deleteEvent:: ', event);
     const params = { absenceId: event.absenceId };
-
+    console.log('params:: ', params);
     const { data } = await axios.delete(`Workers/${route.params.id}/deleteAbsence`, {
         params,
     });
+    console.log('delete data:: ', data);
 
     if (data) emit('refresh');
 };
@@ -121,7 +124,7 @@ const handleEventSelected = (event, { year, month, day }) => {
     console.log('event:: ', event);
     const date = new Date(year, month - 1, day);
     console.log('date:: ', date);
-    if (event.type == props.absenceType.code) deleteEvent(date, event);
+    if (event.type == props.absenceType.code) deleteEvent(event);
     else editEvent(event);
 };
 

From 78dc3c1c9add1baf5675315653678a034c6aa428 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Thu, 4 Apr 2024 11:20:30 -0300
Subject: [PATCH 13/42] Move data fetching to main component

---
 src/pages/Worker/Card/WorkerCalendar.vue      | 65 +++++++++++++++++--
 .../Worker/Card/WorkerCalendarFilter.vue      | 64 +-----------------
 src/pages/Worker/Card/WorkerCalendarItem.vue  | 16 ++---
 3 files changed, 67 insertions(+), 78 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
index e3c0edbf3..fdfb3f9f8 100644
--- a/src/pages/Worker/Card/WorkerCalendar.vue
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { ref } from 'vue';
+import { ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
 
@@ -8,6 +8,7 @@ import FetchData from 'components/FetchData.vue';
 import WorkerCalendarItem from 'pages/Worker/Card/WorkerCalendarItem.vue';
 
 import { useStateStore } from 'stores/useStateStore';
+import axios from 'axios';
 
 const stateStore = useStateStore();
 const route = useRoute();
@@ -15,11 +16,13 @@ const { t } = useI18n();
 
 const workerCalendarFilterRef = ref(null);
 const workerCalendarRef = ref(null);
-const businessFk = ref(null);
 const absenceType = ref(null);
 const hasWorkCenter = ref(false);
 const isSubordinate = ref(false);
+const businessFk = ref(null);
 const year = ref(Date.vnNew().getFullYear());
+const contractHolidays = ref(null);
+const yearHolidays = ref(null);
 const events = ref({});
 
 const onFetchActiveContract = (data) => {
@@ -42,6 +45,8 @@ const addEvent = (day, newEvent) => {
 const onFetchAbsences = (data) => {
     if (!data) return;
 
+    events.value = {};
+
     if (data.holidays) {
         data.holidays.forEach((holiday) => {
             const holidayDetail = holiday.detail && holiday.detail.name;
@@ -68,7 +73,57 @@ const onFetchAbsences = (data) => {
     console.log('events:: ', events.value);
 };
 
-const onHandleRefresh = () => workerCalendarFilterRef.value.refreshData();
+const getAbsences = async () => {
+    try {
+        const params = {
+            workerFk: route.params.id,
+            businessFk: businessFk.value,
+            year: year.value,
+        };
+        const { data } = await axios.get('Calendars/absences', { params });
+        if (data) onFetchAbsences(data);
+
+        return data;
+    } catch (error) {
+        console.error('Error fetching absences:', error);
+        return null;
+    }
+};
+
+const getHolidays = async (params) => {
+    try {
+        const { data } = await axios.get(`Workers/${route.params.id}/holidays`, {
+            params,
+        });
+        return data;
+    } catch (error) {
+        console.error('Error fetching holidays:', error);
+        return null;
+    }
+};
+
+const updateContractHolidays = async () => {
+    contractHolidays.value = await getHolidays({
+        businessFk: businessFk.value,
+        year: year.value,
+    });
+};
+
+const updateYearHolidays = async () => {
+    yearHolidays.value = await getHolidays({ year: year.value });
+};
+
+const refreshData = () => {
+    updateYearHolidays();
+    updateContractHolidays();
+    getAbsences();
+};
+
+const onDeletedEvent = (timestamp) => {
+    delete events.value[timestamp];
+};
+
+watch([year, businessFk], () => refreshData());
 </script>
 
 <template>
@@ -106,7 +161,6 @@ const onHandleRefresh = () => workerCalendarFilterRef.value.refreshData();
                 v-model:business-fk="businessFk"
                 v-model:year="year"
                 v-model:absence-type="absenceType"
-                @on-absences-fetched="onFetchAbsences"
             />
         </QScrollArea>
     </QDrawer>
@@ -142,7 +196,8 @@ const onHandleRefresh = () => workerCalendarFilterRef.value.refreshData();
                     :absence-type="absenceType"
                     :business-fk="businessFk"
                     :events="events"
-                    @refresh="onHandleRefresh"
+                    @refresh="refreshData"
+                    @on-deleted-event="onDeletedEvent"
                 />
             </div>
         </QCard>
diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index e83a0f1f3..c3fe65e19 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -4,9 +4,8 @@ import FetchData from 'components/FetchData.vue';
 import { useI18n } from 'vue-i18n';
 import VnSelectFilter from 'components/common/VnSelectFilter.vue';
 import { useRoute } from 'vue-router';
-import { computed, ref, watch, reactive } from 'vue';
+import { computed, ref } from 'vue';
 import { toDateFormat } from '../../../filters/date';
-import axios from 'axios';
 
 const { t } = useI18n();
 const route = useRoute();
@@ -26,12 +25,7 @@ const props = defineProps({
     },
 });
 
-const emit = defineEmits([
-    'update:businessFk',
-    'update:year',
-    'update:absenceType',
-    'onAbsencesFetched',
-]);
+const emit = defineEmits(['update:businessFk', 'update:year', 'update:absenceType']);
 
 const selectedBusinessFk = computed({
     get: () => props.businessFk,
@@ -64,60 +58,6 @@ const generateYears = () => {
 const absenceTypeList = ref([]);
 const contractList = ref([]);
 const yearList = ref(generateYears());
-
-const contractHolidays = ref(null);
-const yearHolidays = ref(null);
-
-const getHolidays = async (params) => {
-    try {
-        const { data } = await axios.get(`Workers/${route.params.id}/holidays`, {
-            params,
-        });
-        return data;
-    } catch (error) {
-        console.error('Error fetching holidays:', error);
-        return null;
-    }
-};
-
-const updateContractHolidays = async () => {
-    contractHolidays.value = await getHolidays({
-        businessFk: selectedBusinessFk.value,
-        year: selectedYear.value,
-    });
-};
-
-const updateYearHolidays = async () => {
-    yearHolidays.value = await getHolidays({ year: selectedYear.value });
-};
-
-const getAbsences = async () => {
-    try {
-        const params = {
-            workerFk: route.params.id,
-            businessFk: props.businessFk,
-            year: props.year,
-        };
-        const { data } = await axios.get('Calendars/absences', { params });
-        if (data) emit('onAbsencesFetched', data);
-        return data;
-    } catch (error) {
-        console.error('Error fetching absences:', error);
-        return null;
-    }
-};
-
-const refreshData = () => {
-    updateYearHolidays();
-    updateContractHolidays();
-    getAbsences();
-};
-
-watch([selectedYear, selectedBusinessFk], () => refreshData());
-
-defineExpose({
-    refreshData,
-});
 </script>
 
 <template>
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index a853a95db..481d926c4 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -36,7 +36,7 @@ const props = defineProps({
     },
 });
 
-const emit = defineEmits(['refresh']);
+const emit = defineEmits(['refresh', 'onDeletedEvent']);
 
 const route = useRoute();
 const { t } = useI18n();
@@ -76,34 +76,30 @@ const createEvent = async (date) => {
 
 const editEvent = async (event) => {
     try {
-        console.log('editEvent');
         const absenceType = props.absenceType;
         const params = {
             absenceId: event.absenceId,
             absenceTypeId: absenceType.id,
         };
-
         const { data } = await axios.patch(
             `Workers/${route.params.id}/updateAbsence`,
             params
         );
-        console.log('edit data:: ', data);
+
         if (data) emit('refresh');
     } catch (error) {
         console.log('error editing event:: ', error);
     }
 };
 
-const deleteEvent = async (event) => {
+const deleteEvent = async (event, date) => {
     console.log('deleteEvent:: ', event);
     const params = { absenceId: event.absenceId };
-    console.log('params:: ', params);
     const { data } = await axios.delete(`Workers/${route.params.id}/deleteAbsence`, {
         params,
     });
-    console.log('delete data:: ', data);
 
-    if (data) emit('refresh');
+    if (data) emit('onDeletedEvent', date.getTime());
 };
 
 const handleDateSelected = (date) => {
@@ -121,10 +117,8 @@ const handleDateSelected = (date) => {
 };
 
 const handleEventSelected = (event, { year, month, day }) => {
-    console.log('event:: ', event);
     const date = new Date(year, month - 1, day);
-    console.log('date:: ', date);
-    if (event.type == props.absenceType.code) deleteEvent(event);
+    if (event.type == props.absenceType.code) deleteEvent(event, date);
     else editEvent(event);
 };
 

From cb55115cd2fadf643f480bed43c411d5b03a026e Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Thu, 4 Apr 2024 12:02:43 -0300
Subject: [PATCH 14/42] Remove unused component

---
 src/components/common/VnCalendar.vue | 61 ----------------------------
 1 file changed, 61 deletions(-)
 delete mode 100644 src/components/common/VnCalendar.vue

diff --git a/src/components/common/VnCalendar.vue b/src/components/common/VnCalendar.vue
deleted file mode 100644
index 7403fc6ef..000000000
--- a/src/components/common/VnCalendar.vue
+++ /dev/null
@@ -1,61 +0,0 @@
-<template>
-    <QCalendarMonth
-        ref="calendarRef"
-        v-model="selectedDate"
-        v-bind="$attrs"
-        show-work-weeks
-        :weekdays="[1, 2, 3, 4, 5, 6, 0]"
-        animated
-        bordered
-        mini-mode
-        @change="onChange"
-        @moved="onMoved"
-        @click-date="onClickDate"
-        @click-day="onClickDay"
-        @click-workweek="onClickWorkweek"
-        @click-head-workweek="onClickHeadWorkweek"
-        @click-head-day="onClickHeadDay"
-        style="max-width: 300px"
-    />
-</template>
-<script setup>
-import { ref } from 'vue';
-import { QCalendarMonth, today } from '@quasar/quasar-ui-qcalendar/src/index.js';
-import '@quasar/quasar-ui-qcalendar/src/QCalendarVariables.sass';
-import '@quasar/quasar-ui-qcalendar/src/QCalendarTransitions.sass';
-import '@quasar/quasar-ui-qcalendar/src/QCalendarMonth.sass';
-
-const calendarRef = ref(null);
-const selectedDate = ref(today());
-
-const onToday = () => {
-    calendarRef.value.moveToToday();
-};
-const onPrev = () => {
-    calendarRef.value.prev();
-};
-const onNext = () => {
-    calendarRef.value.next();
-};
-const onMoved = (data) => {
-    console.log('onMoved', data);
-};
-const onChange = (data) => {
-    console.log('onChange', data);
-};
-const onClickDate = (data) => {
-    console.log('onClickDate', data);
-};
-const onClickDay = (data) => {
-    console.log('onClickDay', data);
-};
-const onClickWorkweek = (data) => {
-    console.log('onClickWorkweek', data);
-};
-const onClickHeadDay = (data) => {
-    console.log('onClickHeadDay', data);
-};
-const onClickHeadWorkweek = (data) => {
-    console.log('onClickHeadWorkweek', data);
-};
-</script>

From dae08c322dbad65cfb0a3062c2a4a7330ef4cd55 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Fri, 5 Apr 2024 08:04:34 -0300
Subject: [PATCH 15/42] visual adjustments

---
 src/pages/Worker/Card/WorkerCalendar.vue     | 16 +++++++++-------
 src/pages/Worker/Card/WorkerCalendarItem.vue |  8 ++++----
 2 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
index fdfb3f9f8..379ba334f 100644
--- a/src/pages/Worker/Card/WorkerCalendar.vue
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -138,7 +138,7 @@ watch([year, businessFk], () => refreshData());
         auto-load
     />
     <template v-if="stateStore.isHeaderMounted()">
-        <!-- <Teleport to="#actions-append">
+        <Teleport to="#actions-append">
             <div class="row q-gutter-x-sm">
                 <QBtn
                     flat
@@ -152,7 +152,7 @@ watch([year, businessFk], () => refreshData());
                     </QTooltip>
                 </QBtn>
             </div>
-        </Teleport> -->
+        </Teleport>
     </template>
     <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
         <QScrollArea class="fit text-grey-8">
@@ -170,13 +170,13 @@ watch([year, businessFk], () => refreshData());
                 {{ t('Autonomous worker') }}
             </QCardSection>
         </QCard>
-        <QCard v-else class="full-width q-pa-xl">
+        <QCard v-else class="full-width">
             <QIcon
                 v-if="isSubordinate"
                 name="info"
                 size="sm"
                 class="absolute"
-                style="top: 16px; right: 16px"
+                style="top: 14px; right: 14px"
             >
                 <QTooltip max-width="250px">
                     {{
@@ -208,18 +208,20 @@ watch([year, businessFk], () => refreshData());
 .calendar-container {
     display: grid;
     gap: 32px;
-    grid-template-columns: repeat(3, minmax(0, 1fr));
+    grid-template-columns: repeat(3, minmax(0, 320px));
+    padding: 40px;
+    justify-content: center;
 }
 
 @media (max-width: $breakpoint-md) {
     .calendar-container {
-        grid-template-columns: repeat(2, minmax(0, 1fr));
+        grid-template-columns: repeat(2, minmax(0, 320px));
     }
 }
 
 @media (max-width: $breakpoint-xs) {
     .calendar-container {
-        grid-template-columns: repeat(1, minmax(0, 1fr));
+        grid-template-columns: repeat(1, minmax(0, 320px));
     }
 }
 </style>
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index 481d926c4..92fd3f47b 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -150,7 +150,7 @@ watch(props.year, (newValue) => {
 </script>
 
 <template>
-    <QCalendarMonthWrapper style="height: 200px">
+    <QCalendarMonthWrapper style="height: 200px" class="outline">
         <template #header>
             <span class="full-width text-center text-body1 q-py-sm">{{
                 weekdayStore.getLocaleMonths[$props.month - 1].locale
@@ -199,7 +199,7 @@ watch(props.year, (newValue) => {
 
 .q-calendar-month__day--content {
     position: absolute;
-    top: 0;
+    top: 1;
     left: 0;
     display: flex;
     justify-content: center;
@@ -214,8 +214,8 @@ watch(props.year, (newValue) => {
     display: flex;
     justify-content: center;
     align-items: center;
-    width: 20px;
-    height: 20px;
+    width: 2em;
+    height: 2em;
     font-size: 0.75em;
     line-height: 1.715em;
     border-radius: 50%;

From 4b6038d1d2db4c90b141f4ce50b6c9ffb3a06660 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Sat, 6 Apr 2024 14:10:08 -0300
Subject: [PATCH 16/42] Last changes

---
 src/pages/Worker/Card/WorkerCalendar.vue      | 42 ++++++---
 .../Worker/Card/WorkerCalendarFilter.vue      | 93 +++++++++++--------
 src/pages/Worker/Card/WorkerCalendarItem.vue  | 78 ++++++++++++----
 src/pages/Worker/Card/WorkerDateLabel.vue     |  3 +-
 4 files changed, 147 insertions(+), 69 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
index 379ba334f..06cb69f5c 100644
--- a/src/pages/Worker/Card/WorkerCalendar.vue
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -23,7 +23,8 @@ const businessFk = ref(null);
 const year = ref(Date.vnNew().getFullYear());
 const contractHolidays = ref(null);
 const yearHolidays = ref(null);
-const events = ref({});
+const eventsMap = ref({});
+const festiveEventsMap = ref({});
 
 const onFetchActiveContract = (data) => {
     if (!data) return;
@@ -31,21 +32,27 @@ const onFetchActiveContract = (data) => {
     hasWorkCenter.value = Boolean(data?.workCenterFk);
 };
 
-const addEvent = (day, newEvent) => {
+const addEvent = (day, newEvent, isFestive = false) => {
     const timestamp = new Date(day).getTime();
-    let event = events.value[timestamp];
+    let event = eventsMap.value[timestamp];
 
-    if (event) {
+    if (!event) {
+        eventsMap.value[timestamp] = newEvent;
+        if (isFestive)
+            festiveEventsMap.value[timestamp] = JSON.parse(JSON.stringify(newEvent));
+    } else {
         const oldName = event.name;
+        const oldEventWasFestive = event.isFestive;
         Object.assign(event, newEvent);
+        event.isFestive = oldEventWasFestive;
         event.name = `${oldName}, ${event.name}`;
-    } else events.value[timestamp] = newEvent;
+    }
 };
 
 const onFetchAbsences = (data) => {
     if (!data) return;
 
-    events.value = {};
+    eventsMap.value = {};
 
     if (data.holidays) {
         data.holidays.forEach((holiday) => {
@@ -53,10 +60,14 @@ const onFetchAbsences = (data) => {
             const holidayType = holiday.type && holiday.type.name;
             const holidayName = holidayDetail || holidayType;
 
-            addEvent(holiday.dated, {
-                name: holidayName,
-                className: 'festive',
-            });
+            addEvent(
+                holiday.dated,
+                {
+                    name: holidayName,
+                    isFestive: true,
+                },
+                true
+            );
         });
     }
     if (data.absences) {
@@ -67,10 +78,10 @@ const onFetchAbsences = (data) => {
                 color: type.rgb,
                 type: type.code,
                 absenceId: absence.id,
+                isFestive: false,
             });
         });
     }
-    console.log('events:: ', events.value);
 };
 
 const getAbsences = async () => {
@@ -120,7 +131,10 @@ const refreshData = () => {
 };
 
 const onDeletedEvent = (timestamp) => {
-    delete events.value[timestamp];
+    delete eventsMap.value[timestamp];
+    // Si el evento que eliminamos se encontraba dentro de un dia festivo, volvemos a agregar el evento festivo
+    if (festiveEventsMap.value[timestamp])
+        eventsMap.value[timestamp] = festiveEventsMap.value[timestamp];
 };
 
 watch([year, businessFk], () => refreshData());
@@ -161,6 +175,8 @@ watch([year, businessFk], () => refreshData());
                 v-model:business-fk="businessFk"
                 v-model:year="year"
                 v-model:absence-type="absenceType"
+                :contract-holidays="contractHolidays"
+                :year-holidays="yearHolidays"
             />
         </QScrollArea>
     </QDrawer>
@@ -195,7 +211,7 @@ watch([year, businessFk], () => refreshData());
                     :month="month"
                     :absence-type="absenceType"
                     :business-fk="businessFk"
-                    :events="events"
+                    :events="eventsMap"
                     @refresh="refreshData"
                     @on-deleted-event="onDeletedEvent"
                 />
diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index c3fe65e19..db6b803d2 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -20,7 +20,15 @@ const props = defineProps({
         default: null,
     },
     absenceType: {
-        type: Number,
+        type: Object,
+        default: null,
+    },
+    contractHolidays: {
+        type: Object,
+        default: null,
+    },
+    yearHolidays: {
+        type: Object,
         default: null,
     },
 });
@@ -29,10 +37,7 @@ const emit = defineEmits(['update:businessFk', 'update:year', 'update:absenceTyp
 
 const selectedBusinessFk = computed({
     get: () => props.businessFk,
-    set: (value) => {
-        console.log('businessFk', value);
-        emit('update:businessFk', value);
-    },
+    set: (value) => emit('update:businessFk', value),
 });
 
 const selectedYear = computed({
@@ -76,42 +81,61 @@ const yearList = ref(generateYears());
         @on-fetch="(data) => (contractList = data)"
         auto-load
     />
-    <QItem v-if="contractHolidays" class="q-py-md">
-        <QItemSection class="text-center">
-            <p class="holiday-title q-mb-sm">
+
+    <div
+        v-if="contractHolidays"
+        class="q-pa-md q-mb-md q-ma-md color-vn-text"
+        style="border: 2px solid black"
+    >
+        <QCardSection horizontal>
+            <span class="text-weight-bold text-subtitle1 text-center full-width">
                 {{ t('Contract') }} #{{ selectedBusinessFk }}
-            </p>
-            <div>
+            </span>
+        </QCardSection>
+        <QCardSection class="column items-center" horizontal>
+            <span>
                 {{ t('Used') }} {{ contractHolidays.holidaysEnjoyed || 0 }} {{ t('of') }}
                 {{ contractHolidays.totalHolidays || 0 }}
                 {{ t('days') }}
-            </div>
-            <div>
+            </span>
+        </QCardSection>
+        <QCardSection class="column items-center" horizontal>
+            <span>
                 {{ t('Spent') }} {{ contractHolidays.hoursEnjoyed || 0 }} {{ t('of') }}
                 {{ contractHolidays.totalHours || 0 }} {{ t('hours') }}
-            </div>
-            <div>
+            </span>
+        </QCardSection>
+        <QCardSection class="column items-center" horizontal>
+            <span>
                 {{ t('Paid holidays') }}
                 {{ contractHolidays.payedHolidays || 0 }}
                 {{ t('days') }}
-            </div>
-        </QItemSection>
-    </QItem>
-    <QSeparator />
-    <QItem v-if="yearHolidays" class="q-py-md">
-        <QItemSection class="text-center">
-            <p class="holiday-title q-mb-sm">{{ t('Year') }} {{ selectedYear }}</p>
-            <div>
+            </span>
+        </QCardSection>
+    </div>
+    <div
+        v-if="contractHolidays"
+        class="q-pa-md q-mb-md q-ma-md color-vn-text"
+        style="border: 2px solid black"
+    >
+        <QCardSection horizontal>
+            <span class="text-weight-bold text-subtitle1 text-center full-width">
+                {{ t('Year') }} {{ selectedYear }}
+            </span>
+        </QCardSection>
+        <QCardSection class="column items-center" horizontal>
+            <span>
                 {{ t('Used') }} {{ yearHolidays.holidaysEnjoyed || 0 }} {{ t('of') }}
                 {{ yearHolidays.totalHolidays || 0 }} {{ t('days') }}
-            </div>
-            <div>
+            </span>
+        </QCardSection>
+        <QCardSection class="column items-center" horizontal>
+            <span>
                 {{ t('Spent') }} {{ yearHolidays.hoursEnjoyed || 0 }} {{ t('of') }}
                 {{ yearHolidays.totalHours || 0 }} {{ t('hours') }}
-            </div>
-        </QItemSection>
-    </QItem>
-    <QSeparator />
+            </span>
+        </QCardSection>
+    </div>
     <QList dense class="list q-gutter-y-sm q-my-lg">
         <QItem>
             <QItemSection>
@@ -172,17 +196,18 @@ const yearList = ref(generateYears());
         </QItem>
     </QList>
     <QSeparator />
-    <QList dense class="list q-my-lg">
+    <QList dense class="list q-my-lg no-pointer-events">
         <QItem>
             <WorkerDateLabel avatar-class="worker-calendar-festive">
-                Festive
+                {{ t('Festive') }}
             </WorkerDateLabel>
             <WorkerDateLabel avatar-class="worker-calendar-today">
-                Current day
+                {{ t('Current day') }}
             </WorkerDateLabel>
         </QItem>
     </QList>
 </template>
+
 <style lang="scss">
 .worker-calendar-festive {
     border: 2px solid $negative;
@@ -192,12 +217,6 @@ const yearList = ref(generateYears());
     border: 2px solid $info;
 }
 </style>
-<style lang="scss" scoped>
-.holiday-title {
-    font-size: 16px;
-    font-weight: bold;
-}
-</style>
 
 <i18n>
 es:
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index 92fd3f47b..cac455822 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -1,5 +1,5 @@
 <script setup>
-import { onBeforeMount, ref, watch } from 'vue';
+import { onBeforeMount, ref, watch, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { date } from 'quasar';
 import { useRoute } from 'vue-router';
@@ -48,6 +48,12 @@ const weekdayStore = useWeekdayStore();
 const selectedDate = ref();
 const calendarEventDates = [];
 const today = ref(date.formatDate(Date.vnNew(), 'YYYY-MM-DD'));
+const todayTimestamp = computed(() => {
+    const date = Date.vnNew();
+    date.setHours(0, 0, 0, 0);
+    return date.getTime();
+});
+const _year = computed(() => props.year);
 
 const updateSelectedDate = (year) => {
     const _date = new Date(year, props.month - 1, 1);
@@ -67,10 +73,9 @@ const createEvent = async (date) => {
             params
         );
 
-        console.log('CREATE data:: ', data);
         if (data) emit('refresh');
     } catch (error) {
-        console.log('error creating event:: ', error);
+        console.error('error creating event:: ', error);
     }
 };
 
@@ -88,12 +93,11 @@ const editEvent = async (event) => {
 
         if (data) emit('refresh');
     } catch (error) {
-        console.log('error editing event:: ', error);
+        console.error('error editing event:: ', error);
     }
 };
 
 const deleteEvent = async (event, date) => {
-    console.log('deleteEvent:: ', event);
     const params = { absenceId: event.absenceId };
     const { data } = await axios.delete(`Workers/${route.params.id}/deleteAbsence`, {
         params,
@@ -117,8 +121,14 @@ const handleDateSelected = (date) => {
 };
 
 const handleEventSelected = (event, { year, month, day }) => {
+    if (!props.absenceType) {
+        notify(t('Choose an absence type from the right menu'), 'warning');
+        return;
+    }
+
     const date = new Date(year, month - 1, day);
-    if (event.type == props.absenceType.code) deleteEvent(event, date);
+    if (!event.absenceId) createEvent(date);
+    else if (event.type == props.absenceType.code) deleteEvent(event, date);
     else editEvent(event);
 };
 
@@ -131,20 +141,34 @@ const getEventAttrs = (timestamp) => {
     const event = getEventByTimestamp(timestamp);
     if (!event) return {};
 
-    const { name, color } = event;
+    const { name, color, isFestive } = event;
 
     // Atributos a asignar a cada slot que representa un evento en el calendario
-    return {
+
+    const attrs = {
         title: name,
-        style: `background-color: ${color};`,
+        style: color ? `background-color: ${color};` : '',
+        label: timestamp.day,
     };
+
+    if (isFestive) {
+        attrs.class = '--festive';
+        attrs.label = event.absenceId ? timestamp.day : '';
+    }
+
+    return attrs;
+};
+
+const isToday = (timestamp) => {
+    const { year, month, day } = timestamp;
+    return todayTimestamp.value === new Date(year, month - 1, day).getTime();
 };
 
 onBeforeMount(() => {
-    updateSelectedDate(props.year);
+    updateSelectedDate(_year.value);
 });
 
-watch(props.year, (newValue) => {
+watch(_year, (newValue) => {
     updateSelectedDate(newValue);
 });
 </script>
@@ -173,16 +197,20 @@ watch(props.year, (newValue) => {
             >
                 <template #day="{ scope: { timestamp } }">
                     <!-- Este slot representa cada día del calendario y muestra un botón representando el correspondiente evento -->
-                    <QButton
+                    <QBtn
                         v-if="getEventByTimestamp(timestamp)"
                         v-bind="{ ...getEventAttrs(timestamp) }"
                         @click="
                             handleEventSelected(getEventByTimestamp(timestamp), timestamp)
                         "
+                        rounded
+                        dense
+                        flat
                         class="calendar-event"
-                    >
-                        {{ timestamp.day }}
-                    </QButton>
+                        :class="{
+                            '--today': isToday(timestamp),
+                        }"
+                    />
                 </template>
             </QCalendarMonth>
         </template>
@@ -190,6 +218,11 @@ watch(props.year, (newValue) => {
 </template>
 
 <style lang="scss">
+:root {
+    --calendar-border-current-dark: #84d0e2 2px solid;
+    --calendar-border-current: #84d0e2 2px solid;
+}
+
 .q-calendar__button {
     &:hover {
         background-color: var(--vn-accent-color);
@@ -197,6 +230,10 @@ watch(props.year, (newValue) => {
     }
 }
 
+.q-calendar__button--bordered {
+    color: $info !important;
+}
+
 .q-calendar-month__day--content {
     position: absolute;
     top: 1;
@@ -213,13 +250,20 @@ watch(props.year, (newValue) => {
 .calendar-event {
     display: flex;
     justify-content: center;
-    align-items: center;
     width: 2em;
     height: 2em;
     font-size: 0.75em;
     line-height: 1.715em;
-    border-radius: 50%;
     cursor: pointer;
+    color: white;
+
+    &.--today {
+        border: 2px solid $info;
+    }
+
+    &.--festive {
+        border: 2px solid $negative;
+    }
 
     &:hover {
         opacity: 0.8;
diff --git a/src/pages/Worker/Card/WorkerDateLabel.vue b/src/pages/Worker/Card/WorkerDateLabel.vue
index 4f2673be2..fdac00b33 100644
--- a/src/pages/Worker/Card/WorkerDateLabel.vue
+++ b/src/pages/Worker/Card/WorkerDateLabel.vue
@@ -18,7 +18,7 @@ defineEmits(['update:selected']);
 
 <template>
     <QChip
-        class="chip glossy"
+        class="chip"
         :selected="selected"
         :style="selected ? { backgroundColor: color } : null"
         @update:selected="$emit('update:selected', $event)"
@@ -26,7 +26,6 @@ defineEmits(['update:selected']);
         <QAvatar
             :color="color"
             :class="avatarClass"
-            class="glossy"
             :style="{ backgroundColor: color }"
         />
         <slot />

From cd3024c0a1aa025ec6962161d413830b5792fd77 Mon Sep 17 00:00:00 2001
From: robert <robert@verdnatura.es>
Date: Tue, 9 Apr 2024 09:17:49 +0200
Subject: [PATCH 17/42] feat: refs #6679 add icon

---
 src/router/modules/Supplier.js | 1 +
 src/router/modules/entry.js    | 1 +
 src/router/modules/travel.js   | 1 +
 src/router/modules/worker.js   | 2 +-
 4 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/router/modules/Supplier.js b/src/router/modules/Supplier.js
index 64c48146b..588c44960 100644
--- a/src/router/modules/Supplier.js
+++ b/src/router/modules/Supplier.js
@@ -46,6 +46,7 @@ export default {
                     name: 'SupplierCreate',
                     meta: {
                         title: 'create',
+                        icon: 'add',
                     },
                     component: () => import('src/pages/Supplier/SupplierCreate.vue'),
                 },
diff --git a/src/router/modules/entry.js b/src/router/modules/entry.js
index 50a651af5..1856ba525 100644
--- a/src/router/modules/entry.js
+++ b/src/router/modules/entry.js
@@ -35,6 +35,7 @@ export default {
                     name: 'EntryCreate',
                     meta: {
                         title: 'create',
+                        icon: 'add',
                     },
                     component: () => import('src/pages/Entry/EntryCreate.vue'),
                 },
diff --git a/src/router/modules/travel.js b/src/router/modules/travel.js
index 2f1e2150e..e1a08e9de 100644
--- a/src/router/modules/travel.js
+++ b/src/router/modules/travel.js
@@ -44,6 +44,7 @@ export default {
                     name: 'TravelCreate',
                     meta: {
                         title: 'travelCreate',
+                        icon: 'add',
                     },
                     component: () => import('src/pages/Travel/TravelCreate.vue'),
                 },
diff --git a/src/router/modules/worker.js b/src/router/modules/worker.js
index 68f096220..e0c713717 100644
--- a/src/router/modules/worker.js
+++ b/src/router/modules/worker.js
@@ -52,7 +52,7 @@ export default {
                     name: 'WorkerCreate',
                     meta: {
                         title: 'workerCreate',
-                        icon: '',
+                        icon: 'add',
                     },
                     component: () => import('src/pages/Worker/WorkerCreate.vue'),
                 },

From b05c28f571283f3b29403561aac58eb2752df66c Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 08:57:39 -0300
Subject: [PATCH 18/42] Add chaining to holiday detail and holiday type

---
 src/pages/Worker/Card/WorkerCalendar.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
index 06cb69f5c..0ce4f5c34 100644
--- a/src/pages/Worker/Card/WorkerCalendar.vue
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -56,8 +56,8 @@ const onFetchAbsences = (data) => {
 
     if (data.holidays) {
         data.holidays.forEach((holiday) => {
-            const holidayDetail = holiday.detail && holiday.detail.name;
-            const holidayType = holiday.type && holiday.type.name;
+            const holidayDetail = holiday?.detail?.name;
+            const holidayType = holiday?.type?.name;
             const holidayName = holidayDetail || holidayType;
 
             addEvent(

From e4166c85fabd899cd14c167149c9492bc1dc6bd7 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 09:05:15 -0300
Subject: [PATCH 19/42] Move add absences text to a i18n variable

---
 src/pages/Worker/Card/WorkerCalendar.vue | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
index 0ce4f5c34..c0e895eb2 100644
--- a/src/pages/Worker/Card/WorkerCalendar.vue
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -195,11 +195,7 @@ watch([year, businessFk], () => refreshData());
                 style="top: 14px; right: 14px"
             >
                 <QTooltip max-width="250px">
-                    {{
-                        t(
-                            'To start adding absences, click an absence type from the right menu and then on the day you want to add an absence'
-                        )
-                    }}
+                    {{ t('addAbsencesText') }}
                 </QTooltip>
             </QIcon>
             <div class="calendar-container">
@@ -243,8 +239,11 @@ watch([year, businessFk], () => refreshData());
 </style>
 
 <i18n>
+en:
+    addAbsencesText: To start adding absences, click an absence type from the right menu and then on the day you want to add an absence
+
 es:
     Search worker: Buscar trabajador
     You can search by worker id or name: Puedes buscar por id o nombre del trabajador
-    To start adding absences, click an absence type from the right menu and then on the day you want to add an absence: Para empezar a añadir ausencias, haz clic en un tipo de ausencia desde el menu de la derecha y después en el día que quieres añadir la ausencia
+    addAbsencesText: Para empezar a añadir ausencias, haz clic en un tipo de ausencia desde el menu de la derecha y después en el día que quieres añadir la ausencia
 </i18n>

From 196679b9e987719569eafcf57963510faf0b4121 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 09:07:46 -0300
Subject: [PATCH 20/42] Change v-if variable

---
 src/pages/Worker/Card/WorkerCalendarFilter.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index db6b803d2..7b13aee12 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -114,7 +114,7 @@ const yearList = ref(generateYears());
         </QCardSection>
     </div>
     <div
-        v-if="contractHolidays"
+        v-if="yearHolidays"
         class="q-pa-md q-mb-md q-ma-md color-vn-text"
         style="border: 2px solid black"
     >

From 0941d74d528fa910df2061f2f5782c83621ff8e9 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 09:14:41 -0300
Subject: [PATCH 21/42] Move default value assignment

---
 src/pages/Worker/Card/WorkerCalendarFilter.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index 7b13aee12..ff657cef0 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -57,7 +57,7 @@ const generateYears = () => {
     const now = Date.vnNew();
     const maxYear = now.getFullYear() + 1;
 
-    return Array.from({ length: 5 }, (_, i) => String(maxYear - i));
+    return Array.from({ length: 5 }, (_, i) => String(maxYear - i)) || [];
 };
 
 const absenceTypeList = ref([]);
@@ -142,7 +142,7 @@ const yearList = ref(generateYears());
                 <VnSelectFilter
                     :label="t('Year')"
                     v-model="selectedYear"
-                    :options="yearList || []"
+                    :options="yearList"
                     dense
                     outlined
                     rounded
@@ -156,7 +156,7 @@ const yearList = ref(generateYears());
                 <VnSelectFilter
                     :label="t('Contract')"
                     v-model="selectedBusinessFk"
-                    :options="contractList || []"
+                    :options="contractList"
                     option-value="businessFk"
                     option-label="businessFk"
                     dense

From fb4f35a378545a089111eab4c86e313b8982762a Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 09:21:35 -0300
Subject: [PATCH 22/42] Rename WorkerDateLabel and change colors

---
 src/pages/Worker/Card/WorkerCalendarFilter.vue     | 14 +++++++-------
 .../{WorkerDateLabel.vue => WorkerEventLabel.vue}  | 10 ++--------
 2 files changed, 9 insertions(+), 15 deletions(-)
 rename src/pages/Worker/Card/{WorkerDateLabel.vue => WorkerEventLabel.vue} (78%)

diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index ff657cef0..58f770c52 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -1,5 +1,5 @@
 <script setup>
-import WorkerDateLabel from 'pages/Worker/Card/WorkerDateLabel.vue';
+import WorkerEventLabel from 'pages/Worker/Card/WorkerEventLabel.vue';
 import FetchData from 'components/FetchData.vue';
 import { useI18n } from 'vue-i18n';
 import VnSelectFilter from 'components/common/VnSelectFilter.vue';
@@ -186,24 +186,24 @@ const yearList = ref(generateYears());
     </QList>
     <QList dense class="list q-gutter-y-sm q-my-lg">
         <QItem v-for="type in absenceTypeList" :key="type.id">
-            <WorkerDateLabel
+            <WorkerEventLabel
                 :color="type.rgb"
                 :selected="selectedAbsenceType?.id === type.id"
                 @click="selectedAbsenceType = type"
             >
                 {{ type.name }}
-            </WorkerDateLabel>
+            </WorkerEventLabel>
         </QItem>
     </QList>
     <QSeparator />
     <QList dense class="list q-my-lg no-pointer-events">
         <QItem>
-            <WorkerDateLabel avatar-class="worker-calendar-festive">
+            <WorkerEventLabel avatar-class="worker-calendar-festive">
                 {{ t('Festive') }}
-            </WorkerDateLabel>
-            <WorkerDateLabel avatar-class="worker-calendar-today">
+            </WorkerEventLabel>
+            <WorkerEventLabel avatar-class="worker-calendar-today">
                 {{ t('Current day') }}
-            </WorkerDateLabel>
+            </WorkerEventLabel>
         </QItem>
     </QList>
 </template>
diff --git a/src/pages/Worker/Card/WorkerDateLabel.vue b/src/pages/Worker/Card/WorkerEventLabel.vue
similarity index 78%
rename from src/pages/Worker/Card/WorkerDateLabel.vue
rename to src/pages/Worker/Card/WorkerEventLabel.vue
index fdac00b33..cf16090ef 100644
--- a/src/pages/Worker/Card/WorkerDateLabel.vue
+++ b/src/pages/Worker/Card/WorkerEventLabel.vue
@@ -18,9 +18,9 @@ defineEmits(['update:selected']);
 
 <template>
     <QChip
-        class="chip"
+        class="text-white"
         :selected="selected"
-        :style="selected ? { backgroundColor: color } : null"
+        :style="{ backgroundColor: selected ? color : 'black' }"
         @update:selected="$emit('update:selected', $event)"
     >
         <QAvatar
@@ -31,9 +31,3 @@ defineEmits(['update:selected']);
         <slot />
     </QChip>
 </template>
-
-<style scoped lang="scss">
-.chip {
-    color: var(--vn-text-color);
-}
-</style>

From 881c6e2f7fa214ffa04e461681ad1a4f9823b223 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 09:54:23 -0300
Subject: [PATCH 23/42] Improve translations

---
 .../Worker/Card/WorkerCalendarFilter.vue      | 58 +++++++++++++------
 1 file changed, 39 insertions(+), 19 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index 58f770c52..66d5bdf27 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -94,22 +94,31 @@ const yearList = ref(generateYears());
         </QCardSection>
         <QCardSection class="column items-center" horizontal>
             <span>
-                {{ t('Used') }} {{ contractHolidays.holidaysEnjoyed || 0 }} {{ t('of') }}
-                {{ contractHolidays.totalHolidays || 0 }}
-                {{ t('days') }}
+                {{
+                    t('usedDays', {
+                        holidaysEnjoyed: contractHolidays.holidaysEnjoyed || 0,
+                        totalHolidays: contractHolidays.totalHolidays || 0,
+                    })
+                }}
             </span>
         </QCardSection>
         <QCardSection class="column items-center" horizontal>
             <span>
-                {{ t('Spent') }} {{ contractHolidays.hoursEnjoyed || 0 }} {{ t('of') }}
-                {{ contractHolidays.totalHours || 0 }} {{ t('hours') }}
+                {{
+                    t('spentHours', {
+                        hoursEnjoyed: contractHolidays.hoursEnjoyed || 0,
+                        totalHours: contractHolidays.totalHours || 0,
+                    })
+                }}
             </span>
         </QCardSection>
         <QCardSection class="column items-center" horizontal>
             <span>
-                {{ t('Paid holidays') }}
-                {{ contractHolidays.payedHolidays || 0 }}
-                {{ t('days') }}
+                {{
+                    t('paidHolidays', {
+                        payedHolidays: contractHolidays.payedHolidays || 0,
+                    })
+                }}
             </span>
         </QCardSection>
     </div>
@@ -125,15 +134,21 @@ const yearList = ref(generateYears());
         </QCardSection>
         <QCardSection class="column items-center" horizontal>
             <span>
-                {{ t('Used') }} {{ yearHolidays.holidaysEnjoyed || 0 }} {{ t('of') }}
-                {{ yearHolidays.totalHolidays || 0 }} {{ t('days') }}
+                {{
+                    t('usedDays', {
+                        holidaysEnjoyed: yearHolidays.holidaysEnjoyed || 0,
+                        totalHolidays: yearHolidays.totalHolidays || 0,
+                    })
+                }}
             </span>
         </QCardSection>
         <QCardSection class="column items-center" horizontal>
-            <span>
-                {{ t('Spent') }} {{ yearHolidays.hoursEnjoyed || 0 }} {{ t('of') }}
-                {{ yearHolidays.totalHours || 0 }} {{ t('hours') }}
-            </span>
+            {{
+                t('spentHours', {
+                    hoursEnjoyed: yearHolidays.hoursEnjoyed || 0,
+                    totalHours: yearHolidays.totalHours || 0,
+                })
+            }}
         </QCardSection>
     </div>
     <QList dense class="list q-gutter-y-sm q-my-lg">
@@ -219,15 +234,20 @@ const yearList = ref(generateYears());
 </style>
 
 <i18n>
+en:
+    spentHours: Spent {hoursEnjoyed} of {totalHours} hours
+    usedDays: Used {holidaysEnjoyed} of {totalHolidays} days
+    paidHolidays: Paid holidays {payedHolidays} days
+
+
 es:
-    Used: Utilizados
-    Spent: Utilizadas
     Paid holidays: Vacaciones pagadas
-    of: de
-    days: días
-    hours: horas
     Year: Año
     Contract: Contrato
     Festive: Festivo
     Current day: Día actual
+    spentHours: Utilizadas {hoursEnjoyed} de {totalHours} horas
+    usedDays: Utilizados {holidaysEnjoyed} de {totalHolidays} días
+    paidHolidays: Vacaciones pagadas {payedHolidays} días
+
 </i18n>

From 3e5a5dfe1c4a238a9ad6292b8bc6b54e50d13cfb Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 10:53:07 -0300
Subject: [PATCH 24/42] remove import

---
 src/pages/Worker/Card/WorkerCalendarItem.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index cac455822..c1954b456 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -7,7 +7,6 @@ import { useRoute } from 'vue-router';
 import QCalendarMonthWrapper from 'src/components/ui/QCalendarMonthWrapper.vue';
 import { QCalendarMonth } from '@quasar/quasar-ui-qcalendar/src/index.js';
 import '@quasar/quasar-ui-qcalendar/src/QCalendarVariables.sass';
-import '@quasar/quasar-ui-qcalendar/src/QCalendarMonth.sass';
 
 import { useWeekdayStore } from 'src/stores/useWeekdayStore';
 import useNotify from 'src/composables/useNotify.js';

From dfcf6e35d54479c5b9d04cde5672c6027ba0bf15 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 11:06:07 -0300
Subject: [PATCH 25/42] Change WorkerEventLabels separations

---
 src/pages/Worker/Card/WorkerCalendarFilter.vue | 5 ++---
 src/pages/Worker/Card/WorkerEventLabel.vue     | 2 +-
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index 66d5bdf27..abd99ffb5 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -199,7 +199,7 @@ const yearList = ref(generateYears());
             </QItemSection>
         </QItem>
     </QList>
-    <QList dense class="list q-gutter-y-sm q-my-lg">
+    <QList dense class="list q-gutter-y-xs q-my-md">
         <QItem v-for="type in absenceTypeList" :key="type.id">
             <WorkerEventLabel
                 :color="type.rgb"
@@ -211,7 +211,7 @@ const yearList = ref(generateYears());
         </QItem>
     </QList>
     <QSeparator />
-    <QList dense class="list q-my-lg no-pointer-events">
+    <QList dense class="list q-my-md no-pointer-events">
         <QItem>
             <WorkerEventLabel avatar-class="worker-calendar-festive">
                 {{ t('Festive') }}
@@ -239,7 +239,6 @@ en:
     usedDays: Used {holidaysEnjoyed} of {totalHolidays} days
     paidHolidays: Paid holidays {payedHolidays} days
 
-
 es:
     Paid holidays: Vacaciones pagadas
     Year: Año
diff --git a/src/pages/Worker/Card/WorkerEventLabel.vue b/src/pages/Worker/Card/WorkerEventLabel.vue
index cf16090ef..b75fea890 100644
--- a/src/pages/Worker/Card/WorkerEventLabel.vue
+++ b/src/pages/Worker/Card/WorkerEventLabel.vue
@@ -18,7 +18,7 @@ defineEmits(['update:selected']);
 
 <template>
     <QChip
-        class="text-white"
+        class="text-white q-ma-none"
         :selected="selected"
         :style="{ backgroundColor: selected ? color : 'black' }"
         @update:selected="$emit('update:selected', $event)"

From 9ea0a6204672fb79a552f12d356bdc985b0d5aba Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 14:03:18 -0300
Subject: [PATCH 26/42] Add border and change background color

---
 src/components/ui/QCalendarMonthWrapper.vue  | 46 +++++++++++++++++++-
 src/pages/Worker/Card/WorkerCalendarItem.vue |  7 ++-
 2 files changed, 51 insertions(+), 2 deletions(-)

diff --git a/src/components/ui/QCalendarMonthWrapper.vue b/src/components/ui/QCalendarMonthWrapper.vue
index 49acd0e7d..c5187a7b8 100644
--- a/src/components/ui/QCalendarMonthWrapper.vue
+++ b/src/components/ui/QCalendarMonthWrapper.vue
@@ -1,5 +1,32 @@
+<script setup>
+import { computed } from 'vue';
+import { useQuasar } from 'quasar';
+import '@quasar/quasar-ui-qcalendar/src/QCalendarVariables.sass';
+
+const $props = defineProps({
+    bordered: {
+        type: Boolean,
+        default: false,
+    },
+    transparentBackground: {
+        type: Boolean,
+        default: false,
+    },
+});
+
+const $q = useQuasar();
+
+const containerClasses = computed(() => {
+    const classes = ['main-container-background'];
+    if ($props.bordered) classes.push('--bordered');
+    if ($props.transparentBackground) classes.push('transparent-background');
+    else classes.push($q.dark.isActive ? '--dark' : '--light');
+    return classes;
+});
+</script>
+
 <template>
-    <div :class="['main-container-background', $q.dark.isActive ? '--dark' : '--light']">
+    <div :class="containerClasses">
         <div class="nav-container row"><slot name="header" /></div>
         <slot name="calendar" />
     </div>
@@ -7,6 +34,8 @@
 
 <style lang="scss">
 .main-container-background {
+    --calendar-current-background-dark: transparent;
+
     &.--dark {
         background-color: var(--calendar-background-dark);
     }
@@ -14,10 +43,25 @@
     &.--light {
         background-color: var(--calendar-background);
     }
+
+    &.--bordered {
+        border: 1px solid black;
+    }
+}
+
+.transparent-background {
+    .q-calendar-month > * {
+        background-color: var(--vn-section-color) !important;
+        --calendar-outside-background-dark: #transparent;
+    }
 }
 
 .nav-container {
     display: flex;
     align-items: center;
+
+    &.--bordered {
+        border: 1px solid black;
+    }
 }
 </style>
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index c1954b456..b88b48fd6 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -173,7 +173,12 @@ watch(_year, (newValue) => {
 </script>
 
 <template>
-    <QCalendarMonthWrapper style="height: 200px" class="outline">
+    <QCalendarMonthWrapper
+        style="height: 200px"
+        class="outline"
+        bordered
+        transparent-background
+    >
         <template #header>
             <span class="full-width text-center text-body1 q-py-sm">{{
                 weekdayStore.getLocaleMonths[$props.month - 1].locale

From c573019038289710ac2d881429070df97844fef3 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 14:13:40 -0300
Subject: [PATCH 27/42] Sizes and spacings

---
 src/pages/Worker/Card/WorkerCalendar.vue     |  6 +++---
 src/pages/Worker/Card/WorkerCalendarItem.vue | 22 ++++++++++++++++----
 2 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
index c0e895eb2..161d1feae 100644
--- a/src/pages/Worker/Card/WorkerCalendar.vue
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -220,20 +220,20 @@ watch([year, businessFk], () => refreshData());
 .calendar-container {
     display: grid;
     gap: 32px;
-    grid-template-columns: repeat(3, minmax(0, 320px));
+    grid-template-columns: repeat(3, minmax(0, 334px));
     padding: 40px;
     justify-content: center;
 }
 
 @media (max-width: $breakpoint-md) {
     .calendar-container {
-        grid-template-columns: repeat(2, minmax(0, 320px));
+        grid-template-columns: repeat(2, minmax(0, 334px));
     }
 }
 
 @media (max-width: $breakpoint-xs) {
     .calendar-container {
-        grid-template-columns: repeat(1, minmax(0, 320px));
+        grid-template-columns: repeat(1, minmax(0, 334px));
     }
 }
 </style>
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index b88b48fd6..2c524c2a3 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -174,7 +174,7 @@ watch(_year, (newValue) => {
 
 <template>
     <QCalendarMonthWrapper
-        style="height: 200px"
+        style="height: 290px"
         class="outline"
         bordered
         transparent-background
@@ -228,12 +228,26 @@ watch(_year, (newValue) => {
 }
 
 .q-calendar__button {
+    width: 32px;
+    height: 32px;
+    font-size: 13px;
+
     &:hover {
         background-color: var(--vn-accent-color);
         cursor: pointer;
     }
 }
 
+.q-calendar-month__week--wrapper {
+    margin-bottom: 4px;
+}
+
+.q-calendar-month__workweek {
+    height: 32px;
+    display: flex;
+    justify-content: center;
+}
+
 .q-calendar__button--bordered {
     color: $info !important;
 }
@@ -254,9 +268,9 @@ watch(_year, (newValue) => {
 .calendar-event {
     display: flex;
     justify-content: center;
-    width: 2em;
-    height: 2em;
-    font-size: 0.75em;
+    width: 32px;
+    height: 32px;
+    font-size: 13px;
     line-height: 1.715em;
     cursor: pointer;
     color: white;

From faa8d053139fb0415ccaf0d412a1b434315e39b2 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 14:48:51 -0300
Subject: [PATCH 28/42] Change saturday and sunday days color

---
 src/pages/Worker/Card/WorkerCalendarItem.vue | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index 2c524c2a3..7ab2a34b0 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -223,6 +223,7 @@ watch(_year, (newValue) => {
 
 <style lang="scss">
 :root {
+    // Cambia los colores del día actual del calendario por los de salix
     --calendar-border-current-dark: #84d0e2 2px solid;
     --calendar-border-current: #84d0e2 2px solid;
 }
@@ -238,6 +239,12 @@ watch(_year, (newValue) => {
     }
 }
 
+.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;
 }

From 9bffc9bb25a7470bbc5a90056860aa69ac06d671 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 15:20:29 -0300
Subject: [PATCH 29/42] classes and size improvements

---
 src/components/ui/QCalendarMonthWrapper.vue  |  7 +++----
 src/pages/Worker/Card/WorkerCalendar.vue     | 20 +++++---------------
 src/pages/Worker/Card/WorkerCalendarItem.vue |  2 +-
 3 files changed, 9 insertions(+), 20 deletions(-)

diff --git a/src/components/ui/QCalendarMonthWrapper.vue b/src/components/ui/QCalendarMonthWrapper.vue
index c5187a7b8..e87d9c4c9 100644
--- a/src/components/ui/QCalendarMonthWrapper.vue
+++ b/src/components/ui/QCalendarMonthWrapper.vue
@@ -50,10 +50,9 @@ const containerClasses = computed(() => {
 }
 
 .transparent-background {
-    .q-calendar-month > * {
-        background-color: var(--vn-section-color) !important;
-        --calendar-outside-background-dark: #transparent;
-    }
+    --calendar-background-dark: transparent;
+    --calendar-background: transparent;
+    --calendar-outside-background-dark: transparent;
 }
 
 .nav-container {
diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue
index 161d1feae..288e78dcf 100644
--- a/src/pages/Worker/Card/WorkerCalendar.vue
+++ b/src/pages/Worker/Card/WorkerCalendar.vue
@@ -180,7 +180,7 @@ watch([year, businessFk], () => refreshData());
             />
         </QScrollArea>
     </QDrawer>
-    <QPage class="column items-center q-pa-md">
+    <QPage class="column items-center">
         <QCard v-if="!hasWorkCenter">
             <QCardSection class="text-center">
                 {{ t('Autonomous worker') }}
@@ -218,24 +218,14 @@ watch([year, businessFk], () => refreshData());
 
 <style lang="scss" scoped>
 .calendar-container {
-    display: grid;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    align-items: center;
     gap: 32px;
-    grid-template-columns: repeat(3, minmax(0, 334px));
     padding: 40px;
     justify-content: center;
 }
-
-@media (max-width: $breakpoint-md) {
-    .calendar-container {
-        grid-template-columns: repeat(2, minmax(0, 334px));
-    }
-}
-
-@media (max-width: $breakpoint-xs) {
-    .calendar-container {
-        grid-template-columns: repeat(1, minmax(0, 334px));
-    }
-}
 </style>
 
 <i18n>
diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index 7ab2a34b0..598e3abbf 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -174,7 +174,7 @@ watch(_year, (newValue) => {
 
 <template>
     <QCalendarMonthWrapper
-        style="height: 290px"
+        style="height: 290px; width: 310px"
         class="outline"
         bordered
         transparent-background

From fc4a69b2c6413b3314e21e73feeff13b6f4347c2 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Tue, 9 Apr 2024 15:28:11 -0300
Subject: [PATCH 30/42] resolve conflicts in worker routes

---
 src/router/modules/worker.js | 25 ++++++++++---------------
 1 file changed, 10 insertions(+), 15 deletions(-)

diff --git a/src/router/modules/worker.js b/src/router/modules/worker.js
index b3470908e..5da5dba10 100644
--- a/src/router/modules/worker.js
+++ b/src/router/modules/worker.js
@@ -19,7 +19,7 @@ export default {
             'WorkerNotificationsManager',
             'WorkerPBX',
             'WorkerLog',
-            'WorkerCalendar'
+            'WorkerCalendar',
         ],
         departmentCard: ['BasicData'],
     },
@@ -120,22 +120,8 @@ export default {
                         import('src/pages/Worker/Card/WorkerNotificationsManager.vue'),
                 },
                 {
-<<<<<<< HEAD
-                    name: 'WorkerCalendar',
-                    path: 'calendar',
-                    meta: {
-                        title: 'calendar',
-                        icon: 'calendar_today',
-                    },
-                    component: () => import('src/pages/Worker/Card/WorkerCalendar.vue'),
-                },
-                {
-                    name: 'WorkerPda',
-                    path: 'pda',
-=======
                     path: 'pbx',
                     name: 'WorkerPBX',
->>>>>>> be9dd8b2b721a19295af30ff538e636ef69e890a
                     meta: {
                         title: 'pbx',
                         icon: 'vn:pbx',
@@ -151,6 +137,15 @@ 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'),
+                },
             ],
         },
     ],

From 933e6b88b1993300c254ed58e5a2513b6ff3ace7 Mon Sep 17 00:00:00 2001
From: robert <robert@verdnatura.es>
Date: Wed, 10 Apr 2024 13:24:20 +0200
Subject: [PATCH 31/42] feat: refs #6679 add icon

---
 src/router/modules/customer.js | 1 +
 src/router/modules/order.js    | 1 +
 src/router/modules/route.js    | 1 +
 src/router/modules/shelving.js | 1 +
 4 files changed, 4 insertions(+)

diff --git a/src/router/modules/customer.js b/src/router/modules/customer.js
index 75188bd32..cf74a5ac0 100644
--- a/src/router/modules/customer.js
+++ b/src/router/modules/customer.js
@@ -56,6 +56,7 @@ export default {
                     name: 'CustomerCreate',
                     meta: {
                         title: 'create',
+                        icon: 'add',
                     },
                     component: () => import('src/pages/Customer/CustomerCreate.vue'),
                 },
diff --git a/src/router/modules/order.js b/src/router/modules/order.js
index 16d73281b..7a5245f24 100644
--- a/src/router/modules/order.js
+++ b/src/router/modules/order.js
@@ -35,6 +35,7 @@ export default {
                     name: 'OrderCreate',
                     meta: {
                         title: 'create',
+                        icon: 'add',
                     },
                     component: () => import('src/pages/Order/Card/OrderForm.vue'),
                 },
diff --git a/src/router/modules/route.js b/src/router/modules/route.js
index 099492981..7531a4b73 100644
--- a/src/router/modules/route.js
+++ b/src/router/modules/route.js
@@ -35,6 +35,7 @@ export default {
                     name: 'RouteCreate',
                     meta: {
                         title: 'create',
+                        icon: 'add',
                     },
                     component: () => import('src/pages/Route/Card/RouteForm.vue'),
                 },
diff --git a/src/router/modules/shelving.js b/src/router/modules/shelving.js
index b881ca020..d454aab81 100644
--- a/src/router/modules/shelving.js
+++ b/src/router/modules/shelving.js
@@ -35,6 +35,7 @@ export default {
                     name: 'ShelvingCreate',
                     meta: {
                         title: 'create',
+                        icon: 'add',
                     },
                     component: () => import('src/pages/Shelving/Card/ShelvingForm.vue'),
                 },

From e4a8c450536d2baad932ffa5312ef3f209e96de6 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Wed, 10 Apr 2024 08:32:04 -0300
Subject: [PATCH 32/42] Change workweeks colod and capitalize

---
 src/pages/Worker/Card/WorkerCalendarItem.vue | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue
index 598e3abbf..584222d19 100644
--- a/src/pages/Worker/Card/WorkerCalendarItem.vue
+++ b/src/pages/Worker/Card/WorkerCalendarItem.vue
@@ -222,10 +222,12 @@ watch(_year, (newValue) => {
 </template>
 
 <style lang="scss">
+@import '../../../css/quasar.variables.scss';
 :root {
     // Cambia los colores del día actual del calendario por los de salix
     --calendar-border-current-dark: #84d0e2 2px solid;
     --calendar-border-current: #84d0e2 2px solid;
+    --calendar-current-color-dark: #ec8916;
 }
 
 .q-calendar__button {
@@ -294,6 +296,15 @@ watch(_year, (newValue) => {
         opacity: 0.8;
     }
 }
+.q-calendar-month__workweek,
+.q-calendar-month__head--workweek,
+.q-calendar-month__head--weekday.q-calendar__center.q-calendar__ellipsis {
+    text-transform: capitalize;
+    color: #777;
+    font-weight: bold;
+    font-size: 0.8rem;
+    text-align: center;
+}
 </style>
 
 <i18n>

From 7f2d8ee1e5dd33c18dbb37d1a53a4332d8491fc3 Mon Sep 17 00:00:00 2001
From: robert <robert@verdnatura.es>
Date: Wed, 10 Apr 2024 14:42:43 +0200
Subject: [PATCH 33/42] feat: refs #6679 add icon

---
 src/i18n/en/index.js | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index 9b6ec06e3..94649363f 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -137,7 +137,7 @@ export default {
     customer: {
         pageTitles: {
             customers: 'Customers',
-            create: 'Create',
+            create: 'New customer',
             list: 'List',
             webPayments: 'Web Payments',
             extendedList: 'Extended list',
@@ -299,7 +299,7 @@ export default {
             notes: 'Notes',
             dms: 'File management',
             log: 'Log',
-            create: 'Create',
+            create: 'New entry',
             latestBuys: 'Latest buys',
         },
         list: {
@@ -669,7 +669,7 @@ export default {
         pageTitles: {
             shelving: 'Shelving',
             shelvingList: 'Shelving List',
-            create: 'Create',
+            create: 'New shelving',
             summary: 'Summary',
             basicData: 'Basic Data',
             log: 'Logs',
@@ -776,7 +776,7 @@ export default {
         pageTitles: {
             order: 'Orders',
             orderList: 'List',
-            create: 'Create',
+            create: 'New order',
             summary: 'Summary',
             basicData: 'Basic Data',
             catalog: 'Catalog',
@@ -994,7 +994,7 @@ export default {
             routes: 'Routes',
             cmrsList: 'External CMRs list',
             RouteList: 'List',
-            create: 'Create',
+            create: 'New route',
             basicData: 'Basic Data',
             summary: 'Summary',
             RouteRoadmap: 'Roadmaps',
@@ -1025,7 +1025,7 @@ export default {
             suppliers: 'Suppliers',
             supplier: 'Supplier',
             list: 'List',
-            create: 'Create',
+            create: 'New supplier',
             summary: 'Summary',
             basicData: 'Basic data',
             fiscalData: 'Fiscal data',

From de18b56cb2fd439d05bafe2eef16ea1304f42ee5 Mon Sep 17 00:00:00 2001
From: robert <robert@verdnatura.es>
Date: Wed, 10 Apr 2024 14:47:20 +0200
Subject: [PATCH 34/42]  feat: refs #6679 add icon

---
 src/i18n/en/index.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index 027ff68cc..1a0c37743 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -139,7 +139,7 @@ export default {
     customer: {
         pageTitles: {
             customers: 'Customers',
-            create: 'New customer',
+            create: 'New customers',
             list: 'List',
             webPayments: 'Web Payments',
             extendedList: 'Extended list',
@@ -785,7 +785,7 @@ export default {
         pageTitles: {
             order: 'Orders',
             orderList: 'List',
-            create: 'New order',
+            create: 'New orders',
             summary: 'Summary',
             basicData: 'Basic Data',
             catalog: 'Catalog',
@@ -1004,7 +1004,7 @@ export default {
             routes: 'Routes',
             cmrsList: 'External CMRs list',
             RouteList: 'List',
-            create: 'New route',
+            create: 'New routes',
             basicData: 'Basic Data',
             summary: 'Summary',
             RouteRoadmap: 'Roadmaps',
@@ -1035,7 +1035,7 @@ export default {
             suppliers: 'Suppliers',
             supplier: 'Supplier',
             list: 'List',
-            create: 'New supplier',
+            create: 'New suppliers',
             summary: 'Summary',
             basicData: 'Basic data',
             fiscalData: 'Fiscal data',

From c12fd772184b8d7a26391c817d96a72004c3b392 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Fri, 12 Apr 2024 08:10:14 -0300
Subject: [PATCH 35/42] Remove businessFk from FetchData

---
 src/pages/Worker/Card/WorkerCalendarFilter.vue | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index abd99ffb5..fef8cdda3 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -72,12 +72,8 @@ const yearList = ref(generateYears());
         auto-load
     />
     <FetchData
-        v-if="businessFk"
         :url="`Workers/${route.params.id}/contracts`"
-        :filter="{
-            fields: ['businessFk', 'businessFk', 'started', 'ended'],
-            where: { businessFk },
-        }"
+        :filter="{ fields: ['businessFk', 'businessFk', 'started', 'ended'] }"
         @on-fetch="(data) => (contractList = data)"
         auto-load
     />

From 3d9d444bb425099ed13aeb709c85a7b87bbb3d38 Mon Sep 17 00:00:00 2001
From: wbuezas <wbuezas@verdnatura.es>
Date: Fri, 12 Apr 2024 08:11:58 -0300
Subject: [PATCH 36/42] remove filter field

---
 src/pages/Worker/Card/WorkerCalendarFilter.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/Worker/Card/WorkerCalendarFilter.vue b/src/pages/Worker/Card/WorkerCalendarFilter.vue
index fef8cdda3..374762ac1 100644
--- a/src/pages/Worker/Card/WorkerCalendarFilter.vue
+++ b/src/pages/Worker/Card/WorkerCalendarFilter.vue
@@ -73,7 +73,7 @@ const yearList = ref(generateYears());
     />
     <FetchData
         :url="`Workers/${route.params.id}/contracts`"
-        :filter="{ fields: ['businessFk', 'businessFk', 'started', 'ended'] }"
+        :filter="{ fields: ['businessFk', 'started', 'ended'] }"
         @on-fetch="(data) => (contractList = data)"
         auto-load
     />

From 68069ba9c64ca7b04e323bc7d4a2237b3ad603e9 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Mon, 15 Apr 2024 12:48:07 +0200
Subject: [PATCH 37/42] feat: refs #6938 hide personal phone

---
 src/components/ui/CardDescriptor.vue       |  4 +-
 src/components/ui/CardSummary.vue          |  2 +-
 src/pages/Worker/Card/WorkerBasicData.vue  |  3 ++
 src/pages/Worker/Card/WorkerDescriptor.vue | 26 +------------
 src/pages/Worker/Card/WorkerSummary.vue    | 43 ++--------------------
 5 files changed, 12 insertions(+), 66 deletions(-)

diff --git a/src/components/ui/CardDescriptor.vue b/src/components/ui/CardDescriptor.vue
index 8e9304d3e..f30ea8937 100644
--- a/src/components/ui/CardDescriptor.vue
+++ b/src/components/ui/CardDescriptor.vue
@@ -47,7 +47,7 @@ const arrayData = useArrayData($props.dataKey || $props.module, {
     skip: 0,
 });
 const { store } = arrayData;
-const entity = computed(() => store.data);
+const entity = computed(() =>Array.isArray( store.data) ? store.data[0] : store.data);
 const isLoading = ref(false);
 
 defineExpose({
@@ -67,7 +67,7 @@ async function getData() {
     try {
         const { data } = await arrayData.fetch({ append: false, updateRouter: false });
         state.set($props.dataKey, data);
-        emit('onFetch', data);
+        emit('onFetch', Array.isArray(data) ? data[0] : data);
     } finally {
         isLoading.value = false;
     }
diff --git a/src/components/ui/CardSummary.vue b/src/components/ui/CardSummary.vue
index 1e1480293..a06837cf4 100644
--- a/src/components/ui/CardSummary.vue
+++ b/src/components/ui/CardSummary.vue
@@ -32,7 +32,7 @@ const arrayData = useArrayData(props.dataKey || route.meta.moduleName, {
     skip: 0,
 });
 const { store } = arrayData;
-const entity = computed(() => store.data);
+const entity = computed(() => Array.isArray(store.data) ? store.data[0] : store.data);
 const isLoading = ref(false);
 
 defineExpose({
diff --git a/src/pages/Worker/Card/WorkerBasicData.vue b/src/pages/Worker/Card/WorkerBasicData.vue
index c59f4281d..775472065 100644
--- a/src/pages/Worker/Card/WorkerBasicData.vue
+++ b/src/pages/Worker/Card/WorkerBasicData.vue
@@ -27,6 +27,7 @@ const workerFilter = {
         },
         { relation: 'sip', scope: { fields: ['extension', 'secret'] } },
         { relation: 'department', scope: { include: { relation: 'department' } } },
+        { relation: 'client', scope: {fields:['phone']} },
     ],
 };
 const workersFilter = {
@@ -86,6 +87,7 @@ const maritalStatus = [
                     :label="t('Mobile extension')"
                     clearable
                 />
+                <VnInput v-model="data.client.phone" :label="t('Personal phone')" clearable />
             </VnRow>
 
             <VnRow class="row q-gutter-md q-mb-md">
@@ -157,6 +159,7 @@ es:
     Last name: Apellidos
     Business phone: Teléfono de empresa
     Mobile extension: Extensión móvil
+    Personal phone: Teléfono personal
     Boss: Jefe
     Marital status: Estado civil
     Married: Casado/a
diff --git a/src/pages/Worker/Card/WorkerDescriptor.vue b/src/pages/Worker/Card/WorkerDescriptor.vue
index a20ad5546..bb4acec69 100644
--- a/src/pages/Worker/Card/WorkerDescriptor.vue
+++ b/src/pages/Worker/Card/WorkerDescriptor.vue
@@ -31,29 +31,7 @@ const entityId = computed(() => {
 });
 
 const worker = ref();
-const filter = {
-    include: [
-        {
-            relation: 'user',
-            scope: {
-                fields: ['email', 'name', 'nickname'],
-            },
-        },
-        {
-            relation: 'department',
-            scope: {
-                include: [
-                    {
-                        relation: 'department',
-                    },
-                ],
-            },
-        },
-        {
-            relation: 'sip',
-        },
-    ],
-};
+const filter = { where: { id: route.params.id}};
 
 const sip = ref(null);
 
@@ -82,7 +60,7 @@ const setData = (entity) => {
     <CardDescriptor
         module="Worker"
         data-key="workerData"
-        :url="`Workers/${entityId}`"
+        :url="`Workers/summary`"
         :filter="filter"
         :title="data.title"
         :subtitle="data.subtitle"
diff --git a/src/pages/Worker/Card/WorkerSummary.vue b/src/pages/Worker/Card/WorkerSummary.vue
index dad21cda5..b24476e4f 100644
--- a/src/pages/Worker/Card/WorkerSummary.vue
+++ b/src/pages/Worker/Card/WorkerSummary.vue
@@ -10,7 +10,7 @@ import CardSummary from 'components/ui/CardSummary.vue';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
 import VnTitle from 'src/components/common/VnTitle.vue';
 
-const route = useRoute();
+const {params} = useRoute();
 const { t } = useI18n();
 
 const $props = defineProps({
@@ -20,53 +20,18 @@ const $props = defineProps({
     },
 });
 
-const entityId = computed(() => $props.id || route.params.id);
+const entityId = computed(() => $props.id || params.id);
 const workerUrl = ref();
 
 onMounted(async () => {
     workerUrl.value = (await getUrl('')) + `worker/${entityId.value}/`;
 });
 
-const filter = {
-    include: [
-        {
-            relation: 'user',
-            scope: {
-                fields: ['email', 'name', 'nickname', 'roleFk'],
-                include: {
-                    relation: 'role',
-                    scope: {
-                        fields: ['name'],
-                    },
-                },
-            },
-        },
-        {
-            relation: 'department',
-            scope: {
-                include: {
-                    relation: 'department',
-                    scope: {
-                        fields: ['name'],
-                    },
-                },
-            },
-        },
-        {
-            relation: 'boss',
-        },
-        {
-            relation: 'client',
-        },
-        {
-            relation: 'sip',
-        },
-    ],
-};
+const filter = {where: {id: params.id}};
 </script>
 
 <template>
-    <CardSummary ref="summary" :url="`Workers/${entityId}`" :filter="filter">
+    <CardSummary ref="summary" :url="`Workers/summary`" :filter="filter" >
         <template #header="{ entity }">
             <div>{{ entity.id }} - {{ entity.firstName }} {{ entity.lastName }}</div>
         </template>

From 058ddc8e9a315b44a254c467b0b2ba450ff8a10f Mon Sep 17 00:00:00 2001
From: robert <robert@verdnatura.es>
Date: Mon, 15 Apr 2024 13:18:39 +0200
Subject: [PATCH 38/42] feat: refs #6500

---
 src/i18n/en/index.js           | 23 +++++++++++------------
 src/i18n/es/index.js           | 22 +++++++++++-----------
 src/router/modules/Supplier.js |  2 +-
 src/router/modules/customer.js |  2 +-
 src/router/modules/entry.js    |  2 +-
 src/router/modules/order.js    |  2 +-
 src/router/modules/route.js    |  2 +-
 src/router/modules/shelving.js |  2 +-
 8 files changed, 28 insertions(+), 29 deletions(-)

diff --git a/src/i18n/en/index.js b/src/i18n/en/index.js
index 1a0c37743..f584c9ae0 100644
--- a/src/i18n/en/index.js
+++ b/src/i18n/en/index.js
@@ -139,13 +139,13 @@ export default {
     customer: {
         pageTitles: {
             customers: 'Customers',
-            create: 'New customers',
+            create: 'New customer',
             list: 'List',
             webPayments: 'Web Payments',
             extendedList: 'Extended list',
             notifications: 'Notifications',
             defaulter: 'Defaulter',
-            createCustomer: 'Create customer',
+            customerCreate: 'Create customer',
             summary: 'Summary',
             basicData: 'Basic data',
             fiscalData: 'Fiscal data',
@@ -301,7 +301,7 @@ export default {
             notes: 'Notes',
             dms: 'File management',
             log: 'Log',
-            create: 'New entry',
+            entryCreate: 'New entry',
             latestBuys: 'Latest buys',
         },
         list: {
@@ -425,7 +425,7 @@ export default {
         pageTitles: {
             tickets: 'Tickets',
             list: 'List',
-            createTicket: 'Create ticket',
+            ticketCreate: 'New ticket',
             summary: 'Summary',
             basicData: 'Basic Data',
             boxing: 'Boxing',
@@ -507,7 +507,7 @@ export default {
         pageTitles: {
             claims: 'Claims',
             list: 'List',
-            createClaim: 'Create claim',
+            claimCreate: 'New claim',
             summary: 'Summary',
             basicData: 'Basic Data',
             lines: 'Lines',
@@ -594,7 +594,7 @@ export default {
             list: 'List',
             negativeBases: 'Negative Bases',
             globalInvoicing: 'Global invoicing',
-            createInvoiceOut: 'Create invoice out',
+            invoiceOutCreate: 'Create invoice out',
             summary: 'Summary',
             basicData: 'Basic Data',
         },
@@ -678,7 +678,7 @@ export default {
         pageTitles: {
             shelving: 'Shelving',
             shelvingList: 'Shelving List',
-            create: 'New shelving',
+            shelvingCreate: 'New shelving',
             summary: 'Summary',
             basicData: 'Basic Data',
             log: 'Logs',
@@ -719,7 +719,7 @@ export default {
         pageTitles: {
             invoiceIns: 'Invoices In',
             list: 'List',
-            createInvoiceIn: 'Create invoice in',
+            invoiceInCreate: 'Create invoice in',
             summary: 'Summary',
             basicData: 'Basic data',
             vat: 'VAT',
@@ -785,7 +785,7 @@ export default {
         pageTitles: {
             order: 'Orders',
             orderList: 'List',
-            create: 'New orders',
+            orderCreate: 'New order',
             summary: 'Summary',
             basicData: 'Basic Data',
             catalog: 'Catalog',
@@ -1004,7 +1004,7 @@ export default {
             routes: 'Routes',
             cmrsList: 'External CMRs list',
             RouteList: 'List',
-            create: 'New routes',
+            routeCreate: 'New route',
             basicData: 'Basic Data',
             summary: 'Summary',
             RouteRoadmap: 'Roadmaps',
@@ -1035,7 +1035,7 @@ export default {
             suppliers: 'Suppliers',
             supplier: 'Supplier',
             list: 'List',
-            create: 'New suppliers',
+            supplierCreate: 'New supplier',
             summary: 'Summary',
             basicData: 'Basic data',
             fiscalData: 'Fiscal data',
@@ -1154,7 +1154,6 @@ export default {
         pageTitles: {
             travel: 'Travels',
             list: 'List',
-            create: 'Create',
             summary: 'Summary',
             extraCommunity: 'Extra community',
             travelCreate: 'New travel',
diff --git a/src/i18n/es/index.js b/src/i18n/es/index.js
index c19eb0764..80f3f4708 100644
--- a/src/i18n/es/index.js
+++ b/src/i18n/es/index.js
@@ -139,13 +139,12 @@ export default {
     customer: {
         pageTitles: {
             customers: 'Clientes',
-            create: 'Crear',
             list: 'Listado',
             webPayments: 'Pagos Web',
             extendedList: 'Listado extendido',
             notifications: 'Notificaciones',
             defaulter: 'Morosos',
-            createCustomer: 'Crear cliente',
+            customerCreate: 'Nuevo cliente',
             summary: 'Resumen',
             basicData: 'Datos básicos',
             fiscalData: 'Datos fiscales',
@@ -295,6 +294,7 @@ export default {
             entries: 'Entradas',
             list: 'Listado',
             summary: 'Resumen',
+            entryCreate: 'Nueva entrada',
             basicData: 'Datos básicos',
             buys: 'Compras',
             notes: 'Notas',
@@ -424,7 +424,7 @@ export default {
         pageTitles: {
             tickets: 'Tickets',
             list: 'Listado',
-            createTicket: 'Crear ticket',
+            ticketCreate: 'Nuevo ticket',
             summary: 'Resumen',
             basicData: 'Datos básicos',
             boxing: 'Encajado',
@@ -506,7 +506,7 @@ export default {
         pageTitles: {
             claims: 'Reclamaciones',
             list: 'Listado',
-            createClaim: 'Crear reclamación',
+            claimCreate: 'Crear reclamación',
             summary: 'Resumen',
             basicData: 'Datos básicos',
             lines: 'Líneas',
@@ -594,7 +594,7 @@ export default {
             list: 'Listado',
             negativeBases: 'Bases Negativas',
             globalInvoicing: 'Facturación global',
-            createInvoiceOut: 'Crear fact. emitida',
+            invoiceOutCreate: 'Crear fact. emitida',
             summary: 'Resumen',
             basicData: 'Datos básicos',
         },
@@ -680,7 +680,7 @@ export default {
         pageTitles: {
             order: 'Cesta',
             orderList: 'Listado',
-            create: 'Crear',
+            orderCreate: 'Nuevo pedido',
             summary: 'Resumen',
             basicData: 'Datos básicos',
             catalog: 'Catálogo',
@@ -736,7 +736,7 @@ export default {
         pageTitles: {
             shelving: 'Carros',
             shelvingList: 'Listado de carros',
-            create: 'Crear',
+            shelvingCreate: 'Nuevo carro',
             summary: 'Resumen',
             basicData: 'Datos básicos',
             log: 'Historial',
@@ -776,7 +776,7 @@ export default {
         pageTitles: {
             invoiceIns: 'Fact. recibidas',
             list: 'Listado',
-            createInvoiceIn: 'Crear fact. recibida',
+            invoiceInCreate: 'Crear fact. recibida',
             summary: 'Resumen',
             basicData: 'Datos básicos',
             vat: 'IVA',
@@ -1003,7 +1003,7 @@ export default {
             routes: 'Rutas',
             cmrsList: 'Listado de CMRs externos',
             RouteList: 'Listado',
-            create: 'Crear',
+            routeCreate: 'Nueva ruta',
             basicData: 'Datos básicos',
             summary: 'Resumen',
             RouteRoadmap: 'Troncales',
@@ -1034,7 +1034,7 @@ export default {
             suppliers: 'Proveedores',
             supplier: 'Proveedor',
             list: 'Listado',
-            create: 'Crear',
+            supplierCreate: 'Nuevo proveedor',
             summary: 'Resumen',
             basicData: 'Datos básicos',
             fiscalData: 'Datos fiscales',
@@ -1153,7 +1153,6 @@ export default {
         pageTitles: {
             travel: 'Envíos',
             list: 'Listado',
-            create: 'Crear',
             summary: 'Resumen',
             extraCommunity: 'Extra comunitarios',
             travelCreate: 'Nuevo envío',
@@ -1216,6 +1215,7 @@ export default {
             items: 'Artículos',
             list: 'Listado',
             diary: 'Histórico',
+            itemCreate: 'Nuevo artículo',
             tags: 'Etiquetas',
         },
         descriptor: {
diff --git a/src/router/modules/Supplier.js b/src/router/modules/Supplier.js
index 588c44960..da45aad2f 100644
--- a/src/router/modules/Supplier.js
+++ b/src/router/modules/Supplier.js
@@ -45,7 +45,7 @@ export default {
                     path: 'create',
                     name: 'SupplierCreate',
                     meta: {
-                        title: 'create',
+                        title: 'supplierCreate',
                         icon: 'add',
                     },
                     component: () => import('src/pages/Supplier/SupplierCreate.vue'),
diff --git a/src/router/modules/customer.js b/src/router/modules/customer.js
index cf74a5ac0..76d9a5af1 100644
--- a/src/router/modules/customer.js
+++ b/src/router/modules/customer.js
@@ -55,7 +55,7 @@ export default {
                     path: 'create',
                     name: 'CustomerCreate',
                     meta: {
-                        title: 'create',
+                        title: 'customerCreate',
                         icon: 'add',
                     },
                     component: () => import('src/pages/Customer/CustomerCreate.vue'),
diff --git a/src/router/modules/entry.js b/src/router/modules/entry.js
index 1856ba525..67fc41824 100644
--- a/src/router/modules/entry.js
+++ b/src/router/modules/entry.js
@@ -34,7 +34,7 @@ export default {
                     path: 'create',
                     name: 'EntryCreate',
                     meta: {
-                        title: 'create',
+                        title: 'entryCreate',
                         icon: 'add',
                     },
                     component: () => import('src/pages/Entry/EntryCreate.vue'),
diff --git a/src/router/modules/order.js b/src/router/modules/order.js
index 7a5245f24..eb5424e75 100644
--- a/src/router/modules/order.js
+++ b/src/router/modules/order.js
@@ -34,7 +34,7 @@ export default {
                     path: 'create',
                     name: 'OrderCreate',
                     meta: {
-                        title: 'create',
+                        title: 'orderCreate',
                         icon: 'add',
                     },
                     component: () => import('src/pages/Order/Card/OrderForm.vue'),
diff --git a/src/router/modules/route.js b/src/router/modules/route.js
index 7531a4b73..f8ededf55 100644
--- a/src/router/modules/route.js
+++ b/src/router/modules/route.js
@@ -34,7 +34,7 @@ export default {
                     path: 'create',
                     name: 'RouteCreate',
                     meta: {
-                        title: 'create',
+                        title: 'routeCreate',
                         icon: 'add',
                     },
                     component: () => import('src/pages/Route/Card/RouteForm.vue'),
diff --git a/src/router/modules/shelving.js b/src/router/modules/shelving.js
index d454aab81..d20ce40f4 100644
--- a/src/router/modules/shelving.js
+++ b/src/router/modules/shelving.js
@@ -34,7 +34,7 @@ export default {
                     path: 'create',
                     name: 'ShelvingCreate',
                     meta: {
-                        title: 'create',
+                        title: 'shelvingCreate',
                         icon: 'add',
                     },
                     component: () => import('src/pages/Shelving/Card/ShelvingForm.vue'),

From 1e77e827842862db4657ae021cf70887980faae9 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Mon, 15 Apr 2024 13:28:10 +0200
Subject: [PATCH 39/42] fix: refs #6938  id filter

---
 src/pages/Worker/Card/WorkerSummary.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerSummary.vue b/src/pages/Worker/Card/WorkerSummary.vue
index b24476e4f..16c7f0f08 100644
--- a/src/pages/Worker/Card/WorkerSummary.vue
+++ b/src/pages/Worker/Card/WorkerSummary.vue
@@ -10,7 +10,7 @@ import CardSummary from 'components/ui/CardSummary.vue';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
 import VnTitle from 'src/components/common/VnTitle.vue';
 
-const {params} = useRoute();
+const { params } = useRoute();
 const { t } = useI18n();
 
 const $props = defineProps({
@@ -27,11 +27,11 @@ onMounted(async () => {
     workerUrl.value = (await getUrl('')) + `worker/${entityId.value}/`;
 });
 
-const filter = {where: {id: params.id}};
+const filter = { where: { id: entityId.value } };
 </script>
 
 <template>
-    <CardSummary ref="summary" :url="`Workers/summary`" :filter="filter" >
+    <CardSummary ref="summary" :url="`Workers/summary`" :filter="filter">
         <template #header="{ entity }">
             <div>{{ entity.id }} - {{ entity.firstName }} {{ entity.lastName }}</div>
         </template>

From b2211369ea3e8268870e958e1ec561df0629c8ba Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Mon, 15 Apr 2024 13:30:42 +0200
Subject: [PATCH 40/42] fix: refs #6938  remove personal phone

---
 src/pages/Worker/Card/WorkerSummary.vue | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/src/pages/Worker/Card/WorkerSummary.vue b/src/pages/Worker/Card/WorkerSummary.vue
index 16c7f0f08..43c493565 100644
--- a/src/pages/Worker/Card/WorkerSummary.vue
+++ b/src/pages/Worker/Card/WorkerSummary.vue
@@ -68,12 +68,6 @@ const filter = { where: { id: entityId.value } };
                         <VnLinkPhone :phone-number="worker.phone" />
                     </template>
                 </VnLv>
-                <VnLv :value="worker.client?.phone">
-                    <template #label>
-                        {{ t('worker.summary.personalPhone') }}
-                        <VnLinkPhone :phone-number="worker.client?.phone" />
-                    </template>
-                </VnLv>
                 <VnLv :label="t('worker.summary.locker')" :value="worker.locker" />
             </QCard>
             <QCard class="vn-one">

From d178d7dc6a928baf53fd5556d794bf98e5c0518f Mon Sep 17 00:00:00 2001
From: robert <robert@verdnatura.es>
Date: Tue, 16 Apr 2024 08:04:57 +0200
Subject: [PATCH 41/42] feat: refs #6679  add icon

---
 src/i18n/locale/en.yml | 24 +++++++++++-------------
 src/i18n/locale/es.yml | 23 +++++++++++------------
 2 files changed, 22 insertions(+), 25 deletions(-)

diff --git a/src/i18n/locale/en.yml b/src/i18n/locale/en.yml
index ef9c2c4cd..06885375e 100644
--- a/src/i18n/locale/en.yml
+++ b/src/i18n/locale/en.yml
@@ -127,13 +127,12 @@ dashboard:
 customer:
     pageTitles:
         customers: Customers
-        create: Create
         list: List
         webPayments: Web Payments
         extendedList: Extended list
         notifications: Notifications
         defaulter: Defaulter
-        createCustomer: Create customer
+        customerCreate: New customer
         summary: Summary
         basicData: Basic data
         fiscalData: Fiscal data
@@ -281,7 +280,7 @@ entry:
         notes: Notes
         dms: File management
         log: Log
-        create: Create
+        entryCreate: New entry
         latestBuys: Latest buys
     list:
         newEntry: New entry
@@ -396,7 +395,7 @@ ticket:
     pageTitles:
         tickets: Tickets
         list: List
-        createTicket: Create ticket
+        ticketCreate: New ticket
         summary: Summary
         basicData: Basic Data
         boxing: Boxing
@@ -472,7 +471,7 @@ claim:
     pageTitles:
         claims: Claims
         list: List
-        createClaim: Create claim
+        claimCreate: New claim
         summary: Summary
         basicData: Basic Data
         lines: Lines
@@ -545,7 +544,7 @@ invoiceOut:
         list: List
         negativeBases: Negative Bases
         globalInvoicing: Global invoicing
-        createInvoiceOut: Create invoice out
+        invoiceOutCreate: Create invoice out
         summary: Summary
         basicData: Basic Data
     list:
@@ -618,7 +617,7 @@ shelving:
     pageTitles:
         shelving: Shelving
         shelvingList: Shelving List
-        create: Create
+        shelvingCreate: New shelving
         summary: Summary
         basicData: Basic Data
         log: Logs
@@ -651,7 +650,7 @@ invoiceIn:
     pageTitles:
         invoiceIns: Invoices In
         list: List
-        createInvoiceIn: Create invoice in
+        invoiceInCreate: Create invoice in
         summary: Summary
         basicData: Basic data
         vat: VAT
@@ -712,7 +711,7 @@ order:
     pageTitles:
         order: Orders
         orderList: List
-        create: Create
+        orderCreate: New order
         summary: Summary
         basicData: Basic Data
         catalog: Catalog
@@ -905,7 +904,7 @@ route:
         routes: Routes
         cmrsList: External CMRs list
         RouteList: List
-        create: Create
+        routeCreate: New route
         basicData: Basic Data
         summary: Summary
         RouteRoadmap: Roadmaps
@@ -932,7 +931,7 @@ supplier:
         suppliers: Suppliers
         supplier: Supplier
         list: List
-        create: Create
+        supplierCreate: New supplier
         summary: Summary
         basicData: Basic data
         fiscalData: Fiscal data
@@ -1038,7 +1037,6 @@ travel:
     pageTitles:
         travel: Travels
         list: List
-        create: Create
         summary: Summary
         extraCommunity: Extra community
         travelCreate: New travel
@@ -1096,7 +1094,7 @@ item:
         list: List
         diary: Diary
         tags: Tags
-        create: Create
+        itemCreate: New item
     descriptor:
         item: Item
         buyer: Buyer
diff --git a/src/i18n/locale/es.yml b/src/i18n/locale/es.yml
index d0de39ebc..5167daf77 100644
--- a/src/i18n/locale/es.yml
+++ b/src/i18n/locale/es.yml
@@ -124,8 +124,7 @@ dashboard:
     dashboard: Tablón
 customer:
   pageTitles:
-    customers: Clientes
-    create: Crear
+    customerCreate: Nuevo cliente
     list: Listado
     webPayments: Pagos Web
     extendedList: Listado extendido
@@ -278,7 +277,7 @@ entry:
     notes: Notas
     dms: Gestión documental
     log: Historial
-    create: Crear
+    entryCreate: Nueva entrada
     latestBuys: Últimas compras
   list:
     newEntry: Nueva entrada
@@ -393,7 +392,7 @@ ticket:
   pageTitles:
     tickets: Tickets
     list: Listado
-    createTicket: Crear ticket
+    ticketCreate: Nuevo ticket
     summary: Resumen
     basicData: Datos básicos
     boxing: Encajado
@@ -469,7 +468,7 @@ claim:
   pageTitles:
     claims: Reclamaciones
     list: Listado
-    createClaim: Crear reclamación
+    claimCreate: Crear reclamación
     summary: Resumen
     basicData: Datos básicos
     lines: Líneas
@@ -545,7 +544,7 @@ invoiceOut:
     list: Listado
     negativeBases: Bases Negativas
     globalInvoicing: Facturación global
-    createInvoiceOut: Crear fact. emitida
+    invoiceOutCreate: Crear fact. emitida
     summary: Resumen
     basicData: Datos básicos
   list:
@@ -618,7 +617,7 @@ order:
   pageTitles:
     order: Cesta
     orderList: Listado
-    create: Crear
+    orderCreate: Nueva orden
     summary: Resumen
     basicData: Datos básicos
     catalog: Catálogo
@@ -668,7 +667,7 @@ shelving:
   pageTitles:
     shelving: Carros
     shelvingList: Listado de carros
-    create: Crear
+    shelvingCreate: Nuevo carro
     summary: Resumen
     basicData: Datos básicos
     log: Historial
@@ -700,7 +699,7 @@ invoiceIn:
   pageTitles:
     invoiceIns: Fact. recibidas
     list: Listado
-    createInvoiceIn: Crear fact. recibida
+    invoiceInCreate: Crear fact. recibida
     summary: Resumen
     basicData: Datos básicos
     vat: IVA
@@ -902,7 +901,7 @@ route:
     routes: Rutas
     cmrsList: Listado de CMRs externos
     RouteList: Listado
-    create: Crear
+    routeCreate: Nueva ruta
     basicData: Datos básicos
     summary: Resumen
     RouteRoadmap: Troncales
@@ -929,7 +928,7 @@ supplier:
     suppliers: Proveedores
     supplier: Proveedor
     list: Listado
-    create: Crear
+    supplierCreate: Nuevo proveedor
     summary: Resumen
     basicData: Datos básicos
     fiscalData: Datos fiscales
@@ -1093,7 +1092,7 @@ item:
     list: Listado
     diary: Histórico
     tags: Etiquetas
-    create: Crear
+    itemCreate: Nuevo artículo
   descriptor:
     item: Artículo
     buyer: Comprador

From 87ae6870a9c6f67fc26f16516b75b2c87d85a556 Mon Sep 17 00:00:00 2001
From: robert <robert@verdnatura.es>
Date: Tue, 16 Apr 2024 09:33:56 +0200
Subject: [PATCH 42/42] feat: refs #6679 add icon

---
 src/i18n/locale/es.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/i18n/locale/es.yml b/src/i18n/locale/es.yml
index 5167daf77..92ae714c2 100644
--- a/src/i18n/locale/es.yml
+++ b/src/i18n/locale/es.yml
@@ -124,6 +124,7 @@ dashboard:
     dashboard: Tablón
 customer:
   pageTitles:
+    customers: Clientes
     customerCreate: Nuevo cliente
     list: Listado
     webPayments: Pagos Web