ElPoyo/EM2_ERP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Enhance container management UI with new management components and improved QR code generation flow

Browse Source
This commit is contained in:
ElPoyo
2025-10-30 20:06:13 +01:00
parent 6abb8f1d14
commit e59e3e6316
11 changed files with 815 additions and 485 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
em2rp/lib/views/widgets/common/qr_code_dialog.dart
View File

@@ -1,4 +1,5 @@
import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';
import 'package:qr_flutter/qr_flutter.dart';
import 'package:em2rp/utils/colors.dart';
import 'package:em2rp/services/qr_code_service.dart';
@@ -122,14 +123,42 @@ class QRCodeDialog<T> extends StatelessWidget {
}
Future<void> _downloadQRCode(BuildContext context, String id) async {
// Afficher le dialog de chargement
showDialog(
context: context,
barrierDismissible: false,
builder: (context) => Dialog(
child: Container(
padding: const EdgeInsets.all(24),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(AppColors.rouge),
),
const SizedBox(height: 16),
const Text(
'Génération du QR Code...',
style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
),
],
),
),
),
);
try {
// Générer l'image QR code en haute résolution
final qrImage = await QRCodeService.generateQRCode(
// Exécuter la génération dans un isolate séparé
final qrImage = await compute(
_generateQRCodeIsolate,
id,
size: 1024,
useCache: false,
);
// Fermer le dialog de chargement
if (context.mounted) {
Navigator.pop(context);
}
// Utiliser la bibliothèque printing pour sauvegarder l'image
await Printing.sharePdf(
bytes: qrImage,
@@ -145,6 +174,11 @@ class QRCodeDialog<T> extends StatelessWidget {
);
}
} catch (e) {
// Fermer le dialog de chargement en cas d'erreur
if (context.mounted) {
Navigator.pop(context);
}
if (context.mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
@@ -156,6 +190,15 @@ class QRCodeDialog<T> extends StatelessWidget {
}
}
/// Fonction statique pour exécuter la génération QR code dans un isolate
static Future<Uint8List> _generateQRCodeIsolate(String id) async {
return await QRCodeService.generateQRCode(
id,
size: 1024,
useCache: false,
);
}
/// Factory pour équipement
static QRCodeDialog forEquipment(dynamic equipment) {
return QRCodeDialog(

126
em2rp/lib/views/widgets/common/qr_code_format_selector_dialog.dart
View File

@@ -1,16 +1,24 @@
import 'package:flutter/material.dart';
import 'package:em2rp/utils/colors.dart';
import 'package:em2rp/models/equipment_model.dart';
import 'package:em2rp/services/pdf_service.dart';
import 'package:printing/printing.dart';
/// Widget réutilisable pour sélectionner le format de génération de QR codes multiples
class QRCodeFormatSelectorDialog extends StatelessWidget {
final List<EquipmentModel> equipmentList;
/// Compatible avec n'importe quel type d'objet (équipements, conteneurs, etc.)
class QRCodeFormatSelectorDialog<T> extends StatelessWidget {
final List<T> itemList;
final String Function(T) getId;
final String Function(T) getTitle;
final List<String> Function(T)? getDetails;
final String dialogTitle;
const QRCodeFormatSelectorDialog({
super.key,
required this.equipmentList,
required this.itemList,
required this.getId,
required this.getTitle,
this.getDetails,
required this.dialogTitle,
});
@override
@@ -29,7 +37,7 @@ class QRCodeFormatSelectorDialog extends StatelessWidget {
const SizedBox(width: 12),
Expanded(
child: Text(
'Générer ${equipmentList.length} QR Codes',
dialogTitle,
style: const TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
@@ -49,7 +57,7 @@ class QRCodeFormatSelectorDialog extends StatelessWidget {
),
const SizedBox(height: 16),
// Liste des équipements
// Liste des items
Expanded(
child: Container(
decoration: BoxDecoration(
@@ -58,19 +66,19 @@ class QRCodeFormatSelectorDialog extends StatelessWidget {
),
child: ListView.separated(
shrinkWrap: true,
itemCount: equipmentList.length,
itemCount: itemList.length,
separatorBuilder: (context, index) => const Divider(height: 1),
itemBuilder: (context, index) {
final equipment = equipmentList[index];
final item = itemList[index];
return ListTile(
dense: true,
leading: const Icon(Icons.qr_code, size: 20),
title: Text(
equipment.id,
getId(item),
style: const TextStyle(fontWeight: FontWeight.bold),
),
subtitle: Text(
'${equipment.brand ?? ''} ${equipment.model ?? ''}'.trim(),
getTitle(item),
style: const TextStyle(fontSize: 12),
),
);
@@ -85,30 +93,21 @@ class QRCodeFormatSelectorDialog extends StatelessWidget {
icon: Icons.qr_code,
title: 'Petits QR Codes',
subtitle: 'QR codes compacts (2x2 cm)',
onPressed: () {
Navigator.pop(context);
_generatePDF(context, equipmentList, QRLabelFormat.small);
},
onPressed: () => _generatePDF(context, itemList, QRLabelFormat.small),
),
const SizedBox(height: 12),
_FormatButton(
icon: Icons.qr_code_2,
title: 'QR Moyens',
subtitle: 'QR codes taille moyenne (4x4 cm)',
onPressed: () {
Navigator.pop(context);
_generatePDF(context, equipmentList, QRLabelFormat.medium);
},
onPressed: () => _generatePDF(context, itemList, QRLabelFormat.medium),
),
const SizedBox(height: 12),
_FormatButton(
icon: Icons.label,
title: 'Grandes étiquettes',
subtitle: 'QR + ID + Marque/Modèle (10x5 cm)',
onPressed: () {
Navigator.pop(context);
_generatePDF(context, equipmentList, QRLabelFormat.large);
},
subtitle: 'QR + ID + Détails (10x5 cm)',
onPressed: () => _generatePDF(context, itemList, QRLabelFormat.large),
),
],
),
@@ -118,14 +117,24 @@ class QRCodeFormatSelectorDialog extends StatelessWidget {
Future<void> _generatePDF(
BuildContext context,
List<EquipmentModel> equipmentList,
List<T> items,
QRLabelFormat format,
) async {
// Capturer le navigator AVANT de fermer le premier dialog
final navigator = Navigator.of(context);
final scaffoldMessenger = ScaffoldMessenger.of(context);
// Fermer le dialog de sélection
navigator.pop();
// Attendre un court instant pour que le dialog se ferme complètement
await Future.delayed(const Duration(milliseconds: 100));
// Afficher le dialogue de chargement
showDialog(
context: context,
barrierDismissible: false,
builder: (context) => Dialog(
builder: (dialogContext) => Dialog(
child: Padding(
padding: const EdgeInsets.all(24),
child: Column(
@@ -144,7 +153,7 @@ class QRCodeFormatSelectorDialog extends StatelessWidget {
),
const SizedBox(height: 8),
Text(
'Génération de ${equipmentList.length} QR code(s)',
'Génération de ${items.length} QR code(s)',
style: TextStyle(
fontSize: 14,
color: Colors.grey[600],
@@ -157,31 +166,23 @@ class QRCodeFormatSelectorDialog extends StatelessWidget {
);
try {
// Génération du PDF avec progression
final pdfBytes = await PDFService.generatePDF<EquipmentModel>(
items: equipmentList,
// Attendre que le dialog de chargement s'affiche complètement
await Future.delayed(const Duration(milliseconds: 300));
// Génération du PDF
final pdfBytes = await PDFService.generatePDF<T>(
items: items,
format: format,
getId: (eq) => eq.id,
getTitle: (eq) => '${eq.brand ?? ''} ${eq.model ?? ''}'.trim(),
getDetails: format == QRLabelFormat.large ? (EquipmentModel eq) {
final details = <String>[];
final brand = eq.brand;
if (brand != null && brand.isNotEmpty) {
details.add('Marque: $brand');
}
final model = eq.model;
if (model != null && model.isNotEmpty) {
details.add('Modèle: $model');
}
details.add('Catégorie: ${eq.category.label}');
return details;
} : null,
getId: getId,
getTitle: getTitle,
getDetails: getDetails,
);
// Fermer le dialogue de chargement
if (context.mounted) {
Navigator.pop(context);
}
// Fermer le dialogue de chargement avec le navigator capturé
navigator.pop();
// Petite pause pour s'assurer que le dialog est bien fermé
await Future.delayed(const Duration(milliseconds: 100));
// Afficher le PDF
await Printing.layoutPdf(
@@ -189,25 +190,22 @@ class QRCodeFormatSelectorDialog extends StatelessWidget {
name: 'QRCodes_${DateTime.now().millisecondsSinceEpoch}.pdf',
);
if (context.mounted) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('PDF généré avec succès'),
backgroundColor: Colors.green,
),
);
}
scaffoldMessenger.showSnackBar(
const SnackBar(
content: Text('PDF généré avec succès'),
backgroundColor: Colors.green,
),
);
} catch (e) {
// Fermer le dialogue de chargement en cas d'erreur
if (context.mounted) {
Navigator.pop(context);
}
navigator.pop();
if (context.mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Erreur lors de la génération du PDF: $e')),
);
}
scaffoldMessenger.showSnackBar(
SnackBar(
content: Text('Erreur lors de la génération du PDF: $e'),
backgroundColor: Colors.red,
),
);
}
}
}

231
em2rp/lib/views/widgets/management/management_card.dart Normal file
View File

@@ -0,0 +1,231 @@
import 'package:flutter/material.dart';
import 'package:em2rp/utils/colors.dart';
/// Action du menu contextuel
class CardAction {
final String id;
final String label;
final IconData icon;
final Color? color;
const CardAction({
required this.id,
required this.label,
required this.icon,
this.color,
});
}
/// Widget de card générique pour les pages de gestion
class ManagementCard<T> extends StatelessWidget {
final T item;
final String Function(T) getId;
final String Function(T) getTitle;
final String Function(T) getSubtitle;
final Widget Function(T) getIcon;
final List<Widget> Function(T) getInfoChips;
final Widget Function(T) getStatusBadge;
final List<CardAction> actions;
final void Function(String actionId, T item) onActionSelected;
final VoidCallback onTap;
final VoidCallback? onLongPress;
final bool isSelectionMode;
final bool isSelected;
final ValueChanged<bool?>? onSelectionChanged;
const ManagementCard({
super.key,
required this.item,
required this.getId,
required this.getTitle,
required this.getSubtitle,
required this.getIcon,
required this.getInfoChips,
required this.getStatusBadge,
required this.actions,
required this.onActionSelected,
required this.onTap,
this.onLongPress,
this.isSelectionMode = false,
this.isSelected = false,
this.onSelectionChanged,
});
@override
Widget build(BuildContext context) {
return Card(
margin: const EdgeInsets.only(bottom: 12),
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
side: isSelected
? const BorderSide(color: AppColors.rouge, width: 2)
: BorderSide.none,
),
child: InkWell(
onTap: onTap,
onLongPress: onLongPress,
borderRadius: BorderRadius.circular(8),
child: Padding(
padding: const EdgeInsets.all(16),
child: Row(
children: [
// Checkbox en mode sélection
if (isSelectionMode)
Padding(
padding: const EdgeInsets.only(right: 16),
child: Checkbox(
value: isSelected,
onChanged: onSelectionChanged,
activeColor: AppColors.rouge,
),
),
// Icône principale
getIcon(item),
const SizedBox(width: 16),
// Contenu principal
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Titre (ID)
Text(
getTitle(item),
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 16,
),
),
const SizedBox(height: 4),
// Sous-titre
Text(
getSubtitle(item),
style: TextStyle(
fontSize: 14,
color: Colors.grey.shade700,
),
),
const SizedBox(height: 4),
// Chips d'information
Wrap(
spacing: 8,
runSpacing: 4,
children: getInfoChips(item),
),
],
),
),
const SizedBox(width: 16),
// Badge de statut
getStatusBadge(item),
// Menu contextuel (si pas en mode sélection)
if (!isSelectionMode) ...[
const SizedBox(width: 8),
PopupMenuButton<String>(
icon: const Icon(Icons.more_vert),
onSelected: (actionId) => onActionSelected(actionId, item),
itemBuilder: (context) => actions.map((action) {
return PopupMenuItem(
value: action.id,
child: Row(
children: [
Icon(
action.icon,
size: 20,
color: action.color,
),
const SizedBox(width: 8),
Text(
action.label,
style: TextStyle(color: action.color),
),
],
),
);
}).toList(),
),
],
],
),
),
),
);
}
}
/// Widget helper pour créer un chip d'information
class InfoChip extends StatelessWidget {
final String label;
final IconData icon;
const InfoChip({
super.key,
required this.label,
required this.icon,
});
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: Colors.grey.shade100,
borderRadius: BorderRadius.circular(12),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(icon, size: 14, color: Colors.grey.shade700),
const SizedBox(width: 4),
Text(
label,
style: TextStyle(
fontSize: 12,
color: Colors.grey.shade700,
),
),
],
),
);
}
}
/// Widget helper pour créer un badge de statut
class StatusBadge extends StatelessWidget {
final String label;
final Color color;
const StatusBadge({
super.key,
required this.label,
required this.color,
});
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
color: color.withOpacity(0.1),
borderRadius: BorderRadius.circular(16),
border: Border.all(color: color),
),
child: Text(
label,
style: TextStyle(
color: color,
fontWeight: FontWeight.bold,
fontSize: 12,
),
),
);
}
}

38
em2rp/lib/views/widgets/management/management_empty_state.dart Normal file
View File

@@ -0,0 +1,38 @@
import 'package:flutter/material.dart';
/// Widget réutilisable pour afficher un état vide dans les listes de gestion
class ManagementEmptyState extends StatelessWidget {
final IconData icon;
final String message;
const ManagementEmptyState({
super.key,
required this.icon,
required this.message,
});
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
icon,
size: 80,
color: Colors.grey.shade400,
),
const SizedBox(height: 16),
Text(
message,
style: TextStyle(
fontSize: 18,
color: Colors.grey.shade600,
),
),
],
),
);
}
}

89
em2rp/lib/views/widgets/management/management_filter_bar.dart Normal file
View File

@@ -0,0 +1,89 @@
import 'package:flutter/material.dart';
import 'package:em2rp/utils/colors.dart';
/// Widget réutilisable pour afficher un chip de filtre
class FilterChip extends StatelessWidget {
final String label;
final bool isSelected;
final VoidCallback onTap;
const FilterChip({
super.key,
required this.label,
required this.isSelected,
required this.onTap,
});
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: onTap,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
decoration: BoxDecoration(
color: isSelected ? AppColors.rouge : Colors.white,
borderRadius: BorderRadius.circular(20),
border: Border.all(
color: isSelected ? AppColors.rouge : Colors.grey.shade300,
width: isSelected ? 2 : 1,
),
),
child: Text(
label,
style: TextStyle(
color: isSelected ? Colors.white : AppColors.noir,
fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
),
),
),
);
}
}
/// Widget réutilisable pour une barre de filtres horizontale
class ManagementFilterBar extends StatelessWidget {
final List<FilterChipData> filters;
const ManagementFilterBar({
super.key,
required this.filters,
});
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.symmetric(vertical: 8),
color: Colors.grey.shade50,
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Row(
children: filters.map((filter) {
return Padding(
padding: const EdgeInsets.only(right: 8),
child: FilterChip(
label: filter.label,
isSelected: filter.isSelected,
onTap: filter.onTap,
),
);
}).toList(),
),
),
);
}
}
/// Données pour un chip de filtre
class FilterChipData {
final String label;
final bool isSelected;
final VoidCallback onTap;
const FilterChipData({
required this.label,
required this.isSelected,
required this.onTap,
});
}

66
em2rp/lib/views/widgets/management/management_list.dart Normal file
View File

@@ -0,0 +1,66 @@
import 'package:flutter/material.dart';
import 'package:em2rp/views/widgets/management/management_empty_state.dart';
/// Widget de liste générique pour les pages de gestion
class ManagementList<T> extends StatelessWidget {
final Stream<List<T>> stream;
final List<T>? cachedItems;
final Widget Function(T item) itemBuilder;
final String emptyMessage;
final IconData emptyIcon;
final void Function(List<T>? items)? onDataReceived;
const ManagementList({
super.key,
required this.stream,
this.cachedItems,
required this.itemBuilder,
required this.emptyMessage,
this.emptyIcon = Icons.inventory_2_outlined,
this.onDataReceived,
});
@override
Widget build(BuildContext context) {
return StreamBuilder<List<T>>(
stream: stream,
builder: (context, snapshot) {
// Notifier si des données sont reçues
if (snapshot.hasData && onDataReceived != null) {
WidgetsBinding.instance.addPostFrameCallback((_) {
onDataReceived!(snapshot.data);
});
}
// Afficher le loader seulement au premier chargement
if (snapshot.connectionState == ConnectionState.waiting && cachedItems == null) {
return const Center(child: CircularProgressIndicator());
}
if (snapshot.hasError) {
return Center(
child: Text('Erreur: ${snapshot.error}'),
);
}
final items = cachedItems ?? snapshot.data ?? [];
if (items.isEmpty) {
return ManagementEmptyState(
icon: emptyIcon,
message: emptyMessage,
);
}
return ListView.builder(
padding: const EdgeInsets.all(16),
itemCount: items.length,
itemBuilder: (context, index) {
return itemBuilder(items[index]);
},
);
},
);
}
}

69
em2rp/lib/views/widgets/management/management_search_bar.dart Normal file
View File

@@ -0,0 +1,69 @@
import 'package:flutter/material.dart';
import 'package:em2rp/utils/colors.dart';
/// Widget réutilisable pour la barre de recherche dans les pages de gestion
class ManagementSearchBar extends StatelessWidget {
final TextEditingController controller;
final String hintText;
final ValueChanged<String> onChanged;
final VoidCallback? onSelectionModeToggle;
final bool showSelectionModeButton;
const ManagementSearchBar({
super.key,
required this.controller,
required this.hintText,
required this.onChanged,
this.onSelectionModeToggle,
this.showSelectionModeButton = true,
});
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.1),
spreadRadius: 1,
blurRadius: 3,
offset: const Offset(0, 1),
),
],
),
child: Row(
children: [
Expanded(
child: TextField(
controller: controller,
decoration: InputDecoration(
hintText: hintText,
prefixIcon: const Icon(Icons.search, color: AppColors.rouge),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: BorderSide(color: Colors.grey.shade300),
),
contentPadding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 12,
),
),
onChanged: onChanged,
),
),
if (showSelectionModeButton && onSelectionModeToggle != null) ...[
const SizedBox(width: 12),
IconButton(
icon: const Icon(Icons.checklist, color: AppColors.rouge),
tooltip: 'Mode sélection',
onPressed: onSelectionModeToggle,
),
],
],
),
);
}
}