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

Refactoring - Version OK

Browse Source
This commit is contained in:
dahoud
2025-11-17 16:02:04 +00:00
parent 3f00a26308
commit 3b9ffac8cd
198 changed files with 18010 additions and 11383 deletions
Download Patch File Download Diff File Expand all files Collapse all files

533
unionflow-mobile-apps/lib/features/organizations/presentation/pages/create_organization_page.dart Normal file
View File

@@ -0,0 +1,533 @@
/// Page de création d'une nouvelle organisation
/// Respecte strictement le design system établi dans l'application
library create_organisation_page;
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../data/models/organization_model.dart';
import '../../bloc/organizations_bloc.dart';
import '../../bloc/organizations_event.dart';
import '../../bloc/organizations_state.dart';
/// Page de création d'organisation avec design system cohérent
class CreateOrganizationPage extends StatefulWidget {
const CreateOrganizationPage({super.key});
@override
State<CreateOrganizationPage> createState() => _CreateOrganizationPageState();
}
class _CreateOrganizationPageState extends State<CreateOrganizationPage> {
final _formKey = GlobalKey<FormState>();
final _nomController = TextEditingController();
final _nomCourtController = TextEditingController();
final _descriptionController = TextEditingController();
final _emailController = TextEditingController();
final _telephoneController = TextEditingController();
final _siteWebController = TextEditingController();
final _adresseController = TextEditingController();
final _villeController = TextEditingController();
final _regionController = TextEditingController();
final _paysController = TextEditingController();
TypeOrganization _selectedType = TypeOrganization.association;
StatutOrganization _selectedStatut = StatutOrganization.active;
@override
void dispose() {
_nomController.dispose();
_nomCourtController.dispose();
_descriptionController.dispose();
_emailController.dispose();
_telephoneController.dispose();
_siteWebController.dispose();
_adresseController.dispose();
_villeController.dispose();
_regionController.dispose();
_paysController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF8F9FA), // Background cohérent
appBar: AppBar(
backgroundColor: const Color(0xFF6C5CE7),
foregroundColor: Colors.white,
title: const Text('Nouvelle Organisation'),
elevation: 0,
actions: [
TextButton(
onPressed: _isFormValid() ? _saveOrganisation : null,
child: const Text(
'Enregistrer',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
),
),
),
],
),
body: BlocListener<OrganizationsBloc, OrganizationsState>(
listener: (context, state) {
if (state is OrganizationCreated) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Organisation créée avec succès'),
backgroundColor: Color(0xFF10B981),
),
);
Navigator.of(context).pop(true); // Retour avec succès
} else if (state is OrganizationsError) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(state.message),
backgroundColor: Colors.red,
),
);
}
},
child: Form(
key: _formKey,
child: SingleChildScrollView(
padding: const EdgeInsets.all(12), // SpacingTokens cohérent
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildBasicInfoCard(),
const SizedBox(height: 16),
_buildContactCard(),
const SizedBox(height: 16),
_buildLocationCard(),
const SizedBox(height: 16),
_buildConfigurationCard(),
const SizedBox(height: 24),
_buildActionButtons(),
],
),
),
),
),
);
}
/// Carte des informations de base
Widget _buildBasicInfoCard() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8), // RadiusTokens cohérent
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Informations de base',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
TextFormField(
controller: _nomController,
decoration: const InputDecoration(
labelText: 'Nom de l\'organisation *',
hintText: 'Ex: Association des Développeurs',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.business),
),
validator: (value) {
if (value == null || value.trim().isEmpty) {
return 'Le nom est obligatoire';
}
if (value.trim().length < 3) {
return 'Le nom doit contenir au moins 3 caractères';
}
return null;
},
onChanged: (_) => setState(() {}),
),
const SizedBox(height: 16),
TextFormField(
controller: _nomCourtController,
decoration: const InputDecoration(
labelText: 'Nom court (optionnel)',
hintText: 'Ex: AsDev',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.short_text),
),
validator: (value) {
if (value != null && value.trim().isNotEmpty && value.trim().length < 2) {
return 'Le nom court doit contenir au moins 2 caractères';
}
return null;
},
),
const SizedBox(height: 16),
DropdownButtonFormField<TypeOrganization>(
value: _selectedType,
decoration: const InputDecoration(
labelText: 'Type d\'organisation *',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.category),
),
items: TypeOrganization.values.map((type) {
return DropdownMenuItem(
value: type,
child: Row(
children: [
Text(type.icon, style: const TextStyle(fontSize: 16)),
const SizedBox(width: 8),
Text(type.displayName),
],
),
);
}).toList(),
onChanged: (value) {
if (value != null) {
setState(() {
_selectedType = value;
});
}
},
),
const SizedBox(height: 16),
TextFormField(
controller: _descriptionController,
decoration: const InputDecoration(
labelText: 'Description (optionnel)',
hintText: 'Décrivez brièvement l\'organisation...',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.description),
),
maxLines: 3,
validator: (value) {
if (value != null && value.trim().isNotEmpty && value.trim().length < 10) {
return 'La description doit contenir au moins 10 caractères';
}
return null;
},
),
],
),
);
}
/// Carte des informations de contact
Widget _buildContactCard() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Contact',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
TextFormField(
controller: _emailController,
decoration: const InputDecoration(
labelText: 'Email (optionnel)',
hintText: 'contact@organisation.com',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.email),
),
keyboardType: TextInputType.emailAddress,
validator: (value) {
if (value != null && value.trim().isNotEmpty) {
final emailRegex = RegExp(r'^[^@]+@[^@]+\.[^@]+$');
if (!emailRegex.hasMatch(value.trim())) {
return 'Format d\'email invalide';
}
}
return null;
},
),
const SizedBox(height: 16),
TextFormField(
controller: _telephoneController,
decoration: const InputDecoration(
labelText: 'Téléphone (optionnel)',
hintText: '+225 XX XX XX XX XX',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.phone),
),
keyboardType: TextInputType.phone,
validator: (value) {
if (value != null && value.trim().isNotEmpty && value.trim().length < 8) {
return 'Numéro de téléphone invalide';
}
return null;
},
),
const SizedBox(height: 16),
TextFormField(
controller: _siteWebController,
decoration: const InputDecoration(
labelText: 'Site web (optionnel)',
hintText: 'https://www.organisation.com',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.web),
),
keyboardType: TextInputType.url,
validator: (value) {
if (value != null && value.trim().isNotEmpty) {
final urlRegex = RegExp(r'^https?://[^\s]+$');
if (!urlRegex.hasMatch(value.trim())) {
return 'Format d\'URL invalide (doit commencer par http:// ou https://)';
}
}
return null;
},
),
],
),
);
}
/// Carte de localisation
Widget _buildLocationCard() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Localisation',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
TextFormField(
controller: _adresseController,
decoration: const InputDecoration(
labelText: 'Adresse (optionnel)',
hintText: 'Rue, quartier...',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.location_on),
),
maxLines: 2,
),
const SizedBox(height: 16),
Row(
children: [
Expanded(
child: TextFormField(
controller: _villeController,
decoration: const InputDecoration(
labelText: 'Ville',
hintText: 'Abidjan',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.location_city),
),
),
),
const SizedBox(width: 12),
Expanded(
child: TextFormField(
controller: _regionController,
decoration: const InputDecoration(
labelText: 'Région',
hintText: 'Lagunes',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.map),
),
),
),
],
),
const SizedBox(height: 16),
TextFormField(
controller: _paysController,
decoration: const InputDecoration(
labelText: 'Pays',
hintText: 'Côte d\'Ivoire',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.flag),
),
),
],
),
);
}
/// Carte de configuration
Widget _buildConfigurationCard() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Configuration',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
DropdownButtonFormField<StatutOrganization>(
value: _selectedStatut,
decoration: const InputDecoration(
labelText: 'Statut initial *',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.toggle_on),
),
items: StatutOrganization.values.map((statut) {
final color = Color(int.parse(statut.color.substring(1), radix: 16) + 0xFF000000);
return DropdownMenuItem(
value: statut,
child: Row(
children: [
Container(
width: 12,
height: 12,
decoration: BoxDecoration(
color: color,
shape: BoxShape.circle,
),
),
const SizedBox(width: 8),
Text(statut.displayName),
],
),
);
}).toList(),
onChanged: (value) {
if (value != null) {
setState(() {
_selectedStatut = value;
});
}
},
),
],
),
);
}
/// Boutons d'action
Widget _buildActionButtons() {
return Column(
children: [
SizedBox(
width: double.infinity,
child: ElevatedButton.icon(
onPressed: _isFormValid() ? _saveOrganisation : null,
icon: const Icon(Icons.save),
label: const Text('Créer l\'organisation'),
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF6C5CE7),
foregroundColor: Colors.white,
padding: const EdgeInsets.symmetric(vertical: 16),
textStyle: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
),
),
),
),
const SizedBox(height: 12),
SizedBox(
width: double.infinity,
child: OutlinedButton.icon(
onPressed: () => Navigator.of(context).pop(),
icon: const Icon(Icons.cancel),
label: const Text('Annuler'),
style: OutlinedButton.styleFrom(
foregroundColor: const Color(0xFF6B7280),
padding: const EdgeInsets.symmetric(vertical: 16),
textStyle: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
),
),
),
),
],
);
}
/// Vérifie si le formulaire est valide
bool _isFormValid() {
return _nomController.text.trim().isNotEmpty;
}
/// Sauvegarde l'organisation
void _saveOrganisation() {
if (_formKey.currentState?.validate() ?? false) {
final organisation = OrganizationModel(
nom: _nomController.text.trim(),
nomCourt: _nomCourtController.text.trim().isEmpty ? null : _nomCourtController.text.trim(),
description: _descriptionController.text.trim().isEmpty ? null : _descriptionController.text.trim(),
typeOrganisation: _selectedType,
statut: _selectedStatut,
email: _emailController.text.trim().isEmpty ? null : _emailController.text.trim(),
telephone: _telephoneController.text.trim().isEmpty ? null : _telephoneController.text.trim(),
siteWeb: _siteWebController.text.trim().isEmpty ? null : _siteWebController.text.trim(),
adresse: _adresseController.text.trim().isEmpty ? null : _adresseController.text.trim(),
ville: _villeController.text.trim().isEmpty ? null : _villeController.text.trim(),
region: _regionController.text.trim().isEmpty ? null : _regionController.text.trim(),
pays: _paysController.text.trim().isEmpty ? null : _paysController.text.trim(),
dateCreation: DateTime.now(),
nombreMembres: 0,
);
context.read<OrganizationsBloc>().add(CreateOrganization(organisation));
}
}
}

705
unionflow-mobile-apps/lib/features/organizations/presentation/pages/edit_organization_page.dart Normal file
View File

@@ -0,0 +1,705 @@
/// Page d'édition d'une organisation existante
/// Respecte strictement le design system établi dans l'application
library edit_organisation_page;
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../data/models/organization_model.dart';
import '../../bloc/organizations_bloc.dart';
import '../../bloc/organizations_event.dart';
import '../../bloc/organizations_state.dart';
/// Page d'édition d'organisation avec design system cohérent
class EditOrganizationPage extends StatefulWidget {
final OrganizationModel organization;
const EditOrganizationPage({
super.key,
required this.organization,
});
@override
State<EditOrganizationPage> createState() => _EditOrganizationPageState();
}
class _EditOrganizationPageState extends State<EditOrganizationPage> {
final _formKey = GlobalKey<FormState>();
late final TextEditingController _nomController;
late final TextEditingController _nomCourtController;
late final TextEditingController _descriptionController;
late final TextEditingController _emailController;
late final TextEditingController _telephoneController;
late final TextEditingController _siteWebController;
late final TextEditingController _adresseController;
late final TextEditingController _villeController;
late final TextEditingController _regionController;
late final TextEditingController _paysController;
late TypeOrganization _selectedType;
late StatutOrganization _selectedStatut;
@override
void initState() {
super.initState();
// Initialiser les contrôleurs avec les valeurs existantes
_nomController = TextEditingController(text: widget.organization.nom);
_nomCourtController = TextEditingController(text: widget.organization.nomCourt ?? '');
_descriptionController = TextEditingController(text: widget.organization.description ?? '');
_emailController = TextEditingController(text: widget.organization.email ?? '');
_telephoneController = TextEditingController(text: widget.organization.telephone ?? '');
_siteWebController = TextEditingController(text: widget.organization.siteWeb ?? '');
_adresseController = TextEditingController(text: widget.organization.adresse ?? '');
_villeController = TextEditingController(text: widget.organization.ville ?? '');
_regionController = TextEditingController(text: widget.organization.region ?? '');
_paysController = TextEditingController(text: widget.organization.pays ?? '');
_selectedType = widget.organization.typeOrganisation;
_selectedStatut = widget.organization.statut;
}
@override
void dispose() {
_nomController.dispose();
_nomCourtController.dispose();
_descriptionController.dispose();
_emailController.dispose();
_telephoneController.dispose();
_siteWebController.dispose();
_adresseController.dispose();
_villeController.dispose();
_regionController.dispose();
_paysController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF8F9FA), // Background cohérent
appBar: AppBar(
backgroundColor: const Color(0xFF6C5CE7),
foregroundColor: Colors.white,
title: const Text('Modifier Organisation'),
elevation: 0,
actions: [
TextButton(
onPressed: _hasChanges() ? _saveChanges : null,
child: const Text(
'Enregistrer',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
),
),
),
],
),
body: BlocListener<OrganizationsBloc, OrganizationsState>(
listener: (context, state) {
if (state is OrganizationUpdated) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Organisation modifiée avec succès'),
backgroundColor: Color(0xFF10B981),
),
);
Navigator.of(context).pop(true); // Retour avec succès
} else if (state is OrganizationsError) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(state.message),
backgroundColor: Colors.red,
),
);
}
},
child: Form(
key: _formKey,
child: SingleChildScrollView(
padding: const EdgeInsets.all(12), // SpacingTokens cohérent
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildBasicInfoCard(),
const SizedBox(height: 16),
_buildContactCard(),
const SizedBox(height: 16),
_buildLocationCard(),
const SizedBox(height: 16),
_buildConfigurationCard(),
const SizedBox(height: 16),
_buildMetadataCard(),
const SizedBox(height: 24),
_buildActionButtons(),
],
),
),
),
),
);
}
/// Carte des informations de base
Widget _buildBasicInfoCard() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8), // RadiusTokens cohérent
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Informations de base',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
TextFormField(
controller: _nomController,
decoration: const InputDecoration(
labelText: 'Nom de l\'organisation *',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.business),
),
validator: (value) {
if (value == null || value.trim().isEmpty) {
return 'Le nom est obligatoire';
}
if (value.trim().length < 3) {
return 'Le nom doit contenir au moins 3 caractères';
}
return null;
},
onChanged: (_) => setState(() {}),
),
const SizedBox(height: 16),
TextFormField(
controller: _nomCourtController,
decoration: const InputDecoration(
labelText: 'Nom court (optionnel)',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.short_text),
),
validator: (value) {
if (value != null && value.trim().isNotEmpty && value.trim().length < 2) {
return 'Le nom court doit contenir au moins 2 caractères';
}
return null;
},
onChanged: (_) => setState(() {}),
),
const SizedBox(height: 16),
DropdownButtonFormField<TypeOrganization>(
value: _selectedType,
decoration: const InputDecoration(
labelText: 'Type d\'organisation *',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.category),
),
items: TypeOrganization.values.map((type) {
return DropdownMenuItem(
value: type,
child: Row(
children: [
Text(type.icon, style: const TextStyle(fontSize: 16)),
const SizedBox(width: 8),
Text(type.displayName),
],
),
);
}).toList(),
onChanged: (value) {
if (value != null) {
setState(() {
_selectedType = value;
});
}
},
),
const SizedBox(height: 16),
TextFormField(
controller: _descriptionController,
decoration: const InputDecoration(
labelText: 'Description (optionnel)',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.description),
),
maxLines: 3,
validator: (value) {
if (value != null && value.trim().isNotEmpty && value.trim().length < 10) {
return 'La description doit contenir au moins 10 caractères';
}
return null;
},
onChanged: (_) => setState(() {}),
),
],
),
);
}
/// Carte des informations de contact
Widget _buildContactCard() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Contact',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
TextFormField(
controller: _emailController,
decoration: const InputDecoration(
labelText: 'Email (optionnel)',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.email),
),
keyboardType: TextInputType.emailAddress,
validator: (value) {
if (value != null && value.trim().isNotEmpty) {
final emailRegex = RegExp(r'^[^@]+@[^@]+\.[^@]+$');
if (!emailRegex.hasMatch(value.trim())) {
return 'Format d\'email invalide';
}
}
return null;
},
onChanged: (_) => setState(() {}),
),
const SizedBox(height: 16),
TextFormField(
controller: _telephoneController,
decoration: const InputDecoration(
labelText: 'Téléphone (optionnel)',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.phone),
),
keyboardType: TextInputType.phone,
validator: (value) {
if (value != null && value.trim().isNotEmpty && value.trim().length < 8) {
return 'Numéro de téléphone invalide';
}
return null;
},
onChanged: (_) => setState(() {}),
),
const SizedBox(height: 16),
TextFormField(
controller: _siteWebController,
decoration: const InputDecoration(
labelText: 'Site web (optionnel)',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.web),
),
keyboardType: TextInputType.url,
validator: (value) {
if (value != null && value.trim().isNotEmpty) {
final urlRegex = RegExp(r'^https?://[^\s]+$');
if (!urlRegex.hasMatch(value.trim())) {
return 'Format d\'URL invalide (doit commencer par http:// ou https://)';
}
}
return null;
},
onChanged: (_) => setState(() {}),
),
],
),
);
}
/// Carte de localisation
Widget _buildLocationCard() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Localisation',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
TextFormField(
controller: _adresseController,
decoration: const InputDecoration(
labelText: 'Adresse (optionnel)',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.location_on),
),
maxLines: 2,
onChanged: (_) => setState(() {}),
),
const SizedBox(height: 16),
Row(
children: [
Expanded(
child: TextFormField(
controller: _villeController,
decoration: const InputDecoration(
labelText: 'Ville',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.location_city),
),
onChanged: (_) => setState(() {}),
),
),
const SizedBox(width: 12),
Expanded(
child: TextFormField(
controller: _regionController,
decoration: const InputDecoration(
labelText: 'Région',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.map),
),
onChanged: (_) => setState(() {}),
),
),
],
),
const SizedBox(height: 16),
TextFormField(
controller: _paysController,
decoration: const InputDecoration(
labelText: 'Pays',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.flag),
),
onChanged: (_) => setState(() {}),
),
],
),
);
}
/// Carte de configuration
Widget _buildConfigurationCard() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Configuration',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
DropdownButtonFormField<StatutOrganization>(
value: _selectedStatut,
decoration: const InputDecoration(
labelText: 'Statut *',
border: OutlineInputBorder(),
prefixIcon: Icon(Icons.toggle_on),
),
items: StatutOrganization.values.map((statut) {
final color = Color(int.parse(statut.color.substring(1), radix: 16) + 0xFF000000);
return DropdownMenuItem(
value: statut,
child: Row(
children: [
Container(
width: 12,
height: 12,
decoration: BoxDecoration(
color: color,
shape: BoxShape.circle,
),
),
const SizedBox(width: 8),
Text(statut.displayName),
],
),
);
}).toList(),
onChanged: (value) {
if (value != null) {
setState(() {
_selectedStatut = value;
});
}
},
),
],
),
);
}
/// Carte des métadonnées (lecture seule)
Widget _buildMetadataCard() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Informations système',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
_buildReadOnlyField(
icon: Icons.fingerprint,
label: 'ID',
value: widget.organization.id ?? 'Non défini',
),
const SizedBox(height: 12),
_buildReadOnlyField(
icon: Icons.calendar_today,
label: 'Date de création',
value: _formatDate(widget.organization.dateCreation),
),
const SizedBox(height: 12),
_buildReadOnlyField(
icon: Icons.people,
label: 'Nombre de membres',
value: widget.organization.nombreMembres.toString(),
),
if (widget.organization.ancienneteAnnees > 0) ...[
const SizedBox(height: 12),
_buildReadOnlyField(
icon: Icons.access_time,
label: 'Ancienneté',
value: '${widget.organization.ancienneteAnnees} ans',
),
],
],
),
);
}
/// Champ en lecture seule
Widget _buildReadOnlyField({
required IconData icon,
required String label,
required String value,
}) {
return Row(
children: [
Icon(
icon,
size: 20,
color: const Color(0xFF6B7280),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
label,
style: const TextStyle(
fontSize: 12,
color: Color(0xFF6B7280),
fontWeight: FontWeight.w500,
),
),
const SizedBox(height: 2),
Text(
value,
style: const TextStyle(
fontSize: 14,
color: Color(0xFF374151),
fontWeight: FontWeight.w600,
),
),
],
),
),
],
);
}
/// Boutons d'action
Widget _buildActionButtons() {
return Column(
children: [
SizedBox(
width: double.infinity,
child: ElevatedButton.icon(
onPressed: _hasChanges() ? _saveChanges : null,
icon: const Icon(Icons.save),
label: const Text('Enregistrer les modifications'),
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF6C5CE7),
foregroundColor: Colors.white,
padding: const EdgeInsets.symmetric(vertical: 16),
textStyle: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
),
),
),
),
const SizedBox(height: 12),
SizedBox(
width: double.infinity,
child: OutlinedButton.icon(
onPressed: () => _showDiscardDialog(),
icon: const Icon(Icons.cancel),
label: const Text('Annuler'),
style: OutlinedButton.styleFrom(
foregroundColor: const Color(0xFF6B7280),
padding: const EdgeInsets.symmetric(vertical: 16),
textStyle: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
),
),
),
),
],
);
}
/// Vérifie s'il y a des changements
bool _hasChanges() {
return _nomController.text.trim() != widget.organization.nom ||
_nomCourtController.text.trim() != (widget.organization.nomCourt ?? '') ||
_descriptionController.text.trim() != (widget.organization.description ?? '') ||
_emailController.text.trim() != (widget.organization.email ?? '') ||
_telephoneController.text.trim() != (widget.organization.telephone ?? '') ||
_siteWebController.text.trim() != (widget.organization.siteWeb ?? '') ||
_adresseController.text.trim() != (widget.organization.adresse ?? '') ||
_villeController.text.trim() != (widget.organization.ville ?? '') ||
_regionController.text.trim() != (widget.organization.region ?? '') ||
_paysController.text.trim() != (widget.organization.pays ?? '') ||
_selectedType != widget.organization.typeOrganisation ||
_selectedStatut != widget.organization.statut;
}
/// Sauvegarde les modifications
void _saveChanges() {
if (_formKey.currentState?.validate() ?? false) {
final updatedOrganisation = widget.organization.copyWith(
nom: _nomController.text.trim(),
nomCourt: _nomCourtController.text.trim().isEmpty ? null : _nomCourtController.text.trim(),
description: _descriptionController.text.trim().isEmpty ? null : _descriptionController.text.trim(),
typeOrganisation: _selectedType,
statut: _selectedStatut,
email: _emailController.text.trim().isEmpty ? null : _emailController.text.trim(),
telephone: _telephoneController.text.trim().isEmpty ? null : _telephoneController.text.trim(),
siteWeb: _siteWebController.text.trim().isEmpty ? null : _siteWebController.text.trim(),
adresse: _adresseController.text.trim().isEmpty ? null : _adresseController.text.trim(),
ville: _villeController.text.trim().isEmpty ? null : _villeController.text.trim(),
region: _regionController.text.trim().isEmpty ? null : _regionController.text.trim(),
pays: _paysController.text.trim().isEmpty ? null : _paysController.text.trim(),
);
if (widget.organization.id != null) {
context.read<OrganizationsBloc>().add(
UpdateOrganization(widget.organization.id!, updatedOrganisation),
);
}
}
}
/// Affiche le dialog de confirmation d'annulation
void _showDiscardDialog() {
if (_hasChanges()) {
showDialog(
context: context,
builder: (context) => AlertDialog(
title: const Text('Annuler les modifications'),
content: const Text('Vous avez des modifications non sauvegardées. Êtes-vous sûr de vouloir les abandonner ?'),
actions: [
TextButton(
onPressed: () => Navigator.of(context).pop(),
child: const Text('Continuer l\'édition'),
),
ElevatedButton(
onPressed: () {
Navigator.of(context).pop(); // Fermer le dialog
Navigator.of(context).pop(); // Retour à la page précédente
},
style: ElevatedButton.styleFrom(backgroundColor: Colors.red),
child: const Text('Abandonner', style: TextStyle(color: Colors.white)),
),
],
),
);
} else {
Navigator.of(context).pop();
}
}
/// Formate une date
String _formatDate(DateTime? date) {
if (date == null) return 'Non spécifiée';
return '${date.day}/${date.month}/${date.year}';
}
}

790
unionflow-mobile-apps/lib/features/organizations/presentation/pages/organization_detail_page.dart Normal file
View File

@@ -0,0 +1,790 @@
/// Page de détail d'une organisation
/// Respecte strictement le design system établi dans l'application
library organisation_detail_page;
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../data/models/organization_model.dart';
import '../../bloc/organizations_bloc.dart';
import '../../bloc/organizations_event.dart';
import '../../bloc/organizations_state.dart';
/// Page de détail d'une organisation avec design system cohérent
class OrganizationDetailPage extends StatefulWidget {
final String organizationId;
const OrganizationDetailPage({
super.key,
required this.organizationId,
});
@override
State<OrganizationDetailPage> createState() => _OrganizationDetailPageState();
}
class _OrganizationDetailPageState extends State<OrganizationDetailPage> {
@override
void initState() {
super.initState();
// Charger les détails de l'organisation
context.read<OrganizationsBloc>().add(LoadOrganizationById(widget.organizationId));
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF8F9FA), // Background cohérent
appBar: AppBar(
backgroundColor: const Color(0xFF6C5CE7),
foregroundColor: Colors.white,
title: const Text('Détail Organisation'),
elevation: 0,
actions: [
IconButton(
onPressed: () => _showEditDialog(),
icon: const Icon(Icons.edit),
tooltip: 'Modifier',
),
PopupMenuButton<String>(
onSelected: (value) => _handleMenuAction(value),
itemBuilder: (context) => [
const PopupMenuItem(
value: 'activate',
child: Row(
children: [
Icon(Icons.check_circle, color: Color(0xFF10B981)),
SizedBox(width: 8),
Text('Activer'),
],
),
),
const PopupMenuItem(
value: 'deactivate',
child: Row(
children: [
Icon(Icons.pause_circle, color: Color(0xFF6B7280)),
SizedBox(width: 8),
Text('Désactiver'),
],
),
),
const PopupMenuItem(
value: 'delete',
child: Row(
children: [
Icon(Icons.delete, color: Colors.red),
SizedBox(width: 8),
Text('Supprimer'),
],
),
),
],
),
],
),
body: BlocBuilder<OrganizationsBloc, OrganizationsState>(
builder: (context, state) {
if (state is OrganizationLoading) {
return _buildLoadingState();
} else if (state is OrganizationLoaded) {
return _buildDetailContent(state.organization);
} else if (state is OrganizationsError) {
return _buildErrorState(state);
}
return _buildEmptyState();
},
),
);
}
/// État de chargement
Widget _buildLoadingState() {
return const Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(Color(0xFF6C5CE7)),
),
SizedBox(height: 16),
Text(
'Chargement des détails...',
style: TextStyle(
fontSize: 16,
color: Color(0xFF6B7280),
),
),
],
),
);
}
/// Contenu principal avec les détails
Widget _buildDetailContent(OrganizationModel organization) {
return SingleChildScrollView(
padding: const EdgeInsets.all(12), // SpacingTokens cohérent
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildHeaderCard(organization),
const SizedBox(height: 16),
_buildInfoCard(organization),
const SizedBox(height: 16),
_buildStatsCard(organization),
const SizedBox(height: 16),
_buildContactCard(organization),
const SizedBox(height: 16),
_buildActionsCard(organization),
],
),
);
}
/// Carte d'en-tête avec informations principales
Widget _buildHeaderCard(OrganizationModel organization) {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
const Color(0xFF6C5CE7),
const Color(0xFF6C5CE7).withOpacity(0.8),
],
),
borderRadius: BorderRadius.circular(8), // RadiusTokens cohérent
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.1),
blurRadius: 8,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.2),
borderRadius: BorderRadius.circular(8),
),
child: Text(
organization.typeOrganisation.icon,
style: const TextStyle(fontSize: 24),
),
),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
organization.nom,
style: const TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
if (organization.nomCourt?.isNotEmpty == true) ...[
const SizedBox(height: 4),
Text(
organization.nomCourt!,
style: TextStyle(
fontSize: 14,
color: Colors.white.withOpacity(0.9),
),
),
],
const SizedBox(height: 8),
_buildStatusBadge(organization.statut),
],
),
),
],
),
if (organization.description?.isNotEmpty == true) ...[
const SizedBox(height: 16),
Text(
organization.description!,
style: TextStyle(
fontSize: 14,
color: Colors.white.withOpacity(0.9),
height: 1.4,
),
),
],
],
),
);
}
/// Badge de statut
Widget _buildStatusBadge(StatutOrganization statut) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.2),
borderRadius: BorderRadius.circular(16),
),
child: Text(
statut.displayName,
style: const TextStyle(
fontSize: 12,
fontWeight: FontWeight.w600,
color: Colors.white,
),
),
);
}
/// Carte d'informations générales
Widget _buildInfoCard(OrganizationModel organization) {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Informations générales',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
_buildInfoRow(
icon: Icons.category,
label: 'Type',
value: organization.typeOrganisation.displayName,
),
const SizedBox(height: 12),
_buildInfoRow(
icon: Icons.location_on,
label: 'Localisation',
value: _buildLocationText(organization),
),
const SizedBox(height: 12),
_buildInfoRow(
icon: Icons.calendar_today,
label: 'Date de création',
value: _formatDate(organization.dateCreation),
),
if (organization.ancienneteAnnees > 0) ...[
const SizedBox(height: 12),
_buildInfoRow(
icon: Icons.access_time,
label: 'Ancienneté',
value: '${organization.ancienneteAnnees} ans',
),
],
],
),
);
}
/// Ligne d'information
Widget _buildInfoRow({
required IconData icon,
required String label,
required String value,
}) {
return Row(
children: [
Icon(
icon,
size: 20,
color: const Color(0xFF6C5CE7),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
label,
style: const TextStyle(
fontSize: 12,
color: Color(0xFF6B7280),
fontWeight: FontWeight.w500,
),
),
const SizedBox(height: 2),
Text(
value,
style: const TextStyle(
fontSize: 14,
color: Color(0xFF374151),
fontWeight: FontWeight.w600,
),
),
],
),
),
],
);
}
/// Carte de statistiques
Widget _buildStatsCard(OrganizationModel organization) {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Statistiques',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
Row(
children: [
Expanded(
child: _buildStatItem(
icon: Icons.people,
label: 'Membres',
value: organization.nombreMembres.toString(),
color: const Color(0xFF3B82F6),
),
),
const SizedBox(width: 12),
Expanded(
child: _buildStatItem(
icon: Icons.event,
label: 'Événements',
value: '0', // TODO: Récupérer depuis l'API
color: const Color(0xFF10B981),
),
),
],
),
],
),
);
}
/// Item de statistique
Widget _buildStatItem({
required IconData icon,
required String label,
required String value,
required Color color,
}) {
return Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: color.withOpacity(0.05),
borderRadius: BorderRadius.circular(6),
border: Border.all(
color: color.withOpacity(0.1),
width: 1,
),
),
child: Column(
children: [
Icon(
icon,
size: 24,
color: color,
),
const SizedBox(height: 8),
Text(
value,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: color,
),
),
const SizedBox(height: 4),
Text(
label,
style: TextStyle(
fontSize: 12,
color: color,
fontWeight: FontWeight.w500,
),
),
],
),
);
}
/// Carte de contact
Widget _buildContactCard(OrganizationModel organization) {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Contact',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
if (organization.email?.isNotEmpty == true)
_buildContactRow(
icon: Icons.email,
label: 'Email',
value: organization.email!,
onTap: () => _launchEmail(organization.email!),
),
if (organization.telephone?.isNotEmpty == true) ...[
const SizedBox(height: 12),
_buildContactRow(
icon: Icons.phone,
label: 'Téléphone',
value: organization.telephone!,
onTap: () => _launchPhone(organization.telephone!),
),
],
if (organization.siteWeb?.isNotEmpty == true) ...[
const SizedBox(height: 12),
_buildContactRow(
icon: Icons.web,
label: 'Site web',
value: organization.siteWeb!,
onTap: () => _launchWebsite(organization.siteWeb!),
),
],
],
),
);
}
/// Ligne de contact
Widget _buildContactRow({
required IconData icon,
required String label,
required String value,
VoidCallback? onTap,
}) {
return InkWell(
onTap: onTap,
borderRadius: BorderRadius.circular(6),
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 4),
child: Row(
children: [
Icon(
icon,
size: 20,
color: const Color(0xFF6C5CE7),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
label,
style: const TextStyle(
fontSize: 12,
color: Color(0xFF6B7280),
fontWeight: FontWeight.w500,
),
),
const SizedBox(height: 2),
Text(
value,
style: TextStyle(
fontSize: 14,
color: onTap != null ? const Color(0xFF6C5CE7) : const Color(0xFF374151),
fontWeight: FontWeight.w600,
decoration: onTap != null ? TextDecoration.underline : null,
),
),
],
),
),
if (onTap != null)
const Icon(
Icons.open_in_new,
size: 16,
color: Color(0xFF6C5CE7),
),
],
),
),
);
}
/// Carte d'actions
Widget _buildActionsCard(OrganizationModel organization) {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(8),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Actions',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF6C5CE7),
),
),
const SizedBox(height: 16),
Row(
children: [
Expanded(
child: ElevatedButton.icon(
onPressed: () => _showEditDialog(),
icon: const Icon(Icons.edit),
label: const Text('Modifier'),
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF6C5CE7),
foregroundColor: Colors.white,
),
),
),
const SizedBox(width: 12),
Expanded(
child: OutlinedButton.icon(
onPressed: () => _showDeleteConfirmation(organization),
icon: const Icon(Icons.delete),
label: const Text('Supprimer'),
style: OutlinedButton.styleFrom(
foregroundColor: Colors.red,
side: const BorderSide(color: Colors.red),
),
),
),
],
),
],
),
);
}
/// État d'erreur
Widget _buildErrorState(OrganizationsError state) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.error_outline,
size: 64,
color: Colors.red.shade400,
),
const SizedBox(height: 16),
Text(
'Erreur',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Colors.red.shade700,
),
),
const SizedBox(height: 8),
Text(
state.message,
textAlign: TextAlign.center,
style: const TextStyle(
fontSize: 14,
color: Color(0xFF6B7280),
),
),
const SizedBox(height: 24),
ElevatedButton.icon(
onPressed: () {
context.read<OrganizationsBloc>().add(LoadOrganizationById(widget.organizationId));
},
icon: const Icon(Icons.refresh),
label: const Text('Réessayer'),
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF6C5CE7),
foregroundColor: Colors.white,
),
),
],
),
);
}
/// État vide
Widget _buildEmptyState() {
return const Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.business_outlined,
size: 64,
color: Color(0xFF6B7280),
),
SizedBox(height: 16),
Text(
'Organisation non trouvée',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Color(0xFF374151),
),
),
],
),
);
}
/// Construit le texte de localisation
String _buildLocationText(OrganizationModel organization) {
final parts = <String>[];
if (organization.ville?.isNotEmpty == true) {
parts.add(organization.ville!);
}
if (organization.region?.isNotEmpty == true) {
parts.add(organization.region!);
}
if (organization.pays?.isNotEmpty == true) {
parts.add(organization.pays!);
}
return parts.isEmpty ? 'Non spécifiée' : parts.join(', ');
}
/// Formate une date
String _formatDate(DateTime? date) {
if (date == null) return 'Non spécifiée';
return '${date.day}/${date.month}/${date.year}';
}
/// Actions du menu
void _handleMenuAction(String action) {
switch (action) {
case 'activate':
context.read<OrganizationsBloc>().add(ActivateOrganization(widget.organizationId));
break;
case 'deactivate':
// TODO: Implémenter la désactivation
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Désactivation - À implémenter')),
);
break;
case 'delete':
_showDeleteConfirmation(null);
break;
}
}
/// Affiche le dialog d'édition
void _showEditDialog() {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Édition - À implémenter')),
);
}
/// Affiche la confirmation de suppression
void _showDeleteConfirmation(OrganizationModel? organization) {
showDialog(
context: context,
builder: (context) => AlertDialog(
title: const Text('Confirmer la suppression'),
content: Text(
organization != null
? 'Êtes-vous sûr de vouloir supprimer "${organization.nom}" ?'
: 'Êtes-vous sûr de vouloir supprimer cette organisation ?',
),
actions: [
TextButton(
onPressed: () => Navigator.of(context).pop(),
child: const Text('Annuler'),
),
ElevatedButton(
onPressed: () {
Navigator.of(context).pop();
context.read<OrganizationsBloc>().add(DeleteOrganization(widget.organizationId));
Navigator.of(context).pop(); // Retour à la liste
},
style: ElevatedButton.styleFrom(backgroundColor: Colors.red),
child: const Text('Supprimer', style: TextStyle(color: Colors.white)),
),
],
),
);
}
/// Lance l'application email
void _launchEmail(String email) {
// TODO: Implémenter url_launcher
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Ouvrir email: $email')),
);
}
/// Lance l'application téléphone
void _launchPhone(String phone) {
// TODO: Implémenter url_launcher
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Appeler: $phone')),
);
}
/// Lance le navigateur web
void _launchWebsite(String url) {
// TODO: Implémenter url_launcher
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Ouvrir site: $url')),
);
}
}

736
unionflow-mobile-apps/lib/features/organizations/presentation/pages/organizations_page.dart Normal file
View File

@@ -0,0 +1,736 @@
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../bloc/organizations_bloc.dart';
import '../../bloc/organizations_event.dart';
import '../../bloc/organizations_state.dart';
/// Page de gestion des organisations - Interface sophistiquée et exhaustive
///
/// Cette page offre une interface complète pour la gestion des organisations
/// avec des fonctionnalités avancées de recherche, filtrage, statistiques
/// et actions de gestion basées sur les permissions utilisateur.
class OrganizationsPage extends StatefulWidget {
const OrganizationsPage({super.key});
@override
State<OrganizationsPage> createState() => _OrganizationsPageState();
}
class _OrganizationsPageState extends State<OrganizationsPage> with TickerProviderStateMixin {
// Controllers et état
final TextEditingController _searchController = TextEditingController();
late TabController _tabController;
// État de l'interface
String _searchQuery = '';
@override
void initState() {
super.initState();
_tabController = TabController(length: 4, vsync: this);
// Charger les organisations au démarrage
context.read<OrganizationsBloc>().add(const LoadOrganizations());
}
@override
void dispose() {
_tabController.dispose();
_searchController.dispose();
super.dispose();
}
// Données de démonstration enrichies
final List<Map<String, dynamic>> _allOrganisations = [
{
'id': '1',
'nom': 'Syndicat des Travailleurs Unis',
'description': 'Organisation syndicale représentant les travailleurs de l\'industrie',
'type': 'Syndicat',
'secteurActivite': 'Industrie',
'status': 'Active',
'dateCreation': DateTime(2020, 3, 15),
'dateModification': DateTime(2024, 9, 19),
'nombreMembres': 1250,
'adresse': '123 Rue de la République, Paris',
'telephone': '+33 1 23 45 67 89',
'email': 'contact@stu.org',
'siteWeb': 'https://www.stu.org',
'logo': null,
'budget': 850000,
'projetsActifs': 8,
'evenementsAnnuels': 24,
},
{
'id': '2',
'nom': 'Fédération Nationale des Employés',
'description': 'Fédération regroupant plusieurs syndicats d\'employés',
'type': 'Fédération',
'secteurActivite': 'Services',
'status': 'Active',
'dateCreation': DateTime(2018, 7, 22),
'dateModification': DateTime(2024, 9, 18),
'nombreMembres': 3500,
'adresse': '456 Avenue des Champs, Lyon',
'telephone': '+33 4 56 78 90 12',
'email': 'info@fne.org',
'siteWeb': 'https://www.fne.org',
'logo': null,
'budget': 2100000,
'projetsActifs': 15,
'evenementsAnnuels': 36,
},
{
'id': '3',
'nom': 'Union des Artisans',
'description': 'Union représentant les artisans et petites entreprises',
'type': 'Union',
'secteurActivite': 'Artisanat',
'status': 'Active',
'dateCreation': DateTime(2019, 11, 8),
'dateModification': DateTime(2024, 9, 15),
'nombreMembres': 890,
'adresse': '789 Place du Marché, Marseille',
'telephone': '+33 4 91 23 45 67',
'email': 'contact@unionartisans.org',
'siteWeb': 'https://www.unionartisans.org',
'logo': null,
'budget': 450000,
'projetsActifs': 5,
'evenementsAnnuels': 18,
},
];
// Filtrage des organisations
List<Map<String, dynamic>> get _filteredOrganisations {
var organisations = _allOrganisations;
// Filtrage par recherche
if (_searchQuery.isNotEmpty) {
final query = _searchQuery.toLowerCase();
organisations = organisations.where((org) =>
org['nom'].toString().toLowerCase().contains(query) ||
org['description'].toString().toLowerCase().contains(query) ||
org['secteurActivite'].toString().toLowerCase().contains(query) ||
org['type'].toString().toLowerCase().contains(query)).toList();
}
// Le filtrage par type est maintenant géré par les onglets
return organisations;
}
@override
Widget build(BuildContext context) {
return BlocListener<OrganizationsBloc, OrganizationsState>(
listener: (context, state) {
// Gestion des erreurs avec SnackBar
if (state is OrganizationsError) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(state.message),
backgroundColor: Colors.red,
duration: const Duration(seconds: 4),
action: SnackBarAction(
label: 'Réessayer',
textColor: Colors.white,
onPressed: () {
context.read<OrganizationsBloc>().add(const LoadOrganizations());
},
),
),
);
}
},
child: Scaffold(
backgroundColor: const Color(0xFFF8F9FA),
body: SingleChildScrollView(
padding: const EdgeInsets.all(12),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Header épuré sans statistiques
_buildCleanHeader(),
const SizedBox(height: 16),
// Section statistiques dédiée
_buildStatsSection(),
const SizedBox(height: 16),
// Barre de recherche et filtres
_buildSearchAndFilters(),
const SizedBox(height: 16),
// Onglets de catégories
_buildCategoryTabs(),
const SizedBox(height: 16),
// Liste des organisations
_buildOrganisationsDisplay(),
const SizedBox(height: 80), // Espace pour le FAB
],
),
),
floatingActionButton: _buildActionButton(),
),
);
}
/// Bouton d'action harmonisé
Widget _buildActionButton() {
return FloatingActionButton.extended(
onPressed: () => _showCreateOrganisationDialog(),
backgroundColor: const Color(0xFF6C5CE7),
elevation: 8,
icon: const Icon(Icons.add, color: Colors.white),
label: const Text(
'Nouvelle organisation',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
),
),
);
}
/// Header épuré et cohérent avec le design system
Widget _buildCleanHeader() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
gradient: const LinearGradient(
colors: [Color(0xFF6C5CE7), Color(0xFF5A4FCF)],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
borderRadius: BorderRadius.circular(16),
boxShadow: [
BoxShadow(
color: const Color(0xFF6C5CE7).withOpacity(0.3),
blurRadius: 20,
offset: const Offset(0, 8),
),
],
),
child: Row(
children: [
Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.2),
borderRadius: BorderRadius.circular(12),
),
child: const Icon(
Icons.business,
color: Colors.white,
size: 24,
),
),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Gestion des Organisations',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
Text(
'Interface complète de gestion des organisations',
style: TextStyle(
fontSize: 14,
color: Colors.white.withOpacity(0.8),
),
),
],
),
),
_buildHeaderActions(),
],
),
);
}
/// Section statistiques dédiée et harmonisée
Widget _buildStatsSection() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(16),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 10,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Icon(
Icons.analytics_outlined,
color: Colors.grey[600],
size: 20,
),
const SizedBox(width: 8),
Text(
'Statistiques',
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
color: Colors.grey[800],
),
),
],
),
const SizedBox(height: 16),
Row(
children: [
Expanded(
child: _buildStatCard(
'Total',
'${_allOrganisations.length}',
Icons.business_outlined,
const Color(0xFF6C5CE7),
),
),
const SizedBox(width: 12),
Expanded(
child: _buildStatCard(
'Actives',
'${_allOrganisations.where((o) => o['status'] == 'Active').length}',
Icons.check_circle_outline,
const Color(0xFF00B894),
),
),
const SizedBox(width: 12),
Expanded(
child: _buildStatCard(
'Membres',
'${_allOrganisations.fold<int>(0, (sum, o) => sum + (o['nombreMembres'] as int))}',
Icons.people_outline,
const Color(0xFF0984E3),
),
),
],
),
],
),
);
}
/// Actions du header
Widget _buildHeaderActions() {
return Row(
children: [
Container(
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.2),
borderRadius: BorderRadius.circular(8),
),
child: IconButton(
onPressed: () => _showNotifications(),
icon: const Icon(Icons.notifications_outlined, color: Colors.white),
tooltip: 'Notifications',
),
),
const SizedBox(width: 8),
Container(
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.2),
borderRadius: BorderRadius.circular(8),
),
child: IconButton(
onPressed: () => _showSettings(),
icon: const Icon(Icons.settings_outlined, color: Colors.white),
tooltip: 'Paramètres',
),
),
],
);
}
/// Carte de statistique harmonisée
Widget _buildStatCard(String label, String value, IconData icon, Color color) {
return Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: color.withOpacity(0.05),
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: color.withOpacity(0.1),
width: 1,
),
),
child: Column(
children: [
Icon(icon, color: color, size: 20),
const SizedBox(height: 8),
Text(
value,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: Colors.grey[800],
),
),
Text(
label,
style: TextStyle(
fontSize: 12,
color: Colors.grey[600],
fontWeight: FontWeight.w500,
),
),
],
),
);
}
/// Onglets de catégories harmonisés
Widget _buildCategoryTabs() {
return Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(16),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 10,
offset: const Offset(0, 2),
),
],
),
child: TabBar(
controller: _tabController,
labelColor: const Color(0xFF6C5CE7),
unselectedLabelColor: Colors.grey[600],
indicatorColor: const Color(0xFF6C5CE7),
indicatorWeight: 3,
indicatorSize: TabBarIndicatorSize.tab,
labelStyle: const TextStyle(
fontWeight: FontWeight.w600,
fontSize: 14,
),
unselectedLabelStyle: const TextStyle(
fontWeight: FontWeight.normal,
fontSize: 14,
),
tabs: const [
Tab(text: 'Toutes'),
Tab(text: 'Syndicats'),
Tab(text: 'Fédérations'),
Tab(text: 'Unions'),
],
),
);
}
/// Affichage des organisations harmonisé
Widget _buildOrganisationsDisplay() {
return SizedBox(
height: 600, // Hauteur fixe pour le TabBarView
child: TabBarView(
controller: _tabController,
children: [
_buildOrganisationsTab('Toutes'),
_buildOrganisationsTab('Syndicat'),
_buildOrganisationsTab('Fédération'),
_buildOrganisationsTab('Union'),
],
),
);
}
/// Onglet des organisations
Widget _buildOrganisationsTab(String filter) {
final organisations = filter == 'Toutes'
? _filteredOrganisations
: _filteredOrganisations.where((o) => o['type'] == filter).toList();
return Column(
children: [
// Barre de recherche et filtres
_buildSearchAndFilters(),
// Liste des organisations
Expanded(
child: organisations.isEmpty
? _buildEmptyState()
: _buildOrganisationsList(organisations),
),
],
);
}
/// Barre de recherche et filtres harmonisée
Widget _buildSearchAndFilters() {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(16),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 10,
offset: const Offset(0, 2),
),
],
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Barre de recherche
Container(
decoration: BoxDecoration(
color: Colors.grey[50],
borderRadius: BorderRadius.circular(12),
border: Border.all(
color: Colors.grey[200]!,
width: 1,
),
),
child: TextField(
controller: _searchController,
onChanged: (value) {
setState(() {
_searchQuery = value;
});
},
decoration: InputDecoration(
hintText: 'Rechercher par nom, type, secteur...',
hintStyle: TextStyle(
color: Colors.grey[500],
fontSize: 14,
),
prefixIcon: Icon(Icons.search, color: Colors.grey[400]),
suffixIcon: _searchQuery.isNotEmpty
? IconButton(
onPressed: () {
_searchController.clear();
setState(() {
_searchQuery = '';
});
},
icon: Icon(Icons.clear, color: Colors.grey[400]),
)
: null,
border: InputBorder.none,
contentPadding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 12,
),
),
),
),
],
),
);
}
/// Liste des organisations
Widget _buildOrganisationsList(List<Map<String, dynamic>> organisations) {
return RefreshIndicator(
onRefresh: () async {
// Recharger les organisations
// Note: Cette page utilise des données passées en paramètre
// Le rafraîchissement devrait être géré par le parent
await Future.delayed(const Duration(milliseconds: 500));
},
child: ListView.builder(
padding: const EdgeInsets.all(16),
itemCount: organisations.length,
itemBuilder: (context, index) {
final org = organisations[index];
return _buildOrganisationCard(org);
},
),
);
}
/// Carte d'organisation
Widget _buildOrganisationCard(Map<String, dynamic> org) {
return Container(
margin: const EdgeInsets.only(bottom: 12),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(12),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.05),
blurRadius: 10,
offset: const Offset(0, 2),
),
],
),
child: InkWell(
onTap: () => _showOrganisationDetails(org),
borderRadius: BorderRadius.circular(12),
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Container(
padding: const EdgeInsets.all(8),
decoration: BoxDecoration(
color: const Color(0xFF6C5CE7).withOpacity(0.1),
borderRadius: BorderRadius.circular(8),
),
child: const Icon(
Icons.business,
color: Color(0xFF6C5CE7),
size: 20,
),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
org['nom'],
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Color(0xFF1F2937),
),
),
const SizedBox(height: 2),
Text(
org['type'],
style: TextStyle(
fontSize: 12,
color: Colors.grey[600],
fontWeight: FontWeight.w500,
),
),
],
),
),
Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: org['status'] == 'Active' ? Colors.green.withOpacity(0.1) : Colors.orange.withOpacity(0.1),
borderRadius: BorderRadius.circular(12),
),
child: Text(
org['status'],
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w600,
color: org['status'] == 'Active' ? Colors.green[700] : Colors.orange[700],
),
),
),
],
),
const SizedBox(height: 12),
Text(
org['description'],
style: TextStyle(
fontSize: 14,
color: Colors.grey[700],
height: 1.4,
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
const SizedBox(height: 12),
Row(
children: [
_buildInfoChip(Icons.people, '${org['nombreMembres']} membres'),
const SizedBox(width: 8),
_buildInfoChip(Icons.work, org['secteurActivite']),
],
),
],
),
),
),
);
}
/// Chip d'information
Widget _buildInfoChip(IconData icon, String text) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: Colors.grey[100],
borderRadius: BorderRadius.circular(8),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(icon, size: 12, color: Colors.grey[600]),
const SizedBox(width: 4),
Text(
text,
style: TextStyle(
fontSize: 11,
color: Colors.grey[700],
fontWeight: FontWeight.w500,
),
),
],
),
);
}
/// État vide
Widget _buildEmptyState() {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.business_outlined,
size: 64,
color: Colors.grey[400],
),
const SizedBox(height: 16),
Text(
'Aucune organisation trouvée',
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
color: Colors.grey[600],
),
),
const SizedBox(height: 8),
Text(
'Essayez de modifier vos critères de recherche',
style: TextStyle(
fontSize: 14,
color: Colors.grey[500],
),
),
],
),
);
}
// Méthodes temporaires pour éviter les erreurs
void _showNotifications() {}
void _showSettings() {}
void _showOrganisationDetails(Map<String, dynamic> org) {}
void _showCreateOrganisationDialog() {}
}

21
unionflow-mobile-apps/lib/features/organizations/presentation/pages/organizations_page_wrapper.dart Normal file
View File

@@ -0,0 +1,21 @@
/// Wrapper pour la page des organisations avec BLoC Provider
library organisations_page_wrapper;
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../di/organizations_di.dart';
import '../../bloc/organizations_bloc.dart';
import 'organizations_page.dart';
/// Wrapper qui fournit le BLoC pour la page des organisations
class OrganizationsPageWrapper extends StatelessWidget {
const OrganizationsPageWrapper({super.key});
@override
Widget build(BuildContext context) {
return BlocProvider<OrganizationsBloc>(
create: (context) => OrganizationsDI.getOrganizationsBloc(),
child: const OrganizationsPage(),
);
}
}