Skip to content

Commit

Permalink
feat: mise à jour interface et champs obligatoires SIFA (#3916)
Browse files Browse the repository at this point in the history 
Co-authored-by: Paul G. <[email protected]>
  • Loading branch information
@nkrmr @Pomarom
nkrmr and Pomarom authored Dec 6, 2024
1 parent 788c644 commit ff98cd0
Show file tree
Hide file tree
Showing 10 changed files with 275 additions and 155 deletions.
13 changes: 11 additions & 2 deletions ui/components/Table/Table.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -188,10 +188,19 @@ export default function Table({
<Fragment key={row.id}>
<Box
as="tr"
bg={j % 2 === 0 ? "#EEEEEE" : "white"}
bg={j % 2 === 0 ? "grey.100" : "white"}
py="3"
data-rowindex={row.id}
onClick={() => onRowClick?.(row.id)}
onClick={() => {
onRowClick?.(row.id);
if (!props.isRowExpanded) {
row.toggleExpanded();
}
}}
_hover={{
backgroundColor: "grey.200",
cursor: "pointer",
}}
>
{/* first row is a normal row */}
{row.getVisibleCells().map((cell) => {
Expand Down
4 changes: 0 additions & 4 deletions ui/modules/effectifs/EffectifsPage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,8 +49,6 @@ function EffectifsPage(props: EffectifsPageProps) {
const [showOnlyErrors, setShowOnlyErrors] = useState(false);
const [filtreAnneeScolaire, setFiltreAnneeScolaire] = useState("all");

const [triggerExpand, setTriggerExpand] = useState({} as { tableId: string; rowId: string });

const {
data: organismesEffectifs,
isFetching,
Expand Down Expand Up @@ -246,8 +244,6 @@ function EffectifsPage(props: EffectifsPageProps) {
effectifs={effectifs}
formation={formation}
searchValue={searchValue}
triggerExpand={triggerExpand}
onTriggerExpand={setTriggerExpand}
refetch={refetch}
/>
);
Expand Down
162 changes: 102 additions & 60 deletions ui/modules/mon-espace/SIFA/SIFAPage.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { ChevronDownIcon, ChevronUpIcon } from "@chakra-ui/icons";
import {
Center,
Heading,
Expand All @@ -14,6 +15,7 @@ import {
ListItem,
Grid,
Image,
Collapse,
} from "@chakra-ui/react";
import { useQuery, useQueryClient } from "@tanstack/react-query";
import groupBy from "lodash.groupby";
Expand All @@ -25,6 +27,7 @@ import { DuplicateEffectifGroupPagination, getSIFADate, SIFA_GROUP } from "share
import { _get, _getBlob } from "@/common/httpClient";
import { Organisme } from "@/common/internal/Organisme";
import { downloadObject } from "@/common/utils/browser";
import ButtonTeleversement from "@/components/buttons/ButtonTeleversement";
import DownloadButton from "@/components/buttons/DownloadButton";
import Link from "@/components/Links/Link";
import SupportLink from "@/components/Links/SupportLink";
Expand All @@ -36,7 +39,9 @@ import useToaster from "@/hooks/useToaster";
import { effectifsStateAtom, effectifFromDecaAtom } from "@/modules/mon-espace/effectifs/engine/atoms";
import EffectifTableContainer from "@/modules/mon-espace/effectifs/engine/EffectifTableContainer";
import { Input } from "@/modules/mon-espace/effectifs/engine/formEngine/components/Input/Input";
import InfoTeleversementSIFA from "@/modules/organismes/InfoTeleversementSIFA";
import { DownloadLine, ExternalLinkLine } from "@/theme/components/icons";
import Eye from "@/theme/components/icons/Eye";

function useOrganismesEffectifs(organismeId: string) {
const setCurrentEffectifsState = useSetRecoilState(effectifsStateAtom);
Expand Down Expand Up @@ -82,9 +87,12 @@ const SIFAPage = (props: SIFAPageProps) => {
const { toastWarning, toastSuccess } = useToaster();
const organisme = useRecoilValue<any>(organismeAtom);
const { isLoading, organismesEffectifs, refetch } = useOrganismesEffectifs(organisme._id);
const [show, setShow] = useState(false);
const handleToggle = () => {
setShow(!show);
};

const [searchValue, setSearchValue] = useState("");
const [triggerExpand, setTriggerExpand] = useState({} as { tableId: string; rowId: string });

const organismesEffectifsGroupedBySco: any = useMemo(
() => groupBy(organismesEffectifs, "annee_scolaire"),
Expand Down Expand Up @@ -143,7 +151,7 @@ const SIFAPage = (props: SIFAPageProps) => {
<HStack gap={4}>
<SupportLink href={SIFA_GROUP}></SupportLink>
<DownloadButton
variant="secondary"
variant="primary"
action={async () => {
trackPlausibleEvent("telechargement_sifa");
downloadObject(
Expand Down Expand Up @@ -196,17 +204,36 @@ const SIFAPage = (props: SIFAPageProps) => {
</Text>
</ListItem>
</UnorderedList>
<Link
variant="link"
href="/InstructionsSIFA_31122023.pdf"
mt={4}
isExternal
aria-label="Télécharger le fichier d'instruction SIFA pour 2023 (PDF, 1.5 Mo)"
plausibleGoal="telechargement_fichier_instruction_sifa"
>
Fichier d’instruction SIFA (2023)
<DownloadLine mb={1} ml={2} fontSize="xs" />
</Link>
<Flex mt={4} gap={6}>
<Link
variant="link"
href="/InstructionsSIFA_31122023.pdf"
isExternal
aria-label="Télécharger le fichier d'instruction SIFA pour 2023 (PDF, 1.5 Mo)"
plausibleGoal="telechargement_fichier_instruction_sifa"
>
Fichier d’instruction SIFA (2023)
<DownloadLine mb={1} ml={2} fontSize="xs" />
</Link>
<BasicModal
renderTrigger={(onOpen) => (
<ButtonTeleversement
onClick={(e) => {
e.preventDefault();
trackPlausibleEvent("televersement_clic_modale_donnees_obligatoires");
onOpen();
}}
>
<Eye mr={2} />
Les données obligatoires
</ButtonTeleversement>
)}
title="SIFA : les données obligatoires à renseigner"
size="4xl"
>
<InfoTeleversementSIFA />
</BasicModal>
</Flex>
<Text fontSize="xs" color="mgalt">
PDF – 1.5 Mo
</Text>
Expand All @@ -215,52 +242,69 @@ const SIFAPage = (props: SIFAPageProps) => {
<Text color="#3A3A3A" fontSize="gamma" fontWeight="bold" mb={4}>
Quelques conseils sur le fichier SIFA et sa manipulation :
</Text>
<Text color="grey.800">
<UnorderedList spacing={2} px={6}>
<ListItem>
Vérifiez que tous vos apprentis soient bien présents dans le fichier. Si non, téléchargez le fichier
et complétez à la main avec vos effectifs manquants.
</ListItem>
<ListItem>
Avant de téléverser votre fichier SIFA sur le portail de la DEPP, veuillez en{" "}
<strong>supprimer la première ligne</strong> d‘en-tête de colonnes.
</ListItem>
<ListItem>
<strong>Attention ! Si vous ouvrez le fichier avec Excel</strong>, veuillez le sauvegarder (Fichier
&gt; Enregistrer sous) au format{" "}
<BasicModal
triggerType="link"
button="CSV (délimiteur point-virgule)"
title="Format CSV (délimiteur point-virgule)"
size="6xl"
>
<Image
src="/images/CSV-delimiter.png"
alt="CSV Delimiter"
width="100%"
maxWidth="100%"
objectFit="cover"
/>
</BasicModal>{" "}
après suppression de la première ligne pour assurer la compatibilité avec l‘enquête SIFA.
</ListItem>
<ListItem>
L’enquête SIFA sera terminée dès lors que le fichier est accepté par la plateforme SIFA.
</ListItem>
<ListItem>
En cas de difficultés ou questions, veuillez lire la{" "}
<Link
href={"https://mission-apprentissage.notion.site/Enqu-te-SIFA-a546590b47764051bf1c486b1d57d227"}
textDecoration={"underline"}
isExternal
plausibleGoal="clic_sifa_faq"
>
FAQ dédiée
</Link>
.
</ListItem>
</UnorderedList>
<Text
style={{
color: "#000091",
textDecoration: "underline",
textUnderlineOffset: "4px",
cursor: "pointer",
}}
onClick={handleToggle}
mb={2}
>
{" "}
{!show ? <ChevronDownIcon /> : <ChevronUpIcon />} Voir les détails
</Text>
<Collapse in={show}>
<Text color="grey.800">
<UnorderedList spacing={2} px={6}>
<ListItem>
Vérifiez que tous vos apprentis soient bien présents dans le fichier. Si non, téléchargez le fichier
et complétez à la main avec vos effectifs manquants.
</ListItem>
<ListItem>
Avant de téléverser votre fichier SIFA sur le portail de la DEPP, veuillez{" "}
<strong>supprimer la première ligne</strong> d‘en-tête de colonnes.
</ListItem>
<ListItem>
<strong>Attention ! Si vous ouvrez le fichier avec Excel</strong>, veuillez le sauvegarder (Fichier
&gt; Enregistrer sous) au format{" "}
<BasicModal
triggerType="link"
button="CSV (délimiteur point-virgule)"
title="Format CSV (délimiteur point-virgule)"
size="6xl"
>
<Image
src="/images/CSV-delimiter.png"
alt="CSV Delimiter"
width="100%"
maxWidth="100%"
objectFit="cover"
/>
</BasicModal>{" "}
après suppression de la première ligne pour assurer la compatibilité avec l‘enquête SIFA.
</ListItem>
<ListItem>
L’enquête SIFA sera terminée dès lors que le fichier est accepté par la plateforme SIFA.
</ListItem>
<ListItem>
En cas de difficultés ou questions, veuillez lire la{" "}
<Link
href={
"https://aide.cfas.apprentissage.beta.gouv.fr/fr/category/organisme-de-formation-cfa-fhh03f/"
}
textDecoration={"underline"}
isExternal
plausibleGoal="clic_sifa_faq"
>
FAQ dédiée
</Link>
.
</ListItem>
</UnorderedList>
</Text>
</Collapse>
</Ribbons>
</Grid>
</Box>
Expand Down Expand Up @@ -344,8 +388,6 @@ const SIFAPage = (props: SIFAPageProps) => {
formation={formation}
searchValue={searchValue}
modeSifa={true}
triggerExpand={triggerExpand}
onTriggerExpand={setTriggerExpand}
refetch={refetch}
/>
);
Expand Down
8 changes: 1 addition & 7 deletions ui/modules/mon-espace/effectifs/engine/EffectifTableContainer.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { Box, HStack, Text } from "@chakra-ui/react";
import { UseQueryResult } from "@tanstack/react-query";
import { Dispatch, SetStateAction, useState } from "react";
import { useState } from "react";

import { DoubleChevrons } from "@/theme/components/icons/DoubleChevrons";

Expand All @@ -11,8 +11,6 @@ interface EffectifsTableContainerProps {
modeSifa?: boolean;
canEdit?: boolean;
searchValue?: string;
triggerExpand: object;
onTriggerExpand: Dispatch<SetStateAction<{ tableId: string; rowId: string }>>;
tableId: string;
formation: any;
refetch: (options: { throwOnError: boolean; cancelRefetch: boolean }) => Promise<UseQueryResult>;
Expand All @@ -22,8 +20,6 @@ const EffectifsTableContainer = ({
formation,
canEdit,
searchValue,
triggerExpand,
onTriggerExpand,
tableId,
modeSifa,
refetch,
Expand All @@ -49,8 +45,6 @@ const EffectifsTableContainer = ({
organismesEffectifs={effectifs}
searchValue={searchValue}
onCountItemsChange={(count) => setCount(count)}
triggerExpand={triggerExpand}
onTriggerExpand={onTriggerExpand}
modeSifa={modeSifa}
refetch={refetch}
/>
Expand Down
Loading

0 comments on commit ff98cd0

Please sign in to comment.