c2023
/
p22.10
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Finalna wersja wczytywania uczniow.

This commit is contained in:
konradm 2024-10-17 10:46:48 +02:00
parent d53c68eeb0
commit 3ad0353d9c
2 changed files with 87 additions and 130 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
index.html
View File

@ -2,7 +2,6 @@
<html lang="pl"> <html lang="pl">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ocena Zachowania</title> <title>Ocena Zachowania</title>
<link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/style.css">
</head> </head>
@ -65,17 +64,15 @@
<button onclick="changeDay(1)">Następny Dzień</button> <button onclick="changeDay(1)">Następny Dzień</button>
</div> </div>
<div class="select-class"> <div class="select-class">
<p>Wybierz klase:</p> <p>Wybierz klasę:</p>
<select id="select-class">
<!-- Opcje zostaną wygenerowane dynamicznie -->
</select>
</div> </div>
<table> <table>
<thead> <thead>
<tr> <tr>
<th rowSpan="2"><select class="select-class" id="select-class"> <th rowspan="2">Imię i nazwisko</th>
<option value="">Klasa 1</option>
<option value="">Klasa 2</option>
<option value="">Klasa 3</option>
</select></th>
<th colspan="3">Frekwencja</th> <th colspan="3">Frekwencja</th>
<th colspan="4">Olimpiady</th> <th colspan="4">Olimpiady</th>
<th colspan="2">Konkursy Szkolne</th> <th colspan="2">Konkursy Szkolne</th>
@ -103,7 +100,6 @@
<th>Wolontariat</th> <th>Wolontariat</th>
</tr> </tr>
</thead> </thead>
<tbody id="student-table"> <tbody id="student-table">
<!-- Dane uczniów będą generowane dynamicznie --> <!-- Dane uczniów będą generowane dynamicznie -->
</tbody> </tbody>
@ -116,17 +112,12 @@
</div> </div>
<footer style="margin: 20px"> <footer style="margin: 20px">
K. Michalak K. Michalak<br>
</br> F. Kowalski<br>
F. Kowalski
</br>
Led and Authored by M. Pabiszczak Led and Authored by M. Pabiszczak
</footer> </footer>
<script src="js/script.js"></script>
<script type="module" src="js/script.js"></script>
</body> </body>
</html> </html>

188
js/script.js
View File

@ -11,99 +11,82 @@ async function fetchJSONFile(filePath) {
} }
} }
// Funkcja do wczytania pliku class.json // Obiekt do przechowywania danych klas i uczniów
const classData = {};
// Funkcja do wczytania pliku class.json i danych uczniów
async function loadClasses() { async function loadClasses() {
const classFilePath = '/data/class.json'; const classFilePath = '/data/class.json';
const classes = await fetchJSONFile(classFilePath); const classes = await fetchJSONFile(classFilePath);
if (classes) { if (classes) {
console.log('Classes loaded:', classes); const section_by_id = document.getElementById("select-class");
section_by_id.innerHTML = ""; // Wyczyść istniejące opcje
var section_HTML = ""
// Iterowanie po wszystkich klasach i wczytywanie plików z danymi uczniów
for (const classInfo of classes) { for (const classInfo of classes) {
const studentsFilePath = '/data/'+ classInfo.file_path; const studentsFilePath = '/data/' + classInfo.file_path;
const studentsData = await fetchJSONFile(studentsFilePath); const studentsDataForClass = await fetchJSONFile(studentsFilePath);
// Wczytywanie klas do elementu select w html
const section_by_id = document.getElementById("select-class")
if (!section_HTML.includes(classInfo.class)) {
const section_option = "<option>" + "Klasa: " + classInfo.class + "</option>"
section_HTML += section_option;
console.log("DODANO KLASE ", classInfo.class, " DO SELECT")
section_by_id.innerHTML = section_HTML
}
//Literowanie studentow i dodawanie do tabeli
if (studentsData) {
console.log(`Students loaded for class ${classInfo.class}:`, studentsData);
// Tutaj możesz przechowywać dane lub je przetwarzać według potrzeb
processClassData(classInfo, studentsData);
const classKey = classInfo.class + "-" + classInfo.group;
// Utwórz i dodaj opcję do selecta
const option = document.createElement("option");
option.value = classKey;
option.text = "Klasa: " + classInfo.class + " Grupa: " + classInfo.group;
section_by_id.appendChild(option);
if (studentsDataForClass) {
processClassData(classInfo, studentsDataForClass);
} }
} }
} }
} }
const classData = []
// Funkcja do przetwarzania danych o klasach i uczniach // Funkcja do przetwarzania danych o klasach i uczniach
function processClassData(classInfo, studentsData) { function processClassData(classInfo, studentsDataForClass) {
console.log(`Class: ${classInfo.class}, Group: ${classInfo.group}, Students Count: ${classInfo.student_count}`); const classKey = classInfo.class + "-" + classInfo.group;
console.log('Student Data:', studentsData); classData[classKey] = studentsDataForClass;
classData.push(studentsData)
// Możesz tutaj np. wyświetlić dane w interfejsie lub przeprowadzić dodatkowe operacje
} }
// Uruchomienie wczytywania klas // Globalna tablica studentsData
loadClasses(); let studentsData = [];
//
//
//
let currentDay = 0;
const baseDate = new Date();
//Pobieranie studentow na podstawie aktualnie wybranej klasy
// Nasłuchiwanie na zmianę klasy i ładowanie uczniów
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
document.getElementById('select-class').addEventListener('change', function() { loadClasses().then(() => {
var selectedClass = this.value; const selectClassElement = document.getElementById('select-class');
var lastCharacter = selectedClass.slice(-1); // Pobiera ostatni znak
console.log("Aktualnie wybrana klasa: ", lastCharacter, " Liczba studentow: ");
if (studentsData && studentsData.students) { selectClassElement.addEventListener('change', function() {
// Literowanie po studentach i wyświetlanie ich danych var selectedClass = this.value;
console.log("Aktualnie wybrana klasa: ", selectedClass);
studentsData.students.forEach(student => { // Pobierz dane uczniów dla wybranej klasy
if(studentsData.header.class == classInfo.class){ let classStudentsData = classData[selectedClass];
console.log('Imię: ', student.first_name)
}
}); if (classStudentsData && classStudentsData.students) {
console.log("Dane uczniów dla klasy:", classStudentsData.students);
// Zaktualizuj tablicę studentsData
studentsData = classStudentsData.students.map(student => ({
name: student.first_name + " " + student.last_name,
behavior: {}
}));
// Wygeneruj tabelę
generateTable();
// Załaduj dane dla aktualnego dnia
loadDayData();
} else {
console.error("Nie znaleziono danych dla klasy: ", selectedClass);
}
});
} else { // Automatycznie wywołaj 'change' dla pierwszej klasy w select
console.log('Nie udało się pobrać danych studentów.'); if (selectClassElement.options.length > 0) {
selectClassElement.selectedIndex = 0;
selectClassElement.dispatchEvent(new Event('change'));
} }
//Pobranie uczniow klasy
}); });
}); });
const studentsData = [
{ name: "Jan Kowalski", behavior: {} },
{ name: "Anna Nowak", behavior: {} },
{ name: "Piotr Wiśniewski", behavior: {} },
{ name: "Katarzyna Zielińska", behavior: {} }
];
function showTab(tabName) { function showTab(tabName) {
const tabs = document.querySelectorAll('.tab'); const tabs = document.querySelectorAll('.tab');
tabs.forEach(tab => tab.classList.remove('active')); tabs.forEach(tab => tab.classList.remove('active'));
@ -116,57 +99,43 @@ function showTab(tabName) {
} }
} }
async function changeClass() {
await loadClasses()
let classesNames = []
for (const classInfo of classData) {
console.log(classInfo)
classesNames.push(classInfo.header.class + "-" + classInfo.header.group)
}
console.log("lol")
console.log(classesNames)
}
function generateTable() { function generateTable() {
changeClass()
const table = document.getElementById('student-table'); const table = document.getElementById('student-table');
table.innerHTML = ''; table.innerHTML = '';
//xd
studentsData.forEach(student => { studentsData.forEach(student => {
console.log("Przetwarzany student:", student);
const studentId = student.name.replace(/\s+/g, '-');
const row = document.createElement('tr'); const row = document.createElement('tr');
row.innerHTML = ` row.innerHTML = `
<td>${student.name}</td> <td>${student.name}</td>
<td><input type="checkbox" id="frekwencja-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="frekwencja-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="brak-godzin-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="brak-godzin-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="min-85-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="min-85-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="etap-szkolny-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="etap-szkolny-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="etap-rejonowy-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="etap-rejonowy-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="etap-wojewodzki-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="etap-wojewodzki-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="etap-ogolnopolski-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="etap-ogolnopolski-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="udzial-konkurs-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="udzial-konkurs-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="wyroznienie-konkurs-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="wyroznienie-konkurs-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="reprezentacja-indywidualna-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="reprezentacja-indywidualna-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="reprezentacja-zespolowa-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="reprezentacja-zespolowa-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="udzial-zawody-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="udzial-zawody-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="organizacja-imprez-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="organizacja-imprez-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="funkcja-klasa-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="funkcja-klasa-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="uroczystosci-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="uroczystosci-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="poczta-sztandar-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="poczta-sztandar-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="pomoc-nauczyciel-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="pomoc-nauczyciel-${studentId}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="wolontariat-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> <td><input type="checkbox" id="wolontariat-${studentId}" onchange="calculateStats()"></td>
`; `;
table.appendChild(row); table.appendChild(row);
}); });
} }
let currentDay = 0;
const baseDate = new Date();
// Zmiana dnia i ładowanie danych
function changeDay(direction) { function changeDay(direction) {
saveDayData(); saveDayData();
currentDay += direction; currentDay += direction;
@ -178,7 +147,7 @@ function changeDay(direction) {
function loadDayData() { function loadDayData() {
studentsData.forEach(student => { studentsData.forEach(student => {
const studentId = student.name.replace(' ', '-'); const studentId = student.name.replace(/\s+/g, '-');
const behavior = student.behavior[`day${currentDay}`] || {}; const behavior = student.behavior[`day${currentDay}`] || {};
document.getElementById(`frekwencja-${studentId}`).checked = behavior.frekwencja || false; document.getElementById(`frekwencja-${studentId}`).checked = behavior.frekwencja || false;
@ -206,7 +175,7 @@ function loadDayData() {
function saveDayData() { function saveDayData() {
studentsData.forEach(student => { studentsData.forEach(student => {
const studentId = student.name.replace(' ', '-'); const studentId = student.name.replace(/\s+/g, '-');
const behavior = { const behavior = {
frekwencja: document.getElementById(`frekwencja-${studentId}`).checked, frekwencja: document.getElementById(`frekwencja-${studentId}`).checked,
brak_godzin: document.getElementById(`brak-godzin-${studentId}`).checked, brak_godzin: document.getElementById(`brak-godzin-${studentId}`).checked,
@ -224,7 +193,7 @@ function saveDayData() {
funkcja_klasa: document.getElementById(`funkcja-klasa-${studentId}`).checked, funkcja_klasa: document.getElementById(`funkcja-klasa-${studentId}`).checked,
uroczystosci: document.getElementById(`uroczystosci-${studentId}`).checked, uroczystosci: document.getElementById(`uroczystosci-${studentId}`).checked,
poczta_sztandar: document.getElementById(`poczta-sztandar-${studentId}`).checked, poczta_sztandar: document.getElementById(`poczta-sztandar-${studentId}`).checked,
pomoc_nauciciel: document.getElementById(`pomoc-nauczyciel-${studentId}`).checked, pomoc_nauczyciel: document.getElementById(`pomoc-nauczyciel-${studentId}`).checked,
wolontariat: document.getElementById(`wolontariat-${studentId}`).checked wolontariat: document.getElementById(`wolontariat-${studentId}`).checked
}; };
@ -260,7 +229,7 @@ function calculateStats() {
Object.keys(student.behavior).forEach(day => { Object.keys(student.behavior).forEach(day => {
const behavior = student.behavior[day]; const behavior = student.behavior[day];
let dayPoints = 0; // Startowa liczba punktów let dayPoints = 0;
if (behavior.frekwencja) dayPoints += frekwencjaPoints; if (behavior.frekwencja) dayPoints += frekwencjaPoints;
if (behavior.brak_godzin) dayPoints += brakGodzinPoints; if (behavior.brak_godzin) dayPoints += brakGodzinPoints;
if (behavior.min_85) dayPoints += min85Points; if (behavior.min_85) dayPoints += min85Points;
@ -277,7 +246,7 @@ function calculateStats() {
if (behavior.funkcja_klasa) dayPoints += funkcjaKlasyPoints; if (behavior.funkcja_klasa) dayPoints += funkcjaKlasyPoints;
if (behavior.uroczystosci) dayPoints += uroczystosciPoints; if (behavior.uroczystosci) dayPoints += uroczystosciPoints;
if (behavior.poczta_sztandar) dayPoints += pocztaSztandarPoints; if (behavior.poczta_sztandar) dayPoints += pocztaSztandarPoints;
if (behavior.pomoc_nauciciel) dayPoints += pomocNauczycielaPoints; if (behavior.pomoc_nauczyciel) dayPoints += pomocNauczycielaPoints;
if (behavior.wolontariat) dayPoints += wolontariatPoints; if (behavior.wolontariat) dayPoints += wolontariatPoints;
totalPoints += dayPoints; totalPoints += dayPoints;
@ -300,6 +269,3 @@ function getGrade(points) {
// Ustawienie daty na dziś // Ustawienie daty na dziś
document.getElementById('current-date').innerText = baseDate.toLocaleDateString(); document.getElementById('current-date').innerText = baseDate.toLocaleDateString();
// Generowanie tabeli przy starcie
generateTable();