✨ connect files notary + handle download
This commit is contained in:
parent
dfba3474d5
commit
eee11aa4bb
@ -1,15 +1,13 @@
|
||||
import { DocumentNotary } from "le-coffre-resources/dist/Notary";
|
||||
|
||||
import BaseNotary from "../BaseNotary";
|
||||
|
||||
// TODO Type get query params -> Where + inclue + orderby
|
||||
export interface IGetDocumentNotaryparams {
|
||||
where?: {};
|
||||
include?: {};
|
||||
orderBy?: {};
|
||||
}
|
||||
|
||||
// TODO Type getbyuid query params
|
||||
|
||||
export default class DocumentsNotary extends BaseNotary {
|
||||
private static instance: DocumentsNotary;
|
||||
private readonly baseURl = this.namespaceUrl.concat("/documents_notary");
|
||||
@ -26,17 +24,17 @@ export default class DocumentsNotary extends BaseNotary {
|
||||
}
|
||||
}
|
||||
|
||||
// public async get(q: IGetDocumentNotaryparams): Promise<DocumentNotary[]> {
|
||||
// const url = new URL(this.baseURl);
|
||||
// const query = { q };
|
||||
// Object.entries(query).forEach(([key, value]) => url.searchParams.set(key, JSON.stringify(value)));
|
||||
// try {
|
||||
// return await this.getRequest<DocumentNotary[]>(url);
|
||||
// } catch (err) {
|
||||
// this.onError(err);
|
||||
// return Promise.reject(err);
|
||||
// }
|
||||
// }
|
||||
public async get(q: IGetDocumentNotaryparams): Promise<DocumentNotary[]> {
|
||||
const url = new URL(this.baseURl);
|
||||
const query = { q };
|
||||
Object.entries(query).forEach(([key, value]) => url.searchParams.set(key, JSON.stringify(value)));
|
||||
try {
|
||||
return await this.getRequest<DocumentNotary[]>(url);
|
||||
} catch (err) {
|
||||
this.onError(err);
|
||||
return Promise.reject(err);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @description : Create a Document Notary
|
||||
@ -50,4 +48,18 @@ export default class DocumentsNotary extends BaseNotary {
|
||||
return Promise.reject(err);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @description : Delete a Document Notary
|
||||
*/
|
||||
public async delete(uid: string): Promise<void> {
|
||||
const url = new URL(this.baseURl);
|
||||
url.pathname = url.pathname.concat(`/${uid}`);
|
||||
try {
|
||||
await this.deleteRequest(url);
|
||||
} catch (err) {
|
||||
this.onError(err);
|
||||
return Promise.reject(err);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
71
src/front/Api/LeCoffreApi/Notary/FilesNotary/Files.ts
Normal file
71
src/front/Api/LeCoffreApi/Notary/FilesNotary/Files.ts
Normal file
@ -0,0 +1,71 @@
|
||||
import { File } from "le-coffre-resources/dist/SuperAdmin";
|
||||
|
||||
import BaseNotary from "../BaseNotary";
|
||||
|
||||
export interface IGetFilesparams {
|
||||
where?: {};
|
||||
include?: {};
|
||||
}
|
||||
|
||||
export type IPutFilesParams = {};
|
||||
|
||||
export interface IPostFilesParams {}
|
||||
|
||||
export default class FilesNotary extends BaseNotary {
|
||||
private static instance: FilesNotary;
|
||||
private readonly baseURl = this.namespaceUrl.concat("/files-notary");
|
||||
|
||||
private constructor() {
|
||||
super();
|
||||
}
|
||||
|
||||
public static getInstance() {
|
||||
return (this.instance ??= new this());
|
||||
}
|
||||
|
||||
public async get(q: IGetFilesparams): Promise<File[]> {
|
||||
const url = new URL(this.baseURl);
|
||||
const query = { q };
|
||||
if (q) Object.entries(query).forEach(([key, value]) => url.searchParams.set(key, JSON.stringify(value)));
|
||||
try {
|
||||
const files = await this.getRequest<File[]>(url);
|
||||
return files;
|
||||
} catch (err) {
|
||||
this.onError(err);
|
||||
return Promise.reject(err);
|
||||
}
|
||||
}
|
||||
|
||||
public async getByUid(uid: string, q?: any): Promise<File> {
|
||||
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 {
|
||||
const file = await this.getRequest<File>(url);
|
||||
return file;
|
||||
} catch (err) {
|
||||
this.onError(err);
|
||||
return Promise.reject(err);
|
||||
}
|
||||
}
|
||||
|
||||
public async delete(uid: string): Promise<File> {
|
||||
const url = new URL(this.baseURl.concat(`/${uid}`));
|
||||
try {
|
||||
return await this.deleteRequest<File>(url);
|
||||
} catch (err) {
|
||||
this.onError(err);
|
||||
return Promise.reject(err);
|
||||
}
|
||||
}
|
||||
|
||||
public async download(uid: string): Promise<any> {
|
||||
const url = new URL(this.baseURl.concat(`/download/${uid}`));
|
||||
try {
|
||||
return await this.getRequest<any>(url);
|
||||
} catch (err) {
|
||||
this.onError(err);
|
||||
return Promise.reject(err);
|
||||
}
|
||||
}
|
||||
}
|
@ -27,7 +27,6 @@ export default function Autocomplete(props: IProps) {
|
||||
useEffect(() => {
|
||||
if (searchValue) {
|
||||
const filteredOptions = options.filter((option) => getLabel(option)?.toLowerCase().includes(searchValue.toLowerCase()));
|
||||
console.log(filteredOptions);
|
||||
if (filteredOptions.length === 0)
|
||||
return setFilteredOptions([{ id: "no-results", label: "Aucun résulats", notSelectable: true }]);
|
||||
return setFilteredOptions(filteredOptions);
|
||||
|
@ -39,7 +39,6 @@ class ToastElementClass extends React.Component<IPropsClass, IState> {
|
||||
|
||||
public override render(): JSX.Element {
|
||||
const toast = this.props.toast;
|
||||
console.log(toast);
|
||||
|
||||
const style = {
|
||||
"--data-duration": `${toast.time}ms`,
|
||||
|
@ -80,7 +80,6 @@ export default function Tabs<T>({ onSelect, tabs: propsTabs }: IProps<T>) {
|
||||
newTabs.splice(index, 1);
|
||||
newTabs.unshift(tabs.current[index]!);
|
||||
tabs.current = newTabs;
|
||||
console.log("Updated values ; ", tabs.current);
|
||||
handleSelect(value);
|
||||
},
|
||||
[handleSelect],
|
||||
|
@ -1,18 +1,22 @@
|
||||
import React from "react";
|
||||
|
||||
import classes from "./classes.module.scss";
|
||||
import { useRouter } from "next/router";
|
||||
|
||||
import DocumentsNotary from "@Front/Api/LeCoffreApi/Notary/DocumentsNotary/DocumentsNotary";
|
||||
import FilesNotary from "@Front/Api/LeCoffreApi/Notary/FilesNotary/Files";
|
||||
import Button, { EButtonSize, EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
|
||||
import IconButton from "@Front/Components/DesignSystem/IconButton";
|
||||
import Table from "@Front/Components/DesignSystem/Table";
|
||||
import { IHead, IRowProps } from "@Front/Components/DesignSystem/Table/MuiTable";
|
||||
import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Typography";
|
||||
import BackArrow from "@Front/Components/Elements/BackArrow";
|
||||
import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate";
|
||||
import Module from "@Front/Config/Module";
|
||||
import BackArrow from "@Front/Components/Elements/BackArrow";
|
||||
import JwtService from "@Front/Services/JwtService/JwtService";
|
||||
import { ArrowDownTrayIcon } from "@heroicons/react/24/outline";
|
||||
import Button, { EButtonSize, EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
|
||||
import { IHead } from "@Front/Components/DesignSystem/Table/MuiTable";
|
||||
import Table from "@Front/Components/DesignSystem/Table";
|
||||
import { saveAs } from "file-saver";
|
||||
import JSZip from "jszip";
|
||||
import { DocumentNotary } from "le-coffre-resources/dist/Notary";
|
||||
import { useRouter } from "next/router";
|
||||
import React, { useCallback, useEffect, useState } from "react";
|
||||
|
||||
type IProps = {};
|
||||
import classes from "./classes.module.scss";
|
||||
|
||||
const header: readonly IHead[] = [
|
||||
{
|
||||
@ -29,9 +33,60 @@ const header: readonly IHead[] = [
|
||||
},
|
||||
];
|
||||
|
||||
export default function ReceivedDocuments(props: IProps) {
|
||||
export default function ReceivedDocuments() {
|
||||
const router = useRouter();
|
||||
let { folderUid } = router.query;
|
||||
const [documentsNotary, setDocumentsNotary] = useState<DocumentNotary[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
const customerUid = JwtService.getInstance().decodeCustomerJwt()?.customerId;
|
||||
if (!folderUid || !customerUid) return;
|
||||
DocumentsNotary.getInstance()
|
||||
.get({ where: { folder: { uid: folderUid }, customer: { uid: customerUid } }, include: { files: true } })
|
||||
.then((documentsNotary) => setDocumentsNotary(documentsNotary));
|
||||
}, [folderUid]);
|
||||
|
||||
const onDownload = useCallback((doc: DocumentNotary) => {
|
||||
const file = doc.files?.[0];
|
||||
if (!file || !file?.uid) return;
|
||||
|
||||
return FilesNotary.getInstance()
|
||||
.download(file.uid)
|
||||
.then((blob) => {
|
||||
const url = URL.createObjectURL(blob);
|
||||
const a = document.createElement("a");
|
||||
a.href = url;
|
||||
a.download = file.file_name ?? "file";
|
||||
a.click();
|
||||
URL.revokeObjectURL(url);
|
||||
})
|
||||
.catch((e) => console.warn(e));
|
||||
}, []);
|
||||
|
||||
const onDownloadAll = useCallback(async () => {
|
||||
if (documentsNotary.length === 0) return;
|
||||
|
||||
const zip = new JSZip();
|
||||
const folder = zip.folder("documents") || zip;
|
||||
|
||||
const downloadPromises = documentsNotary.map(async (doc) => {
|
||||
const file = doc.files?.[0];
|
||||
if (file && file.uid) {
|
||||
const blob = await FilesNotary.getInstance().download(file.uid);
|
||||
folder.file(file.file_name ?? "file", blob);
|
||||
}
|
||||
});
|
||||
|
||||
await Promise.all(downloadPromises);
|
||||
|
||||
zip.generateAsync({ type: "blob" })
|
||||
.then((blob: any) => {
|
||||
saveAs(blob, "documents.zip");
|
||||
})
|
||||
.catch((error: any) => {
|
||||
console.error("Error generating ZIP file: ", error);
|
||||
});
|
||||
}, [documentsNotary]);
|
||||
|
||||
return (
|
||||
<DefaultTemplate title={"Documents reçus"} isPadding={false}>
|
||||
@ -45,15 +100,25 @@ export default function ReceivedDocuments(props: IProps) {
|
||||
<Typography typo={ETypo.TITLE_H1} color={ETypoColor.TEXT_PRIMARY}>
|
||||
Un document vous a été envoyé
|
||||
</Typography>
|
||||
<Table className={classes["table"]} header={header} rows={[{ key: "1", name: "todo", sentAt: "todo", actions: "todo" }]} />
|
||||
<Table className={classes["table"]} header={header} rows={buildRows(documentsNotary, onDownload)} />
|
||||
<Button
|
||||
variant={EButtonVariant.PRIMARY}
|
||||
size={EButtonSize.LG}
|
||||
styletype={EButtonstyletype.CONTAINED}
|
||||
leftIcon={<ArrowDownTrayIcon />}>
|
||||
leftIcon={<ArrowDownTrayIcon />}
|
||||
onClick={onDownloadAll}>
|
||||
Tout télécharger
|
||||
</Button>
|
||||
</div>
|
||||
</DefaultTemplate>
|
||||
);
|
||||
}
|
||||
|
||||
function buildRows(documentsNotary: DocumentNotary[], onDownloadFileNotary: (doc: DocumentNotary) => void): IRowProps[] {
|
||||
return documentsNotary.map((documentNotary) => ({
|
||||
key: documentNotary.uid ?? "",
|
||||
name: documentNotary.files?.[0]?.file_name?.split(".")?.[0] ?? "_",
|
||||
sentAt: new Date(documentNotary.created_at!).toLocaleDateString(),
|
||||
actions: <IconButton onClick={() => onDownloadFileNotary(documentNotary)} icon={<ArrowDownTrayIcon />} />,
|
||||
}));
|
||||
}
|
||||
|
@ -1,4 +1,4 @@
|
||||
import Documents from "@Front/Api/LeCoffreApi/Notary/Documents/Documents";
|
||||
import DocumentsNotary from "@Front/Api/LeCoffreApi/Notary/DocumentsNotary/DocumentsNotary";
|
||||
import Modal from "@Front/Components/DesignSystem/Modal";
|
||||
import Typography, { ETypo } from "@Front/Components/DesignSystem/Typography";
|
||||
import React, { useCallback } from "react";
|
||||
@ -15,7 +15,7 @@ export default function DeleteSentDocumentModal(props: IProps) {
|
||||
|
||||
const onDelete = useCallback(
|
||||
() =>
|
||||
Documents.getInstance()
|
||||
DocumentsNotary.getInstance()
|
||||
.delete(documentUid)
|
||||
.then(() => onDeleteSuccess(documentUid))
|
||||
.then(onClose)
|
||||
|
@ -8,18 +8,21 @@ import Typography, { ETypo, ETypoColor } from "@Front/Components/DesignSystem/Ty
|
||||
import Module from "@Front/Config/Module";
|
||||
import useOpenable from "@Front/Hooks/useOpenable";
|
||||
import { ArrowDownTrayIcon, EyeIcon, TrashIcon } from "@heroicons/react/24/outline";
|
||||
import { useMediaQuery } from "@mui/material";
|
||||
import { Document } from "le-coffre-resources/dist/Customer";
|
||||
import { EDocumentStatus } from "le-coffre-resources/dist/Customer/Document";
|
||||
import { DocumentNotary } from "le-coffre-resources/dist/Notary";
|
||||
import Link from "next/link";
|
||||
import { useCallback, useEffect, useMemo, useState } from "react";
|
||||
|
||||
import classes from "./classes.module.scss";
|
||||
import DeleteAskedDocumentModal from "./DeleteAskedDocumentModal";
|
||||
import DeleteSentDocumentModal from "./DeleteSentDocumentModal";
|
||||
import { useMediaQuery } from "@mui/material";
|
||||
import FilesNotary from "@Front/Api/LeCoffreApi/Notary/FilesNotary/Files";
|
||||
|
||||
type IProps = {
|
||||
documents: Document[];
|
||||
documentsNotary: DocumentNotary[];
|
||||
folderUid: string;
|
||||
};
|
||||
|
||||
@ -31,7 +34,7 @@ const tradDocumentStatus: Record<EDocumentStatus, string> = {
|
||||
};
|
||||
|
||||
export default function DocumentTables(props: IProps) {
|
||||
const { documents: documentsProps, folderUid } = props;
|
||||
const { documents: documentsProps, folderUid, documentsNotary } = props;
|
||||
const [documents, setDocuments] = useState<Document[]>(documentsProps);
|
||||
const [documentUid, setDocumentUid] = useState<string | null>(null);
|
||||
|
||||
@ -79,6 +82,23 @@ export default function DocumentTables(props: IProps) {
|
||||
.catch((e) => console.warn(e));
|
||||
}, []);
|
||||
|
||||
const onDownloadFileNotary = useCallback((doc: DocumentNotary) => {
|
||||
const file = doc.files?.[0];
|
||||
if (!file || !file?.uid) return;
|
||||
|
||||
return FilesNotary.getInstance()
|
||||
.download(file.uid)
|
||||
.then((blob) => {
|
||||
const url = URL.createObjectURL(blob);
|
||||
const a = document.createElement("a");
|
||||
a.href = url;
|
||||
a.download = file.file_name ?? "file";
|
||||
a.click();
|
||||
URL.revokeObjectURL(url);
|
||||
})
|
||||
.catch((e) => console.warn(e));
|
||||
}, []);
|
||||
|
||||
const askedDocuments: IRowProps[] = useMemo(
|
||||
() =>
|
||||
documents
|
||||
@ -190,27 +210,25 @@ export default function DocumentTables(props: IProps) {
|
||||
[documents],
|
||||
);
|
||||
|
||||
//TODO: modify accordingly when the back will handle sent documents
|
||||
const sentDocuments: IRowProps[] = useMemo(
|
||||
() =>
|
||||
documents
|
||||
documentsNotary
|
||||
.map((document) => {
|
||||
if (document.document_status !== "sent") return null;
|
||||
return {
|
||||
key: document.uid,
|
||||
document_type: document.document_type?.name ?? "_",
|
||||
document_status: <Tag color={ETagColor.ERROR} variant={ETagVariant.SEMI_BOLD} label={"Envoyé"} />,
|
||||
document_type: document.files?.[0]?.file_name?.split(".")?.[0] ?? "_",
|
||||
document_status: <Tag color={ETagColor.NEUTRAL} variant={ETagVariant.SEMI_BOLD} label={"ENVOYÉ"} />,
|
||||
date: document.updated_at ? new Date(document.updated_at).toLocaleDateString() : "_",
|
||||
actions: (
|
||||
<div className={classes["actions"]}>
|
||||
<IconButton onClick={() => onDownload(document)} icon={<ArrowDownTrayIcon />} />
|
||||
<IconButton onClick={() => onDownloadFileNotary(document)} icon={<ArrowDownTrayIcon />} />
|
||||
<IconButton icon={<TrashIcon onClick={() => openDeleteSentDocumentModal(document.uid)} />} />
|
||||
</div>
|
||||
),
|
||||
};
|
||||
})
|
||||
.filter((document) => document !== null) as IRowProps[],
|
||||
[documents, onDownload, openDeleteSentDocumentModal],
|
||||
[documentsNotary, onDownloadFileNotary, openDeleteSentDocumentModal],
|
||||
);
|
||||
|
||||
const progress = useMemo(() => {
|
||||
@ -219,13 +237,9 @@ export default function DocumentTables(props: IProps) {
|
||||
return (validatedDocuments.length / total) * 100;
|
||||
}, [askedDocuments.length, refusedDocuments.length, toValidateDocuments.length, validatedDocuments.length]);
|
||||
|
||||
const handleDelete = useCallback(
|
||||
(documentUid: string) => {
|
||||
setDocuments(documents.filter((document) => document.uid !== documentUid));
|
||||
const handleDelete = useCallback((_documentUid: string) => {
|
||||
window.location.reload();
|
||||
},
|
||||
[documents],
|
||||
);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className={classes["root"]}>
|
||||
|
@ -22,11 +22,10 @@ export default function ReminderModal(props: IProps) {
|
||||
const [isAllSelected, setIsAllSelected] = useState(false);
|
||||
|
||||
const onRemind = useCallback(() => {
|
||||
console.log("selectedOptions", selectedOptions);
|
||||
Customers.getInstance().sendReminder(customer.uid!, selectedOptions.map((option) => option.value) as string[]);
|
||||
onRemindSuccess();
|
||||
onClose?.();
|
||||
}, [onClose, onRemindSuccess, selectedOptions]);
|
||||
}, [customer.uid, onClose, onRemindSuccess, selectedOptions]);
|
||||
|
||||
const documentsOptions: IOption[] = useMemo(
|
||||
() =>
|
||||
|
@ -1,3 +1,4 @@
|
||||
import DocumentsNotary from "@Front/Api/LeCoffreApi/Notary/DocumentsNotary/DocumentsNotary";
|
||||
import Folders from "@Front/Api/LeCoffreApi/Notary/Folders/Folders";
|
||||
import Button, { EButtonSize, EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
|
||||
import Tabs from "@Front/Components/Elements/Tabs";
|
||||
@ -6,8 +7,9 @@ import { DocumentIcon, UserPlusIcon } from "@heroicons/react/24/outline";
|
||||
import Customer from "le-coffre-resources/dist/Customer";
|
||||
import { EDocumentStatus } from "le-coffre-resources/dist/Customer/Document";
|
||||
import { OfficeFolder } from "le-coffre-resources/dist/Notary";
|
||||
import { DocumentNotary } from "le-coffre-resources/dist/Notary";
|
||||
import Link from "next/link";
|
||||
import { useCallback, useMemo, useState } from "react";
|
||||
import { useCallback, useEffect, useMemo, useState } from "react";
|
||||
|
||||
import { AnchorStatus } from "..";
|
||||
import classes from "./classes.module.scss";
|
||||
@ -25,6 +27,7 @@ export type ICustomer = Customer & { id: string };
|
||||
|
||||
export default function ClientView(props: IProps) {
|
||||
const { folder, anchorStatus } = props;
|
||||
const [documentsNotary, setDocumentsNotary] = useState<DocumentNotary[]>([]);
|
||||
|
||||
const customers: ICustomer[] = useMemo(
|
||||
() =>
|
||||
@ -74,6 +77,12 @@ export default function ClientView(props: IProps) {
|
||||
[folder],
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
DocumentsNotary.getInstance()
|
||||
.get({ where: { folder: { uid: folder.uid }, customer: { uid: customer.uid } }, include: { files: true } })
|
||||
.then((documentsNotary) => setDocumentsNotary(documentsNotary));
|
||||
}, [customer.uid, folder]);
|
||||
|
||||
return (
|
||||
<section className={classes["root"]}>
|
||||
<div className={classes["tab-container"]}>
|
||||
@ -123,8 +132,8 @@ export default function ClientView(props: IProps) {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{doesCustomerHaveDocument ? (
|
||||
<DocumentTables documents={customer.documents ?? []} folderUid={folder?.uid ?? ""} />
|
||||
{doesCustomerHaveDocument || documentsNotary.length > 0 ? (
|
||||
<DocumentTables documents={customer.documents ?? []} documentsNotary={documentsNotary} folderUid={folder?.uid ?? ""} />
|
||||
) : (
|
||||
<NoDocument />
|
||||
)}
|
||||
|
@ -1,4 +1,5 @@
|
||||
import backgroundImage from "@Assets/images/background_refonte.svg";
|
||||
import DocumentsNotary from "@Front/Api/LeCoffreApi/Notary/DocumentsNotary/DocumentsNotary";
|
||||
import Folders from "@Front/Api/LeCoffreApi/Notary/Folders/Folders";
|
||||
import AutocompleteMultiSelect from "@Front/Components/DesignSystem/AutocompleteMultiSelect";
|
||||
import Button, { EButtonstyletype, EButtonVariant } from "@Front/Components/DesignSystem/Button";
|
||||
@ -15,95 +16,62 @@ import { useRouter } from "next/router";
|
||||
import React, { useCallback, useEffect, useMemo, useState } from "react";
|
||||
|
||||
import classes from "./classes.module.scss";
|
||||
import DocumentsNotary from "@Front/Api/LeCoffreApi/Notary/DocumentsNotary/DocumentsNotary";
|
||||
|
||||
enum EClientSelection {
|
||||
ALL_CLIENTS = "all_clients",
|
||||
SELECTED_CLIENTS = "selected_clients",
|
||||
}
|
||||
|
||||
// type IDocumentFileBase = {
|
||||
// id: string;
|
||||
// file: File | null;
|
||||
// uid?: string;
|
||||
// isLoading?: boolean;
|
||||
// error?: string;
|
||||
// };
|
||||
|
||||
// export type IDocumentFileWithUid = IDocumentFileBase & {
|
||||
// uid: string;
|
||||
// };
|
||||
|
||||
// type IDocumentFile = IDocumentFileBase | IDocumentFileWithUid;
|
||||
|
||||
export default function SendDocuments() {
|
||||
const router = useRouter();
|
||||
let { folderUid } = router.query;
|
||||
const [folder, setFolder] = useState<OfficeFolder | null>(null);
|
||||
const [clientSelection, setClientSelection] = useState<EClientSelection | null>(EClientSelection.SELECTED_CLIENTS);
|
||||
const [clientSelection, setClientSelection] = useState<EClientSelection | null>(null);
|
||||
const [selectedClients, setSelectedClients] = useState<string[]>([]);
|
||||
const [files, setFiles] = useState<File[]>([]);
|
||||
|
||||
const onFormSubmit = useCallback(
|
||||
async (
|
||||
_e: React.FormEvent<HTMLFormElement> | null,
|
||||
values: {
|
||||
_values: {
|
||||
[key: string]: any;
|
||||
},
|
||||
//TODO: when back is done
|
||||
) => {
|
||||
if (folder?.customers && clientSelection === EClientSelection.ALL_CLIENTS) {
|
||||
const allClientIds = folder.customers.map((customer) => customer.uid ?? "");
|
||||
setSelectedClients(allClientIds);
|
||||
}
|
||||
const formData = new FormData();
|
||||
console.log("files", files);
|
||||
|
||||
// get the files from the input which name is "files"
|
||||
// console.log({ values });
|
||||
// const files: File[] = values["files"];
|
||||
// console.log({ files });
|
||||
|
||||
selectedClients.forEach(async (customer) => {
|
||||
formData.append("customerUid", customer as string);
|
||||
formData.append("folderUid", folderUid as string);
|
||||
if (!files[0]) {
|
||||
if (!files.length) {
|
||||
console.error("No files to send");
|
||||
return;
|
||||
}
|
||||
formData.append("file", files[0]);
|
||||
const documentNotary = await DocumentsNotary.getInstance().post(formData);
|
||||
console.log(documentNotary);
|
||||
|
||||
try {
|
||||
await Promise.all(
|
||||
selectedClients.map(async (customer) => {
|
||||
const promises = files.map(async (file) => {
|
||||
const formData = new FormData();
|
||||
formData.append("customerUid", customer as string);
|
||||
formData.append("folderUid", folderUid as string);
|
||||
formData.append("name", file.name);
|
||||
formData.append("file", file);
|
||||
|
||||
// Envoi de chaque fichier pour chaque client
|
||||
return DocumentsNotary.getInstance().post(formData);
|
||||
});
|
||||
// const formData = new FormData();
|
||||
// files.forEach((file) => {
|
||||
// if (file.file) {
|
||||
// formData.append("file", file.file);
|
||||
// }
|
||||
// });
|
||||
// selectedClients.forEach((client) => {
|
||||
// formData.append("customers", client);
|
||||
// });
|
||||
// formData.append("folder", folderUid as string);
|
||||
// const documentNotary = await DocumentsNotary.getInstance().post(formData);
|
||||
// console.log(documentNotary);
|
||||
},
|
||||
[clientSelection, selectedClients, files],
|
||||
|
||||
// Attendre que tous les fichiers pour un client soient envoyés
|
||||
await Promise.all(promises);
|
||||
}),
|
||||
);
|
||||
router.push(
|
||||
Module.getInstance()
|
||||
.get()
|
||||
.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", folderUid as string),
|
||||
);
|
||||
console.log("All files have been successfully sent.");
|
||||
} catch (error) {
|
||||
console.error("Error while sending files: ", error);
|
||||
}
|
||||
},
|
||||
[files, folderUid, router, selectedClients],
|
||||
);
|
||||
|
||||
// const onAddToList = useCallback((documentFile: IDocumentFile) => {
|
||||
// const test = files;
|
||||
// test.push(documentFile);
|
||||
// setFiles(test);
|
||||
// }, []);
|
||||
|
||||
// const onRemoveFromList = useCallback((documentFile: IDocumentFile) => {
|
||||
// const test = files;
|
||||
// const index = test.findIndex((doc) => doc.id === documentFile.id);
|
||||
// if (index === -1) return;
|
||||
// test.splice(index, 1);
|
||||
// setFiles(test);
|
||||
// }, []);
|
||||
|
||||
const fetchFolder = useCallback(async () => {
|
||||
Folders.getInstance()
|
||||
@ -126,11 +94,9 @@ export default function SendDocuments() {
|
||||
setClientSelection(selection);
|
||||
|
||||
if (selection === EClientSelection.ALL_CLIENTS && folder?.customers) {
|
||||
// Automatically select all customers
|
||||
const allClientIds = folder.customers.map((customer) => customer.uid ?? "");
|
||||
setSelectedClients(allClientIds);
|
||||
} else {
|
||||
// Clear selected clients when selecting "Sélectionner certains clients"
|
||||
setSelectedClients([]);
|
||||
}
|
||||
},
|
||||
@ -143,11 +109,7 @@ export default function SendDocuments() {
|
||||
|
||||
useEffect(() => {
|
||||
fetchFolder();
|
||||
if (folder?.customers && clientSelection === EClientSelection.ALL_CLIENTS) {
|
||||
const allClientIds = folder.customers.map((customer) => customer.uid ?? "");
|
||||
setSelectedClients(allClientIds);
|
||||
}
|
||||
}, []);
|
||||
}, [fetchFolder]);
|
||||
|
||||
const backUrl = useMemo(
|
||||
() =>
|
||||
@ -191,7 +153,6 @@ export default function SendDocuments() {
|
||||
value={EClientSelection.SELECTED_CLIENTS}
|
||||
label="Sélectionner certains clients"
|
||||
onChange={onClientSelectionChange}
|
||||
defaultChecked
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
@ -30,7 +30,6 @@ export default function Folder() {
|
||||
},
|
||||
})
|
||||
.then((folders) => {
|
||||
console.log(folders);
|
||||
if (folders.length > 0)
|
||||
router.push(
|
||||
Module.getInstance()
|
||||
|
Loading…
x
Reference in New Issue
Block a user