You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
501 lines
20 KiB
501 lines
20 KiB
// Absende Formular Verwalten
|
|
const hours = document.getElementById('stunden');
|
|
const mins = document.getElementById('minuten');
|
|
const NewEntryButton = document.getElementById('newEntrySubmitButton')
|
|
const SETStudySaveButton = document.getElementById('SETStudySaveButton')
|
|
const SETMonthGoalSaveButton = document.getElementById('SETMonthGoalSaveButton')
|
|
var allowToSend = false;
|
|
const monate = ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"];
|
|
const currentDate = new Date();
|
|
|
|
|
|
//
|
|
// Trigger
|
|
//
|
|
|
|
// Wenn das Dokument komplett geladen ist
|
|
document.addEventListener('DOMContentLoaded', (event) => {
|
|
initDB().then(() => {
|
|
console.log('IndexedDB erfolgreich initialisiert.');
|
|
// Hier kannst du die App weiter initialisieren, z.B. Daten laden oder die UI aufbauen
|
|
|
|
// Bildschirm mit dem Inhalt für den aktuellen Tag füllen
|
|
getActualDataAndFillView();
|
|
|
|
//loadInitialData();
|
|
}).catch((error) => {
|
|
console.error('Fehler bei der Initialisierung der IndexedDB:', error);
|
|
});
|
|
});
|
|
|
|
|
|
|
|
// Änderungen überwachen damit die das Formular nicht zu früh abgesendet wird
|
|
hours.addEventListener('input', () => {
|
|
checkInput();
|
|
})
|
|
mins.addEventListener('input', () => {
|
|
checkInput();
|
|
})
|
|
document.getElementById('sonstigesInput').addEventListener('input', () => {
|
|
checkInput();
|
|
})
|
|
|
|
// Einstellungen wenn Neuer Eintrag erstellt wird
|
|
NewEntryButton.addEventListener('click', () => {
|
|
|
|
if (allowToSend === true) {
|
|
var type = 1
|
|
|
|
// Abfragen der Checkboxen
|
|
const ldcCheck = document.getElementById('ldcCheck').checked
|
|
if (ldcCheck) {
|
|
type = 2
|
|
document.getElementById('ldcCheck').checked = false
|
|
} else if (document.getElementById('sonstigesCheck').checked) {
|
|
type = 3;
|
|
document.getElementById('sonstigesCheck').checked = false;
|
|
sonstigesText.style.display = 'none';
|
|
}
|
|
|
|
// Berechnen der Duration
|
|
const duration = (parseInt(hours.value)*60) + parseInt(mins.value)
|
|
|
|
const newEntryData = {
|
|
date: document.getElementById('datum').value,
|
|
duration: duration,
|
|
type: type,
|
|
status: 1,
|
|
sondertext: document.getElementById('sonstigesInput').value,
|
|
}
|
|
|
|
addEntry(newEntryData, 'hours').then((id) => {
|
|
// console.log('Eintrag hinzugefügt mit ID:', id);
|
|
location.reload()
|
|
});
|
|
|
|
hours.value = null
|
|
mins.value = null
|
|
document.getElementById('sonstigesInput').value = null
|
|
checkInput()
|
|
}
|
|
})
|
|
|
|
// SETTINGS ACTIONS
|
|
|
|
SETStudySaveButton.addEventListener('click', () => {
|
|
|
|
var actualSettings = 0
|
|
|
|
getAllEntries('settings')
|
|
.then(function(result) {
|
|
const SETDBData = result.find(element => element.SettingsID === 1)
|
|
actualSettingsEntryID = SETDBData ? SETDBData.id : undefined;
|
|
actualSettings = SETDBData ? SETDBData.SettingsValue : undefined;
|
|
|
|
// AKTUELLE DATEN AUS FELD ÜBERNHEMEN
|
|
var ActInput = document.getElementById('studysinput').value
|
|
|
|
const StudySettingsData = {
|
|
SettingsID: 1,
|
|
SettingsValue: parseInt(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', StudySettingsData)
|
|
} else {
|
|
addEntry(StudySettingsData, 'settings')
|
|
}
|
|
})
|
|
|
|
SETStudySaveButton.classList.add('d-none')
|
|
})
|
|
|
|
SETMonthGoalSaveButton.addEventListener('click', () => {
|
|
getAllEntries('settings')
|
|
.then(function(result){
|
|
|
|
const SETDBData = result.find(element => element.SettingsID === 2)
|
|
actualSettingsEntryID = SETDBData ? SETDBData.id : undefined;
|
|
actualSettings = SETDBData ? SETDBData.SettingsValue : undefined;
|
|
|
|
// AKTUELLE DATEN AUS FELD ÜBERNHEMEN
|
|
var ActInput = document.getElementById('MonthGoalInput').value
|
|
|
|
const StudySettingsData = {
|
|
SettingsID: 2,
|
|
SettingsValue: parseInt(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', StudySettingsData)
|
|
} else {
|
|
addEntry(StudySettingsData, 'settings')
|
|
}
|
|
|
|
// UPDATE DER MONATSANSICHT
|
|
|
|
// Aktueller Monatsstand an Stunden
|
|
const GesamtStundenMonat = parseInt(document.getElementById('MonthSumHours').value)
|
|
document.getElementById('monthHours').innerText = GesamtStundenMonat + "/" + parseInt(ActInput)
|
|
document.getElementById('prBarMonth').style.width = `${(100/parseInt(ActInput))*parseInt(GesamtStundenMonat)}%`
|
|
|
|
// Aktueller Rest an Stunden
|
|
const rest = parseInt(ActInput) - parseInt(GesamtStundenMonat)
|
|
if (rest > 0) {
|
|
document.getElementById('monthRest').innerText = rest
|
|
} else {
|
|
document.getElementById('monthRest').innerText = 0
|
|
}
|
|
|
|
})
|
|
SETMonthGoalSaveButton.classList.add('d-none')
|
|
})
|
|
|
|
|
|
async function getActualDataAndFillView(monat = currentDate.getMonth(), jahr = currentDate.getFullYear()) {
|
|
try {
|
|
|
|
// Einfüfen des aktuellen Monats
|
|
document.getElementById('actualMonthName').innerHTML = monate[monat !== 12 ? monat : 0];
|
|
console.log("AKTUELLER MONAT SYSTEM: ", monat)
|
|
console.log("AKTUELLER MONAT REAL: ", currentDate.getMonth())
|
|
|
|
// Settings vor ausfüllen
|
|
|
|
// Monatswunsch-Stunden Abfragen
|
|
var MonthGoal = 50
|
|
|
|
// DATEN VON SETTINGS ABFRAGEN
|
|
getAllEntries('settings')
|
|
.then(function(result) {
|
|
document.getElementById('studysinput').value = (result.find(element => element.SettingsID === 1) == undefined) ? 0 : parseInt(result.find(element => element.SettingsID === 1).SettingsValue)
|
|
document.getElementById('MonthGoalInput').value = (result.find(element => element.SettingsID === 2) == undefined) ? 50 : parseInt(result.find(element => element.SettingsID === 2).SettingsValue)
|
|
MonthGoal = (result.find(element => element.SettingsID === 2) == undefined) ? 50 : parseInt(result.find(element => element.SettingsID === 2).SettingsValue)
|
|
});
|
|
|
|
// Filter funktion aufrufen und entsprechend mit dem aktuellen Datum füllen
|
|
const filteredEntries = await filterEntriesByMonthYear(monat === 12 ? 1 : monat + 1, jahr);
|
|
|
|
// Tabelle mit den aktuellen informationen füllen (funktion triggern und Daten übergeben)
|
|
fillTableWithEntries(filteredEntries)
|
|
|
|
// Ausgabe der Daten in den Log für DEV möglich
|
|
// console.log('Gefilterte Einträge für September 2024:', filteredEntries);
|
|
|
|
// MonatsCard füllen
|
|
|
|
// Aktueller Monatsstand an Stunden
|
|
const GesamtStundenMonat = formatDuration(sumDurations(filteredEntries,null,true), true)
|
|
document.getElementById('monthHours').innerText = GesamtStundenMonat + "/" + MonthGoal
|
|
document.getElementById('prBarMonth').style.width = `${(100/MonthGoal)*parseInt(GesamtStundenMonat)}%`
|
|
document.getElementById('MonthSumHours').value = GesamtStundenMonat
|
|
|
|
// Aktueller Rest an Stunden
|
|
const rest = MonthGoal - parseInt(GesamtStundenMonat)
|
|
if (rest > 0) {
|
|
document.getElementById('monthRest').innerText = rest
|
|
} else {
|
|
document.getElementById('monthRest').innerText = 0
|
|
}
|
|
|
|
// Aufteilunge Stunden nach Dienst und LDC
|
|
document.getElementById('monthHourService').innerText = formatDuration(sumDurations(filteredEntries,1,true), true)
|
|
document.getElementById('monthHourLDC').innerText = formatDuration(sumDurations(filteredEntries,2,true), true)
|
|
document.getElementById('monthHourOther').innerText = formatDuration(sumDurations(filteredEntries,3,true), true)
|
|
|
|
// Jahres Ansicht füllen
|
|
var requestYear = currentDate.getFullYear()
|
|
if (currentDate.getMonth() +1 >= 9) {
|
|
requestYear += 1;
|
|
}
|
|
var yearData = await filterEntriesByMonthYear(null, requestYear)
|
|
yearData = formatDuration(sumDurations(yearData, null, true), true)
|
|
document.getElementById('yearHours').innerText = yearData
|
|
document.getElementById('yearRest').innerText = 600 - parseInt(yearData)
|
|
document.getElementById('prBarYear').style.width = `${Math.round((100/600)*parseInt(yearData))}%`
|
|
|
|
} catch (error) {
|
|
console.error('Fehler bei der Initialisierung oder Filterung:', error);
|
|
}
|
|
}
|
|
|
|
|
|
|
|
//
|
|
// NEUES EINTRAG FORMULAR
|
|
//
|
|
|
|
// Checkboxen-Verhalten: Nur eine Checkbox kann ausgewählt werden
|
|
var ldcCheck = document.getElementById('ldcCheck');
|
|
var sonstigesCheck = document.getElementById('sonstigesCheck');
|
|
var sonstigesText = document.getElementById('sonstiges-text');
|
|
var sonstigesInput = document.getElementById('sonstigesInput');
|
|
|
|
ldcCheck.addEventListener('change', function() {
|
|
if (ldcCheck.checked) {
|
|
sonstigesCheck.checked = false;
|
|
sonstigesText.style.display = 'none';
|
|
sonstigesInput.removeAttribute('required'); // Entferne required, wenn "Sonstiges" abgewählt ist
|
|
}
|
|
});
|
|
|
|
sonstigesCheck.addEventListener('change', function() {
|
|
checkInput();
|
|
if (sonstigesCheck.checked) {
|
|
ldcCheck.checked = false;
|
|
sonstigesText.style.display = 'block';
|
|
sonstigesInput.setAttribute('required', 'required'); // Setze required, wenn "Sonstiges" ausgewählt ist
|
|
} else {
|
|
sonstigesText.style.display = 'none';
|
|
sonstigesInput.removeAttribute('required'); // Entferne required, wenn "Sonstiges" abgewählt ist
|
|
}
|
|
});
|
|
|
|
|
|
|
|
//
|
|
// BEARBEITUNGS FORMULAR
|
|
//
|
|
|
|
var edithours = document.getElementById('editStunden')
|
|
var editMins = document.getElementById('editMinuten')
|
|
var editldcCheck = document.getElementById('editldcCheck');
|
|
var editsonstigesCheck = document.getElementById('editsonstigesCheck');
|
|
var editsonstigesText = document.getElementById('edit-sonstiges-text');
|
|
var editsonstigesInput = document.getElementById('editsonstigesInput');
|
|
var EditSaveButton = document.getElementById('editEntrySubmitButton');
|
|
|
|
|
|
// Änderungen überwachen damit die das Formular nicht zu früh abgesendet wird
|
|
edithours.addEventListener('input', () => {
|
|
checkEditInput();
|
|
console.log(this.value)
|
|
})
|
|
editMins.addEventListener('input', () => {
|
|
checkEditInput();
|
|
console.log(this.value)
|
|
})
|
|
editsonstigesInput.addEventListener('input', () => {
|
|
checkEditInput();
|
|
console.log(this.value)
|
|
})
|
|
|
|
editldcCheck.addEventListener('change', function() {
|
|
if (editldcCheck.checked) {
|
|
editsonstigesCheck.checked = false;
|
|
editsonstigesText.style.display = 'none';
|
|
editsonstigesInput.removeAttribute('required'); // Entferne required, wenn "Sonstiges" abgewählt ist
|
|
}
|
|
});
|
|
|
|
editsonstigesCheck.addEventListener('change', function() {
|
|
checkEditInput();
|
|
if (editsonstigesCheck.checked) {
|
|
editldcCheck.checked = false;
|
|
editsonstigesText.style.display = 'block';
|
|
editsonstigesInput.setAttribute('required', 'required'); // Setze required, wenn "Sonstiges" ausgewählt ist
|
|
} else {
|
|
editsonstigesText.style.display = 'none';
|
|
editsonstigesInput.removeAttribute('required'); // Entferne required, wenn "Sonstiges" abgewählt ist
|
|
}
|
|
});
|
|
|
|
|
|
document.getElementById('editEntrySubmitButton').addEventListener('click', () => {
|
|
var ToEditID = document.getElementById('editEntryID').value
|
|
// console.log(`ID: ${ToEditID}, Hours: ${editHours.values}, Minutes: ${editMins.values}`)
|
|
|
|
var type = 1
|
|
|
|
// Abfragen der Checkboxen
|
|
const ldcCheck = document.getElementById('editldcCheck').checked
|
|
if (ldcCheck) {
|
|
type = 2
|
|
document.getElementById('editldcCheck').checked = false
|
|
} else if (document.getElementById('editsonstigesCheck').checked) {
|
|
type = 3;
|
|
document.getElementById('editsonstigesCheck').checked = false;
|
|
sonstigesText.style.display = 'none';
|
|
}
|
|
|
|
updateEntry(parseInt(ToEditID), 'hours', {
|
|
date: document.getElementById('editDatum').value,
|
|
duration: (parseInt(edithours.value)*60) + parseInt(editMins.value),
|
|
type: type,
|
|
status: 1,
|
|
sondertext: document.getElementById('editsonstigesInput').value,
|
|
}).then(() => {
|
|
// console.log('Eintrag aktualisiert.');
|
|
location.reload()
|
|
});
|
|
})
|
|
|
|
document.getElementById('DeleteEntryButton').addEventListener('click', () => {
|
|
const ToEditID = document.getElementById('editEntryID').value
|
|
|
|
deleteEntry(parseInt(ToEditID)).then(() => {
|
|
console.log(`Löschen von Eintrag: ${ToEditID}`);
|
|
location.reload()
|
|
})
|
|
|
|
})
|
|
|
|
|
|
//
|
|
// MONATSANSICHT Anpassen
|
|
//
|
|
|
|
const monthEntrys = document.querySelectorAll('.monthEntrys');
|
|
var diffMonth = 0
|
|
|
|
document.getElementById('dashbord_month_area').addEventListener('click', () =>{
|
|
if (!document.getElementById('dashbord_month_area').classList.contains('ActiveMonth')) {
|
|
document.getElementById('dashbord_month_area').classList.replace('closeMonthArea', 'openMonthArea')
|
|
document.getElementById('dashbord_month_area').classList.add(['openMonthArea'])
|
|
document.getElementById('dashbord_month_area').classList.add(['ActiveMonth'])
|
|
document.getElementById('ActivitysTable').classList.add(['shrinkActivitys'])
|
|
document.getElementById('ActivitysTable').classList.replace('growActivitys', 'shrinkActivitys')
|
|
document.getElementById('dashbord_month_area').classList.remove('mt-4')
|
|
// document.getElementById('dashbord_year_area').classList.add('fade-out')
|
|
// Für jedes ausgewählte Element die neue Klasse hinzufügen
|
|
setTimeout(function() {
|
|
monthEntrys.forEach(element => {
|
|
if (element.classList.contains('fade-out')) {
|
|
element.classList.replace('fade-out', 'fade-in');
|
|
} else {
|
|
element.classList.add('fade-in');
|
|
}
|
|
});
|
|
document.getElementById('MonthNameOfActual').innerHTML = "Aktuell:"
|
|
}, 300);
|
|
} else {
|
|
document.getElementById('dashbord_month_area').classList.remove('ActiveMonth')
|
|
document.getElementById('dashbord_month_area').classList.replace('openMonthArea', 'closeMonthArea')
|
|
document.getElementById('ActivitysTable').classList.replace('shrinkActivitys', 'growActivitys')
|
|
monthEntrys.forEach(element => {
|
|
element.classList.replace('fade-in', 'fade-out');
|
|
});
|
|
document.getElementById('MonthNameOfActual').innerHTML = "Monat:"
|
|
// document.getElementById('actualMonthName').innerHTML = monate[new Date().getMonth()];
|
|
diffMonth = 0;
|
|
getActualDataAndFillView(new Date().getMonth() + diffMonth)
|
|
}
|
|
})
|
|
|
|
document.getElementById('btn-month-before').addEventListener('click', () =>{
|
|
console.log("CLICK-BEFORE: ", diffMonth)
|
|
if (new Date().getMonth() + diffMonth == 0) {
|
|
diffMonth = 11 - new Date().getMonth();
|
|
getActualDataAndFillView(new Date().getMonth() + diffMonth)
|
|
console.log("CLICK-BEFRORE-0TO11: ", diffMonth)
|
|
} else {
|
|
diffMonth = ((monate[new Date().getMonth() + diffMonth]) != 'September') ? diffMonth - 1 : diffMonth;
|
|
// document.getElementById('actualMonthName').innerHTML = monate[new Date().getMonth() + diffMonth];
|
|
getActualDataAndFillView(new Date().getMonth() + diffMonth)
|
|
};
|
|
console.log("CLICK-BEFORE-AFTER: ", diffMonth)
|
|
});
|
|
|
|
document.getElementById('btn-month-next').addEventListener('click', () =>{
|
|
console.log("CLICK-NEXT: ", diffMonth)
|
|
if (new Date().getMonth() + diffMonth == 11) {
|
|
diffMonth = 0 - new Date().getMonth();
|
|
getActualDataAndFillView(new Date().getMonth() + diffMonth)
|
|
console.log("CLICK-NEXT-11TO0: ", diffMonth)
|
|
} else {
|
|
diffMonth = ((monate[new Date().getMonth() + diffMonth]) != 'August') ? diffMonth + 1 : diffMonth;
|
|
// document.getElementById('actualMonthName').innerHTML = monate[new Date().getMonth() + diffMonth];
|
|
getActualDataAndFillView(new Date().getMonth() + diffMonth)
|
|
};
|
|
console.log("CLICK-NEXT-AFTER: ", diffMonth)
|
|
})
|
|
|
|
function setNewCalsOfMonth(TheMonth) {
|
|
|
|
}
|
|
|
|
|
|
|
|
//
|
|
// FUNKTIONEN LIBARY
|
|
//
|
|
|
|
function checkInput() {
|
|
// Eingabe feld für Beschreibung leeren wenn sonstiges abgewählt wird
|
|
if (!sonstigesCheck.checked) {
|
|
sonstigesInput.value = null;
|
|
}
|
|
// Debug ausgabe er Werte
|
|
// console.log(`Check: ${sonstigesCheck.checked} - Input: ${sonstigesInput.value} - Stunden: ${hours.value} - Min: ${mins.value}`)
|
|
|
|
// Berechtigungen durch gehen damit Button verfügbar und Form abgesendet werden kann
|
|
if ((sonstigesCheck.checked && sonstigesInput.value !== "") || !(sonstigesCheck.checked)) {
|
|
// Debug Ausgabe für Bedingungsstufen
|
|
// console.log("Erste Bedingung: TRUE")
|
|
if (hours.value && mins.value) {
|
|
// Debug Ausgabe für Bedingungsstufen
|
|
// console.log("Zweite Bedingung: TRUE")
|
|
if (!allowToSend) {
|
|
// Debug Ausgabe für Bedingungsstufen
|
|
// console.log("Dritte Bedingung: TRUE")
|
|
allowToSend = true;
|
|
NewEntryButton.classList.remove('disabled');
|
|
NewEntryButton.classList.replace('btn-light', 'btn-primary');
|
|
}
|
|
} else if (allowToSend) {
|
|
allowToSend = false;
|
|
NewEntryButton.classList.add('disabled');
|
|
NewEntryButton.classList.replace('btn-primary', 'btn-light');
|
|
}
|
|
} else if (allowToSend) {
|
|
allowToSend = false;
|
|
NewEntryButton.classList.add('disabled');
|
|
NewEntryButton.classList.replace('btn-primary', 'btn-light');
|
|
}
|
|
}
|
|
|
|
var editallowToSend = true;
|
|
function checkEditInput() {
|
|
var edithours = document.getElementById('editStunden')
|
|
var editMins = document.getElementById('editMinuten')
|
|
var editsonstigesCheck = document.getElementById('editsonstigesCheck');
|
|
var editsonstigesText = document.getElementById('edit-sonstiges-text');
|
|
var editsonstigesInput = document.getElementById('editsonstigesInput');
|
|
var EditSaveButton = document.getElementById('editEntrySubmitButton');
|
|
|
|
// Eingabe feld für Beschreibung leeren wenn sonstiges abgewählt wird
|
|
if (!editsonstigesCheck.checked) {
|
|
editsonstigesInput.value = null;
|
|
}
|
|
|
|
// Berechtigungen durch gehen damit Button verfügbar und Form abgesendet werden kann
|
|
if ((editsonstigesCheck.checked && editsonstigesInput.value !== "") || !(editsonstigesCheck.checked)) {
|
|
// Debug Ausgabe für Bedingungsstufen
|
|
// console.log("Erste Bedingung: TRUE")
|
|
if (edithours.value && editMins.value) {
|
|
// Debug Ausgabe für Bedingungsstufen
|
|
// console.log("Zweite Bedingung: TRUE")
|
|
if (!editallowToSend) {
|
|
// Debug Ausgabe für Bedingungsstufen
|
|
// console.log("Dritte Bedingung: TRUE")
|
|
editallowToSend = true;
|
|
EditSaveButton.classList.remove('disabled');
|
|
EditSaveButton.classList.replace('btn-light', 'btn-primary');
|
|
}
|
|
} else if (editallowToSend) {
|
|
editallowToSend = false;
|
|
EditSaveButton.classList.add('disabled');
|
|
EditSaveButton.classList.replace('btn-primary', 'btn-light');
|
|
}
|
|
} else if (editallowToSend) {
|
|
editallowToSend = false;
|
|
EditSaveButton.classList.add('disabled');
|
|
EditSaveButton.classList.replace('btn-primary', 'btn-light');
|
|
}
|
|
// Debug ausgabe er Werte
|
|
console.log(`Status: ${editallowToSend} - Check: ${editsonstigesCheck.checked} - Input: ${editsonstigesInput.value} - Stunden: ${edithours.value} - Min: ${editMinuten.value}`)
|
|
}
|