Option A. Il fallait cinq surfaces empilées pour poser une question sur une
étape et l'écrire en néerlandais ; la profondeur maximale retombe à 2 —
l'éditeur, puis la traduction.
Les trois showNewOrUpdate… sont supprimés au profit d'un rail d'étapes
toujours visible à gauche, d'un panneau de détail à droite, et d'une question
qui se déplie sur place au lieu d'ouvrir une quatrième fenêtre.
Les champs sont d'abord sortis en trois widgets autonomes (ParcoursFields,
EtapeFields, QuestionFields) : c'est ce qui a rendu la refonte possible sans
tout réécrire — 1663 lignes retirées, l'écran n'a pas réécrit les champs, il
les a réagencés.
SAUVEGARDE AU FIL DE L'EAU (héritée de DB2) — plus de bouton Sauvegarder,
tout part à la saisie avec un débounce de 700 ms ; ajouts, suppressions et
réordonnancements partent sans attendre. GuidedPathApi masque à l'éditeur le
fait qu'un parcours vive sous une SectionParcours ou sous une SectionMap :
mêmes opérations, seule la classe générée change.
Deux pièges du backend, trouvés en lisant le contrôleur plutôt qu'en le
supposant :
- UpdateGuidedPath supprime les étapes absentes du DTO, donc le payload
n'emporte que celles qui ont déjà un id — les autres attendent leur
CreateGuidedStep et seraient dupliquées.
- Les questions n'ont pas d'endpoint propre (c'est voulu : elles partent avec
leur étape, que GuidedStep.FromDTO synchronise). Leur id entier est donc
récupéré après coup par `order`, seul repère stable entre la liste locale
et celle du serveur.
Le parcours est créé à la première modification, pas à l'ouverture : une
fenêtre neuve refermée intacte ne laisse rien en base. Si une écriture
échoue, la fenêtre refuse de se fermer et le pied de page porte un
« Réessayer ».
Le garde-fou de DB2 est retiré, comme prévu : un avertissement de perte de
travail n'a plus d'objet quand il n'y a plus rien à perdre. 14 clés i18n
FR/EN/NL ajoutées, 3 retirées.
flutter build web ✅, analyse du dossier sans erreur. Reste la vérification à
l'œil (DB5).
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
232 lines
9.6 KiB
Dart
232 lines
9.6 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_widget_from_html/flutter_widget_from_html.dart';
|
|
import 'package:manager_api_new/api.dart';
|
|
import 'package:manager_app/constants.dart';
|
|
import 'package:manager_app/Screens/Configurations/Section/SubSection/Parcours/guided_path_api.dart';
|
|
import 'package:manager_app/Screens/Configurations/Section/SubSection/Parcours/guided_path_editor.dart';
|
|
import 'package:provider/provider.dart';
|
|
import 'package:manager_app/app_context.dart';
|
|
import 'package:manager_app/l10n/app_localizations.dart';
|
|
import 'package:manager_app/Models/managerContext.dart';
|
|
import 'package:manager_app/Components/message_notification.dart';
|
|
|
|
class ParcoursConfig extends StatefulWidget {
|
|
final List<GuidedPathDTO> initialValue;
|
|
final String parentId;
|
|
final bool isEvent;
|
|
final bool isParcours;
|
|
|
|
/// Parcours géolocalisé (`ShowMap`) : conditionne l'affichage des champs de
|
|
/// position et de zone sur les étapes. Un parcours en salle n'en a pas besoin.
|
|
final bool isGeolocated;
|
|
final ValueChanged<List<GuidedPathDTO>> onChanged;
|
|
|
|
const ParcoursConfig({
|
|
Key? key,
|
|
required this.initialValue,
|
|
required this.parentId,
|
|
required this.isEvent,
|
|
this.isParcours = false,
|
|
this.isGeolocated = true,
|
|
required this.onChanged,
|
|
}) : super(key: key);
|
|
|
|
@override
|
|
_ParcoursConfigState createState() => _ParcoursConfigState();
|
|
}
|
|
|
|
class _ParcoursConfigState extends State<ParcoursConfig> {
|
|
late List<GuidedPathDTO> paths;
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
paths = List.from(widget.initialValue);
|
|
paths.sort((a, b) => (a.order ?? 0).compareTo(b.order ?? 0));
|
|
WidgetsBinding.instance.addPostFrameCallback((_) => _loadFromApi());
|
|
}
|
|
|
|
Future<void> _loadFromApi() async {
|
|
final appContext = Provider.of<AppContext>(context, listen: false);
|
|
final clientAPI = (appContext.getContext() as ManagerAppContext).clientAPI!;
|
|
try {
|
|
final fetchedPaths = widget.isParcours
|
|
? await clientAPI.sectionParcoursApi!
|
|
.sectionParcoursGetAllGuidedPathFromSection(widget.parentId)
|
|
: await clientAPI.sectionMapApi!
|
|
.sectionMapGetAllGuidedPathFromSection(widget.parentId);
|
|
if (fetchedPaths == null || !mounted) return;
|
|
|
|
fetchedPaths.sort((a, b) => (a.order ?? 0).compareTo(b.order ?? 0));
|
|
setState(() {
|
|
paths = List.from(fetchedPaths);
|
|
});
|
|
} catch (e) {
|
|
// Silently keep initial value on error
|
|
}
|
|
}
|
|
|
|
/// Ouvre l'éditeur à fenêtre unique. Il enregistre au fil de la saisie : il
|
|
/// n'y a donc rien à récupérer d'un callback, seulement la liste à relire à
|
|
/// la fermeture pour repartir de l'état réel du serveur.
|
|
Future<void> _openEditor(GuidedPathDTO? path) async {
|
|
final appContext = Provider.of<AppContext>(context, listen: false);
|
|
final managerContext = appContext.getContext() as ManagerAppContext;
|
|
|
|
await showGuidedPathEditor(
|
|
context,
|
|
path: path,
|
|
sectionId: widget.parentId,
|
|
instanceId: managerContext.instanceId,
|
|
isEvent: widget.isEvent,
|
|
isParcours: widget.isParcours,
|
|
isGeolocated: widget.isGeolocated,
|
|
api: GuidedPathApi(managerContext.clientAPI!,
|
|
isParcours: widget.isParcours),
|
|
newPathOrder: paths.length,
|
|
);
|
|
|
|
if (!mounted) return;
|
|
await _loadFromApi();
|
|
if (mounted) widget.onChanged(paths);
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Column(
|
|
children: [
|
|
Padding(
|
|
padding: const EdgeInsets.all(8.0),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(AppLocalizations.of(context)!.guidedPathsLabel,
|
|
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
|
|
ElevatedButton.icon(
|
|
icon: Icon(Icons.add),
|
|
label: Text(AppLocalizations.of(context)!.addPath),
|
|
onPressed: () => _openEditor(null),
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: kSuccess, foregroundColor: kWhite),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
Expanded(
|
|
child: paths.isEmpty
|
|
? Center(
|
|
child: Text(AppLocalizations.of(context)!.noPathConfigured,
|
|
style: TextStyle(fontStyle: FontStyle.italic)))
|
|
: ReorderableListView.builder(
|
|
buildDefaultDragHandles: false,
|
|
itemCount: paths.length,
|
|
onReorder: (oldIndex, newIndex) async {
|
|
if (newIndex > oldIndex) newIndex -= 1;
|
|
final item = paths.removeAt(oldIndex);
|
|
paths.insert(newIndex, item);
|
|
for (int i = 0; i < paths.length; i++) {
|
|
paths[i].order = i;
|
|
}
|
|
|
|
setState(() {});
|
|
widget.onChanged(paths);
|
|
|
|
final appContext =
|
|
Provider.of<AppContext>(context, listen: false);
|
|
final clientAPI = (appContext.getContext() as ManagerAppContext).clientAPI!;
|
|
|
|
try {
|
|
await Future.wait(widget.isParcours
|
|
? paths.map((p) => clientAPI.sectionParcoursApi!.sectionParcoursUpdateGuidedPath(p))
|
|
: paths.map((p) => clientAPI.sectionMapApi!.sectionMapUpdateGuidedPath(p)));
|
|
} catch (e) {
|
|
showNotification(
|
|
kError,
|
|
kWhite,
|
|
AppLocalizations.of(context)!.pathOrderUpdateError,
|
|
context,
|
|
null);
|
|
}
|
|
},
|
|
itemBuilder: (context, index) {
|
|
final path = paths[index];
|
|
return Card(
|
|
key: ValueKey(path.id ?? index.toString()),
|
|
margin: EdgeInsets.symmetric(horizontal: 10, vertical: 5),
|
|
child: ListTile(
|
|
leading: CircleAvatar(
|
|
child: Text("${index + 1}"),
|
|
backgroundColor: kPrimaryColor,
|
|
foregroundColor: kWhite),
|
|
title: path.title != null && path.title!.isNotEmpty
|
|
? HtmlWidget(
|
|
path.title!
|
|
.firstWhere((t) => t.language == 'FR',
|
|
orElse: () => path.title![0])
|
|
.value ??
|
|
AppLocalizations.of(context)!.pathNoTitle,
|
|
)
|
|
: Text(AppLocalizations.of(context)!.pathNoTitle),
|
|
subtitle: Text(AppLocalizations.of(context)!.stepsCount(path.steps?.length ?? 0)),
|
|
trailing: Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
IconButton(
|
|
icon: Icon(Icons.edit, color: kPrimaryColor),
|
|
onPressed: () => _openEditor(path),
|
|
),
|
|
IconButton(
|
|
icon: Icon(Icons.delete, color: kError),
|
|
onPressed: () async {
|
|
final appContext = Provider.of<AppContext>(
|
|
context,
|
|
listen: false);
|
|
try {
|
|
if (path.id != null) {
|
|
final clientAPI = (appContext.getContext() as ManagerAppContext).clientAPI!;
|
|
if (widget.isParcours) {
|
|
await clientAPI.sectionParcoursApi!.sectionParcoursDeleteGuidedPath(path.id!);
|
|
} else {
|
|
await clientAPI.sectionMapApi!.sectionMapDeleteGuidedPath(path.id!);
|
|
}
|
|
}
|
|
|
|
setState(() {
|
|
paths.removeAt(index);
|
|
for (int i = 0; i < paths.length; i++) {
|
|
paths[i].order = i;
|
|
}
|
|
widget.onChanged(paths);
|
|
});
|
|
showNotification(
|
|
kSuccess,
|
|
kWhite,
|
|
AppLocalizations.of(context)!.pathDeletedSuccess,
|
|
context,
|
|
null);
|
|
} catch (e) {
|
|
showNotification(
|
|
kError,
|
|
kWhite,
|
|
AppLocalizations.of(context)!.pathDeleteError,
|
|
context,
|
|
null);
|
|
}
|
|
},
|
|
),
|
|
ReorderableDragStartListener(
|
|
index: index,
|
|
child: Icon(Icons.drag_handle),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
],
|
|
);
|
|
}
|
|
}
|