✨ reminder modal + historique des relances des documents
This commit is contained in:
parent
c66108164c
commit
d40c075289
@ -0,0 +1,23 @@
|
||||
@import "@Themes/constants.scss";
|
||||
|
||||
.root {
|
||||
padding: var(--spacing-3) var(--spacing-15);
|
||||
max-width: 1156px;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: var(--spacing-xl, 32px);
|
||||
|
||||
.table{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media screen and (max-width: $screen-m) {
|
||||
padding: var(--spacing-3);
|
||||
}
|
||||
|
||||
@media screen and (max-width: $screen-s) {
|
||||
padding: var(--spacing-2);
|
||||
}
|
||||
}
|
@ -0,0 +1,53 @@
|
||||
import Table from "@Front/Components/DesignSystem/Table";
|
||||
import { IHead } 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 { useRouter } from "next/router";
|
||||
import React from "react";
|
||||
|
||||
import classes from "./classes.module.scss";
|
||||
|
||||
type IProps = {};
|
||||
|
||||
const header: readonly IHead[] = [
|
||||
{
|
||||
key: "remindedAt",
|
||||
title: "Date de relance",
|
||||
},
|
||||
{
|
||||
key: "customer",
|
||||
title: "Client",
|
||||
},
|
||||
{
|
||||
key: "document_type",
|
||||
title: "Type de document",
|
||||
},
|
||||
{
|
||||
key: "statut",
|
||||
title: "Satut",
|
||||
},
|
||||
];
|
||||
|
||||
export default function DocumentsReminderHistory(props: IProps) {
|
||||
const router = useRouter();
|
||||
let { folderUid } = router.query;
|
||||
|
||||
return (
|
||||
<DefaultTemplate title={"Historique des relances de documents"} isPadding={false}>
|
||||
<div className={classes["root"]}>
|
||||
<BackArrow
|
||||
text="Retour"
|
||||
url={Module.getInstance()
|
||||
.get()
|
||||
.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", folderUid as string)}
|
||||
/>
|
||||
<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" }]} />
|
||||
</div>
|
||||
</DefaultTemplate>
|
||||
);
|
||||
}
|
@ -6,16 +6,15 @@ import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Ty
|
||||
import Module from "@Front/Config/Module";
|
||||
import useOpenable from "@Front/Hooks/useOpenable";
|
||||
import { PencilSquareIcon, TrashIcon, UsersIcon } from "@heroicons/react/24/outline";
|
||||
import { Note } from "le-coffre-resources/dist/Customer";
|
||||
import Customer, { Note } from "le-coffre-resources/dist/Customer";
|
||||
import { useCallback } from "react";
|
||||
|
||||
import { ICustomer } from "..";
|
||||
import { AnchorStatus } from "../..";
|
||||
import classes from "./classes.module.scss";
|
||||
import DeleteCustomerModal from "./DeleteCustomerModal";
|
||||
|
||||
type IProps = {
|
||||
customer: ICustomer;
|
||||
customer: Customer;
|
||||
anchorStatus: AnchorStatus;
|
||||
folderUid: string | undefined;
|
||||
customerNote: Note | null;
|
||||
|
@ -0,0 +1,5 @@
|
||||
@import "@Themes/constants.scss";
|
||||
|
||||
.root {
|
||||
|
||||
}
|
@ -0,0 +1,37 @@
|
||||
import Modal from "@Front/Components/DesignSystem/Modal";
|
||||
import Typography, { ETypo } from "@Front/Components/DesignSystem/Typography";
|
||||
import Customer from "le-coffre-resources/dist/Customer";
|
||||
import React, { useCallback } from "react";
|
||||
|
||||
import classes from "./classes.module.scss";
|
||||
|
||||
type IProps = {
|
||||
isOpen: boolean;
|
||||
onClose?: () => void;
|
||||
onRemindSuccess: () => void;
|
||||
customer: Customer;
|
||||
};
|
||||
|
||||
export default function ReminderModal(props: IProps) {
|
||||
const { isOpen, onClose, onRemindSuccess, customer } = props;
|
||||
|
||||
const onRemind = useCallback(() => {
|
||||
onRemindSuccess();
|
||||
onClose?.();
|
||||
}, [onClose, onRemindSuccess]);
|
||||
|
||||
return (
|
||||
<Modal
|
||||
isOpen={isOpen}
|
||||
onClose={onClose}
|
||||
title={`Relancer votre client ${customer.contact?.last_name}`}
|
||||
firstButton={{ children: "Annuler", onClick: onClose }}
|
||||
secondButton={{ children: "Relancer", onClick: onRemind }}>
|
||||
<div className={classes["root"]}>
|
||||
<Typography typo={ETypo.TEXT_MD_LIGHT}>
|
||||
Sélectionnez le(s) document(s) pour lequel vous souhaitez relancer le client.
|
||||
</Typography>
|
||||
</div>
|
||||
</Modal>
|
||||
);
|
||||
}
|
@ -1,18 +1,45 @@
|
||||
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 useOpenable from "@Front/Hooks/useOpenable";
|
||||
import { ClockIcon, EnvelopeIcon } from "@heroicons/react/24/outline";
|
||||
import Customer from "le-coffre-resources/dist/Customer";
|
||||
|
||||
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";
|
||||
|
||||
type IProps = {
|
||||
customer: Customer;
|
||||
};
|
||||
|
||||
export default function EmailReminder(props: IProps) {
|
||||
const { customer } = props;
|
||||
const { isOpen, open, close } = useOpenable();
|
||||
const router = useRouter();
|
||||
|
||||
let { folderUid } = router.query;
|
||||
|
||||
export default function EmailReminder() {
|
||||
return (
|
||||
<div className={classes["root"]}>
|
||||
<Button rightIcon={<EnvelopeIcon />} variant={EButtonVariant.PRIMARY} styletype={EButtonstyletype.OUTLINED} fullwidth>
|
||||
<Button
|
||||
onClick={open}
|
||||
rightIcon={<EnvelopeIcon />}
|
||||
variant={EButtonVariant.PRIMARY}
|
||||
styletype={EButtonstyletype.OUTLINED}
|
||||
fullwidth>
|
||||
Relancer par mail
|
||||
</Button>
|
||||
<div className={classes["reminder-info"]}>
|
||||
<IconButton icon={<ClockIcon />} variant={EIconButtonVariant.NEUTRAL} />
|
||||
<Link
|
||||
title={"Voir l'historique des relances"}
|
||||
href={Module.getInstance()
|
||||
.get()
|
||||
.modules.pages.Folder.pages.DocumentsReminderHistory.props.path.replace("[folderUid]", folderUid as string)}>
|
||||
<IconButton icon={<ClockIcon />} variant={EIconButtonVariant.NEUTRAL} />
|
||||
</Link>
|
||||
<div className={classes["info"]}>
|
||||
<Typography typo={ETypo.TEXT_XS_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
|
||||
Dernière relance: todo
|
||||
@ -22,6 +49,7 @@ export default function EmailReminder() {
|
||||
</Typography>
|
||||
</div>
|
||||
</div>
|
||||
<ReminderModal isOpen={isOpen} onRemindSuccess={() => {}} onClose={close} customer={customer} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -8,7 +8,7 @@ import { AnchorStatus } from "..";
|
||||
import classes from "./classes.module.scss";
|
||||
import ClientBox from "./ClientBox";
|
||||
import Button, { EButtonSize, EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
|
||||
import { DocumentIcon, EnvelopeIcon, UserPlusIcon } from "@heroicons/react/24/outline";
|
||||
import { DocumentIcon, UserPlusIcon } from "@heroicons/react/24/outline";
|
||||
import Module from "@Front/Config/Module";
|
||||
import Link from "next/link";
|
||||
import NoDocument from "./NoDocument";
|
||||
@ -115,7 +115,7 @@ export default function ClientView(props: IProps) {
|
||||
</Button>
|
||||
</Link>
|
||||
)}
|
||||
<EmailReminder />
|
||||
<EmailReminder customer={customer} />
|
||||
</div>
|
||||
{doesCustomerHaveDocument ? (
|
||||
<DocumentTables documents={customer.documents ?? []} folderUid={folder?.uid ?? ""} />
|
||||
|
@ -61,6 +61,13 @@
|
||||
"labelKey": "folder_information"
|
||||
}
|
||||
},
|
||||
"DocumentsReminderHistory": {
|
||||
"enabled": true,
|
||||
"props": {
|
||||
"path": "/folders/[folderUid]/documents-reminder-history",
|
||||
"labelKey": "documents_reminder_history"
|
||||
}
|
||||
},
|
||||
"CreateFolder": {
|
||||
"enabled": true,
|
||||
"props": {
|
||||
|
@ -61,6 +61,13 @@
|
||||
"labelKey": "folder_information"
|
||||
}
|
||||
},
|
||||
"DocumentsReminderHistory": {
|
||||
"enabled": true,
|
||||
"props": {
|
||||
"path": "/folders/[folderUid]/documents-reminder-history",
|
||||
"labelKey": "documents_reminder_history"
|
||||
}
|
||||
},
|
||||
"CreateFolder": {
|
||||
"enabled": true,
|
||||
"props": {
|
||||
|
@ -61,6 +61,13 @@
|
||||
"labelKey": "folder_information"
|
||||
}
|
||||
},
|
||||
"DocumentsReminderHistory": {
|
||||
"enabled": true,
|
||||
"props": {
|
||||
"path": "/folders/[folderUid]/documents-reminder-history",
|
||||
"labelKey": "documents_reminder_history"
|
||||
}
|
||||
},
|
||||
"CreateFolder": {
|
||||
"enabled": true,
|
||||
"props": {
|
||||
|
@ -61,6 +61,13 @@
|
||||
"labelKey": "folder_information"
|
||||
}
|
||||
},
|
||||
"DocumentsReminderHistory": {
|
||||
"enabled": true,
|
||||
"props": {
|
||||
"path": "/folders/[folderUid]/documents-reminder-history",
|
||||
"labelKey": "documents_reminder_history"
|
||||
}
|
||||
},
|
||||
"CreateFolder": {
|
||||
"enabled": true,
|
||||
"props": {
|
||||
|
@ -0,0 +1,5 @@
|
||||
import DocumentsReminderHistory from "@Front/Components/Layouts/Folder/DocumentsReminderHistory";
|
||||
|
||||
export default function Route() {
|
||||
return <DocumentsReminderHistory />;
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user