persistance calendrier en local

3 years ago · a7ac504158
parent 837acdc8ba
commit a7ac504158
2 changed files with 76 additions and 7 deletions
--- a/server-api/api.js
+++ b/server-api/api.js
@ -271,3 +271,29 @@ app.get('/Contact/AllWithCustomerName', (req, res) => {
        res.send(result);
    });
 });
+
+// Api obtenir l'emploi du temps du id
+
+app.get('/edt/:id', (req, res) => {
+    const id = req.params.id;
+    let sql = 'SELECT * FROM Events WHERE IdUserReceive = ?';
+    db.query(sql, [id], (err, result) => {
+        if (err) throw err;
+        console.log(result);
+        res.send(result);
+    });
+});
+
+app.put('/edt/Add/:id/:jour/:debut/:fin', (req, res) => {
+    
+    // let form = req.body;
+
+    // console.log(form);
+
+    // const sql = `INSERT INTO Events(firstname, idrole, login, password, phone, mail) VALUES ('${form.lastname}', '${form.firstname}', '${form.idrole}', '${form.login}', '${form.password}', '${form.phone}', '${form.mail}')`;
+    // db.query(sql , (err, result) => { 
+    //     if (err) throw err;
+    //     console.log(result);
+    //     res.send('Post added...' + result.insertId);
+    // });
+});
--- a/src/pages/Calendrier.js
+++ b/src/pages/Calendrier.js
@ -8,6 +8,8 @@ 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 Session from 'react-session-api'
+import axios from 'axios'

 const locales = {
    'fr': require('date-fns/locale/fr')
@ -18,18 +20,57 @@ const locales = {
    startOfWeek,
    getDay,
    locales,
+});

+const api = axios.create({
+    baseURL: 'http://localhost:8080'
+})
+
+const apiStringGetEvent = '/edt/' + Session.get("idUser");
+  
+const events = []
+
+const recupererEvents = () => {
+    // api.get(apiStringGetEvent).then((response) => {
+    //     response.forEach(element => {
+    //         events.push({
+    //             title: element.Comment,
+    //             start: new Date(element.jour+" "+element.StartTime),
+    //             end: new Date(element.jour+" "+element.EndTime)
+    //         })
+    //     });
+    // })
+    const event = []
+    if (localStorage.getItem("events") !== null &&localStorage.getItem("events") !== "" && localStorage.getItem("events") !== []) {
+        JSON.parse(localStorage.getItem("events")).forEach(element => {
+            event.push({
+                title: element.title,
+                start: new Date(element.start),
+                end: new Date(element.end)
+            })
        });
+        return event
+    }

-  const events = [
+    return [];
    
-  ];
+}

+const envoyerNouvelleEvent = (event) => {
+    // const apiStringPostEvent = '/edt/' + Session.get("idUser");
+    // api.post(apiStringPostEvent, {
+    //     Comment: event.title,
+    //     jour: event.start,
+    //     StartTime: event.start,
+    //     EndTime: event.end
+    // })
+}
    


 const Calendrier = () => {

+
    const [theme, setTheme] = useState("light");    
    if (localStorage.getItem('theme') && localStorage.getItem("theme") !== '' && localStorage.getItem("theme") !== theme) {
        setTheme(localStorage.getItem("theme"))
@ -39,13 +80,15 @@ const Calendrier = () => {
    const [heureDebut, setHeureDebut] = useState(new Date());
    const [heureFin, setHeureFin] = useState(new Date());

-    const [allEvents, setAllEvents] = useState(events);
+    const [allEvents, setAllEvents] = useState(recupererEvents);

    function handleAddEvent() {
        const newEvent = { title: titre, start: new Date(jour+" "+heureDebut), end: new Date(jour+" "+heureFin) };
        setAllEvents([...allEvents, newEvent]);
+        localStorage.setItem("events", JSON.stringify([...allEvents, newEvent]));
    }

+
    return (
        <body className={theme}>