4nk/lecoffre-front
4
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Merge branch 'dev' into feature/add-customer-to-folders

Browse Source
This commit is contained in:
Maxime Lalo 2023-05-05 17:21:37 +02:00
commit 30ff851001
10 changed files with 138 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -12,6 +12,7 @@ dist/
# next.js
/.next/
/out/
dist/
# production
/build

80
src/front/Api/LeCoffreApi/SuperAdmin/Documents/Documents.ts Normal file
View File

@ -0,0 +1,80 @@
import { Document } from "le-coffre-resources/dist/SuperAdmin";
import { Service } from "typedi";
import BaseSuperAdmin from "../BaseSuperAdmin";
// TODO Type get query params -> Where + inclue + orderby
export interface IGetDocumentsparams {
where?: {};
include?: {};
}
// TODO Type getbyuid query params
export type IPutDocumentsParams = {};
export interface IPostDocumentsParams {}
@Service()
export default class Documents extends BaseSuperAdmin {
private static instance: Documents;
private readonly baseURl = this.namespaceUrl.concat("/documents");
private constructor() {
super();
}
public static getInstance() {
if (!this.instance) {
return new this();
} else {
return this.instance;
}
}
public async get(q: IGetDocumentsparams): Promise<Document[]> {
const url = new URL(this.baseURl);
Object.entries(q).forEach(([key, value]) => url.searchParams.set(key, JSON.stringify(value)));
try {
return await this.getRequest<Document[]>(url);
} catch (err) {
this.onError(err);
return Promise.reject(err);
}
}
/**
* @description : Create a Document
*/
public async post(body: any): Promise<Document> {
const url = new URL(this.baseURl);
try {
return await this.postRequest<Document>(url, body);
} catch (err) {
this.onError(err);
return Promise.reject(err);
}
}
public async getByUid(uid: string, q?: any): Promise<Document> {
const url = new URL(this.baseURl.concat(`/${uid}`));
const query = { q };
if (q) Object.entries(query).forEach(([key, value]) => url.searchParams.set(key, JSON.stringify(value)));
try {
return await this.getRequest<Document>(url);
} catch (err) {
this.onError(err);
return Promise.reject(err);
}
}
public async put(uid: string, body: IPutDocumentsParams): Promise<Document> {
const url = new URL(this.baseURl.concat(`/${uid}`));
try {
return await this.putRequest<Document>(url, body);
} catch (err) {
this.onError(err);
return Promise.reject(err);
}
}
}

2
src/front/Components/DesignSystem/Document/DocumentNotary/classes.module.scss
View File

@ -6,7 +6,7 @@
display: flex;
justify-content: space-between;
align-items: center;
&.PENDING {
&.DEPOSITED {
cursor: pointer;
border: 1px solid $orange-soft;
&:hover {

5
src/front/Components/DesignSystem/Document/DocumentNotary/index.tsx
View File

@ -12,6 +12,7 @@ import classes from "./classes.module.scss";
import { EDocumentStatus } from "le-coffre-resources/dist/Customer/Document";
type IProps = {
folderUid: string;
document: {
uid?: Document["uid"];
document_type?: Document["document_type"];
@ -52,7 +53,7 @@ class DocumentNotaryClass extends React.Component<IPropsClass, IState> {
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)}`;
return `${fileName.substring(0, 7)}...${fileName.substring(fileName.length - 7, fileName.length)}`;
} else {
return fileName;
}
@ -66,7 +67,7 @@ class DocumentNotaryClass extends React.Component<IPropsClass, IState> {
private onClick() {
if (this.props.document.document_status !== EDocumentStatus.VALIDATED && this.props.document.document_status !== EDocumentStatus.DEPOSITED) return;
this.props.router.push(`/folders/${this.props.document.folder?.uid}/documents/${this.props.document.uid}`);
this.props.router.push(`/folders/${this.props.folderUid}/documents/${this.props.document.uid}`);
}
private renderIcon(): JSX.Element {

3
src/front/Components/DesignSystem/UserFolder/DocumentList/index.tsx
View File

@ -16,6 +16,7 @@ type IProps = {
}[]
| null;
openDeletionModal: (uid: Document["uid"]) => void;
folderUid: string;
};
type IState = {};
@ -31,7 +32,7 @@ export default class DocumentList extends React.Component<IProps, IState> {
{this.props.documents &&
this.props.documents.map((document) => {
return (
<DocumentNotary document={document} key={document.uid} openDeletionModal={this.props.openDeletionModal} />
<DocumentNotary folderUid={this.props.folderUid} document={document} key={document.uid} openDeletionModal={this.props.openDeletionModal} />
);
})}
</div>

4
src/front/Components/DesignSystem/UserFolder/index.tsx
View File

@ -88,6 +88,7 @@ export default class UserFolder extends React.Component<IProps, IState> {
documents={documentsAsked}
title="Documents demandés"
openDeletionModal={this.openDeletionModal}
folderUid={this.props.folder.uid!}
/>
<DocumentList
documents={otherDocuments}
@ -98,6 +99,7 @@ export default class UserFolder extends React.Component<IProps, IState> {
: "Vous n'avez aucun document à valider"
}
openDeletionModal={this.openDeletionModal}
folderUid={this.props.folder.uid!}
/>
</div>
{!this.props.isArchived && (
@ -130,7 +132,7 @@ export default class UserFolder extends React.Component<IProps, IState> {
private getDocumentsByStatus(status: string): Document[] | null {
if (!this.props.customer.documents) return null;
const filteredDocuments = this.props.customer.documents.filter(
(document) => document.document_status === status && document.folder?.uid === this.props.folder.uid,
(document) => document.document_status === status,
);
return filteredDocuments;
}

6
src/front/Components/Layouts/DesignSystem/index.tsx
View File

@ -217,20 +217,20 @@ export default class DesignSystem extends BasePage<IProps, IState> {
<div className={classes["sub-section"]}>
<Typography typo={ITypo.P_16}>Documents ASKED</Typography>
<div className={classes["folder-conatainer"]}>
<DocumentNotary document={document} />
<DocumentNotary document={document} folderUid="" />
</div>
</div>
<div className={classes["sub-section"]}>
<Typography typo={ITypo.P_16}>Documents Depoited</Typography>
<div className={classes["folder-conatainer"]}>
<DocumentNotary document={documentPending} />
<DocumentNotary document={documentPending} folderUid=""/>
</div>
</div>
<div className={classes["sub-section"]}>
<Typography typo={ITypo.P_16}>Documents VALIDATED</Typography>
<div className={classes["folder-conatainer"]}>
<DocumentNotary document={documentDeposited} />
<DocumentNotary document={documentDeposited} folderUid="" />
</div>
</div>
</div>

2
src/front/Components/Layouts/Folder/FolderInformation/ClientSection/index.tsx
View File

@ -60,7 +60,7 @@ export default class ClientSection extends React.Component<IProps, IState> {
}
private renderCustomerFolders() {
const output = this.props.folder.office_folder_has_customers?.map((folderHasCustomer, index) => {
const output = this.props.folder.office_folder_has_customers?.map((folderHasCustomer) => {
if (!folderHasCustomer.customer) return null;
return (
<UserFolder

12
src/front/Components/Layouts/Folder/FolderInformation/index.tsx
View File

@ -1,6 +1,7 @@
import "reflect-metadata";
import ChevronIcon from "@Assets/Icons/chevron.svg";
import Folders from "@Front/Api/LeCoffreApi/SuperAdmin/Folders/Folders";
import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
import FolderBoxInformation, { EFolderBoxInformationType } from "@Front/Components/DesignSystem/FolderBoxInformation";
import InputField from "@Front/Components/DesignSystem/Form/Elements/InputField";
@ -9,8 +10,12 @@ import QuantityProgressBar from "@Front/Components/DesignSystem/QuantityProgress
import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography";
import DefaultNotaryDashboard, { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
import Module from "@Front/Config/Module";
import { OfficeFolder } from "le-coffre-resources/dist/Customer";
import { EDocumentStatus } from "le-coffre-resources/dist/Notary/Document";
import Link from "next/link";
import { NextRouter, useRouter } from "next/router";
import { ChangeEvent } from "react";
import BasePage from "../../Base";
import classes from "./classes.module.scss";
import ClientSection from "./ClientSection";
@ -19,6 +24,7 @@ import Folders, { IPutFoldersParams } from "@Front/Api/LeCoffreApi/SuperAdmin/Fo
import { OfficeFolder } from "le-coffre-resources/dist/Customer";
import { ChangeEvent } from "react";
type IProps = {};
type IPropsClass = IProps & {
@ -183,7 +189,11 @@ class FolderInformationClass extends BasePage<IPropsClass, IState> {
q: {
deed: { include: { deed_type: true } },
office: true,
office_folder_has_customers: { include: { customer: { include: { contact: true } } } },
office_folder_has_customers: { include: { customer: { include: { contact: true, documents: {
include: {
files: true
}
} } } } },
documents: {
include: {
depositor: {

58
src/front/Components/Layouts/Folder/ViewDocuments/index.tsx
View File

@ -9,7 +9,6 @@ import FilePreview from "@Front/Components/DesignSystem/FilePreview";
import InputField from "@Front/Components/DesignSystem/Form/Elements/InputField";
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, File } from "le-coffre-resources/dist/Customer";
import Image from "next/image";
@ -20,11 +19,12 @@ import BasePage from "../../Base";
import classes from "./classes.module.scss";
import OcrResult from "./OcrResult";
import { EDocumentStatus } from "le-coffre-resources/dist/Customer/Document";
import Documents from "@Front/Api/LeCoffreApi/SuperAdmin/Documents/Documents";
type IProps = {};
type IPropsClass = {
selectedDocument: Document | null;
documentUid: string;
router: NextRouter;
folderUid: string;
};
@ -37,6 +37,7 @@ type IState = {
selectedFileIndex: number;
selectedFile: File | null;
validatedPercentage: number;
document: Document | null;
};
class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
@ -50,7 +51,8 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
hasValidateAnchoring: false,
selectedFileIndex: 0,
selectedFile: null,
validatedPercentage: this.getRandomPercentageForOcr()
validatedPercentage: this.getRandomPercentageForOcr(),
document: null,
};
this.closeModals = this.closeModals.bind(this);
@ -68,16 +70,16 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
public override render(): JSX.Element | null {
return (
<DefaultNotaryDashboard title={"Demander des documents"} hasBackArrow mobileBackText="Retour aux documents">
{this.props.selectedDocument && this.props.selectedDocument.files && this.state.selectedFile && (
{this.state.document && this.state.document.files && this.state.selectedFile && (
<div className={classes["root"]}>
<Typography typo={ITypo.H1} color={ITypoColor.BLACK} className={classes["title"]}>
App 23 rue Torus Toulon
</Typography>
<Typography typo={ITypo.H3} color={ITypoColor.BLACK} className={classes["subtitle"]}>
{this.props.selectedDocument.document_type?.name}
{this.state.document.document_type?.name}
</Typography>
<div className={classes["document-container"]}>
{this.props.selectedDocument.files.length > 1 && (
{this.state.document.files.length > 1 && (
<div
className={classes["arrow-container"]}
onClick={this.goToPrevious}
@ -88,7 +90,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
<div className={classes["file-container"]}>
<FilePreview href={this.state.selectedFile.file_path as string} key={this.state.selectedFile.uid} />
</div>
{this.props.selectedDocument.files.length > 1 && (
{this.state.document.files.length > 1 && (
<div
className={classes["arrow-container"]}
onClick={this.goToNext}
@ -98,14 +100,14 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
)}
</div>
<div className={classes["footer"]}>
{this.props.selectedDocument?.document_type?.name === "Carte d'identité" && (
{this.state.document?.document_type?.name === "Carte d'identité" && (
<div className={classes["ocr-container"]}>
<OcrResult percentage={this.state.validatedPercentage} />
</div>
)}
<div className={classes["buttons-container"]}>
{this.props.selectedDocument?.document_status === EDocumentStatus.DEPOSITED && (
{this.state.document?.document_status === EDocumentStatus.DEPOSITED && (
<>
<Button variant={EButtonVariant.GHOST} onClick={this.openRefuseModal}>
Refuser
@ -114,7 +116,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
<Button disabled>Télécharger</Button>
</>
)}
{this.props.selectedDocument?.document_status === "VALIDATED" && (
{this.state.document?.document_status === "VALIDATED" && (
<a href={this.state.selectedFile.file_path!} download target="_blank">
<Button>Télécharger</Button>
</a>
@ -168,7 +170,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
</Confirm>
</div>
)}
{(!this.state.selectedFile || !this.props.selectedDocument) && (
{(!this.state.selectedFile || !this.state.document) && (
<div className={classes["root"]}>
<Typography typo={ITypo.P_16} color={ITypoColor.BLACK} className={classes["refuse-text"]}>
Document non trouvé
@ -179,12 +181,20 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
);
}
override componentDidMount(): void {
if (!this.props.selectedDocument || !this.props.selectedDocument.files || !this.props.selectedDocument.files[0]) return;
this.setState({
selectedFile: this.props.selectedDocument.files[0],
selectedFileIndex: 0,
});
override async componentDidMount() {
try{
const document = await Documents.getInstance().getByUid(this.props.documentUid, {
files: true,
document_type: true
});
this.setState({
document,
selectedFileIndex: 0,
selectedFile: document.files![0]!,
});
}catch(e){
console.error(e)
}
}
private getRandomPercentageForOcr() {
@ -207,7 +217,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
const index = this.state.selectedFileIndex - 1;
if (this.hasPrevious()) {
this.setState({
selectedFile: this.props.selectedDocument!.files![index]!,
selectedFile: this.state.document!.files![index]!,
selectedFileIndex: index,
});
}
@ -217,7 +227,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
if (this.hasNext()) {
const index = this.state.selectedFileIndex + 1;
this.setState({
selectedFile: this.props.selectedDocument!.files![index]!,
selectedFile: this.state.document!.files![index]!,
selectedFileIndex: index,
});
}
@ -230,7 +240,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
private hasNext() {
const index = this.state.selectedFileIndex + 1;
return index < this.props.selectedDocument!.files!.length;
return index < this.state.document!.files!.length;
}
private validateAnchoring() {
@ -281,9 +291,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
export default function ViewDocuments(props: IProps) {
const router = useRouter();
let { folderUid, documentUid } = router.query;
const folder = folders.find((folder) => folder.uid === folderUid) ?? null;
const documents = folder?.documents!.filter((document) => document.document_status !== "ASKED") ?? [];
const selectedDocument = documents.find((document) => document.uid === documentUid) ?? null;
return <ViewDocumentsClass {...props} selectedDocument={selectedDocument} router={router} folderUid={folderUid as string} />;
documentUid = documentUid as string;
folderUid = folderUid as string;
return <ViewDocumentsClass {...props} documentUid={documentUid} router={router} folderUid={folderUid as string} />;
}