connect historique des relances

This commit is contained in:
Max S 2024-09-09 16:04:34 +02:00
parent a2068bb0fa
commit a7021e6acb
2 changed files with 75 additions and 34 deletions

View File

@ -1,13 +1,17 @@
import DocumentReminders from "@Front/Api/LeCoffreApi/Notary/DocumentReminders/DocumentReminders";
import Table from "@Front/Components/DesignSystem/Table";
import { IHead } from "@Front/Components/DesignSystem/Table/MuiTable";
import { IHead, IRowProps } from "@Front/Components/DesignSystem/Table/MuiTable";
import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
import BackArrow from "@Front/Components/Elements/BackArrow";
import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate";
import Module from "@Front/Config/Module";
import { DocumentReminder } from "le-coffre-resources/dist/Notary";
import { useRouter } from "next/router";
import React from "react";
import React, { useCallback, useEffect, useState } from "react";
import classes from "./classes.module.scss";
import Tag, { ETagColor } from "@Front/Components/DesignSystem/Tag";
import { EDocumentStatus } from "le-coffre-resources/dist/Customer/Document";
type IProps = {};
@ -31,9 +35,35 @@ const header: readonly IHead[] = [
];
export default function DocumentsReminderHistory(props: IProps) {
const [reminders, setReminders] = useState<DocumentReminder[] | null>(null);
const router = useRouter();
let { folderUid } = router.query;
const fetchReminders = useCallback(async () => {
DocumentReminders.getInstance()
.get({
include: {
document: {
include: {
depositor: {
include: {
contact: true,
},
},
document_type: true,
},
},
},
orderBy: { reminder_date: "desc" },
})
.then((reminders) => setReminders(reminders))
.catch((e) => console.warn(e));
}, []);
useEffect(() => {
fetchReminders();
}, [fetchReminders]);
return (
<DefaultTemplate title={"Historique des relances de documents"} isPadding={false}>
<div className={classes["root"]}>
@ -46,8 +76,34 @@ export default function DocumentsReminderHistory(props: IProps) {
<Typography typo={ETypo.TITLE_H1} color={ETypoColor.TEXT_PRIMARY}>
Historique des relances de documents
</Typography>
<Table className={classes["table"]} header={header} rows={[{ key: "1", name: "todo", sentAt: "todo", actions: "todo" }]} />
<Table className={classes["table"]} header={header} rows={buildRows(reminders)} />
</div>
</DefaultTemplate>
);
}
function buildRows(reminders: DocumentReminder[] | null): IRowProps[] {
if (!reminders) return [];
return reminders.map((reminder) => ({
key: reminder.uid ?? "",
remindedAt: new Date(reminder.reminder_date!).toLocaleDateString(),
customer: `${reminder.document?.depositor?.contact?.first_name} ${reminder.document?.depositor?.contact?.last_name}`,
document_type: reminder.document?.document_type?.name,
statut: getTag(reminder.document?.document_status as EDocumentStatus),
}));
}
function getTag(status: EDocumentStatus) {
switch (status) {
case EDocumentStatus.ASKED:
return <Tag label={status} color={ETagColor.INFO} />;
case EDocumentStatus.DEPOSITED:
return <Tag label={status} color={ETagColor.WARNING} />;
case EDocumentStatus.VALIDATED:
return <Tag label={status} color={ETagColor.SUCCESS} />;
case EDocumentStatus.REFUSED:
return <Tag label={status} color={ETagColor.ERROR} />;
default:
return <Tag label={status} color={ETagColor.INFO} />;
}
}

View File

@ -1,18 +1,18 @@
import DocumentReminders from "@Front/Api/LeCoffreApi/Notary/DocumentReminders/DocumentReminders";
import Button, { EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
import IconButton, { EIconButtonVariant } from "@Front/Components/DesignSystem/IconButton";
import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
import Module from "@Front/Config/Module";
import useOpenable from "@Front/Hooks/useOpenable";
import { ClockIcon, EnvelopeIcon } from "@heroicons/react/24/outline";
import Customer from "le-coffre-resources/dist/Customer";
import { DocumentReminder } from "le-coffre-resources/dist/Notary";
import Link from "next/link";
import { useRouter } from "next/router";
import { useCallback, useEffect, useState } from "react";
import classes from "./classes.module.scss";
import ReminderModal from "./ReminderModal";
import { useRouter } from "next/router";
import Module from "@Front/Config/Module";
import Link from "next/link";
import { useCallback, useEffect, useState } from "react";
import DocumentReminders from "@Front/Api/LeCoffreApi/Notary/DocumentReminders/DocumentReminders";
import { DocumentReminder } from "le-coffre-resources/dist/Notary";
type IProps = {
customer: Customer;
@ -39,7 +39,7 @@ export default function EmailReminder(props: IProps) {
useEffect(() => {
fetchReminders();
}, []);
}, [fetchReminders]);
let { folderUid } = router.query;
@ -61,33 +61,18 @@ export default function EmailReminder(props: IProps) {
title={"Voir l'historique des relances"}
href={Module.getInstance()
.get()
.modules.pages.Folder.pages.DocumentsReminderHistory.props.path.replace("[folderUid]", folderUid as string)}>
.modules.pages.Folder.pages.DocumentsReminderHistory.props.path.replace("[folderUid]", folderUid as string)
.replace("[customerUid]", customer.uid ?? "")}>
<IconButton icon={<ClockIcon />} variant={EIconButtonVariant.NEUTRAL} />
</Link>
<div className={classes["info"]}>
{/* TODO: mettre la date de la dernière relance */}
{!reminders && (
<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
Dernière relance: -
</Typography>
)}
{reminders && reminders.length > 0 && (
<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
Dernière relance: {new Date(reminders[0]!.reminder_date!).toLocaleDateString()}
</Typography>
)}
{/* TODO: mettre le nombre de relance */}
{!reminders && (
<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
Nombre de relance: -
</Typography>
)}
{reminders && reminders.length > 0 && (
<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
Nombre de relance: {reminders.length}
</Typography>
)}
<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
Dernière relance:{" "}
{reminders && reminders.length > 0 ? new Date(reminders[0]!.reminder_date!).toLocaleDateString() : "-"}
</Typography>
<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
Nombre de relance: {reminders && reminders.length > 0 ? reminders.length : "0"}
</Typography>
</div>
</div>
<ReminderModal