Merge branch 'dev' into feature/ora-lecoffr-420-file-component

This commit is contained in:
Maxime Lalo 2023-04-20 17:00:02 +02:00
commit e3114f29c1
9 changed files with 123 additions and 6 deletions

View File

@ -73,7 +73,7 @@ export default class UserFolder extends React.Component<IProps, IState> {
{this.state.isOpen && (
<div className={classes["container"]} data-will-close={this.state.willClose.toString()} ref={this.rootRefElement}>
<QuantityProgressBar
title="Complétion du dossier"
title="Complétion du dossier client"
total={100}
currentNumber={this.calculateDocumentsPercentageProgress()}
/>

View File

@ -13,19 +13,25 @@
max-height: 100vh;
overflow: auto;
}
.sides {
width: 50%;
@media (max-width: $screen-m) {
width: 100%;
}
&.image-container {
display: flex;
align-items: center;
justify-content: center;
@media (max-width: $screen-m) {
display: none;
}
background: var(--grey-soft);
.image {
width: 100%;
height: 100%;
@ -38,6 +44,10 @@
align-items: center;
justify-content: center;
@media (max-width: $screen-m) {
display: none;
}
.background-image {
height: 100%;
width: 100%;
@ -46,4 +56,4 @@
}
}
}
}
}

View File

@ -89,7 +89,7 @@ export default class CreateFolder extends BasePage<IProps, IState> {
<Select options={this.actsOptions} placeholder={"Type dacte"} onChange={this.onActTypeChange} />
<InputField
name="personal_note"
fakeplaceholder="Note personnelle"
fakeplaceholder="Note du dossier"
textarea
onChange={this.onPersonalNoteChange}
/>

View File

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

View File

@ -36,7 +36,7 @@ class UpdateFolderDescriptionClass extends BasePage<IProps, IState> {
<Form className={classes["form"]}>
<div className={classes["content"]}>
<InputField name="input field" fakeplaceholder="Intitulé du dossier" textarea />
<InputField name="input field" fakeplaceholder="Note du dossier" textarea />
</div>
<div className={classes["button-container"]}>

View File

@ -0,0 +1,27 @@
@import "@Themes/constants.scss";
.root {
.title {
margin-top: 24px;
}
.parts-container {
display: flex;
gap: 64px;
margin-top: 32px;
@media (max-width: $screen-m) {
flex-direction: column;
}
.part {
flex: 1;
.form-container {
display: flex;
flex-direction: column;
gap: 24px;
margin-top: 32px;
}
}
}
}

View File

@ -0,0 +1,61 @@
import Form, { IApiFormErrors } from "@Front/Components/DesignSystem/Form";
import InputField from "@Front/Components/DesignSystem/Form/Elements/InputField";
import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography";
import Base from "@Front/Components/Layouts/Base";
import DefaultTemplate from "@Front/Components/LayoutTemplates/DefaultTemplate";
import React from "react";
import classes from "./classes.module.scss";
type IProps = {};
type IState = {};
export default class MyAccount extends Base<IProps, IState> {
public override render(): JSX.Element {
return (
<DefaultTemplate title={"Mon compte"}>
<div className={classes["root"]}>
<Typography typo={ITypo.H1} color={ITypoColor.BLACK} className={classes["title"]}>
Mon compte
</Typography>
<div className={classes["parts-container"]}>
<div className={classes["part"]}>
<Typography typo={ITypo.H2} color={ITypoColor.BLACK}>
Mes informations
</Typography>
<Form onSubmit={this.onFormSubmit}>
<div className={classes["form-container"]}>
<InputField name="name" fakeplaceholder="Nom" type="text" />
<InputField name="surname" fakeplaceholder="Prénom" type="text" />
<InputField name="email" fakeplaceholder="E-mail" type="email" />
<InputField name="phone" fakeplaceholder="Numéro de téléphone" type="tel" />
</div>
</Form>
</div>
<div className={classes["part"]}>
<Typography typo={ITypo.H2} color={ITypoColor.BLACK}>
Mon office
</Typography>
<Form onSubmit={this.onFormSubmit}>
<div className={classes["form-container"]}>
<InputField name="office_denomination" fakeplaceholder="Dénomination de l'office" type="text" />
<InputField name="crpcen" fakeplaceholder="CRPCEN" type="number" />
<InputField name="cp_address" fakeplaceholder="Adresse CP" type="text" />
<InputField name="city" fakeplaceholder="Ville" type="text" />
</div>
</Form>
</div>
</div>
</div>
</DefaultTemplate>
);
}
private onFormSubmit(
e: React.FormEvent<HTMLFormElement> | null,
values: {
[key: string]: string;
},
onApiErrors: (apiFormErrors: IApiFormErrors | null) => void,
) {}
}

View File

@ -18,6 +18,20 @@ body {
input {
font-size: 18px;
/* Firefox */
-moz-appearance: textfield;
/* Chrome */
&::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
/* Opéra*/
&::-o-inner-spin-button {
-o-appearance: none;
margin: 0;
}
}
::placeholder {
@ -49,4 +63,4 @@ a:hover {
.react-select__menu-notice {
font-size: 18px;
font-family: Inter;
}
}

View File

@ -0,0 +1,5 @@
import MyAccount from "@Front/Components/Layouts/MyAccount";
export default function Route() {
return <MyAccount />;
}