Merge branch 'master' of https://codefirst.iut.uca.fr/git/CRM_Production/JTT_CrM

server-api/api.js

@@ -140,6 +140,48 @@ app.get('/Sale/Pie/:iduser/:month/:year', (req, res) => {
     });
 });
 
+app.get('/Sale/Verif/:month/:year/:idcustomer', (req, res) => {
+    
+    const month = req.params.month;
+    const year = req.params.year;
+    const idcustomer = req.params.idcustomer;
+    let sql = 'SELECT s.idsale FROM sales s WHERE s.month = ? AND s.year = ? AND s.idcustomer = ?';
+
+    db.query(sql, [month,year,idcustomer], (err, result) => {
+        if (err) throw err;
+
+        console.log(result);
+        res.send(result);
+    });
+});
+
+app.post('/Sale/Add', (req, res) => {
+    
+    let form = req.body;
+    
+    console.log(form);
+    
+    const sql = `INSERT INTO sales(amount, year, month, idcustomer) VALUES ('${form[0]}', '${form[1]}', '${form[2]}', '${form[3]}')`;
+     db.query(sql , (err, result) => { 
+        if (err) throw err;
+        console.log(result);
+        res.send('Post added...');
+    });
+});
+
+app.put('/Sale/Update/:id', (req, res) => {
+
+    const id = req.params.id;
+    let form = req.body;
+
+    const sql = `UPDATE sales SET amount = ?, year = ?, month = ?, idcustomer = ? WHERE (idsale = ?)`;
+    db.query(sql, [form[0],form[1],form[2],form[3], id], (err, result) => { 
+        if (err) throw err;
+        console.log(result);
+        res.send('Post update...');
+    });
+});
+
 app.get('/User/All', (req, res) => {
 
     let sql = 'SELECT iduser,lastname,firstname,login,phone,mail,roles.name FROM users,roles where users.idrole = roles.idrole Order by roles.idrole,lastname,firstname;';

src/App.js

@@ -32,6 +32,8 @@ const App = () => {
         <Route path="/Admin_list" element={<Admin_list />} />
         <Route path="/Admin_modif" element={<Admin_modif />} />
         <Route path="/Admin_supp" element={<Admin_supp />} />
+        <Route path="/Admin_devis" element={<Admin_devis />} />
+        <Route path="/RestartPassword" element={<RestartPassword />} />
         <Route path="/Dashboard" element={<Dashboard />} />
         <Route path="/Analyse" element={<Analyse />} />
         <Route path="/Calendrier" element={<Calendrier />} />

src/components/NavigationAdmin.js

@@ -20,7 +20,7 @@ const NavigationAdmin = (props) => {
                     <button id="bouton_sup" className="bouton" type="button" value="Supprimer un utilisateur">Supprimer utilisateur</button>
                 </NavLink>
                 <NavLink className="list_devis" to="/Admin_devis">
-                    <button id="bouton_devis" className="bouton" type="button" value="Devis">Devis</button>
+                    <button id="bouton_devis" className="bouton" type="button" value="Devis">Importer Sales</button>
                 </NavLink>
             </div>
             <div className="BoutonDeco">

src/pages/Admin_create.js

@@ -57,7 +57,6 @@ function Admin_create() {
 
     return (
         <div className="page_admin">
-            <NavigationAdmin />
             <div className="Titre_Formulaire">
                 <p className="Titre">Admin</p>
                 <p className="Sous-titre">Création d'utilisateur</p>

src/pages/Admin_devis.js

@@ -3,12 +3,53 @@ import axios from 'axios'
 import NavigationAdmin from '../components/NavigationAdmin.js';
 import { TableContainer,Table,TableHead,TableBody,TableRow,TableCell } from '@mui/material';
 import { Paper } from '@mui/material';
+import * as XLSX from 'xlsx/xlsx.mjs';
 
 const api = axios.create({
     baseURL: 'http://localhost:8080'
   })
 
-const Admin_devis = () => {
+function Admin_devis() {
+
+    const processExcelFile = (data) =>{
+        var workbook = XLSX.read(data, {type: 'binary'});
+        const wsname = workbook.SheetNames[0];
+        const ws = workbook.Sheets[wsname];
+
+        const dataParse = XLSX.utils.sheet_to_json(ws, {header:1});;
+
+        dataParse.forEach(line => {
+            const apiString = '/Sale/Verif/' + line[2] + '/'+ line[1] + '/' + line[3];
+            api.get(apiString).then((response) => {
+                const data = response.data;
+                if(data.length > 0){
+                    const apiStringUpdate = '/Sale/Update/' + data[0].idsale;
+                    api.put(apiStringUpdate, line).then((response) => {
+                        console.log(response.data);
+                    });
+                }
+                else{
+                    api.post('/Sale/Add', line).then (function(response) {
+                        console.log(response.data);
+                    });
+                }
+            });
+        });
+    };
+
+    const fileSelected = (event) => {
+        var file = event.target.files[0];
+
+        if(typeof(FileReader) != "undefined") {
+            var reader = new FileReader();
+
+            reader.onload = function(event) {
+                processExcelFile(event.target.result);
+            };
+
+            reader.readAsBinaryString(file);
+        }            
+    };
 
     return (
         <div className="page_admin">
@@ -16,6 +57,7 @@ const Admin_devis = () => {
             <NavigationAdmin />
             <div className="devis">
                 <p className="Titre">Devis</p>
+                <input type="file" onChange={fileSelected}></input>
             </div>
         </div>
     );

src/pages/Admin_list.js

@@ -3,12 +3,21 @@ import axios from 'axios'
 import NavigationAdmin from '../components/NavigationAdmin.js';
 import { TableContainer,Table,TableHead,TableBody,TableRow,TableCell } from '@mui/material';
 import { Paper } from '@mui/material';
+import { useNavigate } from "react-router-dom";
+import Session from 'react-session-api';
 
 const api = axios.create({
     baseURL: 'http://localhost:8080'
   })
 
 function Admin_list() {
+    //test rejet
+    const navigate = useNavigate();
+
+    useEffect(() => {
+        if(Session.get("idUser") == null)
+            navigate("/");
+    }, []);
 
     const [theme, setTheme] = useState("light");    
     if (localStorage.getItem('theme') && localStorage.getItem("theme") !== '' && localStorage.getItem("theme") !== theme) {

src/pages/Admin_modif.js

@@ -90,7 +90,6 @@ function Admin_modif() {
 
     return (
         <div className="page_admin">
-            <NavigationAdmin />
             <div className="Titre_Formulaire">
                 <p className="Titre">Admin</p>
                 <p className="Sous-titre">Modification d'utilisateur</p>

src/pages/Admin_supp.js

@@ -42,7 +42,6 @@ function Admin_supp(){
     return (
         <div className="page_admin">
             <link rel="stylesheet" href="https://unicons.iconscout.com/release/v4.0.0/css/line.css"></link>
-            <NavigationAdmin />
             <div className="Titre_Formulaire_Rech">
                 <p className="Titre">Admin</p>
                 <p className="Sous-titre">Supression d'utilisateur</p>

src/pages/Analyse.js

@@ -127,12 +127,21 @@ const Analyse = () => {
                 <div className="bas_de_page">
                     <NavigationDashboard />   
                     <div className="Analyse">
-                        <div className="Stat_1">
+                        <div className="Stat-1">
-                            Tendances des ventes
+                            <div className="Stat-1_titre">
-                            <Pie data={data}/>
+                                <p>Tendances des ventes</p>
+                            </div>
+                            <div className='camenbert'>
+                                <Pie data={data}/>
+                            </div>
                         </div>
-                        <div className="Stat_2">
+                        <div className="Stat-2">
-                            Statistique n°2
+                            <div className="Stat-2_titre">
+                                <p>coucou2</p>
+                            </div>
+                            <div className="histogramme">
+                                coucou21
+                            </div>
                         </div>
                     </div>                       
                 </div>

src/pages/Calendrier.js

@@ -1,24 +1,24 @@
 import React, { useState } from 'react';
 import "react-datepicker/dist/react-datepicker.css";
 import NavigationDashboard from '../components/NavigationDashboard';
+
 import format from "date-fns/format";
 import getDay from "date-fns/getDay";
 import parse from "date-fns/parse";
 import startOfWeek from "date-fns/startOfWeek";
 import { Calendar, dateFnsLocalizer } from "react-big-calendar";
 import "react-big-calendar/lib/css/react-big-calendar.css";
-import DatePicker from "react-datepicker";
-
 
 const locales = {
-    "en-US": require("date-fns/locale/en-US"),
+    'fr': require('date-fns/locale/fr')
   };
   const localizer = dateFnsLocalizer({
     format,
     parse,
     startOfWeek,
     getDay,
-    locales
+    locales,
+    
   });
   
   const events = [
@@ -34,10 +34,15 @@ const Calendrier = () => {
     if (localStorage.getItem('theme') && localStorage.getItem("theme") !== '' && localStorage.getItem("theme") !== theme) {
         setTheme(localStorage.getItem("theme"))
     }
-    const [newEvent, setNewEvent] = useState({title: "", start: "", end:""});
+    const [titre, setTitre] = useState("");
+    const [jour , setJour] = useState(new Date());
+    const [heureDebut, setHeureDebut] = useState(new Date());
+    const [heureFin, setHeureFin] = useState(new Date());
+
     const [allEvents, setAllEvents] = useState(events);
 
     function handleAddEvent() {
+        const newEvent = { title: titre, start: new Date(jour+" "+heureDebut), end: new Date(jour+" "+heureFin) };
         setAllEvents([...allEvents, newEvent]);
     }
 
@@ -62,18 +67,24 @@ const Calendrier = () => {
                         <h2 className="Titre">Ajouter un évènement
                             <div className="mini_formulaire_evenement">
                                 <input className="ajout_input" type="text" placeholder="Ajoutez un titre" style={{height: "20px", width: "100%", marginRight: "10px"}} 
-                                    value={newEvent.Titre} onChange={(e) => setNewEvent({...newEvent, title: e.target.value})}/>
+                                onChange={(e) => setTitre(e.target.value)} />
-                                <DatePicker className="ajout_input" placeholderText="Date de début" style={{height: "20px", width: "100%", marginRight: "10px"}}
+                                <input className='date' type="date" placeholder="Ajoutez un jour" style={{height: "20px", width: "100%", marginRight: "10px"}} 
-                                selected={newEvent.start} onChange={(start) => setNewEvent({...newEvent, start})} />
+                                onChange={(e) => setJour(e.target.value)} />
-                                <DatePicker className="ajout_input" placeholderText="Date de fin" style={{height: "20px", width: "100%"}}
+                                <input className='date' type="time" placeholder="Ajoutez une heure de début" style={{height: "20px", width: "100%", marginRight: "10px"}}
-                                selected={newEvent.end} onChange={(end) => setNewEvent({...newEvent, end})} />
+                                onChange={(e) => setHeureDebut(e.target.value)} />
+                                <input className='date' type="time" placeholder="Ajoutez une heure de fin" style={{height: "20px", width: "100%", marginRight: "10px"}}
+                                onChange={(e) => setHeureFin(e.target.value)} />
+
+
+
+                                
                             </div>
                             <button className="bouton_ajout" onClick={handleAddEvent}>
                                 <p>Ajouter l'évènement</p>
                             </button>
                         </h2>
-                        <Calendar localizer={localizer} events={allEvents} 
+                        <Calendar localizer={localizer} events={allEvents} defaultView="week"
-                        startAccessor="start" endAccessor="end" style={{height: "100%", width:"99%"}}/>
+                        startAccessor="start" endAccessor="end" style={{height: "100%", width:"99%"}} />
                     </div>
                 </div>
             </div>

src/pages/Compte.js

@@ -4,7 +4,7 @@ import React, { useEffect, useState } from 'react';
 import NavigationDashboard from '../components/NavigationDashboard';
 import img1 from '../img/logo_personEntouré.svg';
 import axios from 'axios'
-
+import Session from 'react-session-api';
 
 const api = axios.create({
     baseURL: 'http://localhost:8080'
@@ -28,21 +28,21 @@ function Compte() {
         console.log(modification)
     }
 
-    const [users, setUsers] = useState([]);
+    const [lastName, setLastName] = useState("");
-    const [selectedIdUser, setSelectedIdUser] = useState();
+    const [firstName, setFirstName] = useState("");
+    const [phone, setPhone] = useState("");
+    const [mail, setMail] = useState("");
 
     useEffect(() =>{
-        api.get('/User/Id/:id').then((response) => {
+        const apiString = '/User/Id/' + Session.get("idUser");
-            setUsers(response.data);
+        api.get(apiString).then((response) => {
-            setSelectedIdUser(response.data[0].iduser);
+            setLastName(response.data[0].lastname);
+            setFirstName(response.data[0].firstname);
+            setPhone(response.data[0].phone);
+            setMail(response.data[0].mail);
         });
     }, []);
 
-    const handleClick = (event, iduser) => {
-        setSelectedIdUser(iduser);
-    };
-
-
     return (
         <body className={theme}>
 
@@ -74,17 +74,11 @@ function Compte() {
                                 </div>
                             </div>
                             <div className="name">
-                            {users.map((user) => (
+                                <div className="presentationNom">
-                                    <div className="presentationNom"
+                                    <p id="texte" className="def">Nom Complet :</p>
-                                        key={user.iduser}
+                                    <p>{}</p>
-                                        hover
+                                    <input id="texte" value={firstName +" "+ lastName} name="texte" className="texte" type="text" disabled/>
-                                        onClick={(event) => handleClick(event, user.iduser)}
+                                </div>
-                                        selected={user.iduser === selectedIdUser}
-                                    >
-                                        <p id="texte" className="def">Nom Complet :</p>
-                                        <p id="texte" className="nom">{user.lastname}</p>
-                                    </div>
-                                ))}
                                 <div className='bouton_submit'>
                                     <button id="bouton" className="bouton_modifierNom" type="submit" onClick={modificationHandler}>{!modification ? "Modifier" : "Envoyer"}</button>
                                 </div>
@@ -94,7 +88,7 @@ function Compte() {
                             <p className="description">Informations personnel</p>
                             <div className="parti_mail">
                                 <p className="def">Mail :</p>
-                                <p className="mail">coucou@gmail.com</p>
+                                <input id="mail" value={mail} name="mail" className="mail" type="text" disabled/>
                             </div>
                             <div className="parti_pays">
                                 <p className="def">Pays ou Région :</p>
@@ -102,7 +96,7 @@ function Compte() {
                             </div>
                             <div className="parti_tel">
                                 <p className="def">Tel :</p>
-                                <p className="tel">0745632114</p>
+                                <input id="tel" value={phone} name="tel" className="tel" type="text" disabled/>
                             </div>
                         </div>
                         <div className="infoEntreprise">

src/pages/Connexion.js

@@ -6,6 +6,7 @@ import Dashboard from './Dashboard.js'
 import Admin_list from './Admin_list.js';
 import Chargement from './Chargement.js';
 import Session from 'react-session-api';
+import { useNavigate } from "react-router-dom";
 
 const api = axios.create({
     baseURL: 'http://localhost:8080'
@@ -17,6 +18,8 @@ function Connexion() {
         setTheme(localStorage.getItem("theme"))
     }
 
+    const navigate = useNavigate();
+
     const [auth, setAuth] = useState("");
     const [login, setLogin] = useState("");
     const [password, setPassword] = useState("");
@@ -71,7 +74,6 @@ function Connexion() {
         }, 3000)
     }, [])
 
-
     if (auth === "Succeed") {
         const apiString = '/User/role/' + login;
         api.get(apiString).then((response) => {
@@ -86,9 +88,9 @@ function Connexion() {
         });
         //console.log("RoleUser: " + roleUser);
         if (roleUser === 4)
-            return (<Admin_list />);
+            navigate("/Admin_list");
         else if (roleUser === 1)
-            return (<Dashboard />);
+            navigate("/Dashboard");
     }
     else {
         return loader ?(

src/pages/Parametres.js

@@ -1,5 +1,6 @@
 import React, { useState } from 'react';
 import NavigationDashboard from '../components/NavigationDashboard';
+import { NavLink } from 'react-router-dom';
 
 const Parametre = () => {
     const [theme, setTheme] = useState("light");    
@@ -42,7 +43,7 @@ const Parametre = () => {
                             <div className="one_bas">
                                 <p className="text_one_milieu">Mot de passe</p>
                                 <div className='bouton_submit'>
-                                    <button className="bouton_modifierMDP" type="submit">Modifier</button>
+                                    <NavLink className="bouton_modifierMDP" to="/RestartPassword">Modifier</NavLink>
                                 </div>
                             </div>
                         </div>

src/pages/RestartPassword.js

@@ -3,11 +3,12 @@ import React, { useState, useEffect } from 'react';
 import NavigationAdmin from '../components/NavigationAdmin.js';
 import Admin from './Admin_create.js';
 import { useLocation } from "react-router-dom";
-import Select, { SelectChangeEvent } from '@mui/material/Select';
+import Select, { SelectChangeEvent } from '@mui/material/Select'; 
 import MenuItem from '@mui/material/MenuItem';
 import { NavLink } from 'react-router-dom';
 import CryptoJS from 'crypto-js';
 import { useNavigate } from "react-router-dom";
+import Session from 'react-session-api';
 
 
 const api = axios.create({
@@ -16,8 +17,6 @@ const api = axios.create({
 
 function RestartPassword() {
     const location = useLocation();
-    const { iduser } = location.state;
-    console.log(iduser);
 
     const [password, setPassword] = useState("");
     const [confPassword, setConfPassword] = useState("");
@@ -46,7 +45,7 @@ function RestartPassword() {
 
         if(password === confPassword)
         {
-            const apiString = '/User/Auth/Password/' + iduser + "/" + CryptoJS.SHA256(confPassword).toString(CryptoJS.enc.Hex);
+            const apiString = '/User/Auth/Password/' + Session.get("idUser") + "/" + CryptoJS.SHA256(confPassword).toString(CryptoJS.enc.Hex);
             api.get(apiString).then((response) => {
                 const login = response.data;
                 if (login.length > 0){
@@ -54,12 +53,12 @@ function RestartPassword() {
 
                     values.newPassword = CryptoJS.SHA256(newPassword).toString(CryptoJS.enc.Hex);
 
-                    const apiStringUpdate = '/User/Update/Password/' + iduser;
+                    const apiStringUpdate = '/User/Update/Password/' + Session.get("idUser");
                     api.put(apiStringUpdate, values).then((response) => {
                         console.log(response.data);
                     });
 
-                    navigate("/Admin_list");
+                    navigate("/Parametres");
                 }
                 else{
                     console.log("trt");
@@ -70,8 +69,6 @@ function RestartPassword() {
 
     return (
         <div className="page_admin">
-            <NavigationAdmin />
-            {/* Create a admin page */}
             <div className="Titre_Formulaire">
                 <p className="Titre">Admin</p>
                 <p className="Sous-titre">Modification d'utilisateur</p>
@@ -93,7 +90,7 @@ function RestartPassword() {
                         </table>
                         <div className="bouton_submit">
                             <button className="bouton_val" type="submit">Valider</button>
-                            <NavLink className="bouton_ann" to="/Admin_list">Retour</NavLink>
+                            <NavLink className="bouton_ann" to="/Parametres">Retour</NavLink>
                         </div>
                     </form>
                 </div>

src/styles/components/_analyse.scss

@@ -119,36 +119,96 @@ body {
 
             .Analyse {
                 display: flex;
-                flex-direction: column;
+                flex-direction: row;
-                justify-content: space-evenly;
+                justify-content: space-between;
                 height: auto;
                 width: 94.3%;
                 margin: 5px 10px 10px 5px;
 
-                .Stat_1 {
+                .Stat-1 {
                     display: flex;
-                    width: auto;
+                    flex-direction: column;
-                    height: 50%;
+                    justify-content: space-between;
-                    margin: 50px 50px 8px 50px;
+                    width: 49.75%;
+                    height: auto;
 
                     background: rgba(255, 255, 255, 0.3);
                     border-radius: 15px;
                     box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
                     backdrop-filter: blur(3px);
                     -webkit-backdrop-filter: blur(15px);
+
+                    .Stat-1_titre {
+                        display: flex;
+                        width: auto;
+                        height: 25%;
+
+                    }
+
+                    .Stat-1_titre p {
+                        display: flex;
+                        flex-direction: column;
+                        justify-content: space-around;
+                        margin: auto;
+                        padding: 25px;
+                        font-size: 40px;
+
+                        background: rgba(255, 255, 255, 0.3);
+                        border-radius: 15px;
+                        box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
+                        backdrop-filter: blur(3px);
+                        -webkit-backdrop-filter: blur(15px);
+                    }
+
+                    .camenbert {
+                        display: flex;
+                        margin-left: auto;
+                        margin-right: auto;
+                        margin-bottom: 20px;
+                        width: auto;
+                        height: 74%;
+                    }
                 }
 
-                .Stat_2 {
+                .Stat-2 {
                     display: flex;
-                    width: auto;
+                    flex-direction: column;
-                    height: 50%;
+                    justify-content: space-between;
-                    margin: 8px 50px 50px 50px;
+                    width: 49.75%;
+                    height: auto;
 
                     background: rgba(255, 255, 255, 0.3);
                     border-radius: 15px;
                     box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
                     backdrop-filter: blur(3px);
                     -webkit-backdrop-filter: blur(15px);
+
+                    .Stat-2_titre {
+                        display: flex;
+                        width: auto;
+                        height: 25%;
+                    }
+
+                    .Stat-2_titre p {
+                        display: flex;
+                        flex-direction: column;
+                        justify-content: space-around;
+                        margin: auto;
+                        padding: 30px;
+                        font-size: 40px;
+
+                        background: rgba(255, 255, 255, 0.3);
+                        border-radius: 15px;
+                        box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
+                        backdrop-filter: blur(3px);
+                        -webkit-backdrop-filter: blur(15px);
+                    }
+
+                    .histogramme {
+                        display: flex;
+                        width: auto;
+                        height: 74%;
+                    }
                 }
             }
         }

src/styles/components/_dashboard.scss

@@ -185,7 +185,7 @@ body {
                             display: flex;
                             flex-direction: row;
                             justify-content: space-between;
-                            width: 53%;
+                            width: 53.5%;
                             height: auto;
 
                             .Ch_Clé_gauche {
@@ -210,7 +210,7 @@ body {
                                 .Ch_Clé_gauche_bas {
                                     display: flex;
                                     width: auto;
-                                    height: 42%;
+                                    height: 43%;
 
                                     background: rgba(255, 255, 255, 0.3);
                                     border-radius: 15px;
@@ -224,7 +224,7 @@ body {
                                 display: flex;
                                 flex-direction: column;
                                 justify-content: space-between;
-                                width: 51%;
+                                width: 52%;
                                 height: auto;
 
                                 .Ch_Clé_droite_haut {
@@ -242,7 +242,7 @@ body {
                                 .Ch_Clé_droite_bas {
                                     display: flex;
                                     width: auto;
-                                    height: 49%;
+                                    height: 50%;
 
                                     background: rgba(255, 255, 255, 0.3);
                                     border-radius: 15px;

src/styles/components/_parametre.scss

@@ -271,7 +271,7 @@ body {
                                 width: 18px;
                                 height: 18px;
                                 border-radius: 20px;
-                                top: 3.25pt;
+                                top: 2.75pt;
                                 left: 10%;
                                 background-color: white;
                                 transform: scale(1.1);
@@ -280,7 +280,7 @@ body {
                             }
 
                             input:checked[type="checkbox"]:before {
-                                top: 3.25pt;
+                                top: 2.75pt;
                                 left: 27px;
                             }
                         }