From adde8d1ab86718b87aa6947d4e74521dc1d34803 Mon Sep 17 00:00:00 2001 From: carlossa Date: Wed, 15 May 2024 16:00:56 +0200 Subject: [PATCH 1/9] refs #6332 fix colors --- src/components/ui/QCalendarMonthWrapper.vue | 2 -- src/pages/Worker/Card/WorkerCalendarItem.vue | 1 - 2 files changed, 3 deletions(-) diff --git a/src/components/ui/QCalendarMonthWrapper.vue b/src/components/ui/QCalendarMonthWrapper.vue index 24255ea1a..5e3cdadc7 100644 --- a/src/components/ui/QCalendarMonthWrapper.vue +++ b/src/components/ui/QCalendarMonthWrapper.vue @@ -59,12 +59,10 @@ const containerClasses = computed(() => { // 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; } .q-calendar-month__head--weekday { diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue index 950557656..4787c3fd3 100644 --- a/src/pages/Worker/Card/WorkerCalendarItem.vue +++ b/src/pages/Worker/Card/WorkerCalendarItem.vue @@ -231,7 +231,6 @@ watch(_year, (newValue) => { font-size: 13px; line-height: 1.715em; cursor: pointer; - color: white; &.--today { border: 2px solid $info; From 99d16d215fc97b028149725b05b6544d30a170ed Mon Sep 17 00:00:00 2001 From: carlossa Date: Tue, 21 May 2024 11:56:30 +0200 Subject: [PATCH 2/9] refs #6332 colors --- src/components/ui/QCalendarMonthWrapper.vue | 1 - src/pages/Worker/Card/WorkerCalendarItem.vue | 1 + 2 files changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ui/QCalendarMonthWrapper.vue b/src/components/ui/QCalendarMonthWrapper.vue index 5e3cdadc7..896fb1974 100644 --- a/src/components/ui/QCalendarMonthWrapper.vue +++ b/src/components/ui/QCalendarMonthWrapper.vue @@ -50,7 +50,6 @@ const containerClasses = computed(() => { // 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: #84d0e2; // Colores de fondo del calendario en dark mode --calendar-outside-background-dark: #222; --calendar-background-dark: #222; diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue index 4787c3fd3..65ed8522a 100644 --- a/src/pages/Worker/Card/WorkerCalendarItem.vue +++ b/src/pages/Worker/Card/WorkerCalendarItem.vue @@ -238,6 +238,7 @@ watch(_year, (newValue) => { &.--festive { border: 2px solid $negative; + color: $negative; } &:hover { From 27c86288e1bedfb537959f746e8d543a4d035929 Mon Sep 17 00:00:00 2001 From: carlossa Date: Tue, 21 May 2024 16:14:55 +0200 Subject: [PATCH 3/9] refs #6332 color red button --- src/components/ui/QCalendarMonthWrapper.vue | 8 +++++++- src/pages/Worker/Card/WorkerCalendarItem.vue | 3 +-- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/components/ui/QCalendarMonthWrapper.vue b/src/components/ui/QCalendarMonthWrapper.vue index 896fb1974..6736d30d8 100644 --- a/src/components/ui/QCalendarMonthWrapper.vue +++ b/src/components/ui/QCalendarMonthWrapper.vue @@ -109,7 +109,13 @@ const containerClasses = computed(() => { cursor: pointer; } } - + .q-calendar-month__day--label .q-calendar__button { + color: red; + &::before { + content: ''; + color: transparent !important; + } + } .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 diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue index 65ed8522a..e2c9e525c 100644 --- a/src/pages/Worker/Card/WorkerCalendarItem.vue +++ b/src/pages/Worker/Card/WorkerCalendarItem.vue @@ -152,7 +152,7 @@ const getEventAttrs = (timestamp) => { if (isFestive) { attrs.class = '--festive'; - attrs.label = event.absenceId ? timestamp.day : ''; + attrs.label = timestamp.day; } return attrs; @@ -237,7 +237,6 @@ watch(_year, (newValue) => { } &.--festive { - border: 2px solid $negative; color: $negative; } From 2094506baf9f9845bf092f1cb021af84906b7166 Mon Sep 17 00:00:00 2001 From: Javier Segarra Date: Wed, 22 May 2024 08:27:09 +0200 Subject: [PATCH 4/9] fix: WorkerCalendarItem --- src/pages/Worker/Card/WorkerCalendar.vue | 1 + src/pages/Worker/Card/WorkerCalendarItem.vue | 25 ++++++++++++++++---- 2 files changed, 22 insertions(+), 4 deletions(-) diff --git a/src/pages/Worker/Card/WorkerCalendar.vue b/src/pages/Worker/Card/WorkerCalendar.vue index 2e525aa30..432603477 100644 --- a/src/pages/Worker/Card/WorkerCalendar.vue +++ b/src/pages/Worker/Card/WorkerCalendar.vue @@ -82,6 +82,7 @@ const onFetchAbsences = (data) => { type: type.code, absenceId: absence.id, isFestive: false, + isHoliday: false, }); }); } diff --git a/src/pages/Worker/Card/WorkerCalendarItem.vue b/src/pages/Worker/Card/WorkerCalendarItem.vue index 4787c3fd3..f21d34af0 100644 --- a/src/pages/Worker/Card/WorkerCalendarItem.vue +++ b/src/pages/Worker/Card/WorkerCalendarItem.vue @@ -126,7 +126,7 @@ const handleEventSelected = (event, { year, month, day }) => { } const date = new Date(year, month - 1, day); - if (!event.absenceId) createEvent(date); + if (!event?.absenceId) createEvent(date); else if (event.type == props.absenceType.code) deleteEvent(event, date); else editEvent(event); }; @@ -136,24 +136,37 @@ const getEventByTimestamp = ({ year, month, day }) => { return props.events[stamp] || null; }; +const isFestive = (timestamp) => { + const event = getEventByTimestamp(timestamp); + if (!event) return false; + + const { isFestive } = event; + return isFestive; +}; const getEventAttrs = (timestamp) => { const event = getEventByTimestamp(timestamp); if (!event) return {}; - const { name, color, isFestive } = event; + const { name, color, isFestive, type } = event; // Atributos a asignar a cada slot que representa un evento en el calendario const attrs = { title: name, - style: color ? `background-color: ${color};` : '', + style: + color && type !== 'holiday' + ? `background-color: ${color};` + : 'background-color:#3d3d3d;', label: timestamp.day, }; if (isFestive) { attrs.class = '--festive'; attrs.label = event.absenceId ? timestamp.day : ''; + // attrs.style = 'color: red'; } + // if(type === 'holiday') + else attrs.class = `--${type}`; return attrs; }; @@ -203,7 +216,6 @@ watch(_year, (newValue) => {