forked from CRM_Production/JTT_CrM
parent
a46c189cd8
commit
0e295faae6
@ -0,0 +1,13 @@
|
||||
import React from 'react';
|
||||
import { NavLink } from 'react-router-dom';
|
||||
|
||||
|
||||
const NavigationDashboard = () => {
|
||||
return (
|
||||
<div className="nav_barre_verticale">
|
||||
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default NavigationDashboard;
|
||||
@ -0,0 +1,70 @@
|
||||
import React from 'react';
|
||||
import axios from 'axios'
|
||||
import Chart from 'chart.js/auto'
|
||||
window.Chart = Chart
|
||||
|
||||
const api = axios.create({
|
||||
baseURL: 'http://localhost:8080'
|
||||
})
|
||||
|
||||
|
||||
const Analyse = () => {
|
||||
return (
|
||||
<div className="page_analyse">
|
||||
{/* Create an analysis page */}
|
||||
<div className="haut_de_page">
|
||||
<h2 className="titre">Analyse</h2>
|
||||
<div className="rechLogo">
|
||||
<div className="input_box">
|
||||
<input type="search" placeholder="Rechercher..."/>
|
||||
<span className="search">
|
||||
<i class="uil uil-search search-icon"></i>
|
||||
</span>
|
||||
</div>
|
||||
<img className="logo" srcSet="./LogoApp.svg"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bas_de_page">
|
||||
<div className="nav_bar_verticale">
|
||||
<div className="parti_one">
|
||||
<button className="button" type="submit">
|
||||
<img className="logo_nav_bar" srcSet="./logo_person.svg"/>
|
||||
</button>
|
||||
</div>
|
||||
<div className="parti_two">
|
||||
<button className="button" type="submit">
|
||||
<img className="logo_nav_bar" srcSet="./logo_speed.svg"/>
|
||||
</button>
|
||||
<button className="button" type="submit">
|
||||
<img className="logo_nav_bar" srcSet="./logo_graph.svg"/>
|
||||
</button>
|
||||
<button className="button" type="submit">
|
||||
<img className="logo_nav_bar" srcSet="./logo_calendrier.svg"/>
|
||||
</button>
|
||||
</div>
|
||||
<div className="parti_three">
|
||||
<button className="button" type="submit">
|
||||
<img className="logo_nav_bar" srcSet="./logo_group.svg"/>
|
||||
</button>
|
||||
</div>
|
||||
<div className="parti_four">
|
||||
<button className="button" type="submit">
|
||||
<img className="logo_nav_bar" srcSet="./logo_parametre.svg"/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="Analyse">
|
||||
<div className="statistiques_1">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
export default Analyse;
|
||||
@ -0,0 +1,143 @@
|
||||
.page_analyse {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
//justify-content: space-evenly;
|
||||
width: auto;
|
||||
height: 100vh;
|
||||
|
||||
background: rgba(255, 255, 255, 0.143);
|
||||
border-radius: 15px;
|
||||
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||
backdrop-filter: blur(3px);
|
||||
-webkit-backdrop-filter: blur(15px);
|
||||
|
||||
.haut_de_page {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding: 50px;
|
||||
width: auto;
|
||||
height: 10%;
|
||||
align-items: center;
|
||||
margin: 10px 10px 5px 10px;
|
||||
|
||||
background: rgba(255, 255, 255, 0.143);
|
||||
border-radius: 15px;
|
||||
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||
backdrop-filter: blur(3px);
|
||||
-webkit-backdrop-filter: blur(15px);
|
||||
|
||||
.titre {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.rechLogo {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
|
||||
.input_box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
height: 40px;
|
||||
max-width: 350px;
|
||||
width: 100%;
|
||||
margin: 30px 30px;
|
||||
border-radius: 25px;
|
||||
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||
|
||||
input {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0 15px 0 65px;
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 25px;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
width: 60px;
|
||||
border-radius: 25px 0 0 25px;
|
||||
|
||||
.search-icon {
|
||||
font-size: 30px;
|
||||
color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.logo {
|
||||
display: flex;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bas_de_page {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
//justify-content: space-between;
|
||||
width: auto;
|
||||
height: 86%;
|
||||
|
||||
.nav_bar_verticale {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
width: 5%;
|
||||
margin: 5px 5px 10px 10px;
|
||||
|
||||
background: rgba(255, 255, 255, 0.143);
|
||||
border-radius: 15px;
|
||||
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||
backdrop-filter: blur(3px);
|
||||
-webkit-backdrop-filter: blur(15px);
|
||||
|
||||
.button {
|
||||
display: flex;
|
||||
object-fit: cover;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
|
||||
.logo_nav_bar{
|
||||
display: flex;
|
||||
margin: 10px;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.statistiques_1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
padding: 50px;
|
||||
width: 1423px;
|
||||
height: 627px;
|
||||
margin: 5px 5px 10px 10px;
|
||||
|
||||
background: rgba(255, 255, 255, 0.143);
|
||||
border-radius: 15px;
|
||||
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
|
||||
backdrop-filter: blur(3px);
|
||||
-webkit-backdrop-filter: blur(15px);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,4 +1,6 @@
|
||||
@import "./settings.scss";
|
||||
@import "./components/connexion.scss";
|
||||
@import "./components/admin.scss";
|
||||
@import "./components/compte.scss";
|
||||
@import "./settings";
|
||||
@import "./components/connexion";
|
||||
@import "./components/admin";
|
||||
@import "./components/compte";
|
||||
@import "./components/dashboard";
|
||||
@import "./components/analyse";
|
||||
Loading…
Reference in new issue