- Restore horizontal 2:1 layout for desktop readonly cards - Implement adaptive height for mobile readonly cards - Fix spacing and margins on mobile recap screens - Update field styles to use beige background - Adjust ChildCardWidget width for mobile editing - Fix compilation errors and duplicate methods Co-authored-by: Cursor <cursoragent@cursor.com>
250 lines
8.2 KiB
Dart
250 lines
8.2 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:google_fonts/google_fonts.dart';
|
|
import 'package:go_router/go_router.dart';
|
|
import 'dart:math' as math;
|
|
import '../models/card_assets.dart';
|
|
import 'image_button.dart';
|
|
|
|
/// Widget générique pour afficher un écran de récapitulatif
|
|
/// Utilisé pour le récapitulatif d'inscription Parents et AM
|
|
class SummaryScreen extends StatelessWidget {
|
|
final String stepText;
|
|
final String title;
|
|
final List<Widget> summaryCards;
|
|
final String previousRoute;
|
|
final VoidCallback onSubmit;
|
|
final String submitButtonText;
|
|
|
|
const SummaryScreen({
|
|
super.key,
|
|
required this.stepText,
|
|
required this.title,
|
|
required this.summaryCards,
|
|
required this.previousRoute,
|
|
required this.onSubmit,
|
|
this.submitButtonText = 'Soumettre ma demande',
|
|
});
|
|
|
|
void _showConfirmationModal(BuildContext context) {
|
|
showDialog(
|
|
context: context,
|
|
barrierDismissible: false,
|
|
builder: (BuildContext ctx) {
|
|
return AlertDialog(
|
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
|
|
backgroundColor: const Color(0xFFF4F1DE),
|
|
title: Text('Demande envoyée !', style: GoogleFonts.merienda(fontSize: 20, fontWeight: FontWeight.bold, color: const Color(0xFF2D6A4F)), textAlign: TextAlign.center),
|
|
content: Text('Votre demande a bien été enregistrée. Nous reviendrons vers vous prochainement.', style: GoogleFonts.merienda(fontSize: 16, color: Colors.black87), textAlign: TextAlign.center),
|
|
actions: [
|
|
Center(
|
|
child: ImageButton(
|
|
bg: 'assets/images/bg_green.png',
|
|
text: 'OK',
|
|
textColor: const Color(0xFF2D6A4F),
|
|
width: 150,
|
|
height: 40,
|
|
fontSize: 16,
|
|
onPressed: () {
|
|
Navigator.of(ctx).pop();
|
|
context.go('/');
|
|
},
|
|
),
|
|
),
|
|
],
|
|
);
|
|
},
|
|
);
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final screenSize = MediaQuery.of(context).size;
|
|
|
|
return Scaffold(
|
|
body: Stack(
|
|
children: [
|
|
Positioned.fill(
|
|
child: Image.asset('assets/images/paper2.png', fit: BoxFit.cover, repeat: ImageRepeat.repeatY),
|
|
),
|
|
Center(
|
|
child: SingleChildScrollView(
|
|
padding: const EdgeInsets.symmetric(vertical: 40.0),
|
|
child: Padding(
|
|
padding: EdgeInsets.symmetric(horizontal: screenSize.width / 4.0),
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
Text(stepText, style: GoogleFonts.merienda(fontSize: 16, color: Colors.black54)),
|
|
const SizedBox(height: 20),
|
|
Text(title, style: GoogleFonts.merienda(fontSize: 22, fontWeight: FontWeight.bold, color: Colors.black87), textAlign: TextAlign.center),
|
|
const SizedBox(height: 30),
|
|
|
|
// Cartes de récapitulatif passées en paramètre
|
|
...summaryCards.map((card) => Padding(
|
|
padding: const EdgeInsets.only(bottom: 20),
|
|
child: card,
|
|
)),
|
|
|
|
const SizedBox(height: 20),
|
|
|
|
ImageButton(
|
|
bg: 'assets/images/bg_green.png',
|
|
text: submitButtonText,
|
|
textColor: const Color(0xFF2D6A4F),
|
|
width: 350,
|
|
height: 50,
|
|
fontSize: 18,
|
|
onPressed: () {
|
|
onSubmit();
|
|
_showConfirmationModal(context);
|
|
},
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
// Chevron gauche (retour)
|
|
Positioned(
|
|
top: screenSize.height / 2 - 20,
|
|
left: 40,
|
|
child: IconButton(
|
|
icon: Transform(
|
|
alignment: Alignment.center,
|
|
transform: Matrix4.rotationY(math.pi),
|
|
child: Image.asset('assets/images/chevron_right.png', height: 40),
|
|
),
|
|
onPressed: () {
|
|
if (context.canPop()) {
|
|
context.pop();
|
|
} else {
|
|
context.go(previousRoute);
|
|
}
|
|
},
|
|
tooltip: 'Retour',
|
|
),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
/// Helper widget pour créer une carte de récapitulatif avec un titre et un contenu
|
|
class SummaryCard extends StatelessWidget {
|
|
final String title;
|
|
final String backgroundImagePath;
|
|
final List<Widget> content;
|
|
final VoidCallback? onEdit;
|
|
|
|
const SummaryCard({
|
|
super.key,
|
|
required this.title,
|
|
required this.backgroundImagePath,
|
|
required this.content,
|
|
this.onEdit,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return AspectRatio(
|
|
aspectRatio: 2.0,
|
|
child: Container(
|
|
padding: const EdgeInsets.symmetric(vertical: 20.0, horizontal: 25.0),
|
|
decoration: BoxDecoration(
|
|
image: DecorationImage(
|
|
image: AssetImage(backgroundImagePath),
|
|
fit: BoxFit.cover,
|
|
),
|
|
borderRadius: BorderRadius.circular(15),
|
|
),
|
|
child: Row(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
Align(
|
|
alignment: Alignment.center,
|
|
child: Text(
|
|
title,
|
|
style: GoogleFonts.merienda(
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.bold,
|
|
color: Colors.black87,
|
|
),
|
|
textAlign: TextAlign.center,
|
|
),
|
|
),
|
|
const SizedBox(height: 15),
|
|
Expanded(
|
|
child: SingleChildScrollView(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: content,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
if (onEdit != null) ...[
|
|
const SizedBox(width: 15),
|
|
Align(
|
|
alignment: Alignment.center,
|
|
child: IconButton(
|
|
icon: Image.asset('assets/images/input_field_bg.png', height: 35),
|
|
tooltip: 'Modifier',
|
|
onPressed: onEdit,
|
|
),
|
|
),
|
|
],
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
/// Fonction helper pour afficher un champ de type "lecture seule" stylisé
|
|
Widget buildDisplayFieldValue(
|
|
BuildContext context,
|
|
String label,
|
|
String value, {
|
|
bool multiLine = false,
|
|
double fieldHeight = 50.0,
|
|
double labelFontSize = 18.0,
|
|
}) {
|
|
const FontWeight labelFontWeight = FontWeight.w600;
|
|
|
|
return Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(label, style: GoogleFonts.merienda(fontSize: labelFontSize, fontWeight: labelFontWeight)),
|
|
const SizedBox(height: 4),
|
|
Container(
|
|
width: double.infinity,
|
|
height: multiLine ? null : fieldHeight,
|
|
constraints: multiLine ? const BoxConstraints(minHeight: 50.0) : null,
|
|
padding: const EdgeInsets.symmetric(horizontal: 18.0, vertical: 12.0),
|
|
decoration: BoxDecoration(
|
|
image: const DecorationImage(
|
|
image: AssetImage('assets/images/bg_beige.png'),
|
|
fit: BoxFit.fill,
|
|
),
|
|
borderRadius: BorderRadius.circular(8),
|
|
),
|
|
child: Text(
|
|
value.isNotEmpty ? value : '-',
|
|
style: GoogleFonts.merienda(fontSize: labelFontSize),
|
|
maxLines: multiLine ? null : 1,
|
|
overflow: multiLine ? TextOverflow.visible : TextOverflow.ellipsis,
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}
|