From 64c97e22b77007277f8ffb9027d7bfcb5c20596a Mon Sep 17 00:00:00 2001
From: Samuel Zielke <git@samuelzielke.de>
Date: Fri, 3 May 2024 19:32:22 +0200
Subject: [PATCH] Edit API and Form

---
 main/models.py                 |  12 +++
 main/templates/main/index.html | 180 +++++++++++++++++++++++++--------
 2 files changed, 149 insertions(+), 43 deletions(-)

diff --git a/main/models.py b/main/models.py
index 387ad8b..d1d8d76 100644
--- a/main/models.py
+++ b/main/models.py
@@ -46,26 +46,38 @@ class service(models.Model):
     date_1 = models.DateField(auto_now_add=False, null=True)
     time_1 = models.TimeField(auto_now_add=False, null=True)
     type_1 = models.IntegerField(auto_created=False, choices=TYPES, null=True)
+    sonder_1 = models.BooleanField(default=False)
+    sonder_1_name = models.CharField(max_length=50, null=True)
     speaker_1 = models.ForeignKey(contributors, on_delete=models.CASCADE, related_name="speaker_1", null=True)
     date_2 = models.DateField(auto_now_add=False, null=True)
     time_2 = models.TimeField(auto_now_add=False, null=True)
     type_2 = models.IntegerField(auto_created=False, choices=TYPES, null=True)
+    sonder_2 = models.BooleanField(default=False)
+    sonder_2_name = models.CharField(max_length=50, null=True)
     speaker_2 = models.ForeignKey(contributors, on_delete=models.CASCADE, related_name="speaker_2", null=True)
     date_3 = models.DateField(auto_now_add=False, null=True)
     time_3 = models.TimeField(auto_now_add=False, null=True)
     type_3 = models.IntegerField(auto_created=False, choices=TYPES, null=True)
+    sonder_3 = models.BooleanField(default=False)
+    sonder_3_name = models.CharField(max_length=50, null=True)
     speaker_3 = models.ForeignKey(contributors, on_delete=models.CASCADE, related_name="speaker_3", null=True)
     date_4 = models.DateField(auto_now_add=False, null=True)
     time_4 = models.TimeField(auto_now_add=False, null=True)
     type_4 = models.IntegerField(auto_created=False, choices=TYPES, null=True)
+    sonder_4 = models.BooleanField(default=False)
+    sonder_4_name = models.CharField(max_length=50, null=True)
     speaker_4 = models.ForeignKey(contributors, on_delete=models.CASCADE, related_name="speaker_4", null=True)
     date_5 = models.DateField(auto_now_add=False, null=True)
     time_5 = models.TimeField(auto_now_add=False, null=True)
     type_5 = models.IntegerField(auto_created=False, choices=TYPES, null=True)
+    sonder_5 = models.BooleanField(default=False)
+    sonder_5_name = models.CharField(max_length=50, null=True)
     speaker_5 = models.ForeignKey(contributors, on_delete=models.CASCADE, related_name="speaker_5", null=True)
     date_6 = models.DateField(auto_now_add=False, null=True)
     time_6 = models.TimeField(auto_now_add=False, null=True)
     type_6 = models.IntegerField(auto_created=False, choices=TYPES, null=True)
+    sonder_6 = models.BooleanField(default=False)
+    sonder_6_name = models.CharField(max_length=50, null=True)
     speaker_6 = models.ForeignKey(contributors, on_delete=models.CASCADE, related_name="speaker_6", null=True)
 
     def __str__(self):
diff --git a/main/templates/main/index.html b/main/templates/main/index.html
index 21120a5..86c390c 100644
--- a/main/templates/main/index.html
+++ b/main/templates/main/index.html
@@ -30,7 +30,8 @@
     #other     { margin: 0.250rem 3.000rem; }
     #technik   { margin: 0 3.000rem; }
     #header    { padding-bottom: 2rem; }
-    select     { width: 7rem;}
+    select     { width: 8rem;}
+    input      { width: 8rem;}
 </style>
 <script>
      function loading_new(){
@@ -103,6 +104,22 @@
     </div>
     
     <!-- PREDIGTDIENST -->
+
+    <script>
+        function update_enable(element, item){
+            if (item == 1){
+                let id_act = "smm_" + element + "_select"
+                let id_old = "smm_" + element + "_text"
+                document.getElementById(id_old).setAttribute("disabled", "")
+                document.getElementById(id_act).removeAttribute("disabled")
+            } else if (item == 2){
+                let id_act = "smm_" + element + "_select"
+                let id_old = "smm_" + element + "_text"
+                document.getElementById(id_act).setAttribute("disabled", "")
+                document.getElementById(id_old).removeAttribute("disabled")
+            }
+        }
+    </script>
     
     <div id="technik">
         <table style="margin-top: 2.000rem;">
@@ -117,20 +134,47 @@
     <div id="s">
         <table>
     
-            <!-- 1. DIENST -->
+            <!-- ÜBERSCHRIFTEN -->
+    
             <tr>
+                <td style="width: 2.750rem;"><div></div></td>
+                <td>
+                    <b style="font-size: 1.2rem;">Datum und Zeit</b>
+                </td>
+                <td>
+                    <b style="font-size: 1.2rem;">Ort</b>
+                </td>
+                <td>
+                   <b style="font-size: 1.2rem;">Leiter</b>
+                </td>
+            </tr>
+
+
+            <!-- 1. DIENST -->
+
+
+            <tr style="height: 5rem;">
                 <td style="width: 2.750rem;"><div class="infobox starttime s">1. Dienst</div></td>
                 <td>
                     <input type="date" name="smd" id="smd_1" min="{{ date_area.min }}" max="{{ date_area.max }}" value="{{ service_data.date_1|date:"Y-m-d"|default_if_none:"0" }}">
                     <input type="time" name="smt" id="smt_1" value="{{ service_data.time_1|time:"H:i"|default_if_none:"0" }}">
                 </td>
                 <td>
-                    <select name="smm" id="smm_1">
-                        <option value="0"{% if not service_data.type_1 %}selected{% endif %}></option>
-                        <option value="1"{% if service_data.type_1 == 1 %}selected{% endif %}>Zoom</option>
-                        <option value="2"{% if service_data.type_1 == 2 %}selected{% endif %}>Saal</option>
-                        <option value="3"{% if service_data.type_1 == 3 %}selected{% endif %}>Gruppe</option>
-                    </select>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_1" id="" onclick="update_enable(1, 1)" value="smm_1_select" {% if not service_data.sonder_1 %} checked {%endif%} />
+                        <label class="form-check-label" for="">Auswahl: </label>
+                        <select name="smm" id="smm_1_select" {% if service_data.sonder_1 %} disabled {% endif %}>
+                            <option value="0"{% if not service_data.type_1 %}selected{% endif %}></option>
+                            <option value="1"{% if service_data.type_1 == 1 %}selected{% endif %}>Zoom</option>
+                            <option value="2"{% if service_data.type_1 == 2 %}selected{% endif %}>Saal</option>
+                            <option value="3"{% if service_data.type_1 == 3 %}selected{% endif %}>Gruppe</option>
+                        </select>
+                    </div>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_1" id="" onclick="update_enable(1, 2)" value="smm_1_sonder" {%if service_data.sonder_1 %} checked {%endif%}/>
+                        <label class="form-check-label" for="smm_1_sonder"> Sonder: </label>
+                        <input type="text" style="height: 1.5rem; font-size: 0.8rem; margin-left: 0.55rem;" maxlength="20" placeholder="max. 20 Zeichen" name="smm" id="smm_1_text" value="{{ service_data.sonder_1_name|default_if_none:"" }}" {% if not service_data.sonder_1 %} disabled {%endif%}>
+                    </div>
                 </td>
                 <td>
                     <select name="sms" id="sms_1">
@@ -143,21 +187,31 @@
             </tr>
     
             <!-- 2. DIENST -->
-            <tr>
+            <tr style="height: 5rem;">
                 <td style="width: 2.750rem;"><div class="infobox starttime s">2. Dienst</div></td>
                 <td>
                     <input type="date" name="smd" id="smd_2" min="{{ date_area.min }}" max="{{ date_area.max }}" value="{{ service_data.date_2|date:"Y-m-d"|default_if_none:"0" }}">
                     <input type="time" name="smt" id="smt_2" value="{{ service_data.time_2|time:"H:i"|default_if_none:"0" }}">
                 </td>
                 <td>
-                    <select name="smm" id="smm_2">
-                        <option value="0"{% if not service_data.type_2 %}selected{% endif %}></option>
-                        <option value="1"{% if service_data.type_2 == 1 %}selected{% endif %}>Zoom</option>
-                        <option value="2"{% if service_data.type_2 == 2 %}selected{% endif %}>Saal</option>
-                        <option value="3"{% if service_data.type_2 == 3 %}selected{% endif %}>Gruppe</option>
-                    </select>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_2" id="" onclick="update_enable(2, 1)" value="smm_2_select" {% if not service_data.sonder_2 %} checked {%endif%} />
+                        <label class="form-check-label" for="">Auswahl: </label>
+                        <select name="smm" id="smm_2_select" {% if service_data.sonder_2 %} disabled {% endif %}>
+                            <option value="0"{% if not service_data.type_2 %}selected{% endif %}></option>
+                            <option value="1"{% if service_data.type_2 == 1 %}selected{% endif %}>Zoom</option>
+                            <option value="2"{% if service_data.type_2 == 2 %}selected{% endif %}>Saal</option>
+                            <option value="3"{% if service_data.type_2 == 3 %}selected{% endif %}>Gruppe</option>
+                        </select>
+                    </div>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_2" id="" onclick="update_enable(2, 2)" value="smm_2_sonder" {% if service_data.sonder_2 %} checked {%endif%}/>
+                        <label class="form-check-label" for="smm_2_sonder"> Sonder: </label>
+                        <input type="text" style="height: 1.5rem; font-size: 0.8rem; margin-left: 0.55rem;" maxlength="20" placeholder="max. 20 Zeichen" name="smm" id="smm_2_text" value="{{ service_data.sonder_2_name|default_if_none:"" }}" {% if not service_data.sonder_2 %} disabled {%endif%}>
+                    </div>
                 </td>
                 <td>
+                    <label for="sms_2"></label>
                     <select name="sms" id="sms_2">
                         <option value="0"{% if not service_data.speaker_2 %}selected{% endif %}></option>
                         {% for i in sm %}
@@ -168,21 +222,31 @@
             </tr>
     
             <!-- 3. DIENST -->
-            <tr>
+            <tr style="height: 5rem;">
                 <td style="width: 2.750rem;"><div class="infobox starttime s">3. Dienst</div></td>
                 <td>
                     <input type="date" name="smd" id="smd_3" min="{{ date_area.min }}" max="{{ date_area.max }}" value="{{ service_data.date_3|date:"Y-m-d"|default_if_none:"0" }}">
                     <input type="time" name="smt" id="smt_3" value="{{ service_data.time_3|time:"H:i"|default_if_none:"0" }}">
                 </td>
                 <td>
-                    <select name="smm" id="smm_3">
-                        <option value="0" {% if not service_data.type_3 %}selected{% endif %}></option>
-                        <option value="1"{% if service_data.type_3 == 1 %}selected{% endif %}>Zoom</option>
-                        <option value="2"{% if service_data.type_3 == 2 %}selected{% endif %}>Saal</option>
-                        <option value="3"{% if service_data.type_3 == 3 %}selected{% endif %}>Gruppe</option>
-                    </select>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_3" id="" onclick="update_enable(3, 1)" value="smm_3_select" {% if not service_data.sonder_3 %} checked {%endif%} />
+                        <label class="form-check-label" for="">Auswahl: </label>
+                        <select name="smm" id="smm_3_select" {% if service_data.sonder_3 %} disabled {% endif %}>
+                            <option value="0"{% if not service_data.type_3 %}selected{% endif %}></option>
+                            <option value="1"{% if service_data.type_3 == 1 %}selected{% endif %}>Zoom</option>
+                            <option value="2"{% if service_data.type_3 == 2 %}selected{% endif %}>Saal</option>
+                            <option value="3"{% if service_data.type_3 == 3 %}selected{% endif %}>Gruppe</option>
+                        </select>
+                    </div>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_1" id="" onclick="update_enable(3, 2)" value="smm_3_sonder" {% if service_data.sonder_3 %} checked {%endif%}/>
+                        <label class="form-check-label" for="smm_3_sonder"> Sonder: </label>
+                        <input type="text" style="height: 1.5rem; font-size: 0.8rem; margin-left: 0.55rem;" maxlength="20" placeholder="max. 20 Zeichen" name="smm" id="smm_3_text" value="{{ service_data.sonder_3_name|default_if_none:"" }}" {% if not service_data.sonder_3 %} disabled {%endif%}>
+                    </div>
                 </td>
                 <td>
+                    <label for="sms_3"></label>
                     <select name="sms" id="sms_3">
                         <option value="0"{% if not service_data.speaker_3 %}selected{% endif %}></option>
                         {% for i in sm %}
@@ -193,21 +257,31 @@
             </tr>
     
             <!-- 4. DIENST -->
-            <tr>
+            <tr style="height: 5rem;">
                 <td style="width: 2.750rem;"><div class="infobox starttime s">4. Dienst</div></td>
                 <td>
                     <input type="date" name="smd" id="smd_4" min="{{ date_area.min }}" max="{{ date_area.max }}" value="{{ service_data.date_4|date:"Y-m-d"|default_if_none:"0" }}">
                     <input type="time" name="smt" id="smt_4" value="{{ service_data.time_4|time:"H:i"|default_if_none:"0" }}">
                 </td>
                 <td>
-                    <select name="smm" id="smm_4">
-                        <option value="0"{% if not service_data.type_4 %}selected{% endif %}></option>
-                        <option value="1"{% if service_data.type_4 == 1 %}selected{% endif %}>Zoom</option>
-                        <option value="2"{% if service_data.type_4 == 2 %}selected{% endif %}>Saal</option>
-                        <option value="3"{% if service_data.type_4 == 3 %}selected{% endif %}>Gruppe</option>
-                    </select>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_4" id="" onclick="update_enable(4, 1)" value="smm_4_select" {% if not service_data.sonder_4 %} checked {%endif%} />
+                        <label class="form-check-label" for="">Auswahl: </label>
+                        <select name="smm" id="smm_4_select"  {% if service_data.sonder_4 %} disabled {% endif %}>
+                            <option value="0"{% if not service_data.type_4 %}selected{% endif %}></option>
+                            <option value="1"{% if service_data.type_4 == 1 %}selected{% endif %}>Zoom</option>
+                            <option value="2"{% if service_data.type_4 == 2 %}selected{% endif %}>Saal</option>
+                            <option value="3"{% if service_data.type_4 == 3 %}selected{% endif %}>Gruppe</option>
+                        </select>
+                    </div>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_4" id="" onclick="update_enable(4, 2)" value="smm_4_sonder" {% if service_data.sonder_4 %} checked {%endif%}/>
+                        <label class="form-check-label" for="smm_4_sonder"> Sonder: </label>
+                        <input type="text" style="height: 1.5rem; font-size: 0.8rem; margin-left: 0.55rem;" maxlength="20" placeholder="max. 20 Zeichen" name="smm" id="smm_4_text" value="{{ service_data.sonder_4_name|default_if_none:"" }}" {% if not service_data.sonder_4 %} disabled {%endif%}>
+                    </div>
                 </td>
                 <td>
+                    <label for="sms_4"></label>
                     <select name="sms" id="sms_4">
                         <option value="0"{% if not service_data.speaker_4 %}selected{% endif %}></option>
                         {% for i in sm %}
@@ -218,21 +292,31 @@
             </tr>
     
             <!-- 5. DIENST -->
-            <tr>
+            <tr style="height: 5rem;">
                 <td style="width: 2.750rem;"><div class="infobox starttime s">5. Dienst</div></td>
                 <td>
                     <input type="date" name="smd" id="smd_5" min="{{ date_area.min }}" max="{{ date_area.max }}" value="{{ service_data.date_5|date:"Y-m-d"|default_if_none:"0" }}">
                     <input type="time" name="smt" id="smt_5" value="{{ service_data.time_5|time:"H:i"|default_if_none:"0" }}">
                 </td>
                 <td>
-                    <select name="smm" id="smm_5">
-                        <option value="0"{% if not service_data.type_5 %}selected{% endif %}></option>
-                        <option value="1"{% if service_data.type_5 == 1 %}selected{% endif %}>Zoom</option>
-                        <option value="2"{% if service_data.type_5 == 2 %}selected{% endif %}>Saal</option>
-                        <option value="3"{% if service_data.type_5 == 3 %}selected{% endif %}>Gruppe</option>
-                    </select>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_5" id="" onclick="update_enable(5, 1)" value="smm_5_select" {% if not service_data.sonder_5 %} checked {%endif%} />
+                        <label class="form-check-label" for="">Auswahl: </label>
+                        <select name="smm" id="smm_5_select" {% if service_data.sonder_5 %} disabled {% endif %}>
+                            <option value="0"{% if not service_data.type_5 %}selected{% endif %}></option>
+                            <option value="1"{% if service_data.type_5 == 1 %}selected{% endif %}>Zoom</option>
+                            <option value="2"{% if service_data.type_5 == 2 %}selected{% endif %}>Saal</option>
+                            <option value="3"{% if service_data.type_5 == 3 %}selected{% endif %}>Gruppe</option>
+                        </select>
+                    </div>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_5" id="" onclick="update_enable(5, 2)" value="smm_5_sonder" {% if service_data.sonder_5 %} checked {%endif%}/>
+                        <label class="form-check-label" for="smm_5_sonder"> Sonder: </label>
+                        <input type="text" style="height: 1.5rem; font-size: 0.8rem; margin-left: 0.55rem;" maxlength="20" placeholder="max. 20 Zeichen" name="smm" id="smm_5_text" value="{{ service_data.sonder_5_name|default_if_none:"" }}" {% if not service_data.sonder_5 %} disabled {%endif%}>
+                    </div>
                 </td>
                 <td>
+                    <label for="sms_5"></label>
                     <select name="sms" id="sms_5">
                         <option value="0"{% if not service_data.speaker_5 %}selected{% endif %}></option>
                         {% for i in sm %}
@@ -243,21 +327,31 @@
             </tr>
     
             <!-- 6. DIENST -->
-            <tr>
+            <tr style="height: 5rem;">
                 <td style="width: 2.750rem;"><div class="infobox starttime s">6. Dienst</div></td>
                 <td>
                     <input type="date" name="smd" id="smd_6" min="{{ date_area.min }}" max="{{ date_area.max }}" value="{{ service_data.date_6|date:"Y-m-d"|default_if_none:"0" }}">
                     <input type="time" name="smt" id="smt_6" value="{{ service_data.time_6|time:"H:i"|default_if_none:"0" }}">
                 </td>
                 <td>
-                    <select name="smm" id="smm_6">
-                        <option value="0"{% if not service_data.type_6 %}selected{% endif %}></option>
-                        <option value="1"{% if service_data.type_6 == 1 %}selected{% endif %}>Zoom</option>
-                        <option value="2"{% if service_data.type_6 == 2 %}selected{% endif %}>Saal</option>
-                        <option value="3"{% if service_data.type_6 == 3 %}selected{% endif %}>Gruppe</option>
-                    </select>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_6" id="" onclick="update_enable(6, 1)" value="smm_6_select" {% if not service_data.sonder_6 %} checked {%endif%} />
+                        <label class="form-check-label" for="">Auswahl: </label>
+                        <select name="smm" id="smm_6_select" {% if service_data.sonder_6 %} disabled {% endif %}>
+                            <option value="0"{% if not service_data.type_6 %}selected{% endif %}></option>
+                            <option value="1"{% if service_data.type_6 == 1 %}selected{% endif %}>Zoom</option>
+                            <option value="2"{% if service_data.type_6 == 2 %}selected{% endif %}>Saal</option>
+                            <option value="3"{% if service_data.type_6 == 3 %}selected{% endif %}>Gruppe</option>
+                        </select>
+                    </div>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="smm_6" id="" onclick="update_enable(6, 2)" value="smm_6_sonder" {% if service_data.sonder_6 %} checked {%endif%}/>
+                        <label class="form-check-label" for="smm_6_sonder"> Sonder: </label>
+                        <input type="text" style="height: 1.5rem; font-size: 0.8rem; margin-left: 0.55rem;" maxlength="20" placeholder="max. 20 Zeichen" name="smm" id="smm_6_text" value="{{ service_data.sonder_6_name|default_if_none:"" }}" {% if not service_data.sonder_5 %} disabled {%endif%}/>
+                    </div>
                 </td>
                 <td>
+                    <label for="sms_6"></label>
                     <select name="sms" id="sms_6">
                         <option value="0"{% if not service_data.speaker_6 %}selected{% endif %}></option>
                         {% for i in sm %}