]> gitweb.hhaalo.de Git - feierabend.git/commitdiff
add viewer table
authorBastian Dehn <hhaalo@arcor.de>
Sun, 23 Jun 2024 14:15:26 +0000 (16:15 +0200)
committerBastian Dehn <hhaalo@arcor.de>
Sun, 23 Jun 2024 14:15:26 +0000 (16:15 +0200)
src/xmlviewer/viewer.html

index f9ba487fd95b6999fdc2e723acfe5e142cb3847e..020d972a5970370c68c744d19e6b9b88241db0bb 100644 (file)
@@ -4,6 +4,21 @@
                <title>Zeitkonto</title>
                <meta charset="UTF-8"> 
                <meta name="viewport" content="width=device-width, initial-scale=1.0">
+               <style>
+                       #anfangssaldo {
+                               font-weight: bold;
+                               padding: 1rem 0;
+                       }
+                       table {
+                               border-collapse: collapse;
+                       }
+                       td, th {
+                               border: 1px solid gray;
+                               border-radius: 1rem;
+                               padding: 1rem;
+                               text-align: left;
+                       }
+               </style>
        </head>
        <body>
                <main>
                                        filereader.onload = data => {
                                                const parser = new DOMParser();
                                                const xmldoc = parser.parseFromString(data.target.result, "text/xml");
-                                               console.debug(xmldoc.children[0].getAttribute("anfangssaldo"));
-                                               const divElement = document.createElement("div");
-                                               divElement.innerText = xmldoc.children[0].getAttribute("anfangssaldo");
+
+                                               const rootNode = xmldoc.children[0]
+                                               let divElement = document.createElement("div");
+                                               divElement.id = "anfangssaldo"
+                                               divElement.innerText = `Anfangssaldo: ${rootNode.getAttribute("anfangssaldo")}`
                                                element.append(divElement);
+
+                                               const count = rootNode.childElementCount;
+                                               const tableElement = document.createElement("table");
+                                               let trElement;
+                                               let tdElement;
+
+                                               trElement = document.createElement("tr");
+
+                                               tdElement = document.createElement("th");
+                                               tdElement.setAttribute("colspan", 2);
+                                               tdElement.innerText = "Datum";
+                                               trElement.append(tdElement);
+
+                                               tdElement = document.createElement("th");
+                                               tdElement.innerText = "Anfang"
+                                               trElement.append(tdElement);
+
+                                               tdElement = document.createElement("th");
+                                               tdElement.innerText = "Ende";
+                                               trElement.append(tdElement);
+
+                                               tdElement = document.createElement("th");
+                                               tdElement.innerText = "Pause";
+                                               trElement.append(tdElement);
+
+                                               tdElement = document.createElement("th");
+                                               tdElement.innerText = "Soll";
+                                               trElement.append(tdElement);
+
+                                               tdElement = document.createElement("th");
+                                               tdElement.innerText = "Ist";
+                                               trElement.append(tdElement);
+
+                                               tdElement = document.createElement("th");
+                                               tdElement.innerText = "Stunden";
+                                               trElement.append(tdElement);
+
+                                               tdElement = document.createElement("th");
+                                               tdElement.innerText = "Saldo";
+                                               trElement.append(tdElement);
+
+                                               tableElement.append(trElement)
+
+
+
+                                               for (let i = 0; i < count; i++) {
+                                                       trElement = document.createElement("tr");
+
+                                                       tdElement = document.createElement("td");
+                                                       tdElement.innerText = rootNode.children[i].getAttribute("wochentag");
+                                                       trElement.append(tdElement);
+
+                                                       tdElement = document.createElement("td");
+                                                       tdElement.innerText = rootNode.children[i].getAttribute("datum");
+                                                       trElement.append(tdElement);
+
+                                                       tdElement = document.createElement("td");
+                                                       tdElement.innerText = rootNode.children[i].getAttribute("begin");
+                                                       trElement.append(tdElement);
+
+                                                       tdElement = document.createElement("td");
+                                                       tdElement.innerText = rootNode.children[i].getAttribute("ende");
+                                                       trElement.append(tdElement);
+
+                                                       tdElement = document.createElement("td");
+                                                       tdElement.innerText = rootNode.children[i].getAttribute("pause");
+                                                       trElement.append(tdElement);
+
+                                                       tdElement = document.createElement("td");
+                                                       tdElement.innerText = rootNode.children[i].getAttribute("sollarbeitszeit");
+                                                       trElement.append(tdElement);
+
+                                                       tdElement = document.createElement("td");
+                                                       tdElement.innerText = rootNode.children[i].getAttribute("arbeitszeit");
+                                                       trElement.append(tdElement);
+
+                                                       tdElement = document.createElement("td");
+                                                       tdElement.innerText = rootNode.children[i].getAttribute("stunden");
+                                                       trElement.append(tdElement);
+
+                                                       tdElement = document.createElement("td");
+                                                       tdElement.innerText = rootNode.children[i].getAttribute("saldo");
+                                                       trElement.append(tdElement);
+
+                                                       tableElement.append(trElement)
+                                               }
+
+                                               element.append(tableElement);
                                        };
                                        filereader.readAsText(fileinput.files[0]);
                                }