Beer Specialist
Francesco Perrone
import React, { useState } from 'react';
// Definizione di un'interfaccia per un appuntamento
interface Appointment {
id: number;
date: string; // Formato ISO (YYYY-MM-DD)
time: string; // Formato 24h (HH:mm)
duration: number; // Durata in minuti (in questo caso 60 minuti)
}
export const Calendar: React.FC = () => {
const [appointments, setAppointments] = useState([]);
// Stato per memorizzare la data, l'ora e la durata selezionata dall'utente
const [selectedDate, setSelectedDate] = useState('');
const [selectedTime, setSelectedTime] = useState('');
// Funzione per aggiungere un appuntamento
const addAppointment = () => {
const newAppointment: Appointment = {
id: appointments.length + 1,
date: selectedDate,
time: selectedTime,
duration: 60, // Imposta la durata fissa a 60 minuti
};
setAppointments([...appointments, newAppointment]);
setSelectedDate(''); // Resetta i campi dopo aver aggiunto
setSelectedTime('');
};
return (
{/* Lista degli appuntamenti */}
);
};
Gestione Appuntamenti
{/* Form per selezionare data e ora */}Appuntamenti
-
{appointments.map((appointment) => (
- {appointment.date} alle {appointment.time} - Durata: {appointment.duration} minuti ))}