This commit is contained in:
Vins 2024-02-20 14:15:46 +01:00
parent 5f742dc6ea
commit 7cbfb1cff5
5 changed files with 45 additions and 27 deletions

View File

@ -7,6 +7,10 @@ export enum ContentType {
FORM_DATA = "multipart/form-data;",
PNG = "image/png",
}
export type IRef = {
response?: Response;
};
export default abstract class BaseApiService {
private static baseUrl: string;
protected readonly variables = FrontendVariables.getInstance();
@ -39,13 +43,13 @@ export default abstract class BaseApiService {
return JSON.stringify(body);
}
protected async getRequest<T>(url: URL, token?: string, contentType?: ContentType, filename?: string) {
protected async getRequest<T>(url: URL, token?: string, contentType?: ContentType, ref?: IRef) {
const request = async () =>
await fetch(url, {
method: "GET",
headers: this.buildHeaders(contentType ?? ContentType.JSON),
});
return this.sendRequest<T>(request, filename);
return this.sendRequest<T>(request, ref);
}
protected async postRequest<T>(url: URL, body: { [key: string]: unknown } = {}, token?: string) {
@ -114,18 +118,18 @@ export default abstract class BaseApiService {
return this.sendRequest<T>(request);
}
private async sendRequest<T>(request: () => Promise<Response>, filename?: string): Promise<T> {
private async sendRequest<T>(request: () => Promise<Response>, ref?: IRef): Promise<T> {
const response = await request();
return this.processResponse<T>(response, request, filename);
return this.processResponse<T>(response, request, ref);
}
protected async processResponse<T>(response: Response, request: () => Promise<Response>, filename?: string): Promise<T> {
protected async processResponse<T>(response: Response, request: () => Promise<Response>, ref?: IRef): Promise<T> {
let responseContent: T;
ref && (ref["response"] = response);
if (response.ok) {
// Check the Content-Type header to determine the response type
const contentType = response.headers.get("Content-Type");
if (contentType && !contentType.includes("application/json")) {
responseContent = (await response.blob()) as T;
} else {

View File

@ -1,3 +1,4 @@
import { IRef } from "@Front/Api/BaseApiService";
import BaseNotary from "../BaseNotary";
// TODO Type get query params -> Where + inclue + orderby
@ -27,7 +28,12 @@ export default class OfficeRib extends BaseNotary {
public async getRibStream() {
const url = new URL(this.baseURl);
try {
return await this.getRequest<any>(url);
const ref: IRef = {};
const blob = await this.getRequest<any>(url, undefined, undefined, ref);
const contentDisposition = ref.response?.headers.get("Content-Disposition");
const r = /attachment; filename="(.*)"/gim;
const fileName = r.exec(contentDisposition ?? "")?.[1] ?? "";
return { blob, fileName };
} catch (err) {
this.onError(err);
return Promise.reject(err);

View File

@ -195,6 +195,7 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
private async getFilePreview(): Promise<void> {
try {
const fileBlob: Blob = await Files.getInstance().download(this.state.selectedFile?.uid as string);
this.setState({
fileBlob,
});
@ -281,7 +282,9 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
this.props.router.push(
Module.getInstance()
.get()
.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", this.props.folderUid) + '?customerUid=' + this.state.document?.depositor?.uid,
.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", this.props.folderUid) +
"?customerUid=" +
this.state.document?.depositor?.uid,
);
} catch (e) {
console.error(e);
@ -297,7 +300,9 @@ class ViewDocumentsClass extends BasePage<IPropsClass, IState> {
this.props.router.push(
Module.getInstance()
.get()
.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", this.props.folderUid) + '?customerUid=' + this.state.document?.depositor?.uid,
.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", this.props.folderUid) +
"?customerUid=" +
this.state.document?.depositor?.uid,
);
} catch (e) {
console.error(e);

View File

@ -15,7 +15,6 @@
display: flex;
justify-content: space-between;
align-items: center;
flex-direction: column;
.arrow-container {
cursor: pointer;
@ -28,6 +27,7 @@
.file-container {
max-width: 1000px;
min-height: 600px;
margin: auto;
flex: 1;
}
@ -36,8 +36,6 @@
.footer {
width: fit-content;
margin: auto;
display: flex;
gap: 10px;
.ocr-container {
margin-top: 42px;
}

View File

@ -13,7 +13,7 @@ export default function Rib() {
const [documentList, setDocumentList] = useState<File[]>([]);
const router = useRouter();
let { officeUid } = router.query;
const [fileUrl, setFileUrl] = useState<string>("");
const [fileBlob, setFileBlob] = useState<Blob>();
const [fileName, setFileName] = useState<string>("");
const [key, setKey] = useState<string>("");
const [isRibModalOpen, setIsRibModalOpen] = useState<boolean>(false);
@ -25,15 +25,13 @@ export default function Rib() {
try {
const blob = await OfficeRib.getInstance().getRibStream();
const ribUrl = URL.createObjectURL(blob);
setFileUrl(ribUrl);
setFileBlob(blob.blob);
setKey(key);
setFileName(key);
setFileName(blob.fileName);
} catch (error) {
setFileUrl("");
setFileName("");
setKey("");
// setFileBlob(undefined);
// setFileName("");
// setKey("");
}
}, [officeUid]);
@ -42,10 +40,11 @@ export default function Rib() {
}, [officeUid]);
function downloadFile() {
if (!fileUrl) return;
if (!fileBlob) return;
const url = window.URL.createObjectURL(fileBlob);
const a = document.createElement("a");
a.style.display = "none";
a.href = fileUrl;
a.href = url;
a.download = key;
document.body.appendChild(a);
a.click();
@ -98,7 +97,7 @@ export default function Rib() {
RIB de l'office
</Typography>
{!fileUrl && (
{!fileBlob && (
<div className={classes["document-container"]}>
<div className={classes["file-container"]}>
<Typography typo={ITypo.P_18} color={ITypoColor.GREY}>
@ -113,10 +112,16 @@ export default function Rib() {
</div>
)}
{fileUrl && (
{fileBlob && (
<div className={classes["document-container"]}>
<div className={classes["file-container"]}>{fileUrl && <FilePreview href={fileUrl} fileName={fileName} />}</div>
<div className={classes["footer"]}>
<div className={classes["file-container"]}>
{fileBlob && <FilePreview href={fileBlob ? URL.createObjectURL(fileBlob) : ""} fileName={fileName} />}
</div>
</div>
)}
{fileBlob && (
<div className={classes["footer"]}>
<div className={classes["buttons-container"]}>
<Button onClick={openDeleteModal} variant={EButtonVariant.SECONDARY}>
Supprimer
</Button>