✨ connect historique des relances
This commit is contained in:
parent
a2068bb0fa
commit
a7021e6acb
@ -1,13 +1,17 @@
|
|||||||
|
import DocumentReminders from "@Front/Api/LeCoffreApi/Notary/DocumentReminders/DocumentReminders";
|
||||||
import Table from "@Front/Components/DesignSystem/Table";
|
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 Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
|
||||||
import BackArrow from "@Front/Components/Elements/BackArrow";
|
import BackArrow from "@Front/Components/Elements/BackArrow";
|
||||||
import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate";
|
import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate";
|
||||||
import Module from "@Front/Config/Module";
|
import Module from "@Front/Config/Module";
|
||||||
|
import { DocumentReminder } from "le-coffre-resources/dist/Notary";
|
||||||
import { useRouter } from "next/router";
|
import { useRouter } from "next/router";
|
||||||
import React from "react";
|
import React, { useCallback, useEffect, useState } from "react";
|
||||||
|
|
||||||
import classes from "./classes.module.scss";
|
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 = {};
|
type IProps = {};
|
||||||
|
|
||||||
@ -31,9 +35,35 @@ const header: readonly IHead[] = [
|
|||||||
];
|
];
|
||||||
|
|
||||||
export default function DocumentsReminderHistory(props: IProps) {
|
export default function DocumentsReminderHistory(props: IProps) {
|
||||||
|
const [reminders, setReminders] = useState<DocumentReminder[] | null>(null);
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
let { folderUid } = router.query;
|
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 (
|
return (
|
||||||
<DefaultTemplate title={"Historique des relances de documents"} isPadding={false}>
|
<DefaultTemplate title={"Historique des relances de documents"} isPadding={false}>
|
||||||
<div className={classes["root"]}>
|
<div className={classes["root"]}>
|
||||||
@ -46,8 +76,34 @@ export default function DocumentsReminderHistory(props: IProps) {
|
|||||||
<Typography typo={ETypo.TITLE_H1} color={ETypoColor.TEXT_PRIMARY}>
|
<Typography typo={ETypo.TITLE_H1} color={ETypoColor.TEXT_PRIMARY}>
|
||||||
Historique des relances de documents
|
Historique des relances de documents
|
||||||
</Typography>
|
</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>
|
</div>
|
||||||
</DefaultTemplate>
|
</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} />;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@ -1,18 +1,18 @@
|
|||||||
|
import DocumentReminders from "@Front/Api/LeCoffreApi/Notary/DocumentReminders/DocumentReminders";
|
||||||
import Button, { EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
|
import Button, { EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
|
||||||
import IconButton, { EIconButtonVariant } from "@Front/Components/DesignSystem/IconButton";
|
import IconButton, { EIconButtonVariant } from "@Front/Components/DesignSystem/IconButton";
|
||||||
import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
|
import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
|
||||||
|
import Module from "@Front/Config/Module";
|
||||||
import useOpenable from "@Front/Hooks/useOpenable";
|
import useOpenable from "@Front/Hooks/useOpenable";
|
||||||
import { ClockIcon, EnvelopeIcon } from "@heroicons/react/24/outline";
|
import { ClockIcon, EnvelopeIcon } from "@heroicons/react/24/outline";
|
||||||
import Customer from "le-coffre-resources/dist/Customer";
|
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 classes from "./classes.module.scss";
|
||||||
import ReminderModal from "./ReminderModal";
|
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 = {
|
type IProps = {
|
||||||
customer: Customer;
|
customer: Customer;
|
||||||
@ -39,7 +39,7 @@ export default function EmailReminder(props: IProps) {
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
fetchReminders();
|
fetchReminders();
|
||||||
}, []);
|
}, [fetchReminders]);
|
||||||
|
|
||||||
let { folderUid } = router.query;
|
let { folderUid } = router.query;
|
||||||
|
|
||||||
@ -61,33 +61,18 @@ export default function EmailReminder(props: IProps) {
|
|||||||
title={"Voir l'historique des relances"}
|
title={"Voir l'historique des relances"}
|
||||||
href={Module.getInstance()
|
href={Module.getInstance()
|
||||||
.get()
|
.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} />
|
<IconButton icon={<ClockIcon />} variant={EIconButtonVariant.NEUTRAL} />
|
||||||
</Link>
|
</Link>
|
||||||
<div className={classes["info"]}>
|
<div className={classes["info"]}>
|
||||||
{/* TODO: mettre la date de la dernière relance */}
|
<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
|
||||||
{!reminders && (
|
Dernière relance:{" "}
|
||||||
<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
|
{reminders && reminders.length > 0 ? new Date(reminders[0]!.reminder_date!).toLocaleDateString() : "-"}
|
||||||
Dernière relance: -
|
</Typography>
|
||||||
</Typography>
|
<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
|
||||||
)}
|
Nombre de relance: {reminders && reminders.length > 0 ? reminders.length : "0"}
|
||||||
|
</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>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<ReminderModal
|
<ReminderModal
|
||||||
|
Loading…
x
Reference in New Issue
Block a user