sent documents table

This commit is contained in:
Max S 2024-08-13 11:47:28 +02:00
parent ed75a960c4
commit 9fa0ae6039
2 changed files with 59 additions and 27 deletions

View File

@ -11,4 +11,10 @@
justify-content: space-between;
align-items: center;
}
.actions {
display: flex;
align-items: center;
gap: var(--spacing-sm, 8px);
}
}

View File

@ -21,25 +21,6 @@ type IProps = {
folderUid: string;
};
const header: readonly IHead[] = [
{
key: "document_type",
title: "Type de document",
},
{
key: "document_status",
title: "Statut",
},
{
key: "created_at",
title: "Demandé le",
},
{
key: "actions",
title: "Actions",
},
];
const tradDocumentStatus: Record<EDocumentStatus, string> = {
[EDocumentStatus.ASKED]: "Demandé",
[EDocumentStatus.DEPOSITED]: "À valider",
@ -99,7 +80,7 @@ export default function DocumentTables(props: IProps) {
label={tradDocumentStatus[document.document_status].toUpperCase()}
/>
),
created_at: document.created_at ? new Date(document.created_at).toLocaleDateString() : "_",
date: document.created_at ? new Date(document.created_at).toLocaleDateString() : "_",
actions: <IconButton icon={<TrashIcon onClick={() => openDeleteAskedDocumentModal(document.uid)} />} />,
};
})
@ -122,7 +103,7 @@ export default function DocumentTables(props: IProps) {
label={tradDocumentStatus[document.document_status].toUpperCase()}
/>
),
created_at: document.created_at ? new Date(document.created_at).toLocaleDateString() : "_",
date: document.updated_at ? new Date(document.updated_at).toLocaleDateString() : "_",
actions: (
<Link
href={Module.getInstance()
@ -153,7 +134,7 @@ export default function DocumentTables(props: IProps) {
label={tradDocumentStatus[document.document_status].toUpperCase()}
/>
),
created_at: document.created_at ? new Date(document.created_at).toLocaleDateString() : "_",
date: document.updated_at ? new Date(document.updated_at).toLocaleDateString() : "_",
actions: (
<div className={classes["actions"]}>
<Link
@ -187,7 +168,7 @@ export default function DocumentTables(props: IProps) {
label={tradDocumentStatus[document.document_status].toUpperCase()}
/>
),
created_at: document.created_at ? new Date(document.created_at).toLocaleDateString() : "_",
date: document.updated_at ? new Date(document.updated_at).toLocaleDateString() : "_",
actions: "",
};
})
@ -195,6 +176,29 @@ export default function DocumentTables(props: IProps) {
[documents],
);
//TODO: modify accordingly when the back will handle sent documents
const sentDocuments: IRowProps[] = useMemo(
() =>
documents
.map((document) => {
if (document.document_status !== "sent") return null;
return {
key: document.uid,
document_type: document.document_type?.name ?? "_",
document_status: <Tag color={ETagColor.ERROR} variant={ETagVariant.SEMI_BOLD} label={"Envoyé"} />,
date: document.updated_at ? new Date(document.updated_at).toLocaleDateString() : "_",
actions: (
<div className={classes["actions"]}>
<IconButton onClick={() => onDownload(document)} icon={<ArrowDownTrayIcon />} />
<IconButton icon={<TrashIcon onClick={() => openDeleteAskedDocumentModal(document.uid)} />} />
</div>
),
};
})
.filter((document) => document !== null) as IRowProps[],
[documents, onDownload, openDeleteAskedDocumentModal],
);
const progress = useMemo(() => {
const total = askedDocuments.length + toValidateDocuments.length + validatedDocuments.length + refusedDocuments.length;
if (total === 0) return 0;
@ -217,10 +221,11 @@ export default function DocumentTables(props: IProps) {
</Typography>
<CircleProgress percentage={progress} />
</div>
{askedDocuments.length > 0 && <Table header={header} rows={askedDocuments} />}
{toValidateDocuments.length > 0 && <Table header={header} rows={toValidateDocuments} />}
{validatedDocuments.length > 0 && <Table header={header} rows={validatedDocuments} />}
{refusedDocuments.length > 0 && <Table header={header} rows={refusedDocuments} />}
{askedDocuments.length > 0 && <Table header={getHeader("Demandé le")} rows={askedDocuments} />}
{toValidateDocuments.length > 0 && <Table header={getHeader("Déposé le")} rows={toValidateDocuments} />}
{validatedDocuments.length > 0 && <Table header={getHeader("Validé le")} rows={validatedDocuments} />}
{refusedDocuments.length > 0 && <Table header={getHeader("Demandé le")} rows={refusedDocuments} />}
{sentDocuments.length > 0 && <Table header={getHeader("Envoyé le")} rows={sentDocuments} />}
{documentUid && (
<DeleteAskedDocumentModal
isOpen={deleteAskedOocumentModal.isOpen}
@ -232,3 +237,24 @@ export default function DocumentTables(props: IProps) {
</div>
);
}
function getHeader(dateColumnTitle: string): IHead[] {
return [
{
key: "document_type",
title: "Type de document",
},
{
key: "document_status",
title: "Statut",
},
{
key: "date",
title: dateColumnTitle,
},
{
key: "actions",
title: "Action",
},
];
}