diff --git a/src/front/Assets/logo.svg b/src/front/Assets/logo.svg index ece53b5b..c79b2e66 100644 --- a/src/front/Assets/logo.svg +++ b/src/front/Assets/logo.svg @@ -1,38 +1,38 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - + - + \ No newline at end of file diff --git a/src/front/Components/DesignSystem/Document/DocumentNotary/index.tsx b/src/front/Components/DesignSystem/Document/DocumentNotary/index.tsx index 66374d71..768ab0a0 100644 --- a/src/front/Components/DesignSystem/Document/DocumentNotary/index.tsx +++ b/src/front/Components/DesignSystem/Document/DocumentNotary/index.tsx @@ -16,6 +16,7 @@ type IProps = { document_type: Document["document_type"]; document_status: Document["document_status"]; folder: Document["folder"]; + files?: Document["files"]; }; openDeletionModal?: (uid: Document["uid"]) => void; }; @@ -37,13 +38,31 @@ class DocumentNotaryClass extends React.Component {
{this.props.document?.document_type?.name} - Aucun document déposé + {this.getDocumentsTitle()}
{this.renderIcon()}
); } + private getDocumentsTitle(){ + const documentFiles = this.props.document.files; + if(documentFiles){ + if(documentFiles.length === 1){ + const fileName = documentFiles[0]?.file_path?.split("/").pop(); + if(fileName && fileName.length > 20){ + return `${fileName.substr(0, 7)}...${fileName.substr(fileName.length - 7, fileName.length)}`; + }else{ + return fileName; + } + }else{ + return `${documentFiles.length} documents déposés`; + } + }else{ + return "Aucun document déposé"; + } + } + private onClick() { if (this.props.document.document_status !== "VALIDATED" && this.props.document.document_status !== "PENDING") return; this.props.router.push(`/folders/${this.props.document.folder.uid}/documents/${this.props.document.uid}`); diff --git a/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx b/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx index de2e85d5..65386b9d 100644 --- a/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx +++ b/src/front/Components/DesignSystem/FolderBoxInformation/index.tsx @@ -28,7 +28,7 @@ export default function FolderBoxInformation(props: IProps) { .modules.pages.Folder.pages.EditDescription.props.path.replace("[folderUid]", props.folder.uid); const editInformationsPath = Module.getInstance() .get() - .modules.pages.Folder.pages.EditDescription.props.path.replace("[folderUid]", props.folder.uid); + .modules.pages.Folder.pages.EditInformations.props.path.replace("[folderUid]", props.folder.uid); const path = type === EFolderBoxInformationType.DESCRIPTION ? editDescriptionPath : editInformationsPath; return ( @@ -70,7 +70,7 @@ export default function FolderBoxInformation(props: IProps) { {folder.folder_number ?? ""}
- Type d’acte + Type d'acte {folder.deed.deed_type.name ?? ""}
diff --git a/src/front/Components/DesignSystem/FolderList/index.tsx b/src/front/Components/DesignSystem/FolderList/index.tsx index 778aad3c..cbb20bec 100644 --- a/src/front/Components/DesignSystem/FolderList/index.tsx +++ b/src/front/Components/DesignSystem/FolderList/index.tsx @@ -27,7 +27,10 @@ class FolderListClass extends React.Component { : Module.getInstance().get().modules.pages.Folder.pages.FolderInformation.props.path; return (
- {this.props.folders.map((folder) => { + {this.props.folders.sort((folder) => { + const pendingDocuments = folder.documents!.filter((document) => document.document_status === "PENDING"); + return pendingDocuments.length >= 1 ? -1 : 1; + }).map((folder) => { return (
{ + static override defaultProps: Partial = { + ...BaseField.defaultProps, + required: true + } + public override render(): ReactNode { let pattern; @@ -46,8 +51,9 @@ export default class InputField extends BaseField { className={ this.props.className ? [classes["textarea"], classes[this.props.className]].join(" ") : classes["textarea"] } + value={value} /> -
{this.props.fakeplaceholder}
+
{this.props.fakeplaceholder} {!this.props.required && " (Facultatif)"}
); @@ -66,14 +72,21 @@ export default class InputField extends BaseField { className={ this.props.className ? [classes["input"], classes[this.props.className]].join(" ") : classes["input"] } + value={value} /> -
{this.props.fakeplaceholder}
+
{this.props.fakeplaceholder} {!this.props.required && " (Facultatif)"}
); } } + public override componentDidMount() { + this.setState({ + value: this.props.defaultValue ?? "", + }) + } + // We filter the props we'll pass to the primitive input as they're useless for it // It also avoids the console warning because of passing useless props to a primitive DOM element private getHtmlAttributes() { diff --git a/src/front/Components/DesignSystem/Header/BurgerMenu/BurgerModal/index.tsx b/src/front/Components/DesignSystem/Header/BurgerMenu/BurgerModal/index.tsx index a45ef59a..7438163c 100644 --- a/src/front/Components/DesignSystem/Header/BurgerMenu/BurgerModal/index.tsx +++ b/src/front/Components/DesignSystem/Header/BurgerMenu/BurgerModal/index.tsx @@ -1,9 +1,9 @@ import LogOutButton from "@Front/Components/DesignSystem/LogOutButton"; +import Module from "@Front/Config/Module"; import React from "react"; import NavigationLink from "../../NavigationLink"; import classes from "./classes.module.scss"; -import Module from "@Front/Config/Module"; type IProps = { isOpen: boolean; @@ -19,8 +19,16 @@ export default class BurgerModal extends React.Component { <>
- - + +
diff --git a/src/front/Components/DesignSystem/Header/HeaderLink/index.tsx b/src/front/Components/DesignSystem/Header/HeaderLink/index.tsx index a2af0095..3c0ddf89 100644 --- a/src/front/Components/DesignSystem/Header/HeaderLink/index.tsx +++ b/src/front/Components/DesignSystem/Header/HeaderLink/index.tsx @@ -6,12 +6,15 @@ import React from "react"; import Typography, { ITypo } from "../../Typography"; import classes from "./classes.module.scss"; -type IPropsClass = { +type IProps = { text: string | JSX.Element; - path?: string; + path: string; isActive?: boolean; + routesActive?: string[]; }; +type IPropsClass = IProps; + type IStateClass = {}; class HeaderLinkClass extends React.Component { @@ -37,14 +40,15 @@ class HeaderLinkClass extends React.Component { } } -export default function HeaderLink(props: IPropsClass) { - /** - * TODO: We need to fix the check and include subPathName - * BUT - * `/folder/archived` and `/folder/xxx` should be differenciated - */ +export default function HeaderLink(props: IProps) { const router = useRouter(); const { pathname } = router; - const isActive = pathname === props.path; + let isActive = props.path === pathname; + if(props.routesActive){ + for (const routeActive of props.routesActive) { + if (isActive) break; + isActive = pathname.includes(routeActive); + } + } return ; } diff --git a/src/front/Components/DesignSystem/Header/Navigation/index.tsx b/src/front/Components/DesignSystem/Header/Navigation/index.tsx index 0319b1a3..0a1427a5 100644 --- a/src/front/Components/DesignSystem/Header/Navigation/index.tsx +++ b/src/front/Components/DesignSystem/Header/Navigation/index.tsx @@ -1,8 +1,8 @@ +import Module from "@Front/Config/Module"; import React from "react"; import HeaderLink from "../HeaderLink"; import classes from "./classes.module.scss"; -import Module from "@Front/Config/Module"; type IProps = {}; type IState = {}; @@ -11,10 +11,15 @@ export default class Navigation extends React.Component { public override render(): JSX.Element { return (
- +
); diff --git a/src/front/Components/DesignSystem/Header/NavigationLink/index.tsx b/src/front/Components/DesignSystem/Header/NavigationLink/index.tsx index ee9ace3b..19634137 100644 --- a/src/front/Components/DesignSystem/Header/NavigationLink/index.tsx +++ b/src/front/Components/DesignSystem/Header/NavigationLink/index.tsx @@ -2,18 +2,19 @@ import React from "react"; import classes from "./classes.module.scss"; import Link from "next/link"; import classNames from "classnames"; -import router from "next/router"; -import { useEffect, useState } from "react"; +import { useRouter } from "next/router"; import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography"; -type IPropsClass = { +type IProps = { text: string | JSX.Element; path?: string; onClick?: () => void; isEnabled?: boolean; isActive?: boolean; + routesActive?: string[]; }; +type IPropsClass = IProps; type IStateClass = {}; class NavigationLinkClass extends React.Component { @@ -33,9 +34,15 @@ class NavigationLinkClass extends React.Component { } } -export default function NavigationLink(props: IPropsClass) { - const [url, setUrl] = useState(""); - useEffect(() => setUrl(router?.asPath), []); - const isActive = url === props.path; +export default function NavigationLink(props: IProps) { + const router = useRouter(); + const { pathname } = router; + let isActive = props.path === pathname; + if(props.routesActive){ + for (const routeActive of props.routesActive) { + if (isActive) break; + isActive = pathname.includes(routeActive); + } + } return ; } diff --git a/src/front/Components/DesignSystem/Header/Profile/ProfileModal/index.tsx b/src/front/Components/DesignSystem/Header/Profile/ProfileModal/index.tsx index 49ec6729..2b08abc4 100644 --- a/src/front/Components/DesignSystem/Header/Profile/ProfileModal/index.tsx +++ b/src/front/Components/DesignSystem/Header/Profile/ProfileModal/index.tsx @@ -2,6 +2,7 @@ import React from "react"; import classes from "./classes.module.scss"; import NavigationLink from "../../NavigationLink"; import LogOutButton from "@Front/Components/DesignSystem/LogOutButton"; +import Module from "@Front/Config/Module"; type IProps = { isOpen: boolean; @@ -17,12 +18,9 @@ export default class ProfileModal extends React.Component { <>
- - - + - - +
diff --git a/src/front/Components/DesignSystem/Header/index.tsx b/src/front/Components/DesignSystem/Header/index.tsx index 23e4ca3f..e90524bc 100644 --- a/src/front/Components/DesignSystem/Header/index.tsx +++ b/src/front/Components/DesignSystem/Header/index.tsx @@ -8,7 +8,8 @@ import Notifications from "./Notifications"; import Profile from "./Profile"; import BurgerMenu from "./BurgerMenu"; import WindowStore from "@Front/Stores/WindowStore"; - +import Module from "@Front/Config/Module"; +import Head from "next/head"; enum EHeaderOpeningState { OPEN = "open", CLOSED = "closed", @@ -48,8 +49,11 @@ export default class Header extends React.Component { public override render(): JSX.Element { return (
+ + +
- + logo
diff --git a/src/front/Components/DesignSystem/RadioBox/classes.module.scss b/src/front/Components/DesignSystem/RadioBox/classes.module.scss index 2790b0ab..da7efcac 100644 --- a/src/front/Components/DesignSystem/RadioBox/classes.module.scss +++ b/src/front/Components/DesignSystem/RadioBox/classes.module.scss @@ -11,7 +11,7 @@ background-color: transparent; width: 16px; height: 16px; - border: 1px solid $green-flash; + border: 1px solid $turquoise-flash; border-radius: 100px; margin-right: 16px; display: grid; @@ -24,7 +24,7 @@ content: ""; width: 10px; height: 10px; - background-color: $green-flash; + background-color: $turquoise-flash; border-radius: 100px; transform: scale(0); } diff --git a/src/front/Components/DesignSystem/Typography/classes.module.scss b/src/front/Components/DesignSystem/Typography/classes.module.scss index 59d8e329..31a68d43 100644 --- a/src/front/Components/DesignSystem/Typography/classes.module.scss +++ b/src/front/Components/DesignSystem/Typography/classes.module.scss @@ -129,4 +129,16 @@ &.purple-flash { color: var(--purple-flash); } + + &.green-flash { + color: var(--green-flash); + } + + &.red-flash { + color: var(--red-flash); + } + + &.orange-flash { + color: var(--orange-flash); + } } diff --git a/src/front/Components/DesignSystem/Typography/index.tsx b/src/front/Components/DesignSystem/Typography/index.tsx index f3e799af..bd212c9b 100644 --- a/src/front/Components/DesignSystem/Typography/index.tsx +++ b/src/front/Components/DesignSystem/Typography/index.tsx @@ -35,6 +35,9 @@ export enum ITypoColor { GREY = "grey", BLACK = "black", PURPLE_FLASH = "purple-flash", + GREEN_FLASH = "green-flash", + ORANGE_FLASH = "orange-flash", + RED_FLASH = "red-flash", } export default class Typography extends React.Component { diff --git a/src/front/Components/DesignSystem/UserFolder/UserFolderHeader/index.tsx b/src/front/Components/DesignSystem/UserFolder/UserFolderHeader/index.tsx index 3ffe5317..7c84edd4 100644 --- a/src/front/Components/DesignSystem/UserFolder/UserFolderHeader/index.tsx +++ b/src/front/Components/DesignSystem/UserFolder/UserFolderHeader/index.tsx @@ -7,6 +7,7 @@ import PenIcon from "@Assets/Icons/pen.svg"; import WarningBadge from "../../WarningBadge"; import Link from "next/link"; import Module from "@Front/Config/Module"; +import { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard"; type IProps = { contact: { @@ -17,7 +18,7 @@ type IProps = { cell_phone_number: Contact["cell_phone_number"]; email: Contact["email"]; }; - selectedFolderUid: string; + folder: IDashBoardFolder; isArchived?: boolean; }; type IState = {}; @@ -29,7 +30,7 @@ export default class UserFolderHeader extends React.Component { public override render(): JSX.Element { const redirectPath = Module.getInstance() .get() - .modules.pages.Folder.pages.EditClient.props.path.replace("[folderUid]", this.props.selectedFolderUid) + .modules.pages.Folder.pages.EditClient.props.path.replace("[folderUid]", this.props.folder.uid) .replace("[clientUid]", this.props.contact.uid); return (
@@ -59,7 +60,7 @@ export default class UserFolderHeader extends React.Component {
{!this.props.isArchived && (
- + {this.hasPendingFiles() && } edit @@ -69,6 +70,14 @@ export default class UserFolderHeader extends React.Component { ); } + private hasPendingFiles(){ + const documents = this.props.folder.documents?.filter((document) => document.depositor.contact.uid === this.props.contact.uid) ?? []; + const notAskedDocuments = documents.filter((document) => document.document_status === "PENDING") ?? []; + console.log(this.props.contact.uid); + console.log(notAskedDocuments.length); + return notAskedDocuments.length > 0; + } + private formatPhoneNumber(phoneNumber: string): string { if (!phoneNumber) return ""; const output = phoneNumber.split("").map((char, index) => { diff --git a/src/front/Components/DesignSystem/UserFolder/index.tsx b/src/front/Components/DesignSystem/UserFolder/index.tsx index e0fc1d82..5e158fb3 100644 --- a/src/front/Components/DesignSystem/UserFolder/index.tsx +++ b/src/front/Components/DesignSystem/UserFolder/index.tsx @@ -68,7 +68,7 @@ export default class UserFolder extends React.Component {
{this.props.hasBackArrow && ( - <> -
- -
-
- -
- +
+ +
+ )} + {this.props.mobileBackText && ( +
+ +
)} {this.props.children}
diff --git a/src/front/Components/Layouts/DesignSystem/dummyData.ts b/src/front/Components/Layouts/DesignSystem/dummyData.ts index 0bef5a44..0f916fdc 100644 --- a/src/front/Components/Layouts/DesignSystem/dummyData.ts +++ b/src/front/Components/Layouts/DesignSystem/dummyData.ts @@ -39,7 +39,7 @@ export const deed: Deed = { }; export const contact: Contact = { - uid: "g('yeh(grgrezg", + uid: "contact_1_uid", first_name: "John", last_name: "Doe", email: "johnDoe@gmail.com", @@ -52,7 +52,7 @@ export const contact: Contact = { }; export const contact2: Contact = { - uid: "g('yeh(grgrezg", + uid: "contact_2_uid", first_name: "Customer2", last_name: "Doe", email: "johnDoe@gmail.com", @@ -73,6 +73,17 @@ export const docType: DocumentType = { private_description: "Acte de naissance private description", archived_at: new Date(), }; + +export const identityDocType: DocumentType = { + name: "Carte d'identité", + uid: "fezezfazegezrgrezg", + created_at: new Date(), + updated_at: new Date(), + public_description: "Carte d'identité public description", + private_description: "Carte d'identité private description", + archived_at: new Date(), +}; + export const customer: Customer = { uid: "erhtgerfzeare", contact: contact, @@ -80,6 +91,15 @@ export const customer: Customer = { updated_at: new Date(), status: ECustomerStatus.VALIDATED, }; + +export const customer2_mock: Customer = { + uid: "yregrgetergrt", + contact: contact2, + created_at: new Date(), + updated_at: new Date(), + status: ECustomerStatus.VALIDATED, +}; + export const folder: OfficeFolder = { uid: "mkovrijvrezviev", folder_number: "12331", @@ -97,7 +117,7 @@ export const folder: OfficeFolder = { export const document: Document = { uid: "fzeafergreztyzgrf", - depositor: customer, + depositor: customer2_mock, document_status: "ASKED", folder: folder, document_type: docType, @@ -123,20 +143,39 @@ export const fileMock2: File = { "https://minteed-prod-euwest3-s3.s3.eu-west-3.amazonaws.com/Qm_Wq_En1_DCA_8yt_RX_Qx_QFA_9_Fm_ZKZH_Qqb_VH_1_Q_Mnv_G_Jtt1_FS_Xp_2a35a36e19", }; +export const identityFile: File = { + uid: "identity_file_uid", + created_at: new Date(), + updated_at: new Date(), + document: document, + file_path: "https://minteed-stg-euwest3-s3.s3.eu-west-3.amazonaws.com/cni_fake_c7259d4923.png" +}; + +export const documentIdentity: Document = { + uid: "ethrthbkjtrbporjbh", + depositor: customer2_mock, + document_status: "PENDING", + folder: folder, + document_type: identityDocType, + updated_at: new Date(), + created_at: new Date(), + files: [identityFile], +}; + export const documentPending: Document = { uid: "fzefeazdagrtetrury", - depositor: customer, + depositor: customer2_mock, document_status: "PENDING", folder: folder, document_type: docType, updated_at: new Date(), created_at: new Date(), - files: [fileMock2], + files: [fileMock,fileMock2], }; export const documentDeposited: Document = { uid: "uè§u§htfgrthytrgr", - depositor: customer, + depositor: customer2_mock, document_status: "VALIDATED", folder: folder, document_type: docType, @@ -151,7 +190,7 @@ export const customer2: Customer = { created_at: new Date(), updated_at: new Date(), status: ECustomerStatus.VALIDATED, - documents: [document, documentPending, documentDeposited], + documents: [document, documentPending, documentDeposited, documentIdentity], }; export const folderWithPendingDocument: OfficeFolder = { @@ -165,7 +204,7 @@ export const folderWithPendingDocument: OfficeFolder = { updated_at: new Date(), description: "Description", archived_description: "Archived description", - documents: [document, documentPending, documentDeposited], + documents: [], }; export const folderWithPendingDocument1: OfficeFolder = { uid: "gtrtyutyhretgytu", @@ -221,7 +260,7 @@ export const folderWithPendingDocument3: OfficeFolder = { updated_at: new Date(), description: "Description", archived_description: "Archived description", - documents: [document, documentDeposited, documentPending], + documents: [document, documentDeposited, documentPending, documentIdentity], office_folder_has_customers: [officeFolderHasCustomer1, officeFolderHasCustomer2], }; diff --git a/src/front/Components/Layouts/Folder/AskDocuments/index.tsx b/src/front/Components/Layouts/Folder/AskDocuments/index.tsx index 46ab0cb5..7e93a30b 100644 --- a/src/front/Components/Layouts/Folder/AskDocuments/index.tsx +++ b/src/front/Components/Layouts/Folder/AskDocuments/index.tsx @@ -4,7 +4,7 @@ import CheckBox from "@Front/Components/DesignSystem/CheckBox"; import Form, { IApiFormErrors } from "@Front/Components/DesignSystem/Form"; import InputField from "@Front/Components/DesignSystem/Form/Elements/InputField"; import Confirm from "@Front/Components/DesignSystem/Modal/Confirm"; -import Select, { IOption } from "@Front/Components/DesignSystem/Select"; +import { IOption } from "@Front/Components/DesignSystem/Select"; import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography"; import BackArrow from "@Front/Components/Elements/BackArrow"; import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard"; @@ -15,19 +15,12 @@ import classes from "./classes.module.scss"; type IProps = {}; type IState = { - actType: IOption | null; isCreateDocumentModalVisible: boolean; documentName: string; visibleDescription: string; }; export default class AskDocuments extends BasePage { - private actsOptions: IOption[] = [ - { label: "Divorce", value: "divorce" }, - { label: "Succession", value: "succession" }, - { label: "Vente immobilière", value: "vente_immobiliere" }, - ]; - private documentsType: IOption[] = [ { label: "Carte d'identité", value: "carte_identite" }, { label: "Diagnostic État Risques et Pollution", value: "diagnostic_erep" }, @@ -46,13 +39,11 @@ export default class AskDocuments extends BasePage { super(props); this.state = { - actType: null, isCreateDocumentModalVisible: false, documentName: "", visibleDescription: "", }; - this.onActTypeChange = this.onActTypeChange.bind(this); this.onFormSubmit = this.onFormSubmit.bind(this); this.closeModal = this.closeModal.bind(this); this.openModal = this.openModal.bind(this); @@ -73,38 +64,27 @@ export default class AskDocuments extends BasePage {
- {!this.state.actType && ( - - +
@@ -70,6 +79,15 @@ class UpdateFolderMetadataClass extends BasePage { ); } + public override componentDidMount(): void { + this.setState({ + selectedOption: { + label: this.props.folder?.deed.deed_type?.name ?? "", + value: this.props.folder?.deed.deed_type?.uid ?? "", + }, + }); + } + private onSelectedOption(option: IOption) { this.setState({ selectedOption: option, @@ -85,5 +103,15 @@ export default function UpdateFolderMetadata() { const router = useRouter(); let { folderUid } = router.query; folderUid = folderUid as string; - return ; + const folder = folders.find((folder) => folder.uid === folderUid) ?? null; + return ; +} + +function formatDate(date: Date | null): string { + if (!date) return "..."; + return date.toLocaleDateString("fr-FR", { + year: "numeric", + month: "long", + day: "numeric", + }); } diff --git a/src/front/Components/Layouts/Folder/ViewDocuments/OcrResult/classes.module.scss b/src/front/Components/Layouts/Folder/ViewDocuments/OcrResult/classes.module.scss new file mode 100644 index 00000000..cf2472f7 --- /dev/null +++ b/src/front/Components/Layouts/Folder/ViewDocuments/OcrResult/classes.module.scss @@ -0,0 +1,37 @@ +@import "@Themes/constants.scss"; + +.root{ + background-color: var(--grey-soft); + padding: 24px; + + .result-text{ + color: rgba(0, 0, 0, 0.4); + } + + .result-container{ + display: flex; + + .percentage-container{ + display: flex; + align-items: center; + gap: 8px; + .dot{ + width: 11px; + height: 11px; + border-radius: 50px; + + &[data-color="green-flash"]{ + background-color: var(--green-flash); + } + + &[data-color="orange-flash"]{ + background-color: var(--orange-flash); + } + + &[data-color="red-flash"]{ + background-color: var(--red-flash); + } + } + } + } +} \ No newline at end of file diff --git a/src/front/Components/Layouts/Folder/ViewDocuments/OcrResult/index.tsx b/src/front/Components/Layouts/Folder/ViewDocuments/OcrResult/index.tsx new file mode 100644 index 00000000..f784dc1e --- /dev/null +++ b/src/front/Components/Layouts/Folder/ViewDocuments/OcrResult/index.tsx @@ -0,0 +1,41 @@ +import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography"; +import React from "react"; + +import classes from "./classes.module.scss"; + +type IProps = { + percentage: number; +}; + +type IState = {}; + +export default class OcrResult extends React.Component { + public override render(): JSX.Element | null { + return ( +
+ + Résultat de l'analyse : + +
+ + Document conforme à :  + +
+ + {this.props.percentage}% + +
+
+
+
+ ); + } + + private getColor() { + if (this.props.percentage > 75) { + return ITypoColor.GREEN_FLASH; + } else { + return ITypoColor.RED_FLASH; + } + } +} diff --git a/src/front/Components/Layouts/Folder/ViewDocuments/classes.module.scss b/src/front/Components/Layouts/Folder/ViewDocuments/classes.module.scss index 61d7d101..a3576e56 100644 --- a/src/front/Components/Layouts/Folder/ViewDocuments/classes.module.scss +++ b/src/front/Components/Layouts/Folder/ViewDocuments/classes.module.scss @@ -26,18 +26,27 @@ } .file-container{ + max-width: 1000px; + margin: auto; min-height: 700px; flex: 1; } } - .buttons-container { - display: flex; - gap: 24px; - justify-content: center; - margin-top: 32px; - @media (max-width: $screen-s) { - flex-direction: column-reverse; + .footer{ + width: fit-content; + margin: auto; + .ocr-container{ + margin-top: 42px; + } + .buttons-container { + display: flex; + gap: 24px; + justify-content: center; + margin-top: 32px; + @media (max-width: $screen-s) { + flex-direction: column-reverse; + } } } diff --git a/src/front/Components/Layouts/Folder/ViewDocuments/index.tsx b/src/front/Components/Layouts/Folder/ViewDocuments/index.tsx index 94a0545c..811be98a 100644 --- a/src/front/Components/Layouts/Folder/ViewDocuments/index.tsx +++ b/src/front/Components/Layouts/Folder/ViewDocuments/index.tsx @@ -1,4 +1,5 @@ import "reflect-metadata"; + import LeftArrowIcon from "@Assets/Icons/left-arrow.svg"; import RightArrowIcon from "@Assets/Icons/right-arrow.svg"; import ValidateAnchoringGif from "@Front/Assets/images/validate_anchoring.gif"; @@ -10,18 +11,18 @@ import Confirm from "@Front/Components/DesignSystem/Modal/Confirm"; import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography"; import { folders } from "@Front/Components/Layouts/DesignSystem/dummyData"; import DefaultNotaryDashboard from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard"; -import { Document } from "le-coffre-resources/dist/Customer"; +import { Document, File } from "le-coffre-resources/dist/Customer"; import Image from "next/image"; import { NextRouter, useRouter } from "next/router"; import React from "react"; import BasePage from "../../Base"; import classes from "./classes.module.scss"; +import OcrResult from "./OcrResult"; type IProps = {}; type IPropsClass = { - documentsList: Document[]; selectedDocument: Document | null; router: NextRouter; folderUid: string; @@ -32,8 +33,8 @@ type IState = { isValidateModalVisible: boolean; refuseText: string; hasValidateAnchoring: boolean; - selectedDocument: Document | null; - selectedDocumentIndex: number; + selectedFileIndex: number; + selectedFile: File | null; }; class ViewDocumentsClass extends BasePage { @@ -45,8 +46,8 @@ class ViewDocumentsClass extends BasePage { isRefuseModalVisible: false, refuseText: "", hasValidateAnchoring: false, - selectedDocument: null, - selectedDocumentIndex: -1, + selectedFileIndex: 0, + selectedFile: null, }; this.closeModals = this.closeModals.bind(this); @@ -64,37 +65,58 @@ class ViewDocumentsClass extends BasePage { public override render(): JSX.Element | null { return ( - {this.state.selectedDocument && ( + {this.props.selectedDocument && this.props.selectedDocument.files && this.state.selectedFile && (
App 23 rue Torus Toulon - - {this.state.selectedDocument.document_type.name} + + {this.props.selectedDocument.document_type.name}
- {this.props.documentsList.length > 1 && ( -
+ {this.props.selectedDocument.files.length > 1 && ( +
left arrow
)}
- {this.state.selectedDocument.files?.map((file) => ( - - ))} +
- {this.props.documentsList.length > 1 && ( -
+ {this.props.selectedDocument.files.length > 1 && ( +
right arrow
)}
-
- - - +
+ {this.props.selectedDocument?.document_type.name === "Carte d'identité" && ( +
+ +
+ )} + +
+ {this.props.selectedDocument?.document_status === "PENDING" && ( + <> + + + + + )} + {this.props.selectedDocument?.document_status === "VALIDATED" && ( + + + + )} +
{ closeBtn header={"Refuser le document ?"} cancelText={"Annuler"} - confirmText={"Refuser"} - canConfirm={this.state.refuseText !== ""}> + confirmText={"Refuser"}>
Veuillez indiquer au client le motif du refus de son document afin qu'il puisse vous renvoyer une bonne @@ -144,7 +165,7 @@ class ViewDocumentsClass extends BasePage {
)} - {!this.state.selectedDocument && ( + {(!this.state.selectedFile || !this.props.selectedDocument) && (
Document non trouvé @@ -156,52 +177,76 @@ class ViewDocumentsClass extends BasePage { } override componentDidMount(): void { - if (!this.props.selectedDocument) return; + if (!this.props.selectedDocument || !this.props.selectedDocument.files || !this.props.selectedDocument.files[0]) return; this.setState({ - selectedDocument: this.props.selectedDocument, - selectedDocumentIndex: this.props.documentsList.findIndex((doc) => doc.uid === this.props.selectedDocument!.uid), + selectedFile: this.props.selectedDocument.files[0], + selectedFileIndex: 0, }); } - override componentDidUpdate(prevProps: Readonly, prevState: Readonly, snapshot?: any): void { - if (prevProps.selectedDocument !== this.props.selectedDocument) { - this.setState({ - selectedDocument: this.props.selectedDocument, - selectedDocumentIndex: this.props.documentsList.findIndex((doc) => doc.uid === this.props.selectedDocument!.uid), - }); - } + private getRandomPercentageForOcr() { + // find diff + let difference = 100 - 90; + + // generate random number + let rand = Math.random(); + + // multiply with difference + rand = Math.floor(rand * difference); + + // add with min value + rand = rand + 90; + + return rand; } private goToPrevious() { + const index = this.state.selectedFileIndex - 1; if (this.hasPrevious()) { - this.props.router.push( - `/folders/${this.props.folderUid}/documents/${this.props.documentsList[this.state.selectedDocumentIndex - 1]!.uid}`, - ); + this.setState({ + selectedFile: this.props.selectedDocument!.files![index]!, + selectedFileIndex: index, + }); } } private goToNext() { if (this.hasNext()) { - this.props.router.push( - `/folders/${this.props.folderUid}/documents/${this.props.documentsList[this.state.selectedDocumentIndex + 1]!.uid}`, - ); + const index = this.state.selectedFileIndex + 1; + this.setState({ + selectedFile: this.props.selectedDocument!.files![index]!, + selectedFileIndex: index, + }); } } private hasPrevious() { - const index = this.state.selectedDocumentIndex - 1; + const index = this.state.selectedFileIndex - 1; return index >= 0; } private hasNext() { - const index = this.state.selectedDocumentIndex + 1; - return index < this.props.documentsList.length; + const index = this.state.selectedFileIndex + 1; + return index < this.props.selectedDocument!.files!.length; } private validateAnchoring() { this.setState({ hasValidateAnchoring: true, }); + + const timeoutDelay = 9800; + setTimeout(() => { + this.setState({ + isValidateModalVisible: false, + }); + }, timeoutDelay); + + setTimeout(() => { + this.setState({ + hasValidateAnchoring: false, + }); + }, timeoutDelay + 1000); } private onRefuseTextChange(e: React.ChangeEvent) { @@ -234,16 +279,9 @@ export default function ViewDocuments(props: IProps) { const router = useRouter(); let { folderUid, documentUid } = router.query; - const folder = folders[0]!; - const documents = folder.documents!.filter((document) => document.document_status !== "ASKED"); + const folder = folders.find((folder) => folder.uid === folderUid) ?? null; + console.log(folder); + const documents = folder?.documents!.filter((document) => document.document_status !== "ASKED") ?? []; const selectedDocument = documents.find((document) => document.uid === documentUid) ?? null; - return ( - - ); + return ; } diff --git a/src/front/Components/Layouts/Folder/index.tsx b/src/front/Components/Layouts/Folder/index.tsx index bfd2968a..0b012370 100644 --- a/src/front/Components/Layouts/Folder/index.tsx +++ b/src/front/Components/Layouts/Folder/index.tsx @@ -22,7 +22,7 @@ export default class Folder extends BasePage { // TODO: Message if the user has not created any folder yet public override render(): JSX.Element { return ( - +
Informations du dossier diff --git a/src/front/Components/Layouts/FolderArchived/index.tsx b/src/front/Components/Layouts/FolderArchived/index.tsx index 0cd42d76..93afb625 100644 --- a/src/front/Components/Layouts/FolderArchived/index.tsx +++ b/src/front/Components/Layouts/FolderArchived/index.tsx @@ -21,7 +21,7 @@ export default class Folder extends BasePage { // TODO: Message if the user has not created any folder yet public override render(): JSX.Element { return ( - +
Informations du dossier diff --git a/src/front/Components/Layouts/MyAccount/index.tsx b/src/front/Components/Layouts/MyAccount/index.tsx index 2eaa1316..03d5d198 100644 --- a/src/front/Components/Layouts/MyAccount/index.tsx +++ b/src/front/Components/Layouts/MyAccount/index.tsx @@ -25,10 +25,10 @@ export default class MyAccount extends Base {
- - - - + + + +
@@ -38,10 +38,15 @@ export default class MyAccount extends Base {
- - - - + + + +
diff --git a/src/front/Components/Layouts/PageNotFound/classes.module.scss b/src/front/Components/Layouts/PageNotFound/classes.module.scss index d044e590..30a6f4b3 100644 --- a/src/front/Components/Layouts/PageNotFound/classes.module.scss +++ b/src/front/Components/Layouts/PageNotFound/classes.module.scss @@ -6,4 +6,13 @@ align-items: center; justify-content: center; flex-direction: column; + text-align: center; + + .buttons-container{ + margin-top: 32px; + } + + @media(max-width: $screen-s){ + margin-top: 32px; + } } \ No newline at end of file diff --git a/src/front/Components/Layouts/PageNotFound/index.tsx b/src/front/Components/Layouts/PageNotFound/index.tsx index c8baf7d3..d7592019 100644 --- a/src/front/Components/Layouts/PageNotFound/index.tsx +++ b/src/front/Components/Layouts/PageNotFound/index.tsx @@ -1,20 +1,23 @@ +import Button from "@Front/Components/DesignSystem/Button"; +import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography"; import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate"; +import Module from "@Front/Config/Module"; import Link from "next/link"; + import BasePage from "../Base"; import classes from "./classes.module.scss"; -import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography"; -import Button from "@Front/Components/DesignSystem/Button"; -import Module from "@Front/Config/Module"; export default class PageNotFound extends BasePage { public override render(): JSX.Element { return (
- Il n'y a rien ici, la page que vous avez demandé n'existe pas - - - + Il n'y a rien ici, la page que vous avez demandée n'existe pas +
+ + + +
); diff --git a/src/front/Config/Module/development.json b/src/front/Config/Module/development.json index b449fef6..1702ebb5 100644 --- a/src/front/Config/Module/development.json +++ b/src/front/Config/Module/development.json @@ -6,7 +6,7 @@ "Home": { "enabled": true, "props": { - "path": "/", + "path": "/folders", "labelKey": "homepage" } }, diff --git a/src/front/Config/Module/preprod.json b/src/front/Config/Module/preprod.json index b449fef6..1702ebb5 100644 --- a/src/front/Config/Module/preprod.json +++ b/src/front/Config/Module/preprod.json @@ -6,7 +6,7 @@ "Home": { "enabled": true, "props": { - "path": "/", + "path": "/folders", "labelKey": "homepage" } }, diff --git a/src/front/Config/Module/production.json b/src/front/Config/Module/production.json index b449fef6..1702ebb5 100644 --- a/src/front/Config/Module/production.json +++ b/src/front/Config/Module/production.json @@ -6,7 +6,7 @@ "Home": { "enabled": true, "props": { - "path": "/", + "path": "/folders", "labelKey": "homepage" } }, diff --git a/src/front/Config/Module/staging.json b/src/front/Config/Module/staging.json index b449fef6..1702ebb5 100644 --- a/src/front/Config/Module/staging.json +++ b/src/front/Config/Module/staging.json @@ -6,7 +6,7 @@ "Home": { "enabled": true, "props": { - "path": "/", + "path": "/folders", "labelKey": "homepage" } }, diff --git a/src/front/Themes/constants.scss b/src/front/Themes/constants.scss index 00a254a8..dea3df9f 100644 --- a/src/front/Themes/constants.scss +++ b/src/front/Themes/constants.scss @@ -1,6 +1,6 @@ // $screen-xl: 2559px; $screen-l: 1440px; -$screen-ls: 1300px; +$screen-ls: 1280px; $screen-m: 1023px; $screen-s: 767px; // $screen-xs: 424px;