✨ Nouvelles fonctionnalités: - Ajout du mode terrain pour utilisation mobile hors connexion - Génération automatique de reçus PDF avec template personnalisé - Révision complète du système de cartes avec amélioration des performances 🔧 Améliorations techniques: - Refactoring du module chat avec architecture simplifiée - Optimisation du système de sécurité NIST SP 800-63B - Amélioration de la gestion des secteurs géographiques - Support UTF-8 étendu pour les noms d'utilisateurs 📱 Application mobile: - Nouveau mode terrain dans user_field_mode_page - Interface utilisateur adaptative pour conditions difficiles - Synchronisation offline améliorée 🗺️ Cartographie: - Optimisation des performances MapBox - Meilleure gestion des tuiles hors ligne - Amélioration de l'affichage des secteurs 📄 Documentation: - Ajout guide Android (ANDROID-GUIDE.md) - Documentation sécurité API (API-SECURITY.md) - Guide module chat (CHAT_MODULE.md) 🐛 Corrections: - Résolution des erreurs 400 lors de la création d'utilisateurs - Correction de la validation des noms d'utilisateurs - Fix des problèmes de synchronisation chat 🤖 Generated with Claude Code (https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
636 lines
24 KiB
Dart
636 lines
24 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:geosector_app/core/data/models/sector_model.dart';
|
|
import 'package:geosector_app/core/data/models/membre_model.dart';
|
|
import 'package:geosector_app/core/data/models/user_sector_model.dart';
|
|
import 'package:geosector_app/core/repositories/membre_repository.dart';
|
|
import 'package:geosector_app/core/services/current_amicale_service.dart';
|
|
import 'package:hive_flutter/hive_flutter.dart';
|
|
import 'package:geosector_app/core/constants/app_keys.dart';
|
|
|
|
class SectorDialog extends StatefulWidget {
|
|
final SectorModel? existingSector;
|
|
final List<List<double>> coordinates;
|
|
final Future<void> Function(String name, String color, List<int> memberIds) onSave;
|
|
|
|
const SectorDialog({
|
|
super.key,
|
|
this.existingSector,
|
|
required this.coordinates,
|
|
required this.onSave,
|
|
});
|
|
|
|
@override
|
|
State<SectorDialog> createState() => _SectorDialogState();
|
|
}
|
|
|
|
class _SectorDialogState extends State<SectorDialog> {
|
|
final _formKey = GlobalKey<FormState>();
|
|
final _nameController = TextEditingController();
|
|
final _nameFocusNode = FocusNode();
|
|
final _searchController = TextEditingController();
|
|
Color _selectedColor = Colors.blue;
|
|
final List<int> _selectedMemberIds = [];
|
|
bool _isLoading = false;
|
|
bool _membersLoaded = false;
|
|
String _searchQuery = '';
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
if (widget.existingSector != null) {
|
|
_nameController.text = widget.existingSector!.libelle;
|
|
_selectedColor = _hexToColor(widget.existingSector!.color);
|
|
// Charger les membres affectés au secteur
|
|
_loadSectorMembers();
|
|
}
|
|
|
|
// Donner le focus au champ nom après que le dialog soit construit
|
|
WidgetsBinding.instance.addPostFrameCallback((_) {
|
|
_nameFocusNode.requestFocus();
|
|
});
|
|
}
|
|
|
|
// Charger les membres actuellement affectés au secteur
|
|
void _loadSectorMembers() {
|
|
if (widget.existingSector == null) return;
|
|
|
|
debugPrint('=== Début chargement membres pour secteur ${widget.existingSector!.id} - ${widget.existingSector!.libelle} ===');
|
|
|
|
try {
|
|
// Vérifier si la box UserSector est ouverte
|
|
if (!Hive.isBoxOpen(AppKeys.userSectorBoxName)) {
|
|
debugPrint('Box UserSector non ouverte');
|
|
return;
|
|
}
|
|
|
|
final userSectorBox = Hive.box<UserSectorModel>(AppKeys.userSectorBoxName);
|
|
debugPrint('Box UserSector contient ${userSectorBox.length} entrées au total');
|
|
|
|
// Afficher toutes les entrées pour debug
|
|
for (var i = 0; i < userSectorBox.length; i++) {
|
|
final us = userSectorBox.getAt(i);
|
|
if (us != null) {
|
|
debugPrint(' - UserSector[$i]: membreId=${us.id}, fkSector=${us.fkSector}, name="${us.firstName} ${us.name}"');
|
|
}
|
|
}
|
|
|
|
// Récupérer tous les UserSectorModel pour ce secteur
|
|
final userSectors = userSectorBox.values
|
|
.where((us) => us.fkSector == widget.existingSector!.id)
|
|
.toList();
|
|
|
|
debugPrint('Trouvé ${userSectors.length} UserSectorModel pour le secteur ${widget.existingSector!.id}');
|
|
|
|
// Pré-sélectionner les IDs des membres affectés
|
|
setState(() {
|
|
_selectedMemberIds.clear();
|
|
for (final userSector in userSectors) {
|
|
// userSector.id est l'ID du membre (pas de l'utilisateur)
|
|
_selectedMemberIds.add(userSector.id);
|
|
debugPrint('Membre présélectionné: ${userSector.firstName} ${userSector.name} (membreId: ${userSector.id}, fkSector: ${userSector.fkSector})');
|
|
}
|
|
});
|
|
|
|
debugPrint('=== Fin chargement: ${_selectedMemberIds.length} membres présélectionnés ===');
|
|
debugPrint('IDs présélectionnés: $_selectedMemberIds');
|
|
|
|
// Marquer le chargement comme terminé
|
|
setState(() {
|
|
_membersLoaded = true;
|
|
});
|
|
} catch (e) {
|
|
debugPrint('Erreur lors du chargement des membres du secteur: $e');
|
|
setState(() {
|
|
_membersLoaded = true; // Même en cas d'erreur
|
|
});
|
|
}
|
|
}
|
|
|
|
@override
|
|
void dispose() {
|
|
_nameController.dispose();
|
|
_nameFocusNode.dispose();
|
|
_searchController.dispose();
|
|
super.dispose();
|
|
}
|
|
|
|
Color _hexToColor(String hexColor) {
|
|
final String colorStr = hexColor.startsWith('#') ? hexColor.substring(1) : hexColor;
|
|
final String fullColorStr = colorStr.length == 6 ? 'FF$colorStr' : colorStr;
|
|
return Color(int.parse(fullColorStr, radix: 16));
|
|
}
|
|
|
|
String _colorToHex(Color color) {
|
|
return '#${color.value.toRadixString(16).substring(2).toUpperCase()}';
|
|
}
|
|
|
|
void _handleSave() async {
|
|
if (_formKey.currentState!.validate()) {
|
|
// Vérifier qu'au moins un membre est sélectionné
|
|
if (_selectedMemberIds.isEmpty) {
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
const SnackBar(
|
|
content: Text('Veuillez sélectionner au moins un membre'),
|
|
backgroundColor: Colors.orange,
|
|
duration: Duration(seconds: 3),
|
|
),
|
|
);
|
|
return;
|
|
}
|
|
|
|
// Indiquer que nous sommes en train de sauvegarder
|
|
setState(() => _isLoading = true);
|
|
|
|
try {
|
|
// Appeler le callback onSave et attendre sa résolution
|
|
await widget.onSave(
|
|
_nameController.text.trim(),
|
|
_colorToHex(_selectedColor),
|
|
_selectedMemberIds,
|
|
);
|
|
|
|
// Si tout s'est bien passé, fermer le dialog
|
|
if (mounted) {
|
|
Navigator.of(context).pop();
|
|
}
|
|
} catch (e) {
|
|
// En cas d'erreur, réactiver le bouton
|
|
if (mounted) {
|
|
setState(() => _isLoading = false);
|
|
}
|
|
// L'erreur sera gérée par le callback onSave
|
|
rethrow;
|
|
}
|
|
}
|
|
}
|
|
|
|
void _showColorPicker() {
|
|
// Grille 6x6 de couleurs suivant le spectre
|
|
// 6 colonnes: Rouge, Orange, Jaune, Vert, Bleu, Violet
|
|
// 6 lignes: variations de luminosité/saturation
|
|
final List<Color> colors = _generateSpectralColorGrid();
|
|
|
|
showDialog(
|
|
context: context,
|
|
builder: (context) => AlertDialog(
|
|
title: const Text('Choisir une couleur'),
|
|
contentPadding: const EdgeInsets.fromLTRB(20, 12, 20, 20),
|
|
content: Container(
|
|
width: 280, // Largeur fixe pour contrôler la taille
|
|
child: Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
const SizedBox(height: 8),
|
|
Container(
|
|
padding: const EdgeInsets.all(8),
|
|
decoration: BoxDecoration(
|
|
border: Border.all(color: Colors.grey.shade300),
|
|
borderRadius: BorderRadius.circular(8),
|
|
color: Colors.grey.shade50,
|
|
),
|
|
child: GridView.builder(
|
|
shrinkWrap: true,
|
|
physics: const NeverScrollableScrollPhysics(),
|
|
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
|
crossAxisCount: 6,
|
|
mainAxisSpacing: 4,
|
|
crossAxisSpacing: 4,
|
|
childAspectRatio: 1.0,
|
|
),
|
|
itemCount: colors.length,
|
|
itemBuilder: (context, index) {
|
|
final color = colors[index];
|
|
final isSelected = _selectedColor.value == color.value;
|
|
|
|
return InkWell(
|
|
onTap: () {
|
|
setState(() {
|
|
_selectedColor = color;
|
|
});
|
|
Navigator.of(context).pop();
|
|
},
|
|
child: Container(
|
|
width: 35,
|
|
height: 35,
|
|
decoration: BoxDecoration(
|
|
color: color,
|
|
borderRadius: BorderRadius.circular(4),
|
|
border: Border.all(
|
|
color: isSelected ? Colors.black87 : Colors.grey.shade400,
|
|
width: isSelected ? 2.5 : 0.5,
|
|
),
|
|
boxShadow: isSelected
|
|
? [
|
|
BoxShadow(
|
|
color: Colors.black.withOpacity(0.3),
|
|
blurRadius: 4,
|
|
offset: const Offset(0, 2),
|
|
),
|
|
]
|
|
: null,
|
|
),
|
|
child: isSelected
|
|
? const Icon(
|
|
Icons.check,
|
|
color: Colors.white,
|
|
size: 18,
|
|
shadows: [
|
|
Shadow(
|
|
color: Colors.black,
|
|
blurRadius: 2,
|
|
),
|
|
],
|
|
)
|
|
: null,
|
|
),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
const SizedBox(height: 12),
|
|
// Affichage de la couleur sélectionnée
|
|
Container(
|
|
height: 40,
|
|
decoration: BoxDecoration(
|
|
color: _selectedColor,
|
|
borderRadius: BorderRadius.circular(6),
|
|
border: Border.all(color: Colors.grey.shade400),
|
|
),
|
|
child: Center(
|
|
child: Text(
|
|
'Couleur sélectionnée',
|
|
style: TextStyle(
|
|
color: _selectedColor.computeLuminance() > 0.5
|
|
? Colors.black87
|
|
: Colors.white,
|
|
fontWeight: FontWeight.w500,
|
|
fontSize: 13,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
actions: [
|
|
TextButton(
|
|
onPressed: () => Navigator.of(context).pop(),
|
|
child: const Text('Annuler'),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
// Mettre en surbrillance les termes recherchés dans le texte
|
|
List<TextSpan> _highlightSearchTerms(String text) {
|
|
if (_searchQuery.isEmpty) {
|
|
return [TextSpan(text: text)];
|
|
}
|
|
|
|
final List<TextSpan> spans = [];
|
|
final lowerText = text.toLowerCase();
|
|
int start = 0;
|
|
int index = lowerText.indexOf(_searchQuery, start);
|
|
|
|
while (index != -1) {
|
|
// Ajouter le texte avant le terme trouvé
|
|
if (index > start) {
|
|
spans.add(TextSpan(
|
|
text: text.substring(start, index),
|
|
));
|
|
}
|
|
|
|
// Ajouter le terme trouvé en surbrillance
|
|
spans.add(TextSpan(
|
|
text: text.substring(index, index + _searchQuery.length),
|
|
style: const TextStyle(
|
|
backgroundColor: Colors.yellow,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
));
|
|
|
|
start = index + _searchQuery.length;
|
|
index = lowerText.indexOf(_searchQuery, start);
|
|
}
|
|
|
|
// Ajouter le reste du texte
|
|
if (start < text.length) {
|
|
spans.add(TextSpan(
|
|
text: text.substring(start),
|
|
));
|
|
}
|
|
|
|
return spans;
|
|
}
|
|
|
|
// Générer une grille 6x6 de couleurs spectrales
|
|
List<Color> _generateSpectralColorGrid() {
|
|
final List<Color> colors = [];
|
|
|
|
// 6 teintes de base (colonnes)
|
|
final List<double> hues = [
|
|
0, // Rouge
|
|
30, // Orange
|
|
60, // Jaune
|
|
120, // Vert
|
|
210, // Bleu
|
|
270, // Violet
|
|
];
|
|
|
|
// 6 variations de luminosité/saturation (lignes)
|
|
// Du plus clair au plus foncé
|
|
final List<Map<String, double>> variations = [
|
|
{'saturation': 0.3, 'lightness': 0.85}, // Très clair
|
|
{'saturation': 0.5, 'lightness': 0.70}, // Clair
|
|
{'saturation': 0.7, 'lightness': 0.55}, // Moyen clair
|
|
{'saturation': 0.85, 'lightness': 0.45}, // Moyen foncé
|
|
{'saturation': 0.95, 'lightness': 0.35}, // Foncé
|
|
{'saturation': 1.0, 'lightness': 0.25}, // Très foncé
|
|
];
|
|
|
|
// Générer la grille ligne par ligne
|
|
for (final variation in variations) {
|
|
for (final hue in hues) {
|
|
colors.add(
|
|
HSLColor.fromAHSL(
|
|
1.0,
|
|
hue,
|
|
variation['saturation']!,
|
|
variation['lightness']!,
|
|
).toColor(),
|
|
);
|
|
}
|
|
}
|
|
|
|
return colors;
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final currentAmicale = CurrentAmicaleService.instance.currentAmicale;
|
|
final screenHeight = MediaQuery.of(context).size.height;
|
|
final dialogHeight = (screenHeight * 0.8).clamp(0.0, 800.0); // 80% de l'écran avec max 800px
|
|
|
|
return AlertDialog(
|
|
title: Text(widget.existingSector == null ? 'Nouveau secteur' : 'Modifier le secteur'),
|
|
content: Container(
|
|
width: 450, // Largeur fixe pour la dialog
|
|
height: dialogHeight, // Hauteur avec maximum de 800px
|
|
child: Form(
|
|
key: _formKey,
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
// Section scrollable pour nom et couleur
|
|
// Nom du secteur
|
|
TextFormField(
|
|
controller: _nameController,
|
|
focusNode: _nameFocusNode,
|
|
decoration: InputDecoration(
|
|
labelText: 'Nom du secteur',
|
|
labelStyle: TextStyle(color: Colors.black),
|
|
label: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Text('Nom du secteur'),
|
|
Text(
|
|
' *',
|
|
style: TextStyle(color: Colors.red),
|
|
),
|
|
],
|
|
),
|
|
hintText: 'Ex: Centre-ville',
|
|
prefixIcon: Icon(Icons.location_on),
|
|
),
|
|
validator: (value) {
|
|
if (value == null || value.trim().isEmpty) {
|
|
return 'Veuillez entrer un nom';
|
|
}
|
|
return null;
|
|
},
|
|
),
|
|
const SizedBox(height: 20),
|
|
|
|
// Couleur du secteur
|
|
const Text(
|
|
'Couleur du secteur',
|
|
style: TextStyle(fontWeight: FontWeight.bold),
|
|
),
|
|
const SizedBox(height: 10),
|
|
InkWell(
|
|
onTap: () {
|
|
_showColorPicker();
|
|
},
|
|
child: Container(
|
|
height: 50,
|
|
decoration: BoxDecoration(
|
|
color: _selectedColor,
|
|
borderRadius: BorderRadius.circular(8),
|
|
border: Border.all(color: Colors.grey),
|
|
),
|
|
child: Center(
|
|
child: Text(
|
|
'Toucher pour changer',
|
|
style: TextStyle(
|
|
color: _selectedColor.computeLuminance() > 0.5
|
|
? Colors.black
|
|
: Colors.white,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(height: 20),
|
|
|
|
// Sélection des membres
|
|
Row(
|
|
children: [
|
|
const Text(
|
|
'Membres affectés',
|
|
style: TextStyle(fontWeight: FontWeight.bold),
|
|
),
|
|
const SizedBox(width: 4),
|
|
Text(
|
|
'*',
|
|
style: TextStyle(
|
|
color: Colors.red,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
const SizedBox(height: 10),
|
|
|
|
// Champ de recherche pour filtrer les membres
|
|
TextField(
|
|
controller: _searchController,
|
|
decoration: InputDecoration(
|
|
hintText: 'Rechercher par prénom, nom ou nom de tournée...',
|
|
prefixIcon: const Icon(Icons.search),
|
|
suffixIcon: _searchQuery.isNotEmpty
|
|
? IconButton(
|
|
icon: const Icon(Icons.clear),
|
|
onPressed: () {
|
|
setState(() {
|
|
_searchController.clear();
|
|
_searchQuery = '';
|
|
});
|
|
},
|
|
)
|
|
: null,
|
|
border: OutlineInputBorder(
|
|
borderRadius: BorderRadius.circular(8),
|
|
),
|
|
contentPadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
|
|
),
|
|
onChanged: (value) {
|
|
setState(() {
|
|
_searchQuery = value.toLowerCase();
|
|
});
|
|
},
|
|
),
|
|
const SizedBox(height: 10),
|
|
|
|
if (_selectedMemberIds.isEmpty)
|
|
Padding(
|
|
padding: const EdgeInsets.only(bottom: 8.0),
|
|
child: Text(
|
|
'Sélectionnez au moins un membre',
|
|
style: TextStyle(
|
|
fontSize: 12,
|
|
color: Colors.grey[600],
|
|
fontStyle: FontStyle.italic,
|
|
),
|
|
),
|
|
),
|
|
|
|
// Liste des membres avec scrolling et filtre
|
|
if (currentAmicale != null)
|
|
Expanded(
|
|
child: ValueListenableBuilder<Box<MembreModel>>(
|
|
valueListenable: Hive.box<MembreModel>(AppKeys.membresBoxName).listenable(),
|
|
builder: (context, box, _) {
|
|
debugPrint('=== Build liste membres - IDs présélectionnés: $_selectedMemberIds ===');
|
|
|
|
// Filtrer les membres de l'amicale
|
|
var membres = box.values
|
|
.where((m) => m.fkEntite == currentAmicale.id)
|
|
.toList();
|
|
|
|
// Appliquer le filtre de recherche
|
|
if (_searchQuery.isNotEmpty) {
|
|
membres = membres.where((membre) {
|
|
final firstName = membre.firstName?.toLowerCase() ?? '';
|
|
final lastName = membre.name?.toLowerCase() ?? '';
|
|
final sectName = membre.sectName?.toLowerCase() ?? '';
|
|
|
|
return firstName.contains(_searchQuery) ||
|
|
lastName.contains(_searchQuery) ||
|
|
sectName.contains(_searchQuery);
|
|
}).toList();
|
|
}
|
|
|
|
if (membres.isEmpty) {
|
|
return Center(
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(20.0),
|
|
child: Text(
|
|
_searchQuery.isNotEmpty
|
|
? 'Aucun membre trouvé pour "$_searchQuery"'
|
|
: 'Aucun membre disponible',
|
|
style: TextStyle(
|
|
color: Colors.grey[600],
|
|
fontSize: 14,
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
// Afficher le nombre de résultats
|
|
return Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Padding(
|
|
padding: const EdgeInsets.symmetric(vertical: 4.0),
|
|
child: Text(
|
|
'${membres.length} membre${membres.length > 1 ? 's' : ''} ${_searchQuery.isNotEmpty ? 'trouvé${membres.length > 1 ? 's' : ''}' : 'disponible${membres.length > 1 ? 's' : ''}'}',
|
|
style: TextStyle(
|
|
fontSize: 12,
|
|
color: Colors.grey[700],
|
|
),
|
|
),
|
|
),
|
|
Expanded(
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
border: Border.all(color: Colors.grey),
|
|
borderRadius: BorderRadius.circular(8),
|
|
),
|
|
child: ListView.builder(
|
|
itemCount: membres.length,
|
|
itemBuilder: (context, index) {
|
|
final membre = membres[index];
|
|
final isSelected = _selectedMemberIds.contains(membre.id);
|
|
|
|
// Log pour debug
|
|
if (index < 3) { // Limiter les logs aux 3 premiers membres
|
|
debugPrint('Membre ${index}: ${membre.firstName} ${membre.name} (ID: ${membre.id}) - isSelected: $isSelected');
|
|
}
|
|
|
|
return CheckboxListTile(
|
|
dense: true,
|
|
contentPadding: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 0.0),
|
|
title: RichText(
|
|
text: TextSpan(
|
|
style: const TextStyle(fontSize: 14, color: Colors.black87),
|
|
children: _highlightSearchTerms(
|
|
'${membre.firstName} ${membre.name}${membre.sectName != null && membre.sectName!.isNotEmpty ? ' (${membre.sectName})' : ''}',
|
|
),
|
|
),
|
|
),
|
|
value: isSelected,
|
|
onChanged: (bool? value) {
|
|
setState(() {
|
|
if (value == true) {
|
|
_selectedMemberIds.add(membre.id);
|
|
} else {
|
|
_selectedMemberIds.remove(membre.id);
|
|
}
|
|
});
|
|
},
|
|
);
|
|
},
|
|
),
|
|
),
|
|
),
|
|
],
|
|
);
|
|
},
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
actions: [
|
|
TextButton(
|
|
onPressed: _isLoading ? null : () => Navigator.of(context).pop(),
|
|
child: const Text('Annuler'),
|
|
),
|
|
ElevatedButton(
|
|
onPressed: _isLoading ? null : _handleSave,
|
|
child: _isLoading
|
|
? const SizedBox(
|
|
width: 20,
|
|
height: 20,
|
|
child: CircularProgressIndicator(strokeWidth: 2),
|
|
)
|
|
: Text(widget.existingSector == null ? 'Créer' : 'Modifier'),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
} |