Base de tableau de bord

This commit is contained in:
wpetit 2020-07-16 20:43:41 +02:00
parent 303ea6b1d6
commit 7bf4c4f080
2 changed files with 59 additions and 12 deletions

View File

@ -0,0 +1,46 @@
import React from 'react';
export function Dashboard() {
return (
<div className="columns">
<div className="column">
<div className="box">
<div className="level">
<div className="level-left">
<h3 className="is-size-3 subtitle level-item">Groupes de travail</h3>
</div>
<div className="level-right">
<button className="button is-primary level-item"><i className="fa fa-plus"></i></button>
</div>
</div>
</div>
</div>
<div className="column">
<div className="box">
<div className="level">
<div className="level-left">
<h3 className="is-size-3 subtitle level-item">D.à.Ds</h3>
</div>
<div className="level-right">
<button disabled className="button is-primary level-item"><i className="fa fa-plus"></i></button>
</div>
</div>
<pre>TODO</pre>
</div>
</div>
<div className="column">
<div className="box">
<div className="level">
<div className="level-left">
<h3 className="is-size-3 subtitle level-item">Assemblées</h3>
</div>
<div className="level-right">
<button disabled className="button is-primary level-item"><i className="fa fa-plus"></i></button>
</div>
</div>
<pre>TODO</pre>
</div>
</div>
</div>
);
}

View File

@ -1,26 +1,27 @@
import React, { useEffect } from 'react';
import { Page } from '../Page';
import { useSelector, useDispatch } from 'react-redux';
import { useSelector } from 'react-redux';
import { RootState } from '../../store/reducers/root';
import { Dashboard } from './Dashboard';
export function HomePage() {
const currentUser = useSelector((state: RootState) => state.auth.currentUser);
return (
<Page title="Accueil">
<Page title={currentUser ? 'Tableau de bord' : 'Accueil'}>
<div className="container is-fluid">
<section className="section">
<div className="columns">
<div className="column is-4 is-offset-4">
<div className="box">
{
currentUser && currentUser.email ?
<p>Bonjour <span className="has-text-weight-bold">{currentUser.name ? currentUser.name : currentUser.email}</span> !</p> :
<p>Veuillez vous authentifier.</p>
}
{
currentUser ?
<Dashboard /> :
<div className="columns">
<div className="column is-4 is-offset-4">
<div className="box">
<p>Veuillez vous authentifier.</p>
</div>
</div>
</div>
</div>
</div>
}
</section>
</div>
</Page>