Added functionality for adding and removing services

app.py

@@ -97,11 +97,24 @@ def AddService():
         tijd = datetime.datetime.strptime(f"{datum}|{tijd}" , "%d-%m-%Y|%H:%M")
         if(tijd != None):
             services.AddService(tijd, str(groepen))
-
     except:
         return "500"
     return "200"
 
+@app.route("/DelService", methods=["POST"])
+@login_required
+def DelService():
+    datum = (request.json)["datum"]
+    tijd = (request.json)["tijd"]
+    try:
+        tijd = datetime.datetime.strptime(f"{datum}|{tijd}" , "%Y-%m-%d|%H:%M:%S")
+        if(tijd != None):
+            services.RemoveService(tijd)
+    except:
+        return "Invalid date/time"
+    return "200"
+
+
 def RunWeb():
     app.run(debug=True)
     

services.py

@@ -44,7 +44,7 @@ class Services:
         query = f"""CREATE TABLE IF NOT EXISTS services 
         (
             id INTEGER PRIMARY KEY AUTOINCREMENT,
-            date STRING,
+            date STRING UNIQUE,
             groups STRING
         );
         """
@@ -55,6 +55,18 @@ class Services:
             INSERT INTO services (date, groups)
             VALUES('{date}', '{groups}');
         """
+        try:
+            self.cursor.execute(query)
+            self.db.commit()
+            return "Success"
+        except:
+            return "Service already exists?"
+
+    def RemoveService(self, service):
+        query = f"""
+            DELETE FROM services 
+            WHERE date == '{service}'
+        """
         self.cursor.execute(query)
         self.db.commit()
 
@@ -71,7 +83,7 @@ class UserManager():
         query = f"""CREATE TABLE IF NOT EXISTS users 
         (
             id INTEGER PRIMARY KEY AUTOINCREMENT,
-            name STRING,
+            name STRING UNIQUE,
             password STRING,
             salt STRING
         );
@@ -114,7 +126,7 @@ if __name__ == "__main__":
     ser = Services(db)
     us = UserManager(db)
 
-    # us.AddUser("Eljakim", "Kunnenwe?")
+    us.AddUser("Eljakim", "Kunnenwe?")
     us.Authenticate("Eljakim", "Kunnenwe?")
     us.Authenticate("Eljakim", "Kunnenwe2?")
     # for i in range(100):

static/script.js

@@ -17,7 +17,6 @@ function GetServices(){
 }
 
 function GetAllServices(){
-    console.log("aa")
     $.ajax({
         type: "POST",
         url: "/GetServices",
@@ -56,6 +55,23 @@ function AddService(){
       });
 }
 
-$(document).ready( function () {
+function DeleteService(date){
-    GetAllServices();
+    d = $(date).parent()[0].getAttribute("data");
-})
+    $.ajax({
+        type: "POST",
+        url: "/DelService",
+        data: JSON.stringify({
+            "datum": d.split(" ")[0],
+            "tijd": d.split(" ")[1],
+        }),
+        contentType: "application/json",
+        dataType: 'text json',
+        success: function(response) {
+            document.getElementById('resultblock').innerHTML = response
+        },
+        error: function(error){
+            console.log(error);
+        }
+      });
+}
+

static/style.css

@@ -1,6 +1,6 @@
 .headerblock{
   width: 100%;
-  height: 5%;
+  /* height: 5%; */
   /* background-color: #FFFFFF; */
 }
 
@@ -133,35 +133,53 @@
 }
 
 .a_datum_input{
-  padding: 1%;
+  background-color:white;
   position: relative;
-  margin:1%;
+  padding: 2%;
-}
+  margin: 1%;
-.a_datum_block{
+  width: 39.5%;
-  width: 100%;
+  left: 10%;
+  font-size: 20px;
+  text-align: center;
+  font-size: 26px;
 }
 
 .a_van_input{
-  padding: 1%;
+  background-color:white;
-  margin:1%;
-}
-
-.a_tot_input{
-  padding: 1%;
-  margin:1%;
-}
-
-.add_service_btn{
   position: relative;
-  background-color: lightblue;
   padding: 2%;
   margin: 1%;
-  width: 20%;
+  width: 39.5%;
-  left: 20%;
+  left: 10%;
+  font-size: 20px;
   text-align: center;
   font-size: 26px;
 }
 
+/* .a_tot_input{
+  background-color:white;
+  position: relative;
+  padding: 2%;
+  margin: 1%;
+  width: 39.5%;
+  left: 14%;
+  font-size: 20px;
+  text-align: center;
+  font-size: 26px;
+} */
+
+.add_service_btn{
+position: relative;
+  background-color: rgb(35, 34, 126);
+  padding: 2%;
+  margin: 1%;
+  width: 40%;
+  left: 30%;
+  text-align: center;
+  font-size: 26px;
+  color: white;
+}
+
 .add_service_btn:hover{
   background-color: blue;
   cursor: pointer;

templates/admin.html

@@ -1,16 +1,41 @@
+<script src="{{url_for('static', filename='jquery-3.6.0.min.js') }}"></script>
+<script>
+    function GetAllServices(){
+        $.ajax({
+            type: "POST",
+            url: "/GetServices",
+            data: JSON.stringify({
+                "nummer": "-1",
+            }),
+            contentType: "application/json",
+            dataType: 'text json',
+            success: function(response) {
+                document.getElementById('resultblock').innerHTML = response
+            },
+            error: function(error){
+                console.log(error);
+            }
+        });
+    }
+    GetAllServices();
+</script>
+
 {% extends 'base.html' %}
 <head>  
+    
   <div class="headerblock">
 
   </div>
-  <h1>Administratie</h1>
+  <title>Administratie</title>
-  
 </head>
             
-            
 {% block content %}
 <div class="requestblock">
-    <h2>Voeg dienst toe:</h2>
+    <div class="MainText">
+        <h1 style="text-align: center;">Voeg dienst toe</h1>
+        <h3 style="text-align: center;">Vul de datum en groepen in om toe te voegen</h3>
+    
+
         <div class="a_datum_block">
             <input class="a_datum_input" id="datum_input" name="text" placeholder="1-11-2021">
             <tr>Tijd</tr>
@@ -19,10 +44,11 @@
         <div class="a_datum_block">
             <input class="a_van_input" id="van_input" name="text" placeholder="1">
             <tr>t/m</tr>
-        <input class="a_tot_input" id="tot_input" name="text" placeholder="10">
+            <input class="a_van_input" id="tot_input" name="text" placeholder="10">
         </div>
         
         <div class="add_service_btn" onclick="AddService()">Toevoegen</div>
+    </div>
 </div>  
 
 <div class="resultblock" id="resultblock">

templates/base.html

@@ -6,6 +6,7 @@
 <script src="{{url_for('static', filename='script.js') }}"></script>
 
 
+
 <body class="bodyclass">
     <header class="headerblock">
         <a href="https://www.rondzes.nl/">

templates/index.html

@@ -3,7 +3,6 @@
   <div class="headerblock">
 
   </div>
-  <h1>Mag ik naar de kapel?</h1>
 </head>
 
             

templates/results.html

@@ -3,16 +3,16 @@
     {% if(loop.index % 2 == 0) %}
     <div class="resultitem" style="background-color: lightcyan">
         {% if current_user.is_authenticated %}
-        <div class=deletebutton>
+        <div class=deletebutton onclick="DeleteService(this)">
             Verwijderen   
         </div>
         {% endif %}
         Dienst op {{value[0].date().strftime("%A")}} on {{value[0].time().hour}}:{{value[0].time().minute}} uur. 
     </div>
     {% else %}
-    <div class="resultitem" style="background-color: lightblue">
+    <div class="resultitem" style="background-color: lightblue" data="{{value[0]}}">
         {% if current_user.is_authenticated %}
-        <div class=deletebutton>
+        <div class=deletebutton onclick="DeleteService(this)">
             Verwijderen   
         </div>
         {% endif %}