Merge branch 'staging' into dev

This commit is contained in:
Maxime Lalo 2023-09-19 17:09:39 +02:00
commit b2cbe58ed2
4 changed files with 79 additions and 55 deletions

View File

@ -21,7 +21,7 @@
display: inline-flex; display: inline-flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
overflow-wrap: anywhere;
.warning { .warning {
margin-left: 32px; margin-left: 32px;
} }

View File

@ -23,13 +23,13 @@
.text-container { .text-container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
overflow-wrap: anywhere;
> :first-child { > :first-child {
margin-bottom: 12px; margin-bottom: 12px;
} }
} }
@media (max-width: $screen-ls) { @media (max-width: $screen-ls) {
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
} }
@ -37,8 +37,6 @@
@media (max-width: $screen-s) { @media (max-width: $screen-s) {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
} }
.edit-icon-container { .edit-icon-container {
@ -54,5 +52,4 @@
margin-top: 24px; margin-top: 24px;
} }
} }
}
}

View File

@ -26,6 +26,7 @@ type IPropsClass = IProps & {
type IState = { type IState = {
filteredFolders: OfficeFolder[]; filteredFolders: OfficeFolder[];
blocks: IBlock[];
}; };
class FolderListContainerClass extends React.Component<IPropsClass, IState> { class FolderListContainerClass extends React.Component<IPropsClass, IState> {
@ -36,6 +37,7 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
super(props); super(props);
this.state = { this.state = {
filteredFolders: this.props.folders, filteredFolders: this.props.folders,
blocks: this.getBlocks(this.props.folders),
}; };
this.filterFolders = this.filterFolders.bind(this); this.filterFolders = this.filterFolders.bind(this);
this.onSelectedFolder = this.onSelectedFolder.bind(this); this.onSelectedFolder = this.onSelectedFolder.bind(this);
@ -50,7 +52,7 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
<SearchBar onChange={this.filterFolders} placeholder="Chercher un dossier" /> <SearchBar onChange={this.filterFolders} placeholder="Chercher un dossier" />
</div> </div>
<div className={classes["folderlist-container"]}> <div className={classes["folderlist-container"]}>
<BlockList blocks={this.getBlocks()} onSelectedBlock={this.onSelectedFolder} /> <BlockList blocks={this.state.blocks} onSelectedBlock={this.onSelectedFolder} />
</div> </div>
</div> </div>
{!this.props.isArchived && ( {!this.props.isArchived && (
@ -73,8 +75,8 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
); );
} }
private getBlocks(): IBlock[] { private getBlocks(folders: OfficeFolder[]): IBlock[] {
const pendingFolders = this.props.folders const pendingFolders = folders
.filter((folder) => { .filter((folder) => {
const pendingDocuments = (folder.documents ?? []).filter( const pendingDocuments = (folder.documents ?? []).filter(
(document) => document.document_status === EDocumentStatus.DEPOSITED, (document) => document.document_status === EDocumentStatus.DEPOSITED,
@ -85,7 +87,7 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
return folder1.created_at! > folder2.created_at! ? -1 : 1; return folder1.created_at! > folder2.created_at! ? -1 : 1;
}); });
const otherFolders = this.props.folders const otherFolders = folders
.filter((folder) => { .filter((folder) => {
const pendingDocuments = (folder.documents ?? []).filter( const pendingDocuments = (folder.documents ?? []).filter(
(document) => document.document_status === EDocumentStatus.DEPOSITED, (document) => document.document_status === EDocumentStatus.DEPOSITED,
@ -104,6 +106,7 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
}; };
}); });
} }
private onSelectedFolder(block: IBlock) { private onSelectedFolder(block: IBlock) {
const folder = this.props.folders.find((folder) => folder.uid === block.id); const folder = this.props.folders.find((folder) => folder.uid === block.id);
if (!folder) return; if (!folder) return;
@ -116,19 +119,21 @@ class FolderListContainerClass extends React.Component<IPropsClass, IState> {
const filteredFolders: OfficeFolder[] = this.props.folders.filter((folder) => { const filteredFolders: OfficeFolder[] = this.props.folders.filter((folder) => {
const name = folder.name.toLowerCase(); const name = folder.name.toLowerCase();
const number = folder.folder_number.toLowerCase(); const number = folder.folder_number.toLowerCase();
value = value.toLowerCase();
if (folder.customers) { if (folder.customers) {
const customerNames = folder.customers const customerNames = folder.customers
.map((customer) => { .map((customer) => {
return `${customer.contact?.first_name.toLowerCase()} ${customer.contact?.last_name.toLowerCase()}`; return `${customer.contact?.first_name.toLowerCase()} ${customer.contact?.last_name.toLowerCase()}`;
}) })
.join(", "); .join(", ");
return name.includes(value) || number.includes(value) || customerNames.includes(value); return name.includes(value) || number.includes(value) || customerNames.includes(value);
} }
return name.includes(value) || number.includes(value); return name.includes(value) || number.includes(value);
}); });
this.setState({ filteredFolders });
this.setState({ filteredFolders, blocks: this.getBlocks(filteredFolders) });
} }
} }

View File

@ -24,7 +24,9 @@ type IState = {
selectedFolder: OfficeFolder | null; selectedFolder: OfficeFolder | null;
selectedOption?: ERadioBoxValue; selectedOption?: ERadioBoxValue;
availableCollaborators: User[]; availableCollaborators: User[];
defaultCheckedAllOffice: boolean;
selectedCollaborators: readonly IOption[]; selectedCollaborators: readonly IOption[];
loading: boolean;
}; };
enum ERadioBoxValue { enum ERadioBoxValue {
@ -39,6 +41,9 @@ class UpdateFolderCollaboratorsClass extends BasePage<IPropsClass, IState> {
selectedFolder: null, selectedFolder: null,
availableCollaborators: [], availableCollaborators: [],
selectedCollaborators: [], selectedCollaborators: [],
defaultCheckedAllOffice: false,
selectedOption: ERadioBoxValue.SELECTION,
loading: true,
}; };
this.onSelectedFolder = this.onSelectedFolder.bind(this); this.onSelectedFolder = this.onSelectedFolder.bind(this);
this.onSelectedOptionAllOffice = this.onSelectedOptionAllOffice.bind(this); this.onSelectedOptionAllOffice = this.onSelectedOptionAllOffice.bind(this);
@ -55,6 +60,7 @@ class UpdateFolderCollaboratorsClass extends BasePage<IPropsClass, IState> {
value: collaborator.uid, value: collaborator.uid,
}; };
}); });
return ( return (
<DefaultNotaryDashboard title={"Ajouter client(s)"} onSelectedFolder={this.onSelectedFolder}> <DefaultNotaryDashboard title={"Ajouter client(s)"} onSelectedFolder={this.onSelectedFolder}>
<div className={classes["root"]}> <div className={classes["root"]}>
@ -63,34 +69,44 @@ class UpdateFolderCollaboratorsClass extends BasePage<IPropsClass, IState> {
</div> </div>
<Typography typo={ITypo.H1Bis}>Modifier les collaborateurs</Typography> <Typography typo={ITypo.H1Bis}>Modifier les collaborateurs</Typography>
<Form className={classes["form"]} onSubmit={this.onFormSubmit}> {!this.state.loading && (
<div className={classes["content"]}> <Form className={classes["form"]} onSubmit={this.onFormSubmit}>
<RadioBox name="office" value={ERadioBoxValue.ALL} defaultChecked onChange={this.onSelectedOptionAllOffice}> <div className={classes["content"]}>
Tout l'office <RadioBox
</RadioBox> name="office"
<RadioBox name="office" value={ERadioBoxValue.SELECTION} onChange={this.onSelectedOptionSpecific}> value={ERadioBoxValue.ALL}
Sélectionner des collaborateurs defaultChecked={this.state.defaultCheckedAllOffice}
</RadioBox> onChange={this.onSelectedOptionAllOffice}>
</div> Tout l'office
</RadioBox>
{this.state.selectedOption === ERadioBoxValue.SELECTION && ( <RadioBox
<div className={classes["sub-content"]}> name="office"
<MultiSelect value={ERadioBoxValue.SELECTION}
onChange={this.onChangeSelectedCollaborators} defaultChecked={!this.state.defaultCheckedAllOffice}
options={selectOptions} onChange={this.onSelectedOptionSpecific}>
placeholder="Collaborateurs" Sélectionner des collaborateurs
defaultValue={this.state.selectedCollaborators} </RadioBox>
/>
</div> </div>
)}
<div className={classes["button-container"]}> {this.state.selectedOption === ERadioBoxValue.SELECTION && (
<Link href={backwardPath} className={classes["cancel-button"]}> <div className={classes["sub-content"]}>
<Button variant={EButtonVariant.GHOST}>Annuler</Button> <MultiSelect
</Link> onChange={this.onChangeSelectedCollaborators}
<Button type="submit">Enregistrer</Button> options={selectOptions}
</div> placeholder="Collaborateurs"
</Form> defaultValue={this.state.selectedCollaborators}
/>
</div>
)}
<div className={classes["button-container"]}>
<Link href={backwardPath} className={classes["cancel-button"]}>
<Button variant={EButtonVariant.GHOST}>Annuler</Button>
</Link>
<Button type="submit">Enregistrer</Button>
</div>
</Form>
)}
</div> </div>
</DefaultNotaryDashboard> </DefaultNotaryDashboard>
); );
@ -121,27 +137,33 @@ class UpdateFolderCollaboratorsClass extends BasePage<IPropsClass, IState> {
value: collaborator.uid, value: collaborator.uid,
}; };
}); });
this.setState({ selectedCollaborators: preSelectedCollaborators });
// no need to pass query 'where' param here, default query for notaries include only users which are in the same office as the caller
const userQuery: IGetUsersParams = {
include: {
contact: {
select: {
first_name: true,
last_name: true,
},
},
},
};
const availableCollaborators = await Users.getInstance().get(userQuery);
this.setState({
loading: false,
availableCollaborators,
selectedCollaborators: preSelectedCollaborators,
defaultCheckedAllOffice: preSelectedCollaborators.length === availableCollaborators.length,
selectedOption:
preSelectedCollaborators.length === availableCollaborators.length ? ERadioBoxValue.ALL : ERadioBoxValue.SELECTION,
});
} catch (error) { } catch (error) {
this.props.router.push(Module.getInstance().get().modules.pages["404"].props.path); this.props.router.push(Module.getInstance().get().modules.pages["404"].props.path);
return; return;
} }
// no need to pass query 'where' param here, default query for notaries include only users which are in the same office as the caller
const userQuery: IGetUsersParams = {
include: {
contact: {
select: {
first_name: true,
last_name: true,
},
},
},
};
const availableCollaborators = await Users.getInstance().get(userQuery);
console.log(availableCollaborators)
this.setState({ availableCollaborators });
} }
private onSelectedOptionAllOffice(event: React.ChangeEvent<HTMLInputElement>) { private onSelectedOptionAllOffice(event: React.ChangeEvent<HTMLInputElement>) {