function MainComponent() { const [studentInfo, setStudentInfo] = useState({ group_number: "", list_number: "" }); const [selectedDate, setSelectedDate] = useState(null); const [remainingSpots, setRemainingSpots] = useState(16); const [selectedItems, setSelectedItems] = useState({}); const [selectedDrinks, setSelectedDrinks] = useState({}); const [mathAnswer, setMathAnswer] = useState(""); const [mathProblem, setMathProblem] = useState({ num1: 0, num2: 0, result: 0 }); const [showAdmin, setShowAdmin] = useState(false); const [adminPassword, setAdminPassword] = useState(""); const [reservations, setReservations] = useState([]); const [error, setError] = useState(null); const [success, setSuccess] = useState(false); const [showSummary, setShowSummary] = useState(false); const [currentReservation, setCurrentReservation] = useState(null); const [numberOfPeople, setNumberOfPeople] = useState(1); // Generate math problem on component mount useEffect(()=>{ const num1 = Math.floor(Math.random() * 10); const num2 = Math.floor(Math.random() * 10); setMathProblem({ num1, num2, result: num1 + num2 }); }, []); // Check availability when date changes useEffect(()=>{ if (selectedDate) { checkAvailability(); } }, [ selectedDate ]); const checkAvailability = async ()=>{ try { const response = await fetch("/api/reservations/availability", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ reservation_date: selectedDate, reservation_time: "09:00" }) }); if (!response.ok) { throw new Error("Failed to check availability"); } const data = await response.json(); setRemainingSpots(data.remaining_spots); } catch (error) { setError("Error checking availability"); console.error(error); } }; const handleAdminAccess = async ()=>{ try { const response = await fetch("/api/reservations/list", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ password: adminPassword }) }); if (!response.ok) { throw new Error("Failed to fetch reservations"); } const data = await response.json(); if (data.error) { throw new Error(data.error); } setReservations(data.reservations); setShowAdmin(true); setError(null); } catch (error) { setError("Error al obtener las reservas: " + error.message); console.error(error); } }; const calculateTotal = ()=>{ const items = [ ...Object.entries(selectedItems).map(([id, quantity])=>({ id: parseInt(id), quantity: parseInt(quantity || 0), name: [ { id: 1, name: "Sándwich vegetal con atún", icon: "🥪" }, { id: 2, name: "Sándwich de jamón y queso", icon: "🥪" }, { id: 3, name: "Sándwich de tortilla francesa", icon: "🥪" }, { id: 4, name: "Queque", icon: "🧁" } ].find((item)=>item.id === parseInt(id))?.name })).filter((item)=>item.quantity > 0), ...Object.entries(selectedDrinks).map(([id, quantity])=>({ id: parseInt(id), quantity: parseInt(quantity || 0), name: [ { id: 5, name: "Café", icon: "☕" }, { id: 6, name: "Té", icon: "🫖" }, { id: 7, name: "Zumo", icon: "🧃" }, { id: 8, name: "Agua", icon: "💧" } ].find((item)=>item.id === parseInt(id))?.name })).filter((item)=>item.quantity > 0) ]; return items; }; const handleSubmit = async ()=>{ if (mathAnswer !== mathProblem.result.toString()) { setError("La operación matemática es incorrecta"); return; } const items = calculateTotal(); if (items.length === 0) { setError("Por favor, selecciona al menos un producto"); return; } setShowSummary(true); setCurrentReservation({ student: studentInfo, date: selectedDate, items, numberOfPeople }); }; const confirmReservation = async ()=>{ try { const response = await fetch("/api/reservations", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ student: studentInfo, reservation_date: selectedDate, reservation_time: "09:00", number_of_people: numberOfPeople, items: [ ...Object.entries(selectedItems).map(([id, quantity])=>({ menu_item_id: parseInt(id), quantity: parseInt(quantity) })), ...Object.entries(selectedDrinks).map(([id, quantity])=>({ menu_item_id: parseInt(id), quantity: parseInt(quantity) })) ] }) }); if (!response.ok) { const data = await response.json(); throw new Error(data.error || "Error al crear la reserva"); } setSuccess(true); setShowSummary(false); // Limpiar el formulario setStudentInfo({ group_number: "", list_number: "" }); setSelectedDate(null); setSelectedItems({}); setSelectedDrinks({}); setMathAnswer(""); setNumberOfPeople(1); // Generate new math problem const num1 = Math.floor(Math.random() * 10); const num2 = Math.floor(Math.random() * 10); setMathProblem({ num1, num2, result: num1 + num2 }); } catch (error) { setError(error.message); console.error(error); } }; const handleDeleteReservation = async (reservationId)=>{ if (!confirm("¿Estás seguro de que deseas eliminar esta reserva?")) { return; } try { const response = await fetch("/api/reservations/delete", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ reservation_id: reservationId }) }); const data = await response.json(); if (!response.ok) { throw new Error(data.error || "Error al eliminar la reserva"); } // Si la eliminación fue exitosa, actualizamos la lista de reservas setReservations((prevReservations)=>prevReservations.filter((reservation)=>reservation.id !== reservationId)); setError(null); // Limpiamos cualquier error previo } catch (error) { console.error("Error:", error); setError(error.message); } }; if (showAdmin && reservations) { return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#f8f4f1]", __source: { fileName: "", lineNumber: 224, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-6 max-w-6xl mx-auto", __source: { fileName: "", lineNumber: 225, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-8", __source: { fileName: "", lineNumber: 226, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-[#5c3f2a]", __source: { fileName: "", lineNumber: 227, columnNumber: 13 }, __self: this }, "Reservas - Un buchito de café"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setShowAdmin(false); setAdminPassword(""); setReservations(null); setError(null); }, className: "px-6 py-2 bg-[#8b5e3c] text-white rounded-lg hover:bg-[#6f4b30] transition-colors", __source: { fileName: "", lineNumber: 230, columnNumber: 13 }, __self: this }, "Volver")), error && /*#__PURE__*/ React.createElement("div", { className: "mb-6 p-4 bg-red-100 text-red-700 rounded-lg", __source: { fileName: "", lineNumber: 244, columnNumber: 13 }, __self: this }, error), reservations.length === 0 ? /*#__PURE__*/ React.createElement("div", { className: "text-center text-[#8b5e3c] text-lg", __source: { fileName: "", lineNumber: 250, columnNumber: 13 }, __self: this }, "No hay reservas para mostrar") : /*#__PURE__*/ React.createElement("div", { className: "grid gap-6 md:grid-cols-2 lg:grid-cols-3", __source: { fileName: "", lineNumber: 254, columnNumber: 13 }, __self: this }, reservations.map((reservation)=>/*#__PURE__*/ React.createElement("div", { key: reservation.id, className: "bg-white p-6 rounded-xl shadow-md relative", __source: { fileName: "", lineNumber: 256, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleDeleteReservation(reservation.id), className: "absolute top-4 right-4 text-red-500 hover:text-red-700 transition-colors", title: "Eliminar reserva", __source: { fileName: "", lineNumber: 260, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "w-6 h-6", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 265, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16", __source: { fileName: "", lineNumber: 271, columnNumber: 23 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 mb-4", __source: { fileName: "", lineNumber: 280, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "w-6 h-6 text-[#8b5e3c]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 281, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z", __source: { fileName: "", lineNumber: 287, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "font-semibold text-[#5c3f2a]", __source: { fileName: "", lineNumber: 294, columnNumber: 21 }, __self: this }, "Grupo: ", reservation.group_number, ", Número:", " ", reservation.list_number)), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 mb-2", __source: { fileName: "", lineNumber: 300, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "w-5 h-5 text-[#8b5e3c]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 301, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z", __source: { fileName: "", lineNumber: 307, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 314, columnNumber: 21 }, __self: this }, new Date(reservation.reservation_date).toLocaleDateString())), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 mb-4", __source: { fileName: "", lineNumber: 321, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "w-5 h-5 text-[#8b5e3c]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 322, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z", __source: { fileName: "", lineNumber: 328, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 335, columnNumber: 21 }, __self: this }, reservation.reservation_time)), /*#__PURE__*/ React.createElement("div", { className: "border-t border-gray-200 pt-4", __source: { fileName: "", lineNumber: 338, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-semibold text-[#5c3f2a] mb-2", __source: { fileName: "", lineNumber: 339, columnNumber: 21 }, __self: this }, "Pedido:"), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", __source: { fileName: "", lineNumber: 342, columnNumber: 21 }, __self: this }, reservation.items && reservation.items.map((item, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 345, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 349, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "w-4 h-4 text-[#8b5e3c]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 350, columnNumber: 31 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M9 5l7 7-7 7", __source: { fileName: "", lineNumber: 356, columnNumber: 33 }, __self: this })), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 363, columnNumber: 31 }, __self: this }, item.name)), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 365, columnNumber: 29 }, __self: this }, "x ", item.quantity)))))))))); } return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#f8f4f1] py-8", __source: { fileName: "", lineNumber: 382, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-6xl mx-auto px-4", __source: { fileName: "", lineNumber: 383, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-12", __source: { fileName: "", lineNumber: 384, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-center mb-6", __source: { fileName: "", lineNumber: 385, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "w-16 h-16 text-[#8b5e3c]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 386, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z", __source: { fileName: "", lineNumber: 392, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-[#5c3f2a] mb-4", __source: { fileName: "", lineNumber: 400, columnNumber: 11 }, __self: this }, "Un buchito de café"), /*#__PURE__*/ React.createElement("p", { className: "text-[#8b5e3c] text-lg", __source: { fileName: "", lineNumber: 403, columnNumber: 11 }, __self: this }, "Tu rincón de café en el campus")), /*#__PURE__*/ React.createElement("div", { className: "grid md:grid-cols-2 gap-8", __source: { fileName: "", lineNumber: 408, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-md p-6", __source: { fileName: "", lineNumber: 409, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 410, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 411, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-[#5c3f2a] mb-4", __source: { fileName: "", lineNumber: 412, columnNumber: 17 }, __self: this }, "Información del Alumno"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 415, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 416, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-[#8b5e3c] mb-1", __source: { fileName: "", lineNumber: 417, columnNumber: 21 }, __self: this }, "Grupo"), /*#__PURE__*/ React.createElement("input", { type: "text", value: studentInfo.group_number, onChange: (e)=>setStudentInfo((prev)=>({ ...prev, group_number: e.target.value })), className: "w-full p-2 border border-[#d4c3b5] rounded-lg focus:outline-none focus:ring-2 focus:ring-[#8b5e3c]", placeholder: "Ej: A1", __source: { fileName: "", lineNumber: 420, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 433, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-[#8b5e3c] mb-1", __source: { fileName: "", lineNumber: 434, columnNumber: 21 }, __self: this }, "Número de lista"), /*#__PURE__*/ React.createElement("input", { type: "text", value: studentInfo.list_number, onChange: (e)=>setStudentInfo((prev)=>({ ...prev, list_number: e.target.value })), className: "w-full p-2 border border-[#d4c3b5] rounded-lg focus:outline-none focus:ring-2 focus:ring-[#8b5e3c]", placeholder: "Ej: 15", __source: { fileName: "", lineNumber: 437, columnNumber: 21 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 453, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-[#5c3f2a] mb-4", __source: { fileName: "", lineNumber: 454, columnNumber: 17 }, __self: this }, "Fecha de Reserva"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 457, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm text-[#8b5e3c] mb-3", __source: { fileName: "", lineNumber: 458, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 mb-2", __source: { fileName: "", lineNumber: 459, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 460, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z", __source: { fileName: "", lineNumber: 466, columnNumber: 25 }, __self: this })), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 473, columnNumber: 23 }, __self: this }, "La cafetería solo está abierta los Miércoles y Jueves"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 478, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-[#8b5e3c] mb-1", __source: { fileName: "", lineNumber: 479, columnNumber: 21 }, __self: this }, "Selecciona un día"), /*#__PURE__*/ React.createElement("input", { type: "date", onChange: (e)=>{ const selectedDay = new Date(e.target.value).getDay(); // 3 es miércoles, 4 es jueves if (selectedDay === 3 || selectedDay === 4) { setSelectedDate(e.target.value); setError(null); } else { setError("Solo se pueden hacer reservas para Miércoles y Jueves"); setSelectedDate(null); } }, min: new Date().toISOString().split("T")[0], className: "w-full p-2 border border-[#d4c3b5] rounded-lg focus:outline-none focus:ring-2 focus:ring-[#8b5e3c]", __source: { fileName: "", lineNumber: 482, columnNumber: 21 }, __self: this })), selectedDate && /*#__PURE__*/ React.createElement("div", { className: "bg-[#fdf6f2] p-4 rounded-lg border border-[#d4c3b5]", __source: { fileName: "", lineNumber: 503, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 mb-4", __source: { fileName: "", lineNumber: 504, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "w-5 h-5 text-[#8b5e3c]", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 505, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4", __source: { fileName: "", lineNumber: 511, columnNumber: 27 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-[#8b5e3c] font-medium", __source: { fileName: "", lineNumber: 518, columnNumber: 25 }, __self: this }, "Plazas disponibles: ", remainingSpots, " de 16")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 523, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-[#8b5e3c] mb-2", __source: { fileName: "", lineNumber: 524, columnNumber: 25 }, __self: this }, "Número de personas"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 527, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "number", min: "1", max: remainingSpots, value: numberOfPeople, onChange: (e)=>{ const value = parseInt(e.target.value); if (value > 0 && value <= remainingSpots) { setNumberOfPeople(value); setError(null); } else { setError(`El número de personas debe estar entre 1 y ${remainingSpots}`); } }, className: "w-24 p-2 border border-[#d4c3b5] rounded-lg focus:outline-none focus:ring-2 focus:ring-[#8b5e3c] text-center", __source: { fileName: "", lineNumber: 528, columnNumber: 27 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-sm text-[#8b5e3c]", __source: { fileName: "", lineNumber: 546, columnNumber: 27 }, __self: this }, remainingSpots <= 0 ? "No hay plazas disponibles para este día" : `Máximo ${remainingSpots} ${remainingSpots === 1 ? "persona" : "personas"}`)))))))), /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 560, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-md p-6", __source: { fileName: "", lineNumber: 561, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-[#5c3f2a] mb-4", __source: { fileName: "", lineNumber: 562, columnNumber: 15 }, __self: this }, "Menú"), /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 566, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 567, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-medium text-[#8b5e3c] mb-3", __source: { fileName: "", lineNumber: 568, columnNumber: 19 }, __self: this }, "Comidas"), /*#__PURE__*/ React.createElement("div", { className: "space-y-3", __source: { fileName: "", lineNumber: 571, columnNumber: 19 }, __self: this }, [ { id: 1, name: "Sándwich vegetal con atún", icon: "🥪" }, { id: 2, name: "Sándwich de jamón y queso", icon: "🥪" }, { id: 3, name: "Sándwich de tortilla francesa", icon: "🥪" }, { id: 4, name: "Queque", icon: "🧁" } ].map((item)=>/*#__PURE__*/ React.createElement("div", { key: item.id, className: "flex items-center justify-between p-3 border border-[#d4c3b5] rounded-lg", __source: { fileName: "", lineNumber: 582, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 586, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl", __source: { fileName: "", lineNumber: 587, columnNumber: 27 }, __self: this }, item.icon), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 588, columnNumber: 27 }, __self: this }, item.name)), /*#__PURE__*/ React.createElement("input", { type: "number", min: "0", value: selectedItems[item.id] || 0, onChange: (e)=>setSelectedItems((prev)=>({ ...prev, [item.id]: e.target.value })), className: "w-20 p-1 border border-[#d4c3b5] rounded-lg text-center focus:outline-none focus:ring-2 focus:ring-[#8b5e3c]", __source: { fileName: "", lineNumber: 590, columnNumber: 25 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 607, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-medium text-[#8b5e3c] mb-3", __source: { fileName: "", lineNumber: 608, columnNumber: 19 }, __self: this }, "Bebidas"), /*#__PURE__*/ React.createElement("div", { className: "space-y-3", __source: { fileName: "", lineNumber: 611, columnNumber: 19 }, __self: this }, [ { id: 5, name: "Café", icon: "☕" }, { id: 6, name: "Té", icon: "🫖" }, { id: 7, name: "Zumo", icon: "🧃" }, { id: 8, name: "Agua", icon: "💧" } ].map((item)=>/*#__PURE__*/ React.createElement("div", { key: item.id, className: "flex items-center justify-between p-3 border border-[#d4c3b5] rounded-lg", __source: { fileName: "", lineNumber: 618, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-3", __source: { fileName: "", lineNumber: 622, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-xl", __source: { fileName: "", lineNumber: 623, columnNumber: 27 }, __self: this }, item.icon), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 624, columnNumber: 27 }, __self: this }, item.name)), /*#__PURE__*/ React.createElement("input", { type: "number", min: "0", value: selectedDrinks[item.id] || 0, onChange: (e)=>setSelectedDrinks((prev)=>({ ...prev, [item.id]: e.target.value })), className: "w-20 p-1 border border-[#d4c3b5] rounded-lg text-center focus:outline-none focus:ring-2 focus:ring-[#8b5e3c]", __source: { fileName: "", lineNumber: 626, columnNumber: 25 }, __self: this }))))))), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-md p-6", __source: { fileName: "", lineNumber: 645, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-[#5c3f2a] mb-4", __source: { fileName: "", lineNumber: 646, columnNumber: 15 }, __self: this }, "Verificación"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 649, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-[#8b5e3c]", __source: { fileName: "", lineNumber: 650, columnNumber: 17 }, __self: this }, "Para confirmar su reserva, resuelva la siguiente operación:"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center gap-3 text-xl font-bold text-[#5c3f2a]", __source: { fileName: "", lineNumber: 653, columnNumber: 17 }, __self: this }, mathProblem.num1, " + ", mathProblem.num2, " =", /*#__PURE__*/ React.createElement("input", { type: "number", value: mathAnswer, onChange: (e)=>setMathAnswer(e.target.value), className: "w-20 p-1 border border-[#d4c3b5] rounded-lg text-center focus:outline-none focus:ring-2 focus:ring-[#8b5e3c]", __source: { fileName: "", lineNumber: 655, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: handleSubmit, disabled: !mathAnswer || !studentInfo.group_number || !studentInfo.list_number || !selectedDate || remainingSpots <= 0, className: "w-full py-3 bg-[#8b5e3c] text-white rounded-lg hover:bg-[#6f4b30] transition-colors disabled:bg-gray-300", __source: { fileName: "", lineNumber: 662, columnNumber: 17 }, __self: this }, "Confirmar Reserva"))))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 text-center", __source: { fileName: "", lineNumber: 680, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowAdmin(true), className: "text-[#8b5e3c] hover:text-[#6f4b30] transition-colors", __source: { fileName: "", lineNumber: 681, columnNumber: 11 }, __self: this }, "Acceder como administrador")), error && /*#__PURE__*/ React.createElement("div", { className: "mt-6 p-4 bg-red-100 text-red-700 rounded-lg", __source: { fileName: "", lineNumber: 690, columnNumber: 11 }, __self: this }, error), showSummary && currentReservation && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 696, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-xl max-w-md w-full", __source: { fileName: "", lineNumber: 697, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-[#5c3f2a] mb-6", __source: { fileName: "", lineNumber: 698, columnNumber: 15 }, __self: this }, "Resumen de tu Reserva"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4 mb-6", __source: { fileName: "", lineNumber: 702, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center pb-2 border-b border-[#d4c3b5]", __source: { fileName: "", lineNumber: 703, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-[#8b5e3c]", __source: { fileName: "", lineNumber: 704, columnNumber: 19 }, __self: this }, "Grupo:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 705, columnNumber: 19 }, __self: this }, currentReservation.student.group_number)), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center pb-2 border-b border-[#d4c3b5]", __source: { fileName: "", lineNumber: 707, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-[#8b5e3c]", __source: { fileName: "", lineNumber: 708, columnNumber: 19 }, __self: this }, "Número de lista:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 711, columnNumber: 19 }, __self: this }, currentReservation.student.list_number)), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center pb-2 border-b border-[#d4c3b5]", __source: { fileName: "", lineNumber: 713, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-[#8b5e3c]", __source: { fileName: "", lineNumber: 714, columnNumber: 19 }, __self: this }, "Fecha:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 715, columnNumber: 19 }, __self: this }, new Date(currentReservation?.date).toLocaleDateString())), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center pb-2 border-b border-[#d4c3b5]", __source: { fileName: "", lineNumber: 719, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-medium text-[#8b5e3c]", __source: { fileName: "", lineNumber: 720, columnNumber: 19 }, __self: this }, "Número de personas:"), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 723, columnNumber: 19 }, __self: this }, currentReservation.numberOfPeople)), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 726, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-medium text-[#8b5e3c] mb-2", __source: { fileName: "", lineNumber: 727, columnNumber: 19 }, __self: this }, "Productos seleccionados:"), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", __source: { fileName: "", lineNumber: 730, columnNumber: 19 }, __self: this }, currentReservation.items.map((item, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "flex justify-between items-center", __source: { fileName: "", lineNumber: 732, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 736, columnNumber: 25 }, __self: this }, item.name), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 737, columnNumber: 25 }, __self: this }, "x", item.quantity)))))), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 744, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowSummary(false), className: "flex-1 py-3 bg-gray-200 text-gray-800 rounded-lg hover:bg-gray-300 transition-colors", __source: { fileName: "", lineNumber: 745, columnNumber: 17 }, __self: this }, "Modificar"), /*#__PURE__*/ React.createElement("button", { onClick: confirmReservation, className: "flex-1 py-3 bg-[#8b5e3c] text-white rounded-lg hover:bg-[#6f4b30] transition-colors", __source: { fileName: "", lineNumber: 751, columnNumber: 17 }, __self: this }, "Confirmar")))), success && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 763, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-xl max-w-md w-full text-center", __source: { fileName: "", lineNumber: 764, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("svg", { className: "w-16 h-16 text-green-500 mx-auto mb-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", __source: { fileName: "", lineNumber: 765, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7", __source: { fileName: "", lineNumber: 771, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-[#5c3f2a] mb-2", __source: { fileName: "", lineNumber: 778, columnNumber: 15 }, __self: this }, "¡Reserva Confirmada!"), /*#__PURE__*/ React.createElement("div", { className: "text-[#8b5e3c] mb-6 space-y-2", __source: { fileName: "", lineNumber: 781, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 782, columnNumber: 17 }, __self: this }, "Gracias por tu reserva en Un buchito de café"), /*#__PURE__*/ React.createElement("p", { className: "text-sm", __source: { fileName: "", lineNumber: 783, columnNumber: 17 }, __self: this }, "Te esperamos el", " ", new Date(currentReservation?.date).toLocaleDateString())), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setSuccess(false); setCurrentReservation(null); }, className: "w-full py-3 bg-[#8b5e3c] text-white rounded-lg hover:bg-[#6f4b30] transition-colors", __source: { fileName: "", lineNumber: 788, columnNumber: 15 }, __self: this }, "Hacer otra reserva")))), showAdmin && !reservations && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", __source: { fileName: "", lineNumber: 804, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-xl max-w-md w-full", __source: { fileName: "", lineNumber: 805, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-[#5c3f2a] mb-6", __source: { fileName: "", lineNumber: 806, columnNumber: 13 }, __self: this }, "Acceso Administrador"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 809, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 810, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-[#8b5e3c] mb-2", __source: { fileName: "", lineNumber: 811, columnNumber: 17 }, __self: this }, "Contraseña"), /*#__PURE__*/ React.createElement("input", { type: "password", value: adminPassword, onChange: (e)=>setAdminPassword(e.target.value), className: "w-full p-2 border border-[#d4c3b5] rounded-lg focus:outline-none focus:ring-2 focus:ring-[#8b5e3c]", placeholder: "Introduce la contraseña", __source: { fileName: "", lineNumber: 814, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 822, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setShowAdmin(false); setAdminPassword(""); setError(null); }, className: "flex-1 py-2 bg-gray-200 text-gray-800 rounded-lg hover:bg-gray-300 transition-colors", __source: { fileName: "", lineNumber: 823, columnNumber: 17 }, __self: this }, "Cancelar"), /*#__PURE__*/ React.createElement("button", { onClick: handleAdminAccess, className: "flex-1 py-2 bg-[#8b5e3c] text-white rounded-lg hover:bg-[#6f4b30] transition-colors", __source: { fileName: "", lineNumber: 833, columnNumber: 17 }, __self: this }, "Acceder")), error && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-3 bg-red-100 text-red-700 rounded-lg text-sm", __source: { fileName: "", lineNumber: 841, columnNumber: 17 }, __self: this }, error))))); }