Merge branch 'main' of https://github.com/DHBWLoerrach/TIF22A_AnwProjekt_B

2023-05-22 22:58:44 +02:00
parent 09188005f6 d8cc85713c
commit 4741ba6911
14 changed files with 795006 additions and 1028376 deletions
@@ -1,27 +0,0 @@
-export default function DozentSelector(){
-    return(
-        <>
-            <div className="round-border dozentSelector">
-                <table>
-                    <tbody>
-                        <tr>
-                            <th></th>
-                            <th>Dozent</th>
-                            <th>Modul</th>
-                        </tr>
-                        <tr>
-                            <td><input type="checkbox"/></td>
-                            <td>Behrends</td>
-                            <td>Anwendungsprojekt</td>
-                        </tr>
-                        <tr>
-                            <td><input type="checkbox"/></td>
-                            <td>Bima</td>
-                            <td>Web-E</td>
-                        </tr>
-                    </tbody>
-                </table>
-            </div>
-        </>
-    )
-}
@@ -8,4 +8,8 @@ export const arrowRight = `<svg xmlns="http://www.w3.org/2000/svg" fill="white"

 export const deleteItem = `<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-trash-fill" viewBox="0 0 16 16">
  <path d="M2.5 1a1 1 0 0 0-1 1v1a1 1 0 0 0 1 1H3v9a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V4h.5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H10a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1H2.5zm3 4a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 .5-.5zM8 5a.5.5 0 0 1 .5.5v7a.5.5 0 0 1-1 0v-7A.5.5 0 0 1 8 5zm3 .5v7a.5.5 0 0 1-1 0v-7a.5.5 0 0 1 1 0z"/>
+</svg>`
+
+export const editItem = `<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="bi bi-pencil-fill" viewBox="0 0 16 16">
+  <path d="M12.854.146a.5.5 0 0 0-.707 0L10.5 1.793 14.207 5.5l1.647-1.646a.5.5 0 0 0 0-.708l-3-3zm.646 6.061L9.793 2.5 3.293 9H3.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.207l6.5-6.5zm-7.468 7.468A.5.5 0 0 1 6 13.5V13h-.5a.5.5 0 0 1-.5-.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.5-.5V10h-.5a.499.499 0 0 1-.175-.032l-.179.178a.5.5 0 0 0-.11.168l-2 5a.5.5 0 0 0 .65.65l5-2a.5.5 0 0 0 .168-.11l.178-.178z"/>
 </svg>`
@@ -1,31 +1,75 @@
-import DozentSelector from "@/components/DozentSelector";
 import Button from "@/components/Button";
 import {useRouter} from "next/router";
-import {useState} from "react";
+import {useEffect, useState} from "react";

-export default function InputForm() {
+let userInfo = []
+
+export default function InputForm(p) {
+
+    class UserInfo {
+        constructor(userid, modules) {
+            this.userid = userid;
+            this.module = modules;
+            this.checked = false;
+        }
+
+        setChecked(checked)
+        {
+            this.checked = checked;
+        }
+
+        setModule(module)
+        {
+            this.module = module;
+        }
+    }
+
+    let startDateParam = "";
+    let endDateParam = "";
+    let courseNameParam = "";
+
+    if (p.startDate != null) startDateParam = p.startDate;
+    if (p.endDate != null) endDateParam = p.endDate;
+    if (p.courseName != null) courseNameParam = p.courseName;

    const router = useRouter();

-    const [startDate, setStartDate] = useState("");
-    const [endDate, setEndDate] = useState("");
-    const [courseName, setCourseName] = useState("");
+    const [startDate, setStartDate] = useState(startDateParam);
+    const [endDate, setEndDate] = useState(endDateParam);
+    const [courseName, setCourseName] = useState(courseNameParam);
+    const [users, setUsers] = useState([]);

-    async function onCreateClicked()
-    {
+    async function getAllUsers() {
+        let sessionid = localStorage.getItem("sessionid");
+        let url = "http://localhost:8080/users/all?sessionid=" + sessionid;
+
+
+        await fetch(url).then(response => response.json()).then(user => setUsers(user));
+    }
+
+    useEffect(() => {
+
+        userInfo = [];
+        getAllUsers();
+    }, [])
+
+    async function onCreateClicked() {
        let startSplit = startDate.split("-");
        let endSplit = endDate.split("-");
        let startYear = parseInt(startSplit[0]);
        let endYear = parseInt(endSplit[0]);

-        let startInternalDate = new Date(startYear, parseInt(startSplit[1]) - 1, parseInt(startSplit[2]) - 1)
-        let endInternalDate = new Date(endYear, parseInt(endSplit[1]) - 1, parseInt(endSplit[2]) - 1)
+        //month - 1 because jan = 0, day like month... but because of next lines 3 to 4 not - 1
+        let startInternalDate = new Date(startYear, parseInt(startSplit[1]) - 1, parseInt(startSplit[2]))
+        let endInternalDate = new Date(endYear, parseInt(endSplit[1]) - 1, parseInt(endSplit[2]))

-        let startDayInYear = Math.floor( (startInternalDate - new Date(startYear, 0, 0)) / (1000 * 60 * 60 * 24));
-        let endDayInYear = Math.floor((endInternalDate - new Date(endYear, 0, 0)) / (1000 * 60 * 60 * 24));
+        let startDayInYear = Math.round((startInternalDate - new Date(startYear, 0, 0)) / (1000 * 60 * 60 * 24));
+        let endDayInYear = Math.round((endInternalDate - new Date(endYear, 0, 0)) / (1000 * 60 * 60 * 24));
+
+        let id = p.courseName == null ? 0 : localStorage.getItem("currentsid");

        let json = {
-            "id": 0,
+            "id": id,
            "startday": startDayInYear,
            "endday": endDayInYear,
            "name": courseName,
@@ -34,20 +78,61 @@ export default function InputForm() {
        }

        let url = "http://localhost:8080/semester?sessionid=" + localStorage.getItem("sessionid");
+        let method = p.courseName == null ? "POST" : "PUT";
+

        await fetch(url, {
-            method: "POST",
+            method: method,
            headers: {"Content-Type": "application/json"},
            body: JSON.stringify(json)
        }).then(response => response.json()).then(semester => console.log(semester));

+
        router.back();
    }

+    function onModuleClicked(user, module) {
+
+        let found = false;
+
+        for (let i = 0; i < userInfo.length; i++) {
+            let current = userInfo[i];
+            if (current !== undefined && current.userid === user.id) {
+                userInfo[i].setModule(module);
+                found = true;
+            }
+        }
+
+        if(!found) {
+            userInfo.push(new UserInfo(user.id, module));
+        }
+    }
+
+    function onCheckBoxClicked(user, e)
+    {
+        onModuleClicked(user, "");
+
+        let found = false;
+
+        for (let i = 0; i < userInfo.length; i++) {
+            let current = userInfo[i];
+            if (current !== undefined && current.userid === user.id) {
+                userInfo[i].setChecked(e.target.checked);
+                found = true;
+            }
+        }
+
+        if(!found) {
+            let temp = new UserInfo(user.id, "");
+            temp.setChecked(e.target.checked);
+            userInfo.push(temp);
+        }
+    }
+
    return (
        <>
            <div className="inputForm round-border">
-                <h3>Kursname</h3>
+                <h3>SemesterName</h3>
                <input className="courseNameInput" value={courseName} onChange={(e) => setCourseName(e.target.value)}/>
                <div className="semesterRangeInput">
                    <div className="semesterDateLables">
@@ -55,15 +140,51 @@ export default function InputForm() {
                        <p className="semesterDateLable">Semesterende</p>
                    </div>
                    <div className="semesterDateInputPair">
-                        <input type="date" id="start" name="trip-start" value={startDate} onChange={(e) => setStartDate(e.target.value)}/>
+                        <input type="date" id="start" name="trip-start" value={startDate}
+                               onChange={(e) => setStartDate(e.target.value)}/>
                        <p className="inputFieldSeperator">-</p>
-                        <input type="date" id="start" name="trip-start" value={endDate} onChange={(e) => setEndDate(e.target.value)}/>
+                        <input type="date" id="start" name="trip-start" value={endDate}
+                               onChange={(e) => setEndDate(e.target.value)}/>
                    </div>
                </div>
-                <DozentSelector/>
+                <div className="round-border dozentSelector">
+                    <table>
+                        <tbody>
+                        <tr>
+                            <th></th>
+                            <th>Dozent</th>
+                            <th>Modul</th>
+                        </tr>
+                        {users.map(user => (
+                            <tr>
+                                <td><input type="checkbox" onChange={(e) => {
+                                    onCheckBoxClicked(user, e);
+                                }}/></td>
+                                <td>{user.firstName + " " + user.lastName}</td>
+                                <select id={"userSelect"} name={"userSelect"} multiple={false} style={{
+                                    maxHeight: 80,
+                                    border: "1px solid black"
+                                }} onChange={(e) => {
+                                    onModuleClicked(user, e.target.value)
+                                }}>
+                                    <option value={"Programmieren"}>Programmieren</option>
+                                    <option value={"BWL"}>BWL</option>
+                                    <option value={"Lineare Algebra"}>Lineare Algebra</option>
+                                    <option value={"Analysis"}>Analysis</option>
+                                    <option value={"AnwendungsProjekt"}>AnwendungsProjekt</option>
+                                </select>
+                            </tr>
+                        ))}
+                        </tbody>
+                    </table>
+                </div>
                <div id="buttons">
-                    <Button color="red" width="100px" height="30px" text="Abbrechen" onClick={() => {router.back()}}/>
-                    <Button color="green" width="100px" height="30px" text="Erstellen" onClick={() => {onCreateClicked()}}/>
+                    <Button color="red" width="100px" height="30px" text="Abbrechen" onClick={() => {
+                        router.back()
+                    }}/>
+                    <Button color="green" width="100px" height="30px" text="Speichern" onClick={() => {
+                        onCreateClicked()
+                    }}/>
                </div>
            </div>
        </>
@@ -1,7 +1,7 @@
 import StatusBar from "@/components/StatusBar";
 import React, {useEffect} from "react";
 import Button from "@/components/Button";
-import {deleteItem} from "@/components/Icons";
+import {deleteItem, editItem} from "@/components/Icons";

 export default function SemesterTile(p)
 {
@@ -14,7 +14,16 @@ export default function SemesterTile(p)
        <div onClick={(e) => p.onClick(e)} className={"semester-tile"}>
            <p>{p.text}</p>
            <StatusBar progress={0}/>
-            <Button icon={deleteItem} width={30} height={30} onClick={p.onButtonDeleteClick}/>
+            <div style={{
+                display: "flex",
+                flexDirection: "row",
+                justifyContent: "center",
+                alignItems: "center",
+                gap: 5
+            }}>
+                <Button icon={deleteItem} width={30} height={30} onClick={p.onButtonDeleteClick}/>
+                <Button icon={editItem} width={30} height={30} onClick={p.onButtonEditClick}/>
+            </div>
        </div>
    )
 }