msaid-soighiri/EME_APP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(frontend): add return checklist screen with shared checklist widgets

Browse Source
This commit is contained in:
SaidSoighiri94
2026-07-07 09:45:15 +02:00
parent 648ea21155
commit e9d67e78f5
5 changed files with 414 additions and 177 deletions
Download Patch File Download Diff File Expand all files Collapse all files
eme-frontend/lib/widgets/etat_checklist.dart
+220
View File
@@ -0,0 +1,220 @@
import "package:flutter/material.dart";
import "package:google_fonts/google_fonts.dart";
import "../theme/ensup_colors.dart";
/// État possible d'un élément de checklist (départ ou retour).
enum EtatChecklist { present, absent, deteriore }
/// Case cliquable colorée selon l'état sélectionné (vert / rouge / jaune).
class EtatBox extends StatelessWidget {
const EtatBox({
super.key,
required this.type,
required this.selected,
required this.onTap,
});
final EtatChecklist type;
final bool selected;
final VoidCallback onTap;
@override
Widget build(BuildContext context) {
var background = Colors.white;
var border = EnsupColors.line;
Widget? contenu;
if (selected) {
switch (type) {
case EtatChecklist.present:
background = const Color(0xFFF0FDF4);
border = const Color(0xFF86EFAC);
contenu = const Icon(Icons.check, size: 16, color: Color(0xFF16A34A));
case EtatChecklist.absent:
background = const Color(0xFFFEF2F2);
border = const Color(0xFFFCA5A5);
contenu = const Icon(Icons.close, size: 16, color: EnsupColors.red);
case EtatChecklist.deteriore:
background = const Color(0xFFFFFBEB);
border = const Color(0xFFFDE68A);
contenu = const Icon(Icons.priority_high, size: 16, color: Color(0xFFD97706));
}
}
return InkWell(
onTap: onTap,
borderRadius: BorderRadius.circular(8),
child: Container(
width: 36,
height: 36,
decoration: BoxDecoration(
color: background,
borderRadius: BorderRadius.circular(8),
border: Border.all(color: border, width: 2),
),
child: contenu,
),
);
}
}
/// Tableau de checklist : une ligne par accessoire avec les 3 états possibles.
class ChecklistTableau extends StatelessWidget {
const ChecklistTableau({
super.key,
required this.accessoires,
required this.etats,
required this.onChanged,
});
final List<String> accessoires;
final List<EtatChecklist> etats;
final void Function(int index, EtatChecklist etat) onChanged;
@override
Widget build(BuildContext context) {
return Column(
children: [
_entete(),
for (var i = 0; i < accessoires.length; i++) _ligne(i),
],
);
}
Widget _entete() {
return Container(
padding: const EdgeInsets.symmetric(vertical: 10),
decoration: const BoxDecoration(
border: Border(bottom: BorderSide(color: EnsupColors.line, width: 2)),
),
child: Row(
children: [
Expanded(child: _texteEntete("ÉLÉMENT")),
_colonneEntete("PRÉSENT"),
_colonneEntete("ABSENT"),
_colonneEntete("DÉTÉRIORÉ"),
],
),
);
}
Widget _texteEntete(String label) {
return Text(
label,
style: GoogleFonts.darkerGrotesque(
fontSize: 12,
fontWeight: FontWeight.w700,
color: EnsupColors.muted,
letterSpacing: 0.6,
),
);
}
Widget _colonneEntete(String label) {
return SizedBox(width: 72, child: Center(child: _texteEntete(label)));
}
Widget _ligne(int index) {
return Container(
padding: const EdgeInsets.symmetric(vertical: 10),
decoration: const BoxDecoration(
border: Border(bottom: BorderSide(color: EnsupColors.line)),
),
child: Row(
children: [
Expanded(
child: Text(
accessoires[index],
style: GoogleFonts.titilliumWeb(fontSize: 14, color: EnsupColors.text2),
),
),
_case(index, EtatChecklist.present),
_case(index, EtatChecklist.absent),
_case(index, EtatChecklist.deteriore),
],
),
);
}
Widget _case(int index, EtatChecklist type) {
return SizedBox(
width: 72,
child: Center(
child: EtatBox(
type: type,
selected: etats[index] == type,
onTap: () => onChanged(index, type),
),
),
);
}
}
/// Encadré d'instructions / rappel à côté d'une checklist.
class ChecklistInstructions extends StatelessWidget {
const ChecklistInstructions({super.key, required this.titre, required this.texte});
final String titre;
final String texte;
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: EnsupColors.blue2.withValues(alpha: 0.05),
borderRadius: BorderRadius.circular(10),
border: Border.all(color: EnsupColors.blue2.withValues(alpha: 0.15), width: 1.5),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
titre.toUpperCase(),
style: GoogleFonts.darkerGrotesque(
fontSize: 12,
fontWeight: FontWeight.w700,
color: EnsupColors.muted,
letterSpacing: 0.6,
),
),
const SizedBox(height: 8),
Text(
texte,
style: GoogleFonts.titilliumWeb(fontSize: 13, color: EnsupColors.text2, height: 1.6),
),
],
),
);
}
}
/// Zone de commentaire optionnel sous une checklist.
class ChecklistCommentaire extends StatelessWidget {
const ChecklistCommentaire({super.key, this.hint = "Commentaire ou observation optionnelle..."});
final String hint;
@override
Widget build(BuildContext context) {
return TextField(
maxLines: 4,
style: GoogleFonts.titilliumWeb(fontSize: 13, color: EnsupColors.text),
decoration: InputDecoration(
hintText: hint,
hintStyle: GoogleFonts.titilliumWeb(fontSize: 13, color: EnsupColors.muted),
filled: true,
fillColor: Colors.white,
contentPadding: const EdgeInsets.symmetric(horizontal: 14, vertical: 12),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(9),
borderSide: const BorderSide(color: EnsupColors.line, width: 1.5),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(9),
borderSide: const BorderSide(color: EnsupColors.cyan, width: 1.5),
),
),
);
}
}