288 lines
12 KiB
JavaScript
288 lines
12 KiB
JavaScript
document.addEventListener("DOMContentLoaded", () => {
|
|
const studentsList = document.getElementById("students-list");
|
|
const criteriaContent = document.getElementById("criteria-content");
|
|
const saveButton = document.getElementById("save-button");
|
|
const studentsTab = document.getElementById("students-tab");
|
|
const criteriaTab = document.getElementById("criteria-tab");
|
|
const addCriteriaForm = document.getElementById("add-criteria-form");
|
|
const editCriteriaForm = document.getElementById("edit-criteria-form");
|
|
const deleteCriteriaForm = document.getElementById("delete-criteria-form");
|
|
const criteriaListDiv = document.getElementById("criteria-list");
|
|
const editCriteriaNameSelect = document.getElementById("edit-criteria-name");
|
|
const deleteCriteriaNameSelect = document.getElementById("delete-criteria-name");
|
|
let uczniowie = [];
|
|
let kryteria = [];
|
|
let dane = {};
|
|
let progiOcen = [];
|
|
|
|
// Ładowanie danych z serwera
|
|
Promise.all([
|
|
fetch("http://localhost:4000/uczniowie").then(response => response.json()),
|
|
fetch("http://localhost:4000/kryteria").then(response => response.json()),
|
|
fetch("http://localhost:4000/dane").then(response => response.json()),
|
|
fetch("http://localhost:4000/oceny").then(response => response.json())
|
|
])
|
|
.then(([uczniowieData, kryteriaData, daneData, ocenyData]) => {
|
|
uczniowie = uczniowieData.uczniowie;
|
|
kryteria = kryteriaData;
|
|
dane = daneData;
|
|
progiOcen = ocenyData.progi;
|
|
console.log("Uczniowie:", uczniowie);
|
|
console.log("Kryteria:", kryteria);
|
|
console.log("Dane:", dane);
|
|
console.log("Progi ocen:", progiOcen);
|
|
renderStudents();
|
|
renderCriteria();
|
|
})
|
|
.catch(error => console.error("Błąd ładowania danych:", error));
|
|
|
|
// Renderuj uczniów
|
|
function renderStudents() {
|
|
studentsList.innerHTML = "";
|
|
uczniowie.forEach(student => {
|
|
const studentKey = `${student.imie}-${student.nazwisko}`;
|
|
const details = document.createElement("details");
|
|
const summary = document.createElement("summary");
|
|
summary.textContent = `${student.imie} ${student.nazwisko} (${student.klasa})`;
|
|
details.appendChild(summary);
|
|
|
|
const criteriaList = document.createElement("div");
|
|
criteriaList.className = "criteria-list";
|
|
|
|
let totalPoints = 0;
|
|
|
|
kryteria.forEach(criteria => {
|
|
const criteriaItem = document.createElement("div");
|
|
criteriaItem.className = "criteria-item";
|
|
const label = document.createElement("span");
|
|
label.textContent = criteria.nazwa;
|
|
const pointsInfo = document.createElement("span");
|
|
pointsInfo.className = "points-info";
|
|
pointsInfo.textContent = `(${criteria.punkty} pkt)`;
|
|
const input = document.createElement("input");
|
|
input.type = "number";
|
|
input.min = "0";
|
|
const savedStudent = dane[studentKey];
|
|
input.value = savedStudent?.[criteria.nazwa] || 0;
|
|
|
|
// Zapisz zmiany lokalnie w pamięci
|
|
input.addEventListener("input", () => {
|
|
if (!dane[studentKey]) {
|
|
dane[studentKey] = {};
|
|
}
|
|
dane[studentKey][criteria.nazwa] = parseInt(input.value) || 0;
|
|
});
|
|
|
|
criteriaItem.appendChild(label);
|
|
criteriaItem.appendChild(pointsInfo);
|
|
criteriaItem.appendChild(input);
|
|
|
|
// Dodaj podkategorie, jeśli istnieją
|
|
if (criteria.podkategorie && criteria.podkategorie.length > 0) {
|
|
const subCriteriaList = document.createElement("div");
|
|
subCriteriaList.className = "sub-criteria-list";
|
|
|
|
criteria.podkategorie.forEach(subCriteria => {
|
|
const subCriteriaItem = document.createElement("div");
|
|
subCriteriaItem.className = "sub-criteria-item";
|
|
const subLabel = document.createElement("span");
|
|
subLabel.textContent = subCriteria.nazwa;
|
|
const subPointsInfo = document.createElement("span");
|
|
subPointsInfo.className = "points-info";
|
|
subPointsInfo.textContent = `(${subCriteria.punkty} pkt)`;
|
|
const subInput = document.createElement("input");
|
|
subInput.type = "number";
|
|
subInput.min = "0";
|
|
subInput.value = savedStudent?.[subCriteria.nazwa] || 0;
|
|
|
|
// Zapisz zmiany lokalnie w pamięci
|
|
subInput.addEventListener("input", () => {
|
|
if (!dane[studentKey]) {
|
|
dane[studentKey] = {};
|
|
}
|
|
dane[studentKey][subCriteria.nazwa] = parseInt(subInput.value) || 0;
|
|
});
|
|
|
|
subCriteriaItem.appendChild(subLabel);
|
|
subCriteriaItem.appendChild(subPointsInfo);
|
|
subCriteriaItem.appendChild(subInput);
|
|
subCriteriaList.appendChild(subCriteriaItem);
|
|
});
|
|
|
|
criteriaItem.appendChild(subCriteriaList);
|
|
}
|
|
|
|
criteriaList.appendChild(criteriaItem);
|
|
|
|
// Oblicz sumę punktów
|
|
const count = savedStudent?.[criteria.nazwa] || 0;
|
|
totalPoints += count * criteria.punkty;
|
|
|
|
// Jeśli są podkategorie, dodaj ich punkty
|
|
if (criteria.podkategorie) {
|
|
criteria.podkategorie.forEach(subCriteria => {
|
|
const subCount = savedStudent?.[subCriteria.nazwa] || 0;
|
|
totalPoints += subCount * subCriteria.punkty;
|
|
});
|
|
}
|
|
});
|
|
|
|
// Wybierz ocenę na podstawie punktów
|
|
const ocena = progiOcen.find(prog => totalPoints >= prog.min)?.ocena || 1;
|
|
|
|
// Dodaj sekcję z punktami i oceną w prawym górnym rogu
|
|
const statsSection = document.createElement("div");
|
|
statsSection.className = "stats-section";
|
|
statsSection.innerHTML = `
|
|
<div class="stats-box">
|
|
<span class="total-points">Punkty: ${totalPoints}</span>
|
|
<span class="grade">Ocena: ${ocena}</span>
|
|
</div>
|
|
`;
|
|
details.appendChild(statsSection);
|
|
|
|
details.appendChild(criteriaList);
|
|
studentsList.appendChild(details);
|
|
});
|
|
}
|
|
|
|
// Renderuj listę kryteriów
|
|
function renderCriteria() {
|
|
criteriaListDiv.innerHTML = "";
|
|
editCriteriaNameSelect.innerHTML = "";
|
|
deleteCriteriaNameSelect.innerHTML = "";
|
|
if (!Array.isArray(kryteria) || kryteria.length === 0) {
|
|
console.warn("Brak kryteriów do wyświetlenia.");
|
|
const noCriteriaMessage = document.createElement("p");
|
|
noCriteriaMessage.textContent = "Brak dostępnych kryteriów.";
|
|
criteriaListDiv.appendChild(noCriteriaMessage);
|
|
return;
|
|
}
|
|
kryteria.forEach(criteria => {
|
|
// Wyświetl kryterium na liście
|
|
const criteriaDiv = document.createElement("div");
|
|
criteriaDiv.textContent = `${criteria.nazwa}: ${criteria.punkty} pkt`;
|
|
criteriaListDiv.appendChild(criteriaDiv);
|
|
// Dodaj opcję do edycji
|
|
const editOption = document.createElement("option");
|
|
editOption.value = criteria.nazwa;
|
|
editOption.textContent = criteria.nazwa;
|
|
editCriteriaNameSelect.appendChild(editOption);
|
|
// Dodaj opcję do usunięcia
|
|
const deleteOption = document.createElement("option");
|
|
deleteOption.value = criteria.nazwa;
|
|
deleteOption.textContent = criteria.nazwa;
|
|
deleteCriteriaNameSelect.appendChild(deleteOption);
|
|
});
|
|
}
|
|
|
|
// Przełączanie między zakładkami
|
|
studentsTab.addEventListener("click", () => {
|
|
studentsList.style.display = "block";
|
|
criteriaContent.style.display = "none";
|
|
});
|
|
|
|
criteriaTab.addEventListener("click", () => {
|
|
studentsList.style.display = "none";
|
|
criteriaContent.style.display = "block";
|
|
renderCriteria();
|
|
});
|
|
|
|
// Dodawanie nowego kryterium
|
|
addCriteriaForm.addEventListener("submit", event => {
|
|
event.preventDefault();
|
|
const nazwa = document.getElementById("new-criteria-name").value.trim();
|
|
const punkty = parseInt(document.getElementById("new-criteria-points").value);
|
|
if (!nazwa || isNaN(punkty)) {
|
|
alert("Wprowadź poprawne dane.");
|
|
return;
|
|
}
|
|
fetch("http://localhost:4000/kryteria", {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({ nazwa, punkty })
|
|
})
|
|
.then(response => {
|
|
if (!response.ok) throw new Error("Błąd dodawania kryterium.");
|
|
return response.text();
|
|
})
|
|
.then(() => {
|
|
alert("Kryterium dodane pomyślnie.");
|
|
return fetch("http://localhost:4000/kryteria").then(response => response.json());
|
|
})
|
|
.then(kryteriaData => {
|
|
kryteria = kryteriaData;
|
|
renderCriteria();
|
|
})
|
|
.catch(error => console.error(error));
|
|
});
|
|
|
|
// Edycja istniejącego kryterium
|
|
editCriteriaForm.addEventListener("submit", event => {
|
|
event.preventDefault();
|
|
const nazwa = editCriteriaNameSelect.value;
|
|
const nowaNazwa = document.getElementById("edit-criteria-new-name").value.trim();
|
|
const punkty = parseInt(document.getElementById("edit-criteria-points").value);
|
|
if (!nowaNazwa || isNaN(punkty)) {
|
|
alert("Wprowadź poprawne dane.");
|
|
return;
|
|
}
|
|
fetch(`http://localhost:4000/kryteria/${encodeURIComponent(nazwa)}`, {
|
|
method: "PUT",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({ nowaNazwa, punkty })
|
|
})
|
|
.then(response => {
|
|
if (!response.ok) throw new Error("Błąd edycji kryterium.");
|
|
return response.text();
|
|
})
|
|
.then(() => {
|
|
alert("Kryterium zaktualizowane pomyślnie.");
|
|
return fetch("http://localhost:4000/kryteria").then(response => response.json());
|
|
})
|
|
.then(kryteriaData => {
|
|
kryteria = kryteriaData;
|
|
renderCriteria();
|
|
})
|
|
.catch(error => console.error(error));
|
|
});
|
|
|
|
// Usuwanie kryterium
|
|
deleteCriteriaForm.addEventListener("submit", event => {
|
|
event.preventDefault();
|
|
const nazwa = deleteCriteriaNameSelect.value;
|
|
fetch(`http://localhost:4000/kryteria/${encodeURIComponent(nazwa)}`, {
|
|
method: "DELETE"
|
|
})
|
|
.then(response => {
|
|
if (!response.ok) throw new Error("Błąd usuwania kryterium.");
|
|
return response.text();
|
|
})
|
|
.then(() => {
|
|
alert("Kryterium usunięte pomyślnie.");
|
|
return fetch("http://localhost:4000/kryteria").then(response => response.json());
|
|
})
|
|
.then(kryteriaData => {
|
|
kryteria = kryteriaData;
|
|
renderCriteria();
|
|
})
|
|
.catch(error => console.error(error));
|
|
});
|
|
|
|
// Zapisz dane na zewnętrznym serwerze
|
|
saveButton.addEventListener("click", () => {
|
|
fetch("http://localhost:4000/dane", {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify(dane)
|
|
})
|
|
.then(response => {
|
|
if (response.ok) {
|
|
alert("Dane zostały zapisane!");
|
|
} else {
|
|
alert("Wystąpił błąd podczas zapisywania danych.");
|
|
}
|
|
})
|
|
.catch(error => console.error("Błąd zapisywania danych:", error));
|
|
});
|
|
}); |