123 lines
3.2 KiB
JavaScript
123 lines
3.2 KiB
JavaScript
import './bootstrap';
|
|
// 1. Importar jQuery
|
|
import jQuery, { ready } from 'jquery';
|
|
|
|
// 2. Hacerlo global (IMPORTANTE para que funcione $(document).ready en Blade)
|
|
window.$ = window.jQuery = jQuery;
|
|
|
|
// 3. Importar Select2
|
|
import select2 from 'select2';
|
|
select2(); // Inicializar el plugin
|
|
|
|
// 4. Importar los estilos de Select2 (Opcional aquí, o en CSS)
|
|
import 'select2/dist/css/select2.css';
|
|
|
|
import { Calendar } from '@fullcalendar/core'
|
|
import dayGridPlugin from '@fullcalendar/daygrid'
|
|
import interactionPlugin from '@fullcalendar/interaction'
|
|
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
|
|
const calendarEl = document.getElementById('calendar')
|
|
|
|
if (!calendarEl) return
|
|
|
|
const calendar = new Calendar(calendarEl, {
|
|
plugins: [dayGridPlugin, interactionPlugin],
|
|
|
|
initialView: 'dayGridMonth',
|
|
locale: 'es',
|
|
|
|
buttonText: {
|
|
today: 'Volver a Hoy'
|
|
},
|
|
|
|
displayEventTime: false,
|
|
contentHeight: 'auto',
|
|
eventDisplay: 'block',
|
|
fixedWeekCount: false,
|
|
|
|
selectable: true,
|
|
|
|
/*
|
|
dateClick: function(info) {
|
|
let fecha = info.dateStr
|
|
window.location.href = `/agenda/dia/${fecha}`
|
|
},
|
|
*/
|
|
|
|
eventClick: function (info) {
|
|
|
|
const evento = info.event
|
|
|
|
const modal = document.getElementById("eventModal")
|
|
if (!modal) return
|
|
|
|
modal.classList.remove("hidden")
|
|
|
|
const statusMap = {
|
|
pending: 'Pendiente',
|
|
confirmed: 'Confirmado',
|
|
in_progress: 'En progreso',
|
|
ready: 'Listo',
|
|
delivered: 'Entregado'
|
|
}
|
|
|
|
const estado = statusMap[evento.extendedProps.status] ?? 'desconocido'
|
|
|
|
document.getElementById("modalTitle").innerText =
|
|
evento.extendedProps.description + " - " + estado
|
|
|
|
const fecha = evento.start
|
|
|
|
const hora = fecha.toLocaleTimeString("es-AR", {
|
|
hour: "2-digit",
|
|
minute: "2-digit",
|
|
hour12: false
|
|
})
|
|
|
|
document.getElementById("modalDate").innerText =
|
|
"Hora: " + hora
|
|
|
|
const url = window.appointmentShowTemplate.replace(':id', evento.id)
|
|
|
|
document.getElementById("viewEventBtn").href = url
|
|
},
|
|
|
|
events: window.appointments ?? [],
|
|
|
|
eventDidMount: function (info) {
|
|
|
|
const status = info.event.extendedProps.status
|
|
|
|
const colors = {
|
|
pending: '#ef4444',
|
|
in_progress: '#f59e0b',
|
|
completed: '#22c55e',
|
|
ready: '#22c55e',
|
|
delivered: '#22c55e'
|
|
}
|
|
|
|
const color = colors[status] ?? '#3b82f6'
|
|
|
|
info.event.setProp('backgroundColor', color)
|
|
info.event.setProp('borderColor', color)
|
|
info.event.setProp('textColor', '#ffffff')
|
|
}
|
|
|
|
})
|
|
|
|
calendar.render()
|
|
|
|
const closeBtn = document.getElementById("closeModal")
|
|
|
|
if (closeBtn) {
|
|
closeBtn.addEventListener("click", function () {
|
|
document.getElementById("eventModal").classList.add("hidden")
|
|
document.body.style.overflow = "auto"
|
|
})
|
|
}
|
|
|
|
})
|
|
|