add calendar festivos

httpdocs/assets/js/safekat/components/SafekatCalendar.js

@@ -0,0 +1,120 @@
+
+import Ajax from '../components/ajax.js'
+import { alertSuccess, alertError } from '../components/alerts/sweetAlert.js'
+// Render calendar
+class SafekatCalendar {
+    constructor(idElement) {
+        this.locale = $('meta[name=locale]').attr('content') ?? 'es';
+        this.calendarEl = document.getElementById(idElement);
+        this.calendar = null;
+    }
+    actionLoader(status = true) {
+        if (status) {
+            Notiflix.Block.circle('.section-block');
+        } else {
+            Notiflix.Block.remove('.section-block');
+        }
+    }
+    init() {
+        if (this.calendarEl) {
+
+            this.calendar = new FullCalendar.Calendar(this.calendarEl, {
+                locale: this.locale,
+                initialView: 'multiMonthYear',
+                multiMonthMaxColumns: 4,
+                contentHeight: '100vh',
+                editable: true,
+                dragScroll: true,
+                dayMaxEvents: 2,
+                dateClick: this.clickEvent.bind(this),
+                eventResizableFromStart: true,
+                customButtons: {
+                    sidebarToggle: {
+                        text: 'Sidebar'
+                    }
+                },
+
+            });
+            this.calendar.render();
+            this.calendar.setOption('aspectRatio', 1.8);
+
+        }
+    }
+    renderFestivos() {
+        this.setEventFestivos()
+    }
+    async setEventFestivos() {
+        try {
+
+
+            let response = await this.getFestivos();
+            this.actionLoader(false)
+            if (response.data) {
+                let festivosEvent = response.data.map(this.parseToFullCalendarEvent)
+                this.addEvents(festivosEvent)
+            }
+        } catch (error) {
+            console.error(error)
+        } finally {
+            this.actionLoader(false)
+
+        }
+    }
+    removeEvents() {
+        this.calendar.getEvents().forEach(event => event.remove());
+    }
+    async clickEvent(info) {
+        try {
+            let response = await this.storeFestivo({ date: info.dateStr })
+            alertSuccess(response.message).fire()
+            this.renderFestivos()
+        } catch (error) {
+            console.error(error)
+
+        } finally {
+            this.actionLoader(false)
+
+        }
+    }
+    addEvents(events) {
+        events.forEach(event => {
+            this.calendar.addEvent(event)
+        });
+    }
+    parseToFullCalendarEvent(festivoEntity) {
+        let date = festivoEntity.date.split('-').reverse().join('/')
+        return {
+            id: festivoEntity.id,
+            title: '',
+            start: festivoEntity.date,
+            display: 'background',
+            color: 'red',
+            textColor: 'white'
+        }
+    }
+
+    getFestivos() {
+        this.actionLoader(true)
+        this.removeEvents()
+        return new Promise((resolve, reject) => {
+            let ajax = new Ajax('/configuracion/festivos/all', null, null, resolve, reject)
+            ajax.get()
+        })
+    }
+    storeFestivo(event) {
+        this.actionLoader(true)
+        return new Promise((resolve, reject) => {
+            let ajax = new Ajax('/configuracion/festivos', event, null, resolve, reject)
+            ajax.post()
+        })
+    }
+    deleteFestivo(id) {
+        return new Promise((resolve, reject) => {
+            let ajax = new Ajax('/configuracion/festivos/' + id, null, null, resolve, reject)
+            ajax.delete()
+        })
+    }
+
+}
+
+export default SafekatCalendar

httpdocs/assets/js/safekat/pages/configuracion/festivo/index.js

@@ -0,0 +1,7 @@
+import SafekatCalendar from "../../../components/SafekatCalendar.js"
+
+$(() => {
+    let calendarFestivos = new SafekatCalendar('calendar');
+    calendarFestivos.init();
+    calendarFestivos.renderFestivos();
+})