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

🐛 Autofill update client

Browse Source
This commit is contained in:
Maxime Lalo 2023-04-27 12:16:56 +02:00
parent 5feca67743
commit af66c5bcae
4 changed files with 51 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/front/Components/DesignSystem/FolderList/index.tsx
View File

@ -29,7 +29,6 @@ class FolderListClass extends React.Component<IPropsClass, IState> {
<div className={classes["root"]}>
{this.props.folders.sort((folder) => {
const pendingDocuments = folder.documents!.filter((document) => document.document_status === "PENDING");
console.log(pendingDocuments.length);
return pendingDocuments.length >= 1 ? -1 : 1;
}).map((folder) => {
return (

7
src/front/Components/DesignSystem/Form/Elements/InputField/index.tsx
View File

@ -66,6 +66,7 @@ export default class InputField extends BaseField<IProps> {
className={
this.props.className ? [classes["input"], classes[this.props.className]].join(" ") : classes["input"]
}
value={value}
/>
<div className={classes["fake-placeholder"]}>{this.props.fakeplaceholder}</div>
</div>
@ -74,6 +75,12 @@ export default class InputField extends BaseField<IProps> {
}
}
public override componentDidMount() {
this.setState({
value: this.props.defaultValue ?? "",
})
}
// We filter the props we'll pass to the primitive input as they're useless for it
// It also avoids the console warning because of passing useless props to a primitive DOM element
private getHtmlAttributes() {

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

@ -66,7 +66,7 @@ class FolderInformationClass extends BasePage<IPropsClass, IState> {
<FolderBoxInformation folder={this.state.selectedFolder} type={EFolderBoxInformationType.DESCRIPTION} />
</div>
<div className={classes["progress-bar"]}>
<QuantityProgressBar title="Complétion du dossier" total={100} currentNumber={0} />
<QuantityProgressBar title="Complétion du dossier" total={100} currentNumber={34} />
</div>
{this.doesFolderHaveCustomer() && <ClientSection folder={this.state.selectedFolder} />}
</div>

61
src/front/Components/Layouts/Folder/UpdateClient/index.tsx
View File

@ -1,20 +1,28 @@
import "reflect-metadata";
import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
import Form from "@Front/Components/DesignSystem/Form";
import InputField from "@Front/Components/DesignSystem/Form/Elements/InputField";
import Confirm from "@Front/Components/DesignSystem/Modal/Confirm";
import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
import BackArrow from "@Front/Components/Elements/BackArrow";
import { folders } from "@Front/Components/Layouts/DesignSystem/dummyData";
import DefaultNotaryDashboard, { IDashBoardFolder } from "@Front/Components/LayoutTemplates/DefaultNotaryDashboard";
import { useRouter } from "next/router";
import Module from "@Front/Config/Module";
import { Contact } from "le-coffre-resources/dist/Customer";
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 Link from "next/link";
import { ChangeEvent } from "react";
import Confirm from "@Front/Components/DesignSystem/Modal/Confirm";
import Module from "@Front/Config/Module";
type IProps = {
type IProps = {};
type IPropsClass = IProps & {
selectedFolderUid: string;
router: NextRouter;
client: Contact | null;
};
type IState = {
selectedFolder: IDashBoardFolder | null;
@ -25,8 +33,8 @@ type IState = {
isOpenLeavingModal: boolean;
doesInputHaveValues: boolean;
};
class UpdateClientClass extends BasePage<IProps, IState> {
constructor(props: IProps) {
class UpdateClientClass extends BasePage<IPropsClass, IState> {
constructor(props: IPropsClass) {
super(props);
this.state = {
selectedFolder: null,
@ -44,34 +52,38 @@ class UpdateClientClass extends BasePage<IProps, IState> {
this.onChangePhoneNumberInput = this.onChangePhoneNumberInput.bind(this);
this.openLeavingModal = this.openLeavingModal.bind(this);
this.closeLeavingModal = this.closeLeavingModal.bind(this);
this.leavePage = this.leavePage.bind(this);
}
public override render(): JSX.Element {
const backwardPath = Module.getInstance()
private backwardPath = Module.getInstance()
.get()
.modules.pages.Folder.pages.FolderInformation.props.path.replace("[folderUid]", this.props.selectedFolderUid);
public override render(): JSX.Element {
return (
<DefaultNotaryDashboard title={"Ajouter client(s)"} onSelectedFolder={this.onSelectedFolder}>
<div className={classes["root"]}>
<div className={classes["back-arrow"]}>
<BackArrow url={backwardPath} />
<BackArrow url={this.backwardPath} />
</div>
<Typography typo={ITypo.H1Bis}>Modifier les informations du client</Typography>
<Form className={classes["form"]}>
<div className={classes["content"]}>
<InputField name="input field" fakeplaceholder="Nom" onChange={this.onChangeNameInput} />
<InputField name="input field" fakeplaceholder="Prénom" onChange={this.onChangeFirstNameInput} />
<InputField name="input field" fakeplaceholder="E-mail" isEmail onChange={this.onChangeEmailInput} />
<InputField name="input field" fakeplaceholder="Nom" onChange={this.onChangeNameInput} defaultValue={this.props.client?.first_name}/>
<InputField name="input field" fakeplaceholder="Prénom" onChange={this.onChangeFirstNameInput} defaultValue={this.props.client?.last_name}/>
<InputField name="input field" fakeplaceholder="E-mail" isEmail onChange={this.onChangeEmailInput} defaultValue={this.props.client?.email}/>
<InputField
name="input field"
fakeplaceholder="Numéro de téléphone"
isPositiveNumber
onChange={this.onChangePhoneNumberInput}
defaultValue={this.props.client?.phone_number}
/>
</div>
<div className={classes["button-container"]}>
{!this.doesInputsHaveValues() ? (
<Link href={backwardPath} className={classes["cancel-button"]}>
<Link href={this.backwardPath} className={classes["cancel-button"]}>
<Button variant={EButtonVariant.GHOST}>Annuler</Button>
</Link>
) : (
@ -89,13 +101,18 @@ class UpdateClientClass extends BasePage<IProps, IState> {
header={"Êtes-vous sur de vouloir quitter sans enregistrer ?"}
cancelText={"Annuler"}
confirmText={"Quitter"}
cancelPath={backwardPath}>
onAccept={this.leavePage}>
Si vous quittez, toutes les modifications que vous avez effectuées ne seront pas enregistrées.{" "}
</Confirm>
</div>
</DefaultNotaryDashboard>
);
}
private leavePage() {
this.props.router.push(this.backwardPath);
}
private openLeavingModal(): void {
this.setState({ isOpenLeavingModal: true });
}
@ -132,9 +149,15 @@ class UpdateClientClass extends BasePage<IProps, IState> {
}
}
export default function UpdateClient() {
export default function UpdateClient(props: IProps) {
const router = useRouter();
let { folderUid } = router.query;
let { folderUid, clientUid } = router.query;
folderUid = folderUid as string;
return <UpdateClientClass selectedFolderUid={folderUid} />;
let client = null;
const folder = folders.find((folder) => folder.uid === folderUid) ?? null;
if (folder && folder.office_folder_has_customers) {
client = folder.office_folder_has_customers.find((client) => client.customer.contact.uid === clientUid) ?? null;
}
return <UpdateClientClass {...props} router={router} selectedFolderUid={folderUid} client={client?.customer.contact ?? null} />;
}