Vue par mois et pas semaine OK
This commit is contained in:
@ -8,6 +8,7 @@ import 'package:table_calendar/table_calendar.dart';
|
||||
import 'package:em2rp/models/event_model.dart';
|
||||
import 'package:em2rp/widgets/event_details.dart';
|
||||
import 'package:latlong2/latlong.dart';
|
||||
import 'package:intl/date_symbol_data_local.dart';
|
||||
|
||||
class CalendarPage extends StatefulWidget {
|
||||
const CalendarPage({Key? key}) : super(key: key);
|
||||
@ -22,6 +23,12 @@ class _CalendarPageState extends State<CalendarPage> {
|
||||
DateTime? _selectedDay;
|
||||
EventModel? _selectedEvent;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
initializeDateFormatting('fr_FR', null);
|
||||
}
|
||||
|
||||
// Événements de test
|
||||
final List<EventModel> _testEvents = [
|
||||
EventModel(
|
||||
@ -138,6 +145,7 @@ class _CalendarPageState extends State<CalendarPage> {
|
||||
focusedDay: _focusedDay,
|
||||
calendarFormat: _calendarFormat,
|
||||
startingDayOfWeek: StartingDayOfWeek.monday,
|
||||
locale: 'fr_FR',
|
||||
availableCalendarFormats: const {
|
||||
CalendarFormat.month: 'Mois',
|
||||
CalendarFormat.week: 'Semaine',
|
||||
@ -178,6 +186,7 @@ class _CalendarPageState extends State<CalendarPage> {
|
||||
border: Border.all(color: Colors.grey.shade300),
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
),
|
||||
outsideDaysVisible: false,
|
||||
cellMargin: EdgeInsets.zero,
|
||||
cellPadding: EdgeInsets.zero,
|
||||
),
|
||||
@ -196,8 +205,22 @@ class _CalendarPageState extends State<CalendarPage> {
|
||||
rightChevronIcon:
|
||||
const Icon(Icons.chevron_right, color: AppColors.rouge),
|
||||
headerPadding: const EdgeInsets.symmetric(vertical: 8),
|
||||
titleTextStyle: const TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
calendarBuilders: CalendarBuilders(
|
||||
dowBuilder: (context, day) {
|
||||
return Center(
|
||||
child: Text(
|
||||
_getDayName(day.weekday),
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
defaultBuilder: (context, day, focusedDay) {
|
||||
final events = _getEventsForDay(day);
|
||||
|
||||
@ -209,7 +232,10 @@ class _CalendarPageState extends State<CalendarPage> {
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
Center(
|
||||
// Numéro du jour en haut à gauche
|
||||
Positioned(
|
||||
top: 4,
|
||||
left: 4,
|
||||
child: Text(
|
||||
day.day.toString(),
|
||||
style: TextStyle(
|
||||
@ -218,12 +244,39 @@ class _CalendarPageState extends State<CalendarPage> {
|
||||
),
|
||||
),
|
||||
),
|
||||
// Badge du nombre d'événements en haut à droite
|
||||
if (events.isNotEmpty)
|
||||
Positioned(
|
||||
top: 4,
|
||||
right: 4,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 6, vertical: 2),
|
||||
decoration: BoxDecoration(
|
||||
color: isSameDay(day, _selectedDay)
|
||||
? Colors.white
|
||||
: AppColors.rouge,
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
),
|
||||
child: Text(
|
||||
events.length.toString(),
|
||||
style: TextStyle(
|
||||
color: isSameDay(day, _selectedDay)
|
||||
? AppColors.rouge
|
||||
: Colors.white,
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
// Liste des événements en dessous
|
||||
if (events.isNotEmpty)
|
||||
Positioned(
|
||||
bottom: 2,
|
||||
left: 2,
|
||||
right: 2,
|
||||
top: 24, // Espace pour le numéro du jour
|
||||
top: 28,
|
||||
child: SingleChildScrollView(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
@ -290,18 +343,44 @@ class _CalendarPageState extends State<CalendarPage> {
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
Center(
|
||||
// Numéro du jour en haut à gauche
|
||||
Positioned(
|
||||
top: 4,
|
||||
left: 4,
|
||||
child: Text(
|
||||
day.day.toString(),
|
||||
style: const TextStyle(color: Colors.white),
|
||||
),
|
||||
),
|
||||
// Badge du nombre d'événements en haut à droite
|
||||
if (events.isNotEmpty)
|
||||
Positioned(
|
||||
top: 4,
|
||||
right: 4,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 6, vertical: 2),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
),
|
||||
child: Text(
|
||||
events.length.toString(),
|
||||
style: const TextStyle(
|
||||
color: AppColors.rouge,
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
// Liste des événements en dessous
|
||||
if (events.isNotEmpty)
|
||||
Positioned(
|
||||
bottom: 2,
|
||||
left: 2,
|
||||
right: 2,
|
||||
top: 24, // Espace pour le numéro du jour
|
||||
top: 28,
|
||||
child: SingleChildScrollView(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
@ -434,7 +513,7 @@ class _CalendarPageState extends State<CalendarPage> {
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 12, vertical: 8),
|
||||
),
|
||||
child: const Text('Mois'),
|
||||
child: const Text('Semaine'),
|
||||
),
|
||||
IconButton(
|
||||
icon: const Icon(Icons.chevron_right),
|
||||
@ -468,17 +547,42 @@ class _CalendarPageState extends State<CalendarPage> {
|
||||
),
|
||||
),
|
||||
),
|
||||
child: Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(_getDayName(day.weekday),
|
||||
style:
|
||||
const TextStyle(fontWeight: FontWeight.bold)),
|
||||
Text('${day.day}',
|
||||
style: const TextStyle(fontSize: 13)),
|
||||
],
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(_getDayName(day.weekday),
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.bold)),
|
||||
Text('${day.day}',
|
||||
style: const TextStyle(fontSize: 13)),
|
||||
],
|
||||
),
|
||||
),
|
||||
if (_getEventsForDay(day).isNotEmpty)
|
||||
Positioned(
|
||||
top: 4,
|
||||
right: 4,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 6, vertical: 2),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.rouge,
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
),
|
||||
child: Text(
|
||||
_getEventsForDay(day).length.toString(),
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}),
|
||||
@ -679,26 +783,42 @@ class _CalendarPageState extends State<CalendarPage> {
|
||||
}
|
||||
}
|
||||
|
||||
String _getMonthName(int month) {
|
||||
switch (month) {
|
||||
case 1:
|
||||
return 'Janvier';
|
||||
case 2:
|
||||
return 'Février';
|
||||
case 3:
|
||||
return 'Mars';
|
||||
case 4:
|
||||
return 'Avril';
|
||||
case 5:
|
||||
return 'Mai';
|
||||
case 6:
|
||||
return 'Juin';
|
||||
case 7:
|
||||
return 'Juillet';
|
||||
case 8:
|
||||
return 'Août';
|
||||
case 9:
|
||||
return 'Septembre';
|
||||
case 10:
|
||||
return 'Octobre';
|
||||
case 11:
|
||||
return 'Novembre';
|
||||
case 12:
|
||||
return 'Décembre';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
String _getMonthYearString(DateTime weekStart, DateTime weekEnd) {
|
||||
final months = [
|
||||
'',
|
||||
'Janvier',
|
||||
'Février',
|
||||
'Mars',
|
||||
'Avril',
|
||||
'Mai',
|
||||
'Juin',
|
||||
'Juillet',
|
||||
'Août',
|
||||
'Septembre',
|
||||
'Octobre',
|
||||
'Novembre',
|
||||
'Décembre'
|
||||
];
|
||||
if (weekStart.month == weekEnd.month) {
|
||||
return '${months[weekStart.month]} ${weekStart.year}';
|
||||
return '${_getMonthName(weekStart.month)} ${weekStart.year}';
|
||||
} else {
|
||||
return '${months[weekStart.month]} - ${months[weekEnd.month]} ${weekEnd.year}';
|
||||
return '${_getMonthName(weekStart.month)} - ${_getMonthName(weekEnd.month)} ${weekEnd.year}';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user