This commit is contained in:
VincentAlamelle 2024-11-12 10:40:22 +01:00 committed by GitHub
commit 731122f3d2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
13 changed files with 150 additions and 35 deletions

View File

@ -33,5 +33,12 @@
@media screen and (max-width: $screen-s) {
display: none;
}
.text {
max-height: 60px;
overflow-y: auto;
white-space: normal;
word-break: break-all;
}
}
}

View File

@ -79,9 +79,7 @@ export default function ContactBox(props: IProps) {
{notaryContact?.email ?? "_"}
</Typography>
</div>
<div className={classes["note-and-rib-button"]}>
{noteAndRibButton()}
</div>
<div className={classes["note-and-rib-button"]}>{noteAndRibButton()}</div>
</div>
<div className={classes["right"]}>{noteAndRibButton()}</div>
@ -95,7 +93,7 @@ export default function ContactBox(props: IProps) {
<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.COLOR_NEUTRAL_700}>
Note dossier
</Typography>
<Typography typo={ETypo.TEXT_LG_REGULAR} color={ETypoColor.COLOR_NEUTRAL_950}>
<Typography typo={ETypo.TEXT_LG_REGULAR} type="span" color={ETypoColor.COLOR_NEUTRAL_950} className={classes["text"]}>
{note?.content ?? "-"}
</Typography>
</div>
@ -107,7 +105,7 @@ export default function ContactBox(props: IProps) {
size={EButtonSize.LG}
styletype={EButtonstyletype.CONTAINED}
rightIcon={<ArrowDownTrayIcon />}>
Télécharger le RIB
Télécharger le RIB de mon notaire
</Button>
)}
</>

View File

@ -11,6 +11,12 @@
display: flex;
flex-direction: column;
gap: var(--spacing-sm, 8px);
.refused-link {
color: var(--color-danger-500);
text-decoration: underline !important;
cursor: pointer;
}
}
@media screen and (max-width: $screen-s) {

View File

@ -1,11 +1,12 @@
import DragAndDrop, { IDocumentFileWithUid } from "@Front/Components/DesignSystem/DragAndDrop";
import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
import { Document } from "le-coffre-resources/dist/Customer";
import { useCallback, useMemo } from "react";
import { useCallback, useMemo, useState } from "react";
import classes from "./classes.module.scss";
import Files from "@Front/Api/LeCoffreApi/Customer/Files/Files";
import { ToasterService } from "@Front/Components/DesignSystem/Toaster";
import Confirm from "@Front/Components/DesignSystem/OldModal/Confirm";
type IProps = {
document: Document;
@ -14,6 +15,8 @@ type IProps = {
export default function DepositDocumentComponent(props: IProps) {
const { document, onChange } = props;
const [isModalOpen, setIsModalOpen] = useState(false);
const [refused_reason, setRefusedReason] = useState<string | null>(null);
const defaultFiles: IDocumentFileWithUid[] = useMemo(() => {
const filesNotArchived = document.files?.filter((file) => !file.archived_at) ?? [];
@ -27,7 +30,8 @@ export default function DepositDocumentComponent(props: IProps) {
const addFile = useCallback(
(file: File) => {
const formData = new FormData();
formData.append("file", file, file.name);
const safeFileName = file.name.normalize("NFD").replace(/[\u0300-\u036f]/g, "");
formData.append("file", file, safeFileName);
const query = JSON.stringify({ document: { uid: document.uid } });
formData.append("q", query);
return Files.getInstance()
@ -50,6 +54,17 @@ export default function DepositDocumentComponent(props: IProps) {
[onChange],
);
const onOpenModal = useCallback(async () => {
const refused_reason = document.document_history?.find((history) => history.document_status === "REFUSED")?.refused_reason;
if (!refused_reason) return;
setRefusedReason(refused_reason);
setIsModalOpen(true);
}, []);
const closeModal = useCallback(() => {
setIsModalOpen(false);
}, []);
return (
<div className={classes["root"]}>
<div className={classes["title"]}>
@ -59,8 +74,37 @@ export default function DepositDocumentComponent(props: IProps) {
<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
Demandé le: {document.created_at ? new Date(document.created_at).toLocaleDateString() : "_"}
</Typography>
{document.document_status === "REFUSED" && (
<div>
<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.TEXT_SECONDARY}>
Refusé le : {document.updated_at ? new Date(document.updated_at).toLocaleDateString() : "_"}
</Typography>
<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.ERROR_WEAK_CONTRAST} onClick={onOpenModal}>
Document non-conforme{" : "} <a className={classes["refused-link"]}>Voir le motif de refus</a>
</Typography>
</div>
)}
</div>
<Confirm
isOpen={isModalOpen}
showCancelButton={false}
onAccept={closeModal}
onClose={closeModal}
closeBtn
header={"Motif de refus"}
confirmText={"J'ai compris"}>
<div className={classes["modal-content"]}>
<Typography typo={ETypo.TEXT_MD_SEMIBOLD} className={classes["text"]}>
Votre document a é refusé pour la raison suivante :
</Typography>
<br />
<Typography typo={ETypo.TEXT_MD_REGULAR} className={classes["text"]}>
{refused_reason}
</Typography>
</div>
</Confirm>
<DragAndDrop
title={"Glisser-déposer ou"}
description={document.document_type?.public_description ?? undefined}

View File

@ -18,6 +18,7 @@ import NotificationBox from "@Front/Components/DesignSystem/NotificationBox";
import ContactBox from "./ContactBox";
import DocumentsNotary from "@Front/Api/LeCoffreApi/Customer/DocumentsNotary/DocumentsNotary";
import { EDocumentNotaryStatus } from "le-coffre-resources/dist/Notary/DocumentNotary";
// import DepositOtherDocument from "@Front/Components/DesignSystem/DepositOtherDocument";
import Tag, { ETagColor } from "@Front/Components/DesignSystem/Tag";
import DefaultCustomerDashboard from "@Front/Components/LayoutTemplates/DefaultCustomerDashboard";
@ -36,6 +37,7 @@ export default function ClientDashboard(props: IProps) {
const [customer, setCustomer] = useState<Customer | null>(null);
const [folder, setFolder] = useState<OfficeFolderNotary | null>(null);
const [documentsNotary, setDocumentsNotary] = useState<DocumentNotary[]>([]);
// const [isAddDocumentModalVisible, setIsAddDocumentModalVisible] = useState<boolean>(false);
const fetchFolderAndCustomer = useCallback(async () => {
let jwt: ICustomerJwtPayload | undefined;
@ -120,6 +122,34 @@ export default function ClientDashboard(props: IProps) {
[documentsNotary],
);
// const onCloseModalAddDocument = useCallback(() => {
// setIsAddDocumentModalVisible(false);
// fetchFolderAndCustomer();
// }, [fetchFolderAndCustomer]);
// const onOpenModalAddDocument = useCallback(() => {
// setIsAddDocumentModalVisible(true);
// }, []);
// const renderBox = useCallback(() => {
// console.log(folder!.office!.uid);
// return (
// <DepositOtherDocument
// folder_uid={folderUid!}
// customer_uid={customer!.uid!}
// open={isAddDocumentModalVisible}
// onClose={onCloseModalAddDocument}
// document={Document.hydrate<Document>({
// document_type: DocumentType.hydrate<DocumentType>({
// name: "Autres documents",
// office: folder!.office!,
// }),
// })}
// />
// );
// }, [customer, folderUid, isAddDocumentModalVisible, onCloseModalAddDocument]);
return (
<DefaultCustomerDashboard>
<div className={classes["root"]}>
@ -206,6 +236,18 @@ export default function ClientDashboard(props: IProps) {
))}
</div>
</div>
<Typography typo={ETypo.TITLE_H3}>Documents supplémentaires (facultatif)</Typography>
<Typography typo={ETypo.TEXT_MD_REGULAR} className={classes["text"]}>
Vous souhaitez envoyer d'autres documents à votre notaire ?
</Typography>
{/* <Button
variant={EButtonVariant.PRIMARY}
styletype={EButtonstyletype.OUTLINED}
className={classes["button"]}
onClick={onOpenModalAddDocument}>
Ajouter d'autres documents
</Button>
{isAddDocumentModalVisible && renderBox()} */}
</div>
</DefaultCustomerDashboard>
);

View File

@ -18,4 +18,11 @@
.delete-button {
margin: auto;
}
.text {
max-height: 60px;
overflow-y: auto;
white-space: normal;
word-wrap: break-word;
}
}

View File

@ -98,7 +98,7 @@ export default function ClientBox(props: IProps) {
<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.COLOR_NEUTRAL_700}>
Note client
</Typography>
<Typography typo={ETypo.TEXT_LG_REGULAR} color={ETypoColor.COLOR_NEUTRAL_950}>
<Typography typo={ETypo.TEXT_LG_REGULAR} type="span" color={ETypoColor.COLOR_NEUTRAL_950} className={classes["text"]}>
{customerNote?.content ?? "-"}
</Typography>
</div>

View File

@ -1,6 +1,7 @@
@import "@Themes/constants.scss";
$mobile-breakpoint: 600px;
$tablet-breakpoint: 1024px;
.root {
display: flex;
@ -21,7 +22,6 @@ $mobile-breakpoint: 600px;
justify-content: space-between;
align-items: center;
gap: var(--spacing-lg, 24px);
}
.open-date {
@ -92,11 +92,11 @@ $mobile-breakpoint: 600px;
word-wrap: break-word;
}
&.desktop {
@media screen and (max-width: $screen-s) {
display: none;
}
}
// &.desktop {
// @media screen and (max-width: $screen-s) {
// display: none;
// }
// }
&.ipad {
display: none;
@ -104,17 +104,17 @@ $mobile-breakpoint: 600px;
display: block;
}
@media screen and (max-width: $mobile-breakpoint) {
@media screen and (max-width: $tablet-breakpoint) {
display: none;
}
}
&.mobile {
display: none;
@media screen and (max-width: $mobile-breakpoint) {
display: block;
}
}
// &.mobile {
// display: none;
// @media screen and (max-width: $mobile-breakpoint) {
// display: block;
// }
// }
}
.separator {

View File

@ -129,7 +129,7 @@ export default function InformationSection(props: IProps) {
<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.COLOR_NEUTRAL_700}>
Note du dossier
</Typography>
<Typography typo={ETypo.TEXT_LG_REGULAR} className={classes["text"]}>
<Typography typo={ETypo.TEXT_LG_REGULAR} type="span" className={classes["text"]}>
{folder?.description}
</Typography>
</div>
@ -154,11 +154,11 @@ export default function InformationSection(props: IProps) {
{!isArchived && <IconButton onClick={onArchive} icon={<ArchiveBoxIcon />} variant={EIconButtonVariant.ERROR} />}
</div>
</div>
<div className={classNames(classes["description-container"], classes["desktop"], classes["mobile"])}>
<div className={classNames(classes["description-container"])}>
<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.COLOR_NEUTRAL_700}>
Note du dossier
</Typography>
<Typography typo={ETypo.TEXT_LG_REGULAR} className={classes["text"]}>
<Typography typo={ETypo.TEXT_LG_REGULAR} type="span" className={classes["text"]}>
{folder?.description}
</Typography>
</div>

View File

@ -83,7 +83,7 @@ export default function StepEmail(props: IProps) {
<div className={classes["content"]}>
<div className={classes["section"]}>
<Typography typo={ETypo.TITLE_H6} color={ETypoColor.TEXT_ACCENT} className={classes["section-title"]}>
Pour les notaires :
Pour les notaires et les colaborateurs :
</Typography>
<Button onClick={redirectUserOnConnection} rightIcon={<Image alt="id-not-logo" src={idNoteLogo} />}>
S'identifier avec ID.not

View File

@ -34,7 +34,7 @@ export default function MyAccount() {
}, []);
return (
<DefaultDoubleSidePage title={"Mon Compte"} image={backgroundImage}>
<DefaultDoubleSidePage title={"Mon Compte"} image={backgroundImage} showHeader={true}>
<div className={classes["root"]}>
<div className={classes["title-container"]}>
<Typography typo={ETypo.TITLE_H1} color={ETypoColor.TEXT_PRIMARY}>
@ -47,7 +47,14 @@ export default function MyAccount() {
<Form className={classes["form"]}>
<TextField name="name" label="Nom" placeholder="Nom" defaultValue={user?.contact?.last_name} readonly canCopy />
<TextField name="surname" label="Prénom" placeholder="Prénom" defaultValue={user?.contact?.first_name} readonly canCopy />
<TextField
name="surname"
label="Prénom"
placeholder="Prénom"
defaultValue={user?.contact?.first_name}
readonly
canCopy
/>
<TextField name="email" label="E-mail" placeholder="E-mail" defaultValue={user?.contact?.email} readonly canCopy />
<TextField
name="phone"
@ -72,7 +79,14 @@ export default function MyAccount() {
readonly
canCopy
/>
<TextField name="crpcen" label="CRPCEN" placeholder="CRPCEN" defaultValue={user?.office_membership?.crpcen} readonly canCopy />
<TextField
name="crpcen"
label="CRPCEN"
placeholder="CRPCEN"
defaultValue={user?.office_membership?.crpcen}
readonly
canCopy
/>
<TextField
name="cp_address"
label="Adresse"

View File

@ -44,7 +44,8 @@ export default class PageNotFound extends BasePage {
<HelpBox
title="Vous avez des questions ?"
description="Notre équipe de support est là pour vous aider."
button={{ text: "Contactez le support" }}
//Button with onclick that redirect to a custom url
button={{ text: "Contactez le support", onClick: () => window.open("https://tally.so/r/mBGaNY") }}
/>
</div>
</DefaultDoubleSidePage>

View File

@ -8,7 +8,7 @@ import Form from "@Front/Components/DesignSystem/Form";
import Subscriptions from "@Front/Api/LeCoffreApi/Admin/Subscriptions/Subscriptions";
import { useCallback, useState } from "react";
import { TrashIcon } from "@heroicons/react/24/outline";
import PlusIcon from "@Assets/Icons/plus.svg";
// import PlusIcon from "@Assets/Icons/plus.svg";
import Module from "@Front/Config/Module";
type EmailLine = {
@ -108,11 +108,7 @@ export default function SubscriptionInvite() {
))}
{isNaN(nbOfCollaborators) && (
<div className={classes["add-line-container"]}>
<Button
onClick={addLine}
variant={EButtonVariant.PRIMARY}
styletype={EButtonstyletype.TEXT}
rightIcon={<PlusIcon />}>
<Button onClick={addLine} variant={EButtonVariant.PRIMARY} styletype={EButtonstyletype.TEXT}>
Ajouter une adresse email
</Button>
</div>