Merge pull request 'LDC wird Schnellwahl-Feld' (#26) from 26-4-LDC_Feld_Editierbar into main

Reviewed-on: #26

app/static/app/js/dbcontrol.js

@@ -294,7 +294,7 @@ function filterEntriesByServiceYear(serviceYearLabel) {
 
 // Tabelle auf dem Dashboard mit Infos füllen
 // sortField: 'date' | 'duration' | 'type' - sortDirection: 'asc' | 'desc'
-function fillTableWithEntries(entries, sortField = 'date', sortDirection = 'asc') {
+function fillTableWithEntries(entries, sortField = 'date', sortDirection = 'asc', ldcLabel = 'LDC') {
   const tableBody = document.getElementById('entriesTableBody');
 
   const sortedEntries = entries.slice().sort((a, b) => {
@@ -357,7 +357,7 @@ function fillTableWithEntries(entries, sortField = 'date', sortDirection = 'asc'
       if (entry.type === 3) {
           typeCell.textContent = entry.sondertext;  // Bei Type 3 zeige "Beschreibung" an
       } else if (entry.type === 2) {
-          typeCell.textContent = 'LDC';  // Ansonsten zeige den Type-Wert
+          typeCell.textContent = ldcLabel;  // Ansonsten zeige den Type-Wert (individuell umbenennbar, siehe Einstellungen)
       } else if (entry.type === 1) {
           typeCell.textContent = 'Dienst';  // Ansonsten zeige den Type-Wert
       }

app/static/app/js/home01.js

@@ -4,6 +4,7 @@ const mins = document.getElementById('minuten');
 const NewEntryButton = document.getElementById('newEntrySubmitButton')
 const SETStudySaveButton = document.getElementById('SETStudySaveButton')
 const SETMonthGoalSaveButton = document.getElementById('SETMonthGoalSaveButton')
+const SETLdcNameSaveButton = document.getElementById('SETLdcNameSaveButton')
 const rule55hCheck = document.getElementById('rule55hCheck')
 const openViewOfEntry = document.getElementById('openViewOfEntry')
 const openViewOfEntryIcon = document.getElementById('openViewOfEntryIcon')
@@ -25,6 +26,9 @@ const currentDate = new Date();
 // live aktualisiert, damit getActualDataAndFillView() sie synchron verwenden kann.
 var rule55Active = false;
 
+// Individuell vergebbarer Name für "LDC" (SettingsID 4), überall im UI verwendet statt fest "LDC".
+var ldcLabel = 'LDC';
+
 // Sortierung der Aktivitäten-Tabelle: wird aus dem Cache (localStorage) geladen/gespeichert.
 var sortField = 'date';
 var sortDirection = 'asc';
@@ -49,6 +53,9 @@ document.addEventListener('DOMContentLoaded', (event) => {
         // 55h-Regel Einstellung laden, bevor die erste Jahresansicht berechnet wird
         await loadRule55Setting();
 
+        // LDC-Bezeichnung laden, bevor die Tabelle erstmalig gefüllt wird
+        await loadLdcLabel();
+
         // Gespeicherte Sortierung der Aktivitäten-Tabelle aus dem Cache laden
         loadSortPreference();
 
@@ -342,6 +349,56 @@ SETMonthGoalSaveButton.addEventListener('click', () => {
     SETMonthGoalSaveButton.classList.add('d-none')
 })
 
+// Lädt die individuelle LDC-Bezeichnung (SettingsID 4) aus der DB, setzt ldcLabel,
+// füllt das Einstellungen-Feld vor und wendet den Namen überall im UI an.
+async function loadLdcLabel() {
+    const result = await getAllEntries('settings')
+    const setting = result.find(element => element.SettingsID === 4)
+    ldcLabel = (setting == undefined || !setting.SettingsValue) ? 'LDC' : setting.SettingsValue
+    document.getElementById('ldcNameInput').value = ldcLabel
+    applyLdcLabel()
+}
+
+// Setzt die aktuelle LDC-Bezeichnung überall dort, wo sie im UI (außerhalb der Tabelle) auftaucht.
+// Die Tabelle selbst bekommt den Namen bei jedem Render über fillTableWithEntries(...).
+function applyLdcLabel() {
+    document.getElementById('ldcCheckLabel').innerText = ldcLabel
+    document.getElementById('editldcCheckLabel').innerText = ldcLabel
+    document.getElementById('monthHourLDCLabel').innerText = ldcLabel
+}
+
+SETLdcNameSaveButton.addEventListener('click', () => {
+    getAllEntries('settings')
+        .then(function(result) {
+            const SETDBData = result.find(element => element.SettingsID === 4)
+            actualSettingsEntryID = SETDBData ? SETDBData.id : undefined;
+            actualSettings = SETDBData ? SETDBData.SettingsValue : undefined;
+
+            // AKTUELLE DATEN AUS FELD ÜBERNHEMEN - bei leerem Feld auf "LDC" zurückfallen
+            var ActInput = document.getElementById('ldcNameInput').value.trim() || 'LDC'
+            document.getElementById('ldcNameInput').value = ActInput
+
+            const LdcNameSettingsData = {
+                SettingsID: 4,
+                SettingsValue: ActInput,
+            }
+
+            // ÜBERPRÜFEN OB EIN EINTRAG MTI DER SETTINGS ID VORHANDEN IST - WENN JA DANN UPDATE WENN NEIN DANN NEUEN ERSTELLEN
+            if ( actualSettings != undefined  ) {
+                updateEntry(actualSettingsEntryID, 'settings', LdcNameSettingsData)
+            } else {
+                addEntry(LdcNameSettingsData, 'settings')
+            }
+
+            ldcLabel = ActInput
+            applyLdcLabel()
+            // Tabelle neu füllen, damit die Typ-Spalte den neuen Namen sofort übernimmt
+            getActualDataAndFillView(cursorMonth, cursorYear)
+        })
+
+    SETLdcNameSaveButton.classList.add('d-none')
+})
+
 
 async function getActualDataAndFillView(monat = currentDate.getMonth(), jahr = currentDate.getFullYear()) {
     try {
@@ -371,7 +428,7 @@ async function getActualDataAndFillView(monat = currentDate.getMonth(), jahr = c
         console.log(jahr)
 
         // Tabelle mit den aktuellen informationen füllen (funktion triggern und Daten übergeben)
-        fillTableWithEntries(filteredEntries, sortField, sortDirection)
+        fillTableWithEntries(filteredEntries, sortField, sortDirection, ldcLabel)
 
         // Ausgabe der Daten in den Log für DEV möglich
         // console.log('Gefilterte Einträge für September 2024:', filteredEntries);

app/templates/app/base.html

@@ -48,6 +48,11 @@
                             55h-Regel (Jahr):
                             <input type="checkbox" name="rule55hCheck" id="rule55hCheck" style="position: static; width: 1.5rem; height: 1.5rem; margin: 0;">
                         </li>
+                        <li class="list-group-item d-flex justify-content-between align-items-center">
+                            Schnellwahl-Titel:
+                            <input type="text" class="w-25 btn btn-secondary" name="ldcNameInput" id="ldcNameInput" value="LDC" maxlength="20" onfocus="document.getElementById('SETLdcNameSaveButton').classList.remove('d-none')">
+                            <button class="btn d-none" id="SETLdcNameSaveButton">Sichern</button>
+                        </li>
                         <h5 class="mt-5 text-white text-center">Kontakt</h5>
                         <li class="list-group-item d-flex justify-content-between align-items-center">
                             WhatsApp Community

app/templates/app/home.html

@@ -64,10 +64,13 @@
                 <div class="progress-bar" role="progressbar" style="background-color:rgb(120,170,86); height: 5px; width: 1%;" aria-valuenow="10" aria-valuemin="0" aria-valuemax="50" id="prBarMonth"></div>
             </div>
 
-            <div class="row justify-content-around">
+            <!-- justify-content-around verteilt die Badges wie bisher auf die verfügbare Breite,
-                <button class="col-3 mt-3 badge badge-primary" style="height: 25px; border: none;">Dienst: <span id="monthHourService"></span>h</button>
+                 solange sie passen; erst wenn der individuell vergebene Schnellwahl-Titel (siehe
-                <button class="col-3 mt-3 badge badge-primary" style="height: 25px; border: none;">LDC: <span id="monthHourLDC"></span>h</button>
+                 Einstellungen) zu lang wird, greift overflow-x: auto statt eines Umbruchs. -->
-                <button class="col-3 mt-3 badge badge-primary" style="height: 25px; border: none;">Übrig: <span id="monthHourOther"></span>h</button>
+            <div class="d-flex justify-content-around mt-3" style="overflow-x: auto; gap: 0.5rem; padding-bottom: 2px;">
+                <button class="badge badge-primary" style="height: 25px; border: none; white-space: nowrap; flex: 0 0 auto;">Dienst: <span id="monthHourService"></span>h</button>
+                <button class="badge badge-primary" style="height: 25px; border: none; white-space: nowrap; flex: 0 0 auto;"><span id="monthHourLDCLabel">LDC</span>: <span id="monthHourLDC"></span>h</button>
+                <button class="badge badge-primary" style="height: 25px; border: none; white-space: nowrap; flex: 0 0 auto;">Übrig: <span id="monthHourOther"></span>h</button>
             </div>
 
             <div class="row justify-content-around align-middle monthEntrys mt-3" style="max-height: 2.5rem; width: 99%; margin-left: 1%;">
@@ -193,7 +196,7 @@
                         <div>
                             <div class="form-check form-check-inline">
                                 <input class="form-check-input" type="checkbox" id="ldcCheck" name="optionen" value="LDC">
-                                <label class="form-check-label" for="ldcCheck">LDC</label>
+                                <label class="form-check-label" for="ldcCheck" id="ldcCheckLabel">LDC</label>
                             </div>
                             <div class="form-check form-check-inline">
                                 <input class="form-check-input" type="checkbox" id="sonstigesCheck" name="optionen" value="Sonstiges">
@@ -260,7 +263,7 @@
                         <div>
                             <div class="form-check form-check-inline">
                                 <input class="form-check-input editItem" type="checkbox" id="editldcCheck" name="editldcCheck" value="LDC">
-                                <label class="form-check-label" for="editldcCheck">LDC</label>
+                                <label class="form-check-label" for="editldcCheck" id="editldcCheckLabel">LDC</label>
                             </div>
                             <div class="form-check form-check-inline">
                                 <input class="form-check-input editItem" type="checkbox" id="editsonstigesCheck" name="editsonstigesCheck" value="Sonstiges">