import LeftArrowIcon from "@Assets/Icons/left-arrow.svg"; import RightArrowIcon from "@Assets/Icons/right-arrow.svg"; import Button from "@Front/Components/DesignSystem/Button"; import FilePreview from "@Front/Components/DesignSystem/FilePreview"; import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography"; import { DocumentNotary } from "le-coffre-resources/dist/Notary"; import Image from "next/image"; import { NextRouter, useRouter } from "next/router"; import React from "react"; import { FileBlob } from "@Front/Api/Entities/types"; import BasePage from "../../Base"; import classes from "./classes.module.scss"; import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate"; import DocumentService from "src/common/Api/LeCoffreApi/sdk/DocumentService"; import FileService from "src/common/Api/LeCoffreApi/sdk/FileService"; import LoaderService from "src/common/Api/LeCoffreApi/sdk/Loader/LoaderService"; type IProps = {}; type IPropsClass = { documentUid: string; router: NextRouter; }; type IState = { isRefuseModalVisible: boolean; isValidateModalVisible: boolean; refuseText: string; selectedFileIndex: number; selectedFile: { uid: string; file_name: string; file_blob: FileBlob } | null; documentNotary: any | null; fileBlob: Blob | null; isLoading: boolean; }; class ViewDocumentsNotaryClass extends BasePage { public constructor(props: IPropsClass) { super(props); this.state = { isValidateModalVisible: false, isRefuseModalVisible: false, refuseText: "", selectedFileIndex: 0, selectedFile: null, documentNotary: null, fileBlob: null, isLoading: true, }; this.goToNext = this.goToNext.bind(this); this.goToPrevious = this.goToPrevious.bind(this); this.hasPrevious = this.hasPrevious.bind(this); this.hasNext = this.hasNext.bind(this); this.downloadFile = this.downloadFile.bind(this); } public override render(): JSX.Element | null { return ( {this.state.documentNotary && this.state.documentNotary.files && this.state.selectedFile && !this.state.isLoading && (
{this.state.documentNotary.name}
{this.state.documentNotary.files.length > 1 && (
left arrow
)}
{this.state.selectedFile.file_blob.type === "application/pdf" || this.state.selectedFile.file_blob.type === "image/jpeg" || this.state.selectedFile.file_blob.type === "image/png" || this.state.selectedFile.file_blob.type === "image/jpg" ? ( ) : (
L'affichage de ce format de fichier n'est pas supporté.
)}
{this.state.documentNotary.files.length > 1 && (
right arrow
)}
{/* {this.state.document?.document_type?.name === "Document d'identité" && (
)} */}
)} {(!this.state.selectedFile || !this.state.documentNotary) && !this.state.isLoading && (
Document non trouvé
)}
); } override async componentDidMount() { try { LoaderService.getInstance().show(); const documentNotary: any = await new Promise((resolve: (document: any) => void) => { DocumentService.getDocumentByUid(this.props.documentUid).then(async (process: any) => { if (process) { const document: any = process.processData; if (document.files && document.files.length > 0) { const files: any[] = []; for (const file of document.files) { files.push((await FileService.getFileByUid(file.uid)).processData); } document.files = files; } resolve(document); } }); }); LoaderService.getInstance().hide(); this.setState( { documentNotary, selectedFileIndex: 0, selectedFile: documentNotary.files![0] as any, isLoading: false, }, () => { this.getFilePreview(); }, ); } catch (e) { this.setState({ isLoading: false, }); console.error(e); } } private async getFilePreview(): Promise { try { const fileBlob: Blob = new Blob([this.state.selectedFile!.file_blob.data], { type: this.state.selectedFile!.file_blob.type }); this.setState({ fileBlob, }); } catch (e) { console.error(e); } } private downloadFile() { if (!this.state.fileBlob) return; const url = window.URL.createObjectURL(this.state.fileBlob); const a = document.createElement("a"); a.style.display = "none"; a.href = url; // the filename you want a.download = this.state.selectedFile?.file_name as string; document.body.appendChild(a); a.click(); window.URL.revokeObjectURL(url); } private goToPrevious() { const index = this.state.selectedFileIndex - 1; if (this.hasPrevious()) { this.setState( { selectedFile: this.state.documentNotary!.files![index]!, selectedFileIndex: index, fileBlob: null, }, () => { this.getFilePreview(); }, ); } } private goToNext() { if (this.hasNext()) { const index = this.state.selectedFileIndex + 1; this.setState( { selectedFile: this.state.documentNotary!.files![index]!, selectedFileIndex: index, fileBlob: null, }, () => { this.getFilePreview(); }, ); } } private hasPrevious() { const index = this.state.selectedFileIndex - 1; return index >= 0; } private hasNext() { const index = this.state.selectedFileIndex + 1; return index < this.state.documentNotary!.files!.length; } } export default function ViewDocumentsNotary(props: IProps) { const router = useRouter(); let { folderUid, documentUid } = router.query; documentUid = documentUid as string; folderUid = folderUid as string; return ; }