lionsdev/unionflow-server-impl-quarkus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Versione OK Pour l'onglet événements.

Browse Source
This commit is contained in:
DahoudG
2025-09-15 20:15:34 +00:00
parent 8a619ee1bf
commit 12d514d866
73 changed files with 11508 additions and 674 deletions
Download Patch File Download Diff File Expand all files Collapse all files

128
unionflow-mobile-apps/lib/features/evenements/presentation/pages/evenements_page.dart
View File

@@ -2,6 +2,8 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../../core/di/injection.dart';
import '../../../../core/models/evenement_model.dart';
import '../../../../core/animations/loading_animations.dart';
import '../../../../core/animations/page_transitions.dart';
import '../../../../shared/theme/app_theme.dart';
import '../bloc/evenement_bloc.dart';
import '../bloc/evenement_event.dart';
@@ -9,6 +11,7 @@ import '../bloc/evenement_state.dart';
import '../widgets/evenement_card.dart';
import '../widgets/evenement_search_bar.dart';
import '../widgets/evenement_filter_chips.dart';
import '../widgets/animated_evenement_list.dart';
import 'evenement_detail_page.dart';
import 'evenement_create_page.dart';
@@ -36,6 +39,9 @@ class _EvenementsPageContent extends StatefulWidget {
class _EvenementsPageContentState extends State<_EvenementsPageContent>
with TickerProviderStateMixin {
late TabController _tabController;
late AnimationController _listAnimationController;
late AnimationController _tabAnimationController;
late Animation<double> _tabFadeAnimation;
final ScrollController _scrollController = ScrollController();
String _searchTerm = '';
TypeEvenement? _selectedType;
@@ -44,18 +50,40 @@ class _EvenementsPageContentState extends State<_EvenementsPageContent>
void initState() {
super.initState();
_tabController = TabController(length: 3, vsync: this);
_listAnimationController = AnimationController(
duration: const Duration(milliseconds: 800),
vsync: this,
);
_tabAnimationController = AnimationController(
duration: const Duration(milliseconds: 300),
vsync: this,
);
_tabFadeAnimation = Tween<double>(begin: 0.0, end: 1.0).animate(
CurvedAnimation(
parent: _tabAnimationController,
curve: Curves.easeInOut,
),
);
_scrollController.addListener(_onScroll);
_tabController.addListener(() {
if (_tabController.indexIsChanging) {
_onTabChanged(_tabController.index);
}
});
// Démarrer les animations d'entrée
_listAnimationController.forward();
_tabAnimationController.forward();
}
@override
void dispose() {
_tabController.dispose();
_listAnimationController.dispose();
_tabAnimationController.dispose();
_scrollController.dispose();
super.dispose();
}
@@ -192,8 +220,8 @@ class _EvenementsPageContentState extends State<_EvenementsPageContent>
void _navigateToDetail(EvenementModel evenement) {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => EvenementDetailPage(evenement: evenement),
PageTransitions.slideFromRight(
EvenementDetailPage(evenement: evenement),
),
);
}
@@ -214,28 +242,42 @@ class _EvenementsPageContentState extends State<_EvenementsPageContent>
],
),
),
body: TabBarView(
controller: _tabController,
children: [
_buildEvenementsList(showSearch: false),
_buildEvenementsList(showSearch: false),
_buildEvenementsList(showSearch: true),
],
body: FadeTransition(
opacity: _tabFadeAnimation,
child: TabBarView(
controller: _tabController,
children: [
_buildEvenementsList(showSearch: false),
_buildEvenementsList(showSearch: false),
_buildEvenementsList(showSearch: true),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: () async {
final result = await Navigator.of(context).push<bool>(
MaterialPageRoute(
builder: (context) => const EvenementCreatePage(),
floatingActionButton: AnimatedBuilder(
animation: _listAnimationController,
builder: (context, child) {
return Transform.scale(
scale: 0.8 + (0.2 * _listAnimationController.value),
child: FloatingActionButton.extended(
onPressed: () async {
final result = await Navigator.of(context).push<bool>(
PageTransitions.slideFromBottom(
const EvenementCreatePage(),
),
);
// Si un événement a été créé, recharger la liste
if (result == true && context.mounted) {
context.read<EvenementBloc>().add(const LoadEvenementsAVenir());
}
},
icon: const Icon(Icons.add),
label: const Text('Nouvel événement'),
backgroundColor: Theme.of(context).primaryColor,
foregroundColor: Colors.white,
),
);
// Si un événement a été créé, recharger la liste
if (result == true && context.mounted) {
context.read<EvenementBloc>().add(const LoadEvenementsAVenir());
}
},
child: const Icon(Icons.add),
),
);
}
@@ -278,7 +320,7 @@ class _EvenementsPageContentState extends State<_EvenementsPageContent>
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.error_outline, size: 64, color: Colors.red),
const Icon(Icons.error_outline, size: 64, color: Colors.red),
const SizedBox(height: 16),
Text(state.message, textAlign: TextAlign.center),
const SizedBox(height: 16),
@@ -333,45 +375,21 @@ class _EvenementsPageContentState extends State<_EvenementsPageContent>
);
}
final evenements = state is EvenementLoaded
final evenements = state is EvenementLoaded
? state.evenements
: state is EvenementLoadingMore
? state.evenements
: state is EvenementError
? state.evenements ?? <EvenementModel>[]
: <EvenementModel>[];
if (evenements.isEmpty) {
return const Center(
child: Text('Aucun événement disponible'),
);
}
return RefreshIndicator(
onRefresh: () async => _onRefresh(),
child: ListView.builder(
controller: _scrollController,
padding: const EdgeInsets.all(16),
itemCount: evenements.length +
(state is EvenementLoadingMore ? 1 : 0),
itemBuilder: (context, index) {
if (index >= evenements.length) {
return const Padding(
padding: EdgeInsets.all(16),
child: Center(child: CircularProgressIndicator()),
);
}
final evenement = evenements[index];
return Padding(
padding: const EdgeInsets.only(bottom: 12),
child: EvenementCard(
evenement: evenement,
onTap: () => _navigateToDetail(evenement),
),
);
},
),
final isLoadingMore = state is EvenementLoadingMore;
return AnimatedEvenementList(
evenements: evenements,
isLoading: isLoadingMore,
onEvenementTap: _navigateToDetail,
onRefresh: _onRefresh,
);
},
),

363
unionflow-mobile-apps/lib/features/evenements/presentation/widgets/animated_evenement_card.dart Normal file
View File

@@ -0,0 +1,363 @@
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import '../../../../core/models/evenement_model.dart';
import '../../../../shared/theme/app_theme.dart';
/// Carte d'événement avec animations sophistiquées
class AnimatedEvenementCard extends StatefulWidget {
final EvenementModel evenement;
final VoidCallback? onTap;
final VoidCallback? onFavorite;
final bool showActions;
const AnimatedEvenementCard({
super.key,
required this.evenement,
this.onTap,
this.onFavorite,
this.showActions = true,
});
@override
State<AnimatedEvenementCard> createState() => _AnimatedEvenementCardState();
}
class _AnimatedEvenementCardState extends State<AnimatedEvenementCard>
with TickerProviderStateMixin {
late AnimationController _hoverController;
late AnimationController _tapController;
late AnimationController _favoriteController;
late Animation<double> _scaleAnimation;
late Animation<double> _elevationAnimation;
late Animation<double> _favoriteScaleAnimation;
late Animation<Color?> _favoriteColorAnimation;
bool _isHovered = false;
bool _isFavorite = false;
@override
void initState() {
super.initState();
_hoverController = AnimationController(
duration: const Duration(milliseconds: 200),
vsync: this,
);
_tapController = AnimationController(
duration: const Duration(milliseconds: 100),
vsync: this,
);
_favoriteController = AnimationController(
duration: const Duration(milliseconds: 300),
vsync: this,
);
_scaleAnimation = Tween<double>(
begin: 1.0,
end: 1.02,
).animate(CurvedAnimation(
parent: _hoverController,
curve: Curves.easeOutCubic,
));
_elevationAnimation = Tween<double>(
begin: 2.0,
end: 8.0,
).animate(CurvedAnimation(
parent: _hoverController,
curve: Curves.easeOutCubic,
));
_favoriteScaleAnimation = Tween<double>(
begin: 1.0,
end: 1.3,
).animate(CurvedAnimation(
parent: _favoriteController,
curve: Curves.elasticOut,
));
_favoriteColorAnimation = ColorTween(
begin: Colors.grey[400],
end: Colors.red,
).animate(CurvedAnimation(
parent: _favoriteController,
curve: Curves.easeInOut,
));
}
@override
void dispose() {
_hoverController.dispose();
_tapController.dispose();
_favoriteController.dispose();
super.dispose();
}
void _onTapDown(TapDownDetails details) {
_tapController.forward();
}
void _onTapUp(TapUpDetails details) {
_tapController.reverse();
}
void _onTapCancel() {
_tapController.reverse();
}
void _onHover(bool isHovered) {
setState(() => _isHovered = isHovered);
if (isHovered) {
_hoverController.forward();
} else {
_hoverController.reverse();
}
}
void _onFavoriteToggle() {
setState(() => _isFavorite = !_isFavorite);
if (_isFavorite) {
_favoriteController.forward();
} else {
_favoriteController.reverse();
}
widget.onFavorite?.call();
}
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
final dateFormat = DateFormat('dd/MM/yyyy');
final timeFormat = DateFormat('HH:mm');
return AnimatedBuilder(
animation: Listenable.merge([
_scaleAnimation,
_elevationAnimation,
_favoriteScaleAnimation,
_favoriteColorAnimation,
]),
builder: (context, child) {
return Transform.scale(
scale: _scaleAnimation.value,
child: MouseRegion(
onEnter: (_) => _onHover(true),
onExit: (_) => _onHover(false),
child: Card(
elevation: _elevationAnimation.value,
margin: EdgeInsets.zero,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
gradient: _isHovered
? LinearGradient(
colors: [
Colors.white,
AppTheme.primaryColor.withOpacity(0.02),
],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
)
: null,
),
child: InkWell(
onTap: widget.onTap,
onTapDown: _onTapDown,
onTapUp: _onTapUp,
onTapCancel: _onTapCancel,
borderRadius: BorderRadius.circular(16),
child: Padding(
padding: const EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// En-tête avec type et actions
Row(
children: [
// Icône du type avec animation
AnimatedContainer(
duration: const Duration(milliseconds: 200),
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: _isHovered
? AppTheme.primaryColor.withOpacity(0.15)
: AppTheme.primaryColor.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Text(
widget.evenement.typeEvenement.icone,
style: const TextStyle(fontSize: 24),
),
),
const SizedBox(width: 12),
// Type et statut
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
widget.evenement.typeEvenement.libelle,
style: theme.textTheme.bodySmall?.copyWith(
color: AppTheme.primaryColor,
fontWeight: FontWeight.w600,
),
),
const SizedBox(height: 4),
_buildStatusChip(),
],
),
),
// Bouton favori animé
if (widget.showActions)
GestureDetector(
onTap: _onFavoriteToggle,
child: Transform.scale(
scale: _favoriteScaleAnimation.value,
child: Icon(
_isFavorite ? Icons.favorite : Icons.favorite_border,
color: _favoriteColorAnimation.value,
size: 24,
),
),
),
],
),
const SizedBox(height: 16),
// Titre avec animation de couleur
AnimatedDefaultTextStyle(
duration: const Duration(milliseconds: 200),
style: theme.textTheme.titleLarge?.copyWith(
fontWeight: FontWeight.bold,
color: _isHovered
? AppTheme.primaryColor
: theme.textTheme.titleLarge?.color,
) ?? const TextStyle(),
child: Text(widget.evenement.titre),
),
if (widget.evenement.description?.isNotEmpty == true) ...[
const SizedBox(height: 8),
Text(
widget.evenement.description!,
style: theme.textTheme.bodyMedium?.copyWith(
color: Colors.grey[600],
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
],
const SizedBox(height: 16),
// Informations de date et lieu avec icônes animées
Row(
children: [
_buildAnimatedInfo(
icon: Icons.calendar_today,
text: dateFormat.format(widget.evenement.dateDebut),
),
const SizedBox(width: 16),
_buildAnimatedInfo(
icon: Icons.access_time,
text: timeFormat.format(widget.evenement.dateDebut),
),
],
),
if (widget.evenement.lieu?.isNotEmpty == true) ...[
const SizedBox(height: 8),
_buildAnimatedInfo(
icon: Icons.location_on,
text: widget.evenement.lieu!,
),
],
],
),
),
),
),
),
),
);
},
);
}
Widget _buildStatusChip() {
Color statusColor;
switch (widget.evenement.statut) {
case StatutEvenement.planifie:
statusColor = Colors.orange;
break;
case StatutEvenement.confirme:
statusColor = Colors.green;
break;
case StatutEvenement.enCours:
statusColor = Colors.blue;
break;
case StatutEvenement.termine:
statusColor = Colors.grey;
break;
case StatutEvenement.annule:
statusColor = Colors.red;
break;
case StatutEvenement.reporte:
statusColor = Colors.purple;
break;
}
return Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: statusColor.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
border: Border.all(color: statusColor.withOpacity(0.3)),
),
child: Text(
widget.evenement.statut.libelle,
style: TextStyle(
color: statusColor,
fontSize: 12,
fontWeight: FontWeight.w600,
),
),
);
}
Widget _buildAnimatedInfo({required IconData icon, required String text}) {
return Row(
mainAxisSize: MainAxisSize.min,
children: [
AnimatedContainer(
duration: const Duration(milliseconds: 200),
child: Icon(
icon,
size: 16,
color: _isHovered
? AppTheme.primaryColor
: Colors.grey[600],
),
),
const SizedBox(width: 4),
Text(
text,
style: TextStyle(
color: Colors.grey[600],
fontSize: 14,
),
),
],
);
}
}

242
unionflow-mobile-apps/lib/features/evenements/presentation/widgets/animated_evenement_list.dart Normal file
View File

@@ -0,0 +1,242 @@
import 'package:flutter/material.dart';
import '../../../../core/models/evenement_model.dart';
import '../../../../core/animations/loading_animations.dart';
import 'evenement_card.dart';
import 'animated_evenement_card.dart';
/// Widget animé pour afficher une liste d'événements avec animations d'apparition
class AnimatedEvenementList extends StatefulWidget {
final List<EvenementModel> evenements;
final Function(EvenementModel)? onEvenementTap;
final bool isLoading;
final VoidCallback? onRefresh;
const AnimatedEvenementList({
super.key,
required this.evenements,
this.onEvenementTap,
this.isLoading = false,
this.onRefresh,
});
@override
State<AnimatedEvenementList> createState() => _AnimatedEvenementListState();
}
class _AnimatedEvenementListState extends State<AnimatedEvenementList>
with TickerProviderStateMixin {
late AnimationController _listController;
List<AnimationController> _itemControllers = [];
List<Animation<double>> _itemAnimations = [];
List<Animation<Offset>> _slideAnimations = [];
@override
void initState() {
super.initState();
_initializeAnimations();
}
@override
void didUpdateWidget(AnimatedEvenementList oldWidget) {
super.didUpdateWidget(oldWidget);
if (widget.evenements.length != oldWidget.evenements.length) {
_updateAnimations();
}
}
@override
void dispose() {
_listController.dispose();
for (final controller in _itemControllers) {
controller.dispose();
}
super.dispose();
}
void _initializeAnimations() {
_listController = AnimationController(
duration: const Duration(milliseconds: 600),
vsync: this,
);
_updateAnimations();
_listController.forward();
}
void _updateAnimations() {
// Dispose des anciens controllers s'ils existent
if (_itemControllers.isNotEmpty) {
for (final controller in _itemControllers) {
controller.dispose();
}
}
// Créer de nouveaux controllers pour chaque élément
_itemControllers = List.generate(
widget.evenements.length,
(index) => AnimationController(
duration: Duration(milliseconds: 300 + (index * 100)),
vsync: this,
),
);
// Animations de fade et scale
_itemAnimations = _itemControllers.map((controller) {
return Tween<double>(begin: 0.0, end: 1.0).animate(
CurvedAnimation(
parent: controller,
curve: Curves.easeOutCubic,
),
);
}).toList();
// Animations de slide depuis le bas
_slideAnimations = _itemControllers.map((controller) {
return Tween<Offset>(
begin: const Offset(0, 0.3),
end: Offset.zero,
).animate(
CurvedAnimation(
parent: controller,
curve: Curves.easeOutCubic,
),
);
}).toList();
// Démarrer les animations avec un délai progressif
for (int i = 0; i < _itemControllers.length; i++) {
Future.delayed(Duration(milliseconds: i * 150), () {
if (mounted) {
_itemControllers[i].forward();
}
});
}
}
@override
Widget build(BuildContext context) {
if (widget.isLoading && widget.evenements.isEmpty) {
return _buildLoadingState();
}
if (widget.evenements.isEmpty) {
return _buildEmptyState();
}
return RefreshIndicator(
onRefresh: () async {
widget.onRefresh?.call();
await Future.delayed(const Duration(milliseconds: 500));
},
child: ListView.builder(
physics: const AlwaysScrollableScrollPhysics(),
padding: const EdgeInsets.all(16),
itemCount: widget.evenements.length + (widget.isLoading ? 1 : 0),
itemBuilder: (context, index) {
if (index >= widget.evenements.length) {
return _buildLoadingIndicator();
}
return _buildAnimatedItem(index);
},
),
);
}
Widget _buildAnimatedItem(int index) {
final evenement = widget.evenements[index];
if (index >= _itemAnimations.length) {
// Fallback pour les nouveaux éléments
return Padding(
padding: const EdgeInsets.only(bottom: 16),
child: AnimatedEvenementCard(
evenement: evenement,
onTap: () => widget.onEvenementTap?.call(evenement),
),
);
}
return AnimatedBuilder(
animation: _itemAnimations[index],
builder: (context, child) {
return SlideTransition(
position: _slideAnimations[index],
child: FadeTransition(
opacity: _itemAnimations[index],
child: Transform.scale(
scale: 0.8 + (0.2 * _itemAnimations[index].value),
child: Padding(
padding: const EdgeInsets.only(bottom: 16),
child: AnimatedEvenementCard(
evenement: evenement,
onTap: () => widget.onEvenementTap?.call(evenement),
),
),
),
),
);
},
);
}
Widget _buildLoadingState() {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
LoadingAnimations.waves(),
const SizedBox(height: 24),
const Text(
'Chargement des événements...',
style: TextStyle(
fontSize: 16,
color: Colors.grey,
),
),
],
),
);
}
Widget _buildEmptyState() {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.event_busy,
size: 80,
color: Colors.grey[400],
),
const SizedBox(height: 24),
Text(
'Aucun événement trouvé',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
color: Colors.grey[600],
),
),
const SizedBox(height: 8),
Text(
'Les événements apparaîtront ici',
style: TextStyle(
fontSize: 14,
color: Colors.grey[500],
),
),
],
),
);
}
Widget _buildLoadingIndicator() {
return Padding(
padding: const EdgeInsets.all(16),
child: Center(
child: LoadingAnimations.dots(),
),
);
}
}