Ajouter des pj ou des images à mon audit

[benoitdequick]

Je voudrais pouvoir ajouter des pièces jointes voire des images dans les notes.

[AdrienMuzyczka]

Page audit

Maquette page audit

• [x] Passer la "modal" en "sidebar"
  • Hauteur de la sidebar = 100% de la hauteur de la page
  • Llargeur de la sidebar = largeur du champ de saisie (8 colonnes) + 48 px de marge à gauche et à droite du champ.
• [x] Revoir le wording du champs zone de texte "Remarques et recommandation générales"
• [x] Ajouter le composant "Ajout de fichier" du DSFR V1.11 et utiliser le composant "Ajout multiple"
  • Wording description : Taille maximale par fichier : 2 Mo. Tous les formats sont pris en compte. Plusieurs fichiers possibles.
  • S'assurer que tous les formats sont bien pris en compte + poids limité à 2 Mo par upload
  • Wording bouton "Sélect. fichiers" : "Parcourir..."
  • Wording mention si aucun fichier sélectionné : "Aucun fichier sélectionné"
  • Wording mention si un fichier sélectionné : "1 fichier selectionné"
  • Wording mention si plusieurs fichiers sélectionné : "X fichiers selectionnés"
  • Wording mention si limite max atteint : "Limite atteinte, vous ne pouvez plus ajouter d’autres fichiers"
• [x] Créer un composant custom "fichier". Cf maquette
  • Seules les images et pdf sont consultables : ouverture des fichiers dans un nouvel onglet
  • Largeur composant = 6 colonnes
  • L'espace entre le texte et les boutons avant retours à la ligne du texte est de 24 px
  • Miniature composant : si c'est image, reprendre l'image. Si pdf, possible d'avoir une miniature du pdf ? Sinon utiliser une icône "document" comme pour les autres formats.
• [ ] Ajouter 2 boutons en bas de la sidebar
  • "Enregistrer les modifications" : ferme la sidebar et affiche un message de succès (comportement actuel)
  • "Annuler" + clic en dehors de la sidebar : ferme la sidebar (comportement actuel)

EDIT le 16/05 :

• [x] dans la barre d'action, inverser la position des boutons "Consulter le rapport" et "Annoter l'audit". "Annoter l'audit" devient le dernier bouton.
• [x] Ajouter le bouton tertiaire "Voir la syntaxe" à côté de la mention "Markdown pris en compte". Ce bouton ouvre la modale "Markdown". Si l'usager clique en dehors de la modale, seule la modale est fermée => tous les liens "Voir la syntaxe" ouvre une nouvelle page nommée "Syntaxe Markdown". Cf maquette

Page rapport d'audit

Maquette page rapport d'audit

• [x] Ajouter une section "pièces jointes" en bas de page dans l'onglet "Notes"
• [x] Afficher/lister les fichiers par ordre d'upload
• [x] Reprendre le composant custom "fichier" (cf plus haut)
  • Supprimer l'option "Supprimer"
  • Largeur du composant = 5 colonnes

[yaaax]

Salut @AdrienMuzyczka , Je lis

Wording mention si limite max atteint : "Limite atteinte, vous ne pouvez plus ajouter d’autres fichiers"

Y a-t-il réellement une limite au nombre de fichiers téléversables ?

[AdrienMuzyczka]

Salut @AdrienMuzyczka , Je lis

Wording mention si limite max atteint : "Limite atteinte, vous ne pouvez plus ajouter d’autres fichiers"

Y a-t-il réellement une limite au nombre de fichiers téléversables ?

Salut @yaaax je ne me souviens plus des règles et si elles ont été misent place. Je note d'en parler au prochain point

[yaaax]

Salut @AdrienMuzyczka ,

Il faudrait ajouter des titres de niveau sur le rapport. Notamment au niveau des onglets. Voir ci-dessous :

Autre option (à ajuster esthétiquement si besoin… en gardant une cohérence avec les autres onglets ?)

[yaaax]

Note sur la largeur du composant affichant la liste des fichiers : le code utilise width: fit-content + min-width: 50%

[AdrienMuzyczka]

Suite à la dernière revue de design :

• [x] Supprimer les boutons “Enregistrer” et “Annuler”. Les saisies de l'usager sont sauvegardées en "temps réel" de la même manière que dans les accordéons "Erreur et recommandation"
• [x] Ajouter en haut à droite de la sidebar un bouton "Fermer". Si l'usager clique en dehors de la sidebar, ses saisies sont sauvegardées et la sidebar fermée.
• [x] Ajouter l'indicateur d'enregistrement à côté du titre
• [x] Garder un bouton tertiaire encadré pour l'action "Choisir un fichier"
• [x] Remplacer le bouton "voir la syntaxe" par un lien SM avec icône externe
• [x] Supprimer dans la sidebar et dans les accordéons de la page "audit" les messages de succès à l'upload d'une image

Maquettes mises à jour

[AdrienMuzyczka]

• [x] Lorsqu'un fichier uploadé est trop volumineux, passer le composant "Ajout de fichier" en état "erreur" et afficher le message suivant : Votre fichier dépasse la limite de 2 Mo. Veuillez choisir un fichier plus léger.
• [x] Passer le bouton "voir la syntaxe" en lien car l'usager est maintenant redirigé sur une nouvelle page
• [ ] Lorsqu'on redimensionne la fenêtre du navigateur, la marge à droite du champ de saisie "Remarques... générales" disparaît
• [x] impossible de scroller en bas de la modale-sidebar des notes (impossible de cliquer sur « Choisir »)
• [x] "Ajouter un fichier" ne devrait pas être un <label> ?