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

✨ Getting office users

Browse Source
This commit is contained in:
Maxime Lalo 2023-07-24 11:56:13 +02:00
parent 080fe63c4e
commit 6c5be9061c
4 changed files with 140 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/front/Components/LayoutTemplates/DefaultCollaboratorDashboard/index.tsx
View File

@ -1,16 +1,16 @@
import ChevronIcon from "@Assets/Icons/chevron.svg";
import Users, { IGetUsersparams } from "@Front/Api/LeCoffreApi/Admin/Users/Users";
import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
import Header from "@Front/Components/DesignSystem/Header";
import Version from "@Front/Components/DesignSystem/Version";
import BackArrow from "@Front/Components/Elements/BackArrow";
import WindowStore from "@Front/Stores/WindowStore";
import classNames from "classnames";
import User from "le-coffre-resources/dist/Notary";
import Image from "next/image";
import React, { ReactNode } from "react";
import classes from "./classes.module.scss";
import Users, { IGetUsersparams } from "@Front/Api/LeCoffreApi/Admin/Users/Users";
import User from "le-coffre-resources/dist/Notary";
import CollaboratorListContainer from "./CollaboratorListContainer";
type IProps = {
@ -88,7 +88,7 @@ export default class DefaultCollaboratorDashboard extends React.Component<IProps
public override async componentDidMount() {
this.onWindowResize = WindowStore.getInstance().onResize((window) => this.onResize(window));
const query: IGetUsersparams = {
where: { office_uid: "2af8694e-4dac-4e0d-854a-acb7fed8aa7d" },
where: { office_uid: "6981326f-8a0a-4437-b15c-4cd5c4d80f6e" },
include: { contact: true },
};

17
src/front/Components/Layouts/Login/index.tsx
View File

@ -1,14 +1,15 @@
import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
import BasePage from "../Base";
import classes from "./classes.module.scss";
import CoffreIcon from "@Assets/Icons/coffre.svg";
import LandingImage from "./landing-connect.jpeg";
import Image from "next/image";
import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
// import { FrontendVariables } from "@Front/Config/VariablesFront";
import idNoteLogo from "@Assets/Icons/id-note-logo.svg";
import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
import Typography, { ITypo } from "@Front/Components/DesignSystem/Typography";
import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
import UserStore from "@Front/Stores/UserStore";
import Image from "next/image";
import BasePage from "../Base";
import classes from "./classes.module.scss";
import LandingImage from "./landing-connect.jpeg";
export default class LoginClass extends BasePage {
public override render(): JSX.Element {
@ -35,7 +36,7 @@ export default class LoginClass extends BasePage {
// const variables = FrontendVariables.getInstance();
// const baseFronturl = variables.BACK_API_PROTOCOL + variables.FRONT_APP_HOST;
await UserStore.instance.connect("I6LJH1tItz");
await UserStore.instance.connect("SbRKyM8BJI");
// await JwtService.getInstance().checkJwt();
// window.location.assign("http://localhost:3000" + "/folders");

34
src/front/Components/Layouts/Offices/OfficeInformations/classes.module.scss
View File

@ -50,4 +50,38 @@
gap: 12px;
}
}
.office-users {
.users {
.title {
margin-top: 32px;
}
.users-container {
margin-top: 32px;
text-align: center;
display: flex;
flex-direction: column;
gap: 24px;
.first-line,
.user-line {
display: grid;
grid-template-columns: repeat(5, 1fr);
padding: 24px;
background-color: var(--purple-soft);
}
.user-line {
background-color: var(--grey-soft);
}
.user-line {
&:nth-child(odd) {
background-color: var(--grey-medium);
}
}
}
}
}
}

95
src/front/Components/Layouts/Offices/OfficeInformations/index.tsx
View File

@ -1,9 +1,10 @@
import Offices from "@Front/Api/LeCoffreApi/SuperAdmin/Offices/Offices";
import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography";
import DefaultOfficeDashboard from "@Front/Components/LayoutTemplates/DefaultOfficeDashboard";
import { Office } from "le-coffre-resources/dist/Notary";
import User, { Office } from "le-coffre-resources/dist/SuperAdmin";
import { useRouter } from "next/router";
import { useEffect, useState } from "react";
import classes from "./classes.module.scss";
type IProps = {};
@ -19,6 +20,13 @@ export default function OfficeInformations(props: IProps) {
const office = await Offices.getInstance().getByUid(officeUid as string, {
q: {
address: true,
users: {
include: {
role: true,
office_role: true,
contact: true,
},
},
},
});
if (!office) return;
@ -28,6 +36,15 @@ export default function OfficeInformations(props: IProps) {
getOffice();
}, [officeUid]);
const renderUser = (user: User) => (
<div key={user.uid} className={classes["user-line"]}>
<Typography typo={ITypo.P_16}>{user.contact?.last_name}</Typography>
<Typography typo={ITypo.P_16}>{user.contact?.first_name}</Typography>
<Typography typo={ITypo.P_16}>{user.contact?.email}</Typography>
<Typography typo={ITypo.P_16}>{user.contact?.phone_number}</Typography>
<Typography typo={ITypo.P_16}>{user.office_role ? user.office_role?.name : user.role?.name}</Typography>
</div>
);
return (
<DefaultOfficeDashboard mobileBackText={"Liste des utilisateurs"}>
<div className={classes["root"]}>
@ -60,6 +77,82 @@ export default function OfficeInformations(props: IProps) {
</Typography>
</div>
</div>
<div className={classes["office-users"]}>
<div className={classes["users"]}>
<div className={classes["title"]}>
<Typography typo={ITypo.H3}>Administrateurs</Typography>
</div>
<div className={classes["users-container"]}>
<div className={classes["first-line"]}>
<Typography typo={ITypo.NAV_HEADER_18} color={ITypoColor.BLACK}>
Nom
</Typography>
<Typography typo={ITypo.NAV_HEADER_18} color={ITypoColor.BLACK}>
Prénom
</Typography>
<Typography typo={ITypo.NAV_HEADER_18} color={ITypoColor.BLACK}>
E-mail pro
</Typography>
<Typography typo={ITypo.NAV_HEADER_18} color={ITypoColor.BLACK}>
Numéro de téléphone
</Typography>
<Typography typo={ITypo.NAV_HEADER_18} color={ITypoColor.BLACK}>
Rôle
</Typography>
</div>
{officeSelected?.users
?.filter((user) => {
if (user.office_role && user.office_role.name === "admin") {
return true;
}
if (!user.office_role && user.role?.name === "admin") {
return true;
}
return false;
})
.map((user) => {
return renderUser(user);
})}
</div>
</div>
<div className={classes["users"]}>
<div className={classes["title"]}>
<Typography typo={ITypo.H3}>Collaborateurs</Typography>
</div>
<div className={classes["users-container"]}>
<div className={classes["first-line"]}>
<Typography typo={ITypo.NAV_HEADER_18} color={ITypoColor.BLACK}>
Nom
</Typography>
<Typography typo={ITypo.NAV_HEADER_18} color={ITypoColor.BLACK}>
Prénom
</Typography>
<Typography typo={ITypo.NAV_HEADER_18} color={ITypoColor.BLACK}>
E-mail pro
</Typography>
<Typography typo={ITypo.NAV_HEADER_18} color={ITypoColor.BLACK}>
Numéro de téléphone
</Typography>
<Typography typo={ITypo.NAV_HEADER_18} color={ITypoColor.BLACK}>
Rôle
</Typography>
</div>
{officeSelected?.users
?.filter((user) => {
if (user.office_role && user.office_role.name !== "admin") {
return true;
}
if (!user.office_role && user.role?.name !== "admin") {
return true;
}
return false;
})
.map((user) => {
return renderUser(user);
})}
</div>
</div>
</div>
</div>
</DefaultOfficeDashboard>
);