new-zoz/script.js

268 lines
11 KiB
JavaScript
Raw Normal View History

2025-02-12 13:05:01 +00:00
document.addEventListener("DOMContentLoaded", () => {
const studentsList = document.getElementById("students-list");
2025-02-14 10:23:48 +00:00
const statsContent = document.getElementById("stats-content");
const criteriaContent = document.getElementById("criteria-content");
2025-02-12 13:05:01 +00:00
const saveButton = document.getElementById("save-button");
2025-02-14 10:23:48 +00:00
const studentsTab = document.getElementById("students-tab");
2025-02-12 13:27:22 +00:00
const statsTab = document.getElementById("stats-tab");
2025-02-14 10:23:48 +00:00
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 = {};
2025-02-12 13:05:01 +00:00
// Ł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())
])
2025-02-14 10:23:48 +00:00
.then(([uczniowieData, kryteriaData, daneData]) => {
uczniowie = uczniowieData.uczniowie;
kryteria = kryteriaData;
dane = daneData;
2025-02-12 13:05:01 +00:00
2025-02-14 10:23:48 +00:00
console.log("Uczniowie:", uczniowie);
console.log("Kryteria:", kryteria);
console.log("Dane:", dane);
2025-02-12 13:05:01 +00:00
2025-02-14 10:23:48 +00:00
renderStudents();
renderStats();
renderCriteria();
})
.catch(error => console.error("Błąd ładowania danych:", error));
2025-02-12 13:05:01 +00:00
// Renderuj uczniów
2025-02-14 10:23:48 +00:00
function renderStudents() {
2025-02-12 13:05:01 +00:00
studentsList.innerHTML = "";
2025-02-14 10:23:48 +00:00
uczniowie.forEach(student => {
const studentKey = `${student.imie}-${student.nazwisko}`;
2025-02-12 13:05:01 +00:00
const details = document.createElement("details");
const summary = document.createElement("summary");
2025-02-14 10:23:48 +00:00
summary.textContent = `${student.imie} ${student.nazwisko} (${student.klasa})`;
2025-02-12 13:05:01 +00:00
details.appendChild(summary);
const criteriaList = document.createElement("div");
criteriaList.className = "criteria-list";
kryteria.forEach(criteria => {
const criteriaItem = document.createElement("div");
criteriaItem.className = "criteria-item";
const label = document.createElement("span");
2025-02-12 13:27:22 +00:00
label.textContent = criteria.nazwa;
const pointsInfo = document.createElement("span");
pointsInfo.className = "points-info";
pointsInfo.textContent = `(${criteria.punkty} pkt)`;
2025-02-12 13:05:01 +00:00
const input = document.createElement("input");
input.type = "number";
input.min = "0";
2025-02-14 10:23:48 +00:00
const savedStudent = dane[studentKey];
input.value = savedStudent?.[criteria.nazwa] || 0;
2025-02-12 13:05:01 +00:00
input.addEventListener("input", () => {
if (!savedStudent) {
2025-02-14 10:23:48 +00:00
dane[studentKey] = {};
2025-02-12 13:05:01 +00:00
}
2025-02-14 10:23:48 +00:00
dane[studentKey][criteria.nazwa] = parseInt(input.value) || 0;
renderStats();
2025-02-12 13:05:01 +00:00
});
criteriaItem.appendChild(label);
2025-02-12 13:27:22 +00:00
criteriaItem.appendChild(pointsInfo);
2025-02-12 13:05:01 +00:00
criteriaItem.appendChild(input);
criteriaList.appendChild(criteriaItem);
});
details.appendChild(criteriaList);
studentsList.appendChild(details);
});
}
2025-02-12 13:27:22 +00:00
// Renderuj statystyki
function renderStats() {
statsContent.innerHTML = "";
2025-02-14 10:23:48 +00:00
uczniowie.forEach(student => {
const studentKey = `${student.imie}-${student.nazwisko}`;
const savedStudent = dane[studentKey];
2025-02-12 13:27:22 +00:00
let totalPoints = 0;
if (savedStudent) {
kryteria.forEach(criteria => {
2025-02-14 10:23:48 +00:00
const count = savedStudent[criteria.nazwa] || 0;
2025-02-12 13:27:22 +00:00
totalPoints += count * criteria.punkty;
});
}
const studentDiv = document.createElement("div");
studentDiv.className = "stat-item";
const name = document.createElement("strong");
2025-02-14 10:23:48 +00:00
name.textContent = `${student.imie} ${student.nazwisko} (${student.klasa})`;
2025-02-12 13:27:22 +00:00
const points = document.createElement("span");
points.className = "points";
points.textContent = `${totalPoints} pkt`;
if (totalPoints > 0) {
points.classList.add("positive");
} else if (totalPoints < 0) {
points.classList.add("negative");
}
studentDiv.appendChild(name);
studentDiv.appendChild(points);
statsContent.appendChild(studentDiv);
});
}
2025-02-14 10:23:48 +00:00
// 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);
});
}
2025-02-12 13:27:22 +00:00
// Przełączanie między zakładkami
2025-02-14 10:23:48 +00:00
studentsTab.addEventListener("click", () => {
studentsList.style.display = "block";
statsContent.style.display = "none";
criteriaContent.style.display = "none";
});
2025-02-12 13:27:22 +00:00
statsTab.addEventListener("click", () => {
studentsList.style.display = "none";
statsContent.style.display = "block";
2025-02-14 10:23:48 +00:00
criteriaContent.style.display = "none";
2025-02-12 13:27:22 +00:00
});
2025-02-14 10:23:48 +00:00
criteriaTab.addEventListener("click", () => {
studentsList.style.display = "none";
2025-02-12 13:27:22 +00:00
statsContent.style.display = "none";
2025-02-14 10:23:48 +00:00
criteriaContent.style.display = "block"; // Pokaż zakładkę "Zarządzanie kryteriami"
renderCriteria(); // Odśwież listę kryteriów
});
// 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));
2025-02-12 13:27:22 +00:00
});
2025-02-12 13:05:01 +00:00
});