Compare commits

...

21 Commits
dev ... robocza

Author SHA1 Message Date
Tomasz 0be9ac2df5 test 2024-10-18 13:51:18 +02:00
Tomasz d3d04b837b zabawa kolorki i kilka funkcji 2024-10-18 13:35:03 +02:00
Tomasz 7e0dcc5287 Merge branch 'teamAPI' into fk1810 2024-10-18 12:24:41 +02:00
Tomasz 52fb67d125 dodanie przesuwania nakglowak tabelki 2024-10-18 12:15:36 +02:00
Twoje Imię Nazwisko 2619e8e917 load categories from json 2024-10-18 06:01:25 -04:00
konradm e2eac05ab5 select-roles added 2024-10-18 10:30:42 +02:00
konradm 3ba6c026f2 Merge branch 'test' into konradm 2024-10-18 10:12:54 +02:00
konradm 9faf9bdb96 linia 2024-10-17 14:39:47 +02:00
konradm 32449be531 first name last name 2024-10-17 14:24:08 +02:00
konradm e0ba11b0e9 commit 2024-10-17 14:15:45 +02:00
konradm a211321c84 commit
// Generuj wiersze dla uczniów
studentsData.forEach(student => {
    const row = document.createElement('tr');

    // Komórka z imieniem i nazwiskiem
    const tdName = document.createElement('td');
    tdName.textContent = student.name;
    row.appendChild(tdName);

    // Upewnij się, że 'behavior' jest zdefiniowany
    if (!student.behavior) {
        student.behavior = {};
    }

    // Komórki z checkboxami dla kryteriów
    categoryColumns.forEach(column => {
        const td = document.createElement('td');
        const checkbox = document.createElement('input');
        checkbox.type = 'checkbox';
        checkbox.id = `${column.id}-${student.name.replace(/ /g, '-')}`;
        checkbox.onchange = calculateStats;

        // Ustawienie stanu checkboxa na podstawie zapisanych danych
        if (student.behavior[`day${currentDay}`] && student.behavior[`day${currentDay}`][column.id]) {
            checkbox.checked = student.behavior[`day${currentDay}`][column.id];
        } else {
            checkbox.checked = false;
        }

        td.appendChild(checkbox);
        row.appendChild(td);
    });

    tbody.appendChild(row);
});
2024-10-17 14:14:38 +02:00
bartoszh 3d62de7867 wszystko zrobione 2024-10-17 12:47:01 +02:00
konradm 3ad0353d9c Finalna wersja wczytywania uczniow. 2024-10-17 10:46:48 +02:00
bartoszh ab33dc5f75 commit 2024-10-16 15:44:17 +02:00
baiobelfer 6f7a626db3 bh update 2024-10-16 14:56:56 +02:00
baiobelfer 36524d8012 update loadCriteria 2024-10-16 14:53:18 +02:00
konradm d53c68eeb0 Pobieranie studentow do tabeli - niedokonczone 2024-10-16 13:51:22 +02:00
konradm 97d6865fdd select class 2024-10-16 12:42:08 +02:00
baiobelfer 5f2d191788 clean index 2024-10-16 13:54:55 +02:00
baiobelfer 9c52664e90 added Leader 2024-10-16 12:47:23 +02:00
email 5ae5f7c23c classes 2024-10-16 12:18:43 +02:00
9 changed files with 600 additions and 337 deletions

View File

@ -1,35 +1,172 @@
body { /* Podstawowe style dla zakładek */
font-family: Arial, sans-serif;
margin: 20px;
}
table {
width: 100%;
border-collapse: collapse;
}
table, th, td {
border: 1px solid black;
}
th, td {
padding: 10px;
text-align: center;
}
th {
background-color: #f2f2f2;
}
input[type="number"], input[type="checkbox"] {
transform: scale(1.2);
}
button {
padding: 10px;
margin: 10px 5px;
font-size: 16px;
}
#stats {
margin-top: 20px;
}
.tab { .tab {
display: none; display: none;
} }
.active {
.tab.active {
display: block; display: block;
} }
/* Style dla przycisków kategorii */
.category-buttons {
margin: 10px 0;
text-align: center;
background-color: #A9A9A9;
}
.category-buttons button {
margin: 5px;
padding: 10px 15px;
font-size: 16px;
cursor: pointer;
background-color: whitesmoke;
border: 1px solid black;
border-radius: 4px;
transition: background-color 0.3s, color 0.3s, border 0.3s;
}
.category-buttons button.active {
background-color: #4CAF50;
color: white;
border: 1px solid #4CAF50;
}
/* Stylizacja tabeli */
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
background-color: whitesmoke;
}
th, td {
border: 1px solid grey;
padding: 8px;
text-align: center;
}
th {
background-color: whitesmoke;
}
tr:nth-child(even) {
background-color: whitesmoke;
}
/* Stylizacja kontenera klasy */
.select-class {
text-align: center;
}
.select-role {
text-align: center;
}
.select-class select {
padding: 5px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 4px;
}
.select-role select {
padding: 5px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 4px;
}
/* Stylizacja nagłówków */
h1, h2, h3 {
text-align: center;
}
/* Dodatkowe style dla układu */
body {
font-family: Arial, sans-serif;
margin: 20px;
background-color: #fafafa;
}
/* Stylizacja stopki */
footer.footer {
width: 100%;
padding: 20px 0;
background-color: #fafafa;
color: #555;
}
.footer-container {
max-width: 1200px;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: stretch;
}
.footer-left, .footer-right {
width: 100%;
}
.footer-left {
text-align: left;
}
.footer-right {
text-align: right;
}
.footer-line {
border: none;
border-top: 2px solid #ddd;
margin: 20px 0;
width: 100%;
}
/* Dodatkowe style dla estetyki */
.footer-left p,
.footer-right p {
margin: 5px 0;
font-size: 14px;
color: #333;
}
/* Stylizacja przycisków ogólna */
button {
outline: none;
}
button:hover {
opacity: 0.8;
}
/* Stylizacja checkboxów */
input[type="checkbox"] {
transform: scale(1.2);
cursor: pointer;
}
.sticky {
position: sticky;
top: 0;
background-color: white; /* lub inny kolor, aby tło było widoczne */
z-index: 1000; /* zapewnia, że będzie na wierzchu */
border-bottom: 1px solid #ccc; /* opcjonalnie, aby oddzielić od treści */
}
.dark-background {
background-color: #2e2e2e; /* Ciemnoszare tło */
color: #ffffff; /* Jasny kolor tekstu dla lepszej czytelności */
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
}
.lead {
background-color: #555;
}

View File

@ -100,6 +100,7 @@
], ],
"roles": { "roles": {
"teacher": { "teacher": {
"name": "Teacher",
"criteria_ids": [ "criteria_ids": [
1, 1,
2, 2,
@ -111,6 +112,7 @@
] ]
}, },
"homeroom_teacher": { "homeroom_teacher": {
"name": "Homeroom Teacher",
"criteria_ids": [ "criteria_ids": [
1, 1,
2, 2,
@ -123,6 +125,7 @@
] ]
}, },
"principal": { "principal": {
"name": "Principal",
"criteria_ids": [ "criteria_ids": [
8, 8,
9, 9,
@ -131,6 +134,7 @@
] ]
}, },
"student": { "student": {
"name": "Student",
"criteria_ids": [ "criteria_ids": [
12, 12,
13 13

View File

@ -2,13 +2,28 @@
<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">
<style>
table {
width: 100%;
border-collapse: collapse;
}
th {
position: sticky;
top: 0;
background-color: lightgray; /* Kolor tła nagłówka */
z-index: 10; /* Zapewnia, że nagłówek będzie nad innymi elementami */
border: 1px solid #ddd; /* Opcjonalnie: Dodanie obramowania */
padding: 8px;
}
</style>
</head> </head>
<body> <body class="dark-background">
<h1 class="lead" style="font-size: 48px;"><em>Ocena Zachowania</em></h1>
<h1>Ocena Zachowania</h1>
<div> <div>
<button onclick="showTab('criteria')">Ocena z zachowania</button> <button onclick="showTab('criteria')">Ocena z zachowania</button>
@ -16,6 +31,7 @@
<button onclick="showTab('points')">Ustal punkty</button> <button onclick="showTab('points')">Ustal punkty</button>
</div> </div>
<!-- Zakładka "Ustal punkty" -->
<div id="points" class="tab"> <div id="points" class="tab">
<h2>Ustal punkty dla kryteriów</h2> <h2>Ustal punkty dla kryteriów</h2>
<table> <table>
@ -26,92 +42,151 @@
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<!-- Wiersze dla wszystkich kryteriów -->
<tr> <tr>
<td>Frekwencja 95-100%</td> <td>Frekwencja 95-100%</td>
<td><input type="number" id="frekwencja-punkty" value="30" onchange="calculateStats()"></td> <td><input type="number" id="frekwencja-punkty" value="30" onchange="calculateStats()"></td>
</tr> </tr>
<tr> <tr>
<td>Brak godzin nieusprawiedliwionych</td> <td>Brak godzin nieusprawiedliwionych</td>
<td><input type="number" id="brak-godzin-punkty" value="20" onchange="calculateStats()"></td> <td><input type="number" id="brak_godzin-punkty" value="20" onchange="calculateStats()"></td>
</tr> </tr>
<!-- Dodaj pozostałe wiersze kryteriów tutaj -->
<tr> <tr>
<td>Minimum 85% frekwencja</td> <td>Minimum 85% frekwencja</td>
<td><input type="number" id="min-85-punkty" value="20" onchange="calculateStats()"></td> <td><input type="number" id="min_85-punkty" value="20" onchange="calculateStats()"></td>
</tr> </tr>
<tr> <tr>
<td>Udział w etapie szkolnym olimpiady</td> <td>Etap szkolny</td>
<td><input type="number" id="etap-szkolny-punkty" value="5" onchange="calculateStats()"></td> <td><input type="number" id="etap_szkolny-punkty" value="5" onchange="calculateStats()"></td>
</tr> </tr>
<tr> <tr>
<td>Udział w etapie rejonowym olimpiady</td> <td>Etap rejonowy</td>
<td><input type="number" id="etap-rejonowy-punkty" value="5" onchange="calculateStats()"></td> <td><input type="number" id="etap_rejonowy-punkty" value="10" onchange="calculateStats()"></td>
</tr> </tr>
<tr> <tr>
<td>Udział w etapie wojewódzkim olimpiady</td> <td>Etap wojewódzki</td>
<td><input type="number" id="etap-wojewodzki-punkty" value="10" onchange="calculateStats()"></td> <td><input type="number" id="etap_wojewodzki-punkty" value="15" onchange="calculateStats()"></td>
</tr> </tr>
<tr> <tr>
<td>Udział w etapie ogólnopolskim olimpiady</td> <td>Etap ogólnopolski</td>
<td><input type="number" id="etap-ogolnopolski-punkty" value="10" onchange="calculateStats()"></td> <td><input type="number" id="etap_ogolnopolski-punkty" value="20" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Udział w konkursach</td>
<td><input type="number" id="udzial_konkurs-punkty" value="5" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Wyróżnienie w konkursie</td>
<td><input type="number" id="wyroznienie_konkurs-punkty" value="10" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Reprezentacja indywidualna</td>
<td><input type="number" id="reprezentacja_indywidualna-punkty" value="5" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Reprezentacja zespołowa</td>
<td><input type="number" id="reprezentacja_zespolowa-punkty" value="10" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Udział w zawodach</td>
<td><input type="number" id="udzial_zawody-punkty" value="15" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Organizacja imprez</td>
<td><input type="number" id="organizacja_imprez-punkty" value="10" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Funkcje w klasie</td>
<td><input type="number" id="funkcja_klasa-punkty" value="10" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Uroczystości okolicznościowe</td>
<td><input type="number" id="uroczystosci-punkty" value="10" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Udział w poczcie sztandarowej</td>
<td><input type="number" id="poczta_sztandar-punkty" value="20" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Pomoc nauczycielowi</td>
<td><input type="number" id="pomoc_nauczyciel-punkty" value="10" onchange="calculateStats()"></td>
</tr>
<tr>
<td>Wolontariat</td>
<td><input type="number" id="wolontariat-punkty" value="10" onchange="calculateStats()"></td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> </div>
<!-- Zakładka "Kryteria oceny zachowania" -->
<div id="criteria" class="tab active"> <div id="criteria" class="tab active">
<h2>Kryteria oceny zachowania - <span id="current-date"></span></h2> <h2>Kryteria oceny zachowania - <span id="current-date"></span></h2>
<div> <div>
<button onclick="changeDay(-1)">Poprzedni Dzień</button> <button onclick="changeDay(-1)">Poprzedni Dzień</button>
<button onclick="changeDay(1)">Następny Dzień</button> <button onclick="changeDay(1)">Następny Dzień</button>
</div> </div>
<table>
<div class="select-role">
<p>Wybierz role:</p>
<select id="select-role" class="select-role">
</select>
</div>
<div class="select-class" id="select-class-container">
<p>Wybierz klasę:</p>
<select class="select-class" id="select-class-select">
<!-- Opcje będą ładowane dynamicznie -->
</select>
</div>
<div class="category-buttons" id="category-buttons-box">
<button data-category="frekwencja" onclick="showInnerTab('frekwencja')">Frekwencja</button>
<button data-category="olimpiady" onclick="showInnerTab('olimpiady')">Olimpiady</button>
<button data-category="konkursy" onclick="showInnerTab('konkursy')">Konkursy Szkolne</button>
<button data-category="reprezentacja" onclick="showInnerTab('reprezentacja')">Reprezentacja Szkoły</button>
<button data-category="aktywnosc" onclick="showInnerTab('aktywnosc')">Aktywność</button>
</div>
<!-- Tabela uczniów -->
<table id="student-table">
<thead> <thead>
<tr> <tr>
<th rowSpan="2">Uczeń</th> <th>Imię i Nazwisko</th>
<th colspan="3">Frekwencja</th> <!-- Dynamiczne kolumny będą generowane przez JavaScript -->
<th colspan="4">Olimpiady</th>
<th colspan="2">Konkursy Szkolne</th>
<th colspan="3">Reprezentacja Szkoły</th>
<th colspan="5">Aktywność</th>
</tr>
<tr>
<th>Frekwencja 95-100%</th>
<th>Brak godzin nieusprawiedliwionych</th>
<th>Minimum 85% frekwencja</th>
<th>Etap szkolny</th>
<th>Etap rejonowy</th>
<th>Etap wojewódzki</th>
<th>Etap ogólnopolski</th>
<th>Udział w konkursach</th>
<th>Wyróżnienie w konkursie</th>
<th>Reprezentacja indywidualna</th>
<th>Reprezentacja zespołowa</th>
<th>Udział w zawodach</th>
<th>Organizacja imprez</th>
<th>Funkcje w klasie</th>
<th>Uroczystości okolicznościowe</th>
<th>Udział w poczcie sztandarowym</th>
<th>Pomoc nauczycielowi</th>
<th>Wolontariat</th>
</tr> </tr>
</thead> </thead>
<tbody>
<tbody id="student-table"> <!-- Wiersze uczniów będą generowane przez JavaScript -->
<!-- Dane uczniów będą generowane dynamicznie -->
</tbody> </tbody>
</table> </table>
</div> </div>
<!-- Zakładka "Statystyka" -->
<div id="stats" class="tab"> <div id="stats" class="tab">
<h2>Statystyka dla wszystkich dni</h2> <h2>Statystyka dla wszystkich dni</h2>
<div id="stats"></div> <div id="stats-output"></div>
</div> </div>
<hr class="footer-line">
<footer class="footer">
<div class="footer-left">
<p>B. Hrynowiecki</p>
<p>K. Michalak</p>
<p>F. Kowalski</p>
<p>S. Ptak</p>
<p>M. Marszalik</p>
</div>
<div class="footer-right">
<p>M. Pabiszczak</p>
</div>
</footer>
<script type="module" src="js/script.js"></script> <!-- Przeniesienie skryptu na koniec body -->
<script type="module" src="js/app.js"></script> <script src="js/script.js"></script>
</body> </body>
</html> </html>

View File

@ -1,45 +0,0 @@
// Funkcja do wczytania pliku JSON
async function fetchJSONFile(filePath) {
try {
const response = await fetch(filePath);
if (!response.ok) {
throw new Error(`HTTP error! Status: ${response.status}`);
}
return await response.json();
} catch (error) {
console.error("Error fetching JSON file:", error);
}
}
// Funkcja do wczytania pliku class.json
async function loadClasses() {
const classFilePath = '/data/class.json';
const classes = await fetchJSONFile(classFilePath);
if (classes) {
console.log('Classes loaded:', classes);
// Iterowanie po wszystkich klasach i wczytywanie plików z danymi uczniów
for (const classInfo of classes) {
const studentsFilePath = '/data/'+ classInfo.file_path;
const studentsData = await fetchJSONFile(studentsFilePath);
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);
}
}
}
}
// Funkcja do przetwarzania danych o klasach i uczniach
function processClassData(classInfo, studentsData) {
console.log(`Class: ${classInfo.class}, Group: ${classInfo.group}, Students Count: ${classInfo.student_count}`);
console.log('Student Data:', studentsData);
// Możesz tutaj np. wyświetlić dane w interfejsie lub przeprowadzić dodatkowe operacje
}
// Uruchomienie wczytywania klas
loadClasses();

View File

@ -1,16 +1,161 @@
// Zmienne globalne
let currentCategory = 'frekwencja';
let currentClass = '';
let studentsData = [];
let currentDay = 0; let currentDay = 0;
const baseDate = new Date(); const baseDate = new Date();
const studentsData = [
{ name: "Jan Kowalski", behavior: {} },
{ name: "Anna Nowak", behavior: {} },
{ name: "Piotr Wiśniewski", behavior: {} },
{ name: "Katarzyna Zielińska", behavior: {} }
];
// Funkcja do wczytywania pliku JSON
async function fetchJSONFile(filePath) {
try {
const response = await fetch(filePath);
if (!response.ok) {
throw new Error(`Błąd HTTP! Status: ${response.status}`);
}
return await response.json();
} catch (error) {
console.error("Błąd podczas pobierania pliku JSON:", error);
return null;
}
}
// Obiekt do przechowywania danych klas i uczniów
const classData = {};
// Funkcja do wczytania pliku class.json i danych uczniów
async function loadClasses() {
const classFilePath = '/data/class.json';
const classes = await fetchJSONFile(classFilePath);
if (classes) {
console.log('Załadowane klasy:', classes);
const selectClass = document.getElementById("select-class-select");
selectClass.innerHTML = ""; // Wyczyść istniejące opcje
classes.forEach(classInfo => {
const option = document.createElement('option');
option.value = classInfo.file_path;
option.textContent = `Klasa: ${classInfo.class}`;
selectClass.appendChild(option);
console.log("Dodano klasę ", classInfo.class, " do SELECT");
});
// Dodaj nasłuchiwacz zdarzeń na zmianę wyboru klasy
selectClass.addEventListener('change', function() {
const selectedClassFile = this.value;
console.log(`Wybrano klasę: ${selectedClassFile}`);
loadStudents(selectedClassFile);
});
// Opcjonalnie, ustaw domyślnie pierwszą klasę i załaduj jej uczniów
if (classes.length > 0) {
selectClass.selectedIndex = 0;
const defaultClassFile = classes[0].file_path;
loadStudents(defaultClassFile);
}
}
}
// Funkcja do wczytania danych uczniów dla wybranej klasy
async function loadStudents(classFilePath) {
if (!classFilePath) {
console.warn("Nie wybrano żadnej klasy.");
return;
}
const studentsFilePath = `/data/${classFilePath}`;
const data = await fetchJSONFile(studentsFilePath);
if (data && Array.isArray(data.students)) {
console.log(`Uczniowie załadowani z pliku ${classFilePath}:`, data);
studentsData = data.students; // Aktualizuj globalną tablicę uczniów
// Inicjalizacja 'behavior' dla każdego ucznia, jeśli jest niezdefiniowany
studentsData.forEach(student => {
if (!student.behavior) {
student.behavior = {};
}
});
currentClass = classFilePath; // Ustaw aktualną klasę
generateTable(currentCategory); // Regeneruj tabelę z aktualną kategorią
} else {
console.error("Błąd: Nie udało się załadować danych uczniów lub dane są niepoprawne.");
studentsData = []; // Jeśli nie udało się załadować danych, wyczyść tablicę uczniów
currentClass = '';
generateTable(currentCategory); // Regeneruj pustą tabelę
}
}
async function getCategoriesWithCriteria() {
const criteriaFilePath = '/data/criteria.json';
const criteria = await fetchJSONFile(criteriaFilePath);
let categoriesWithCriteria = {}
criteria.categories.forEach(category => {
let criteriaForCategory = []
criteria.criteria.forEach(criteria => {
if(category.criteria_ids.includes(criteria.id)) {
console.log(`!!! ${category.name} posiada ${criteria.name}`)
criteriaForCategory.push({name: criteria.name, id: criteria.id})
}
})
categoriesWithCriteria[category.id] = criteriaForCategory
})
return categoriesWithCriteria
}
// Funkcja do wczytania pliku criteria.json
async function loadCriteria() {
const criteriaFilePath = '/data/criteria.json';
const criteria = await fetchJSONFile(criteriaFilePath);
console.log("Załadowane kryteria:", criteria);
//
// LADOWANIE ROL
//
const roles = criteria.roles;
const selectroleByid = document.getElementById("select-role");
let selectroleHTML = ""; // Zainicjalizuj pusty string na HTML
// Iteracja przez klucze obiektu roles
for (const [key, value] of Object.entries(roles)) {
selectroleHTML += `<option value="${key}">${value.name}</option>`;
}
// Wstawienie HTML do elementu select
selectroleByid.innerHTML = selectroleHTML;
// category-buttons-box
const categoriesCriteria = criteria.categories;
const categoryButtonsBox = document.getElementById("category-buttons-box");
let categoryButtonHTML = ""
categoriesCriteria.forEach(category => {
// categoryButtonHTML += `<option value="${key}">${value.name}</option>`;
categoryButtonHTML += `<button data-category="${category.id}" onclick="showInnerTab('${category.id}')">${category.name}</button>`
})
categoryButtonsBox.innerHTML = categoryButtonHTML;
}
// Funkcja do przełączania głównych zakładek
function showTab(tabName) { function showTab(tabName) {
// Ukryj wszystkie główne taby
const tabs = document.querySelectorAll('.tab'); const tabs = document.querySelectorAll('.tab');
tabs.forEach(tab => tab.classList.remove('active')); tabs.forEach(tab => tab.classList.remove('active'));
document.getElementById(tabName).classList.add('active');
// Pokaż wybrany tab
const selectedTab = document.getElementById(tabName);
if (selectedTab) {
selectedTab.classList.add('active');
}
if (tabName === 'criteria') { if (tabName === 'criteria') {
loadDayData(); loadDayData();
@ -19,37 +164,35 @@ function showTab(tabName) {
} }
} }
function generateTable() { // Funkcja do przełączania kategorii w tabeli uczniów
const table = document.getElementById('student-table'); function showInnerTab(category) {
table.innerHTML = ''; currentCategory = category;
// Generowanie tabeli na podstawie wybranej kategorii
generateTable(category);
studentsData.forEach(student => { // Podkreślenie aktywnego przycisku
const row = document.createElement('tr'); const buttons = document.querySelectorAll('.category-buttons button');
row.innerHTML = ` buttons.forEach(button => button.classList.remove('active'));
<td>${student.name}</td> const activeButton = document.querySelector(`.category-buttons button[data-category="${category}"]`);
<td><input type="checkbox" id="frekwencja-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> if (activeButton) {
<td><input type="checkbox" id="brak-godzin-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> activeButton.classList.add('active');
<td><input type="checkbox" id="min-85-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td> }
<td><input type="checkbox" id="etap-szkolny-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="etap-rejonowy-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="etap-wojewodzki-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="etap-ogolnopolski-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="udzial-konkurs-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="wyroznienie-konkurs-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="reprezentacja-indywidualna-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="reprezentacja-zespolowa-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="udzial-zawody-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="organizacja-imprez-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="funkcja-klasa-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="uroczystosci-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="poczta-sztandar-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="pomoc-nauczyciel-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
<td><input type="checkbox" id="wolontariat-${student.name.replace(' ', '-')}" onchange="calculateStats()"></td>
`;
table.appendChild(row);
});
} }
// Funkcja, aby ustawić domyślną kategorię i zakładkę
document.addEventListener("DOMContentLoaded", function() {
// Domyślnie pokazujemy kategorię 'frekwencja'
showInnerTab('frekwencja');
// Ustawienie daty na dziś
document.getElementById('current-date').innerText = baseDate.toLocaleDateString();
// Uruchomienie wczytywania klas i kryteriów
loadClasses();
loadCriteria();
});
// Funkcja do zmiany dnia
function changeDay(direction) { function changeDay(direction) {
saveDayData(); saveDayData();
currentDay += direction; currentDay += direction;
@ -59,81 +202,73 @@ function changeDay(direction) {
loadDayData(); loadDayData();
} }
// Funkcja do ładowania danych dnia
function loadDayData() { function loadDayData() {
studentsData.forEach(student => { studentsData.forEach(student => {
const studentId = student.name.replace(' ', '-'); const studentId = `${student.first_name}-${student.last_name}`.replace(/ /g, '-');
const behavior = student.behavior[`day${currentDay}`] || {}; const behavior = student.behavior[`day${currentDay}`] || {};
document.getElementById(`frekwencja-${studentId}`).checked = behavior.frekwencja || false; // Pobierz kryteria dla aktualnej kategorii
document.getElementById(`brak-godzin-${studentId}`).checked = behavior.brak_godzin || false; const categoryColumns = categories[currentCategory];
document.getElementById(`min-85-${studentId}`).checked = behavior.min_85 || false; categoryColumns.forEach(column => {
document.getElementById(`etap-szkolny-${studentId}`).checked = behavior.etap_szkolny || false; const checkbox = document.getElementById(`${column.id}-${studentId}`);
document.getElementById(`etap-rejonowy-${studentId}`).checked = behavior.etap_rejonowy || false; if (checkbox) {
document.getElementById(`etap-wojewodzki-${studentId}`).checked = behavior.etap_wojewodzki || false; checkbox.checked = behavior[column.id] || false;
document.getElementById(`etap-ogolnopolski-${studentId}`).checked = behavior.etap_ogolnopolski || false; }
document.getElementById(`udzial-konkurs-${studentId}`).checked = behavior.udzial_konkurs || false; });
document.getElementById(`wyroznienie-konkurs-${studentId}`).checked = behavior.wyroznienie_konkurs || false;
document.getElementById(`reprezentacja-indywidualna-${studentId}`).checked = behavior.reprezentacja_indywidualna || false;
document.getElementById(`reprezentacja-zespolowa-${studentId}`).checked = behavior.reprezentacja_zespolowa || false;
document.getElementById(`udzial-zawody-${studentId}`).checked = behavior.udzial_zawody || false;
document.getElementById(`organizacja-imprez-${studentId}`).checked = behavior.organizacja_imprez || false;
document.getElementById(`funkcja-klasa-${studentId}`).checked = behavior.funkcja_klasa || false;
document.getElementById(`uroczystosci-${studentId}`).checked = behavior.uroczystosci || false;
document.getElementById(`poczta-sztandar-${studentId}`).checked = behavior.poczta_sztandar || false;
document.getElementById(`pomoc-nauczyciel-${studentId}`).checked = behavior.pomoc_nauczyciel || false;
document.getElementById(`wolontariat-${studentId}`).checked = behavior.wolontariat || false;
}); });
calculateStats(); calculateStats();
} }
// Funkcja do zapisywania danych dnia
function saveDayData() { function saveDayData() {
studentsData.forEach(student => { studentsData.forEach(student => {
const studentId = student.name.replace(' ', '-'); const studentId = `${student.first_name}-${student.last_name}`.replace(/ /g, '-');
const behavior = {
frekwencja: document.getElementById(`frekwencja-${studentId}`).checked, // Upewnij się, że 'behavior' jest zdefiniowany
brak_godzin: document.getElementById(`brak-godzin-${studentId}`).checked, if (!student.behavior) {
min_85: document.getElementById(`min-85-${studentId}`).checked, student.behavior = {};
etap_szkolny: document.getElementById(`etap-szkolny-${studentId}`).checked, }
etap_rejonowy: document.getElementById(`etap-rejonowy-${studentId}`).checked,
etap_wojewodzki: document.getElementById(`etap-wojewodzki-${studentId}`).checked, let behavior = student.behavior[`day${currentDay}`] || {};
etap_ogolnopolski: document.getElementById(`etap-ogolnopolski-${studentId}`).checked,
udzial_konkurs: document.getElementById(`udzial-konkurs-${studentId}`).checked, const categoryColumns = categories[currentCategory];
wyroznienie_konkurs: document.getElementById(`wyroznienie-konkurs-${studentId}`).checked,
reprezentacja_indywidualna: document.getElementById(`reprezentacja-indywidualna-${studentId}`).checked, categoryColumns.forEach(column => {
reprezentacja_zespolowa: document.getElementById(`reprezentacja-zespolowa-${studentId}`).checked, const checkbox = document.getElementById(`${column.id}-${studentId}`);
udzial_zawody: document.getElementById(`udzial-zawody-${studentId}`).checked, if (checkbox) {
organizacja_imprez: document.getElementById(`organizacja-imprez-${studentId}`).checked, behavior[column.id] = checkbox.checked;
funkcja_klasa: document.getElementById(`funkcja-klasa-${studentId}`).checked, }
uroczystosci: document.getElementById(`uroczystosci-${studentId}`).checked, });
poczta_sztandar: document.getElementById(`poczta-sztandar-${studentId}`).checked,
pomoc_nauciciel: document.getElementById(`pomoc-nauczyciel-${studentId}`).checked,
wolontariat: document.getElementById(`wolontariat-${studentId}`).checked
};
student.behavior[`day${currentDay}`] = behavior; student.behavior[`day${currentDay}`] = behavior;
}); });
} }
// Funkcja do obliczania statystyk
function calculateStats() { function calculateStats() {
const frekwencjaPoints = parseInt(document.getElementById('frekwencja-punkty').value); // Pobieranie punktów z zakładki "Ustal punkty"
const brakGodzinPoints = parseInt(document.getElementById('brak-godzin-punkty').value); const points = {
const min85Points = parseInt(document.getElementById('min-85-punkty').value); frekwencja: parseInt(document.getElementById('frekwencja-punkty').value) || 0,
const etapSzkolnyPoints = parseInt(document.getElementById('etap-szkolny-punkty').value); brak_godzin: parseInt(document.getElementById('brak_godzin-punkty').value) || 0,
const etapRejonowyPoints = parseInt(document.getElementById('etap-rejonowy-punkty').value); min_85: parseInt(document.getElementById('min_85-punkty').value) || 0,
const etapWojewodzkiPoints = parseInt(document.getElementById('etap-wojewodzki-punkty').value); etap_szkolny: parseInt(document.getElementById('etap_szkolny-punkty').value) || 5,
const etapOgolnopolskiPoints = parseInt(document.getElementById('etap-ogolnopolski-punkty').value); etap_rejonowy: parseInt(document.getElementById('etap_rejonowy-punkty').value) || 10,
const udzialKonkursPoints = 5; // stała wartość etap_wojewodzki: parseInt(document.getElementById('etap_wojewodzki-punkty').value) || 15,
const wyroznienieKonkursPoints = 10; // stała wartość etap_ogolnopolski: parseInt(document.getElementById('etap_ogolnopolski-punkty').value) || 20,
const reprezentacjaIndPoints = 5; // stała wartość udzial_konkurs: parseInt(document.getElementById('udzial_konkurs-punkty').value) || 5,
const reprezentacjaZesPoints = 10; // stała wartość wyroznienie_konkurs: parseInt(document.getElementById('wyroznienie_konkurs-punkty').value) || 10,
const udzialZawodyPoints = 15; // stała wartość reprezentacja_indywidualna: parseInt(document.getElementById('reprezentacja_indywidualna-punkty').value) || 5,
const organizacjaImprezPoints = 10; // stała wartość reprezentacja_zespolowa: parseInt(document.getElementById('reprezentacja_zespolowa-punkty').value) || 10,
const funkcjaKlasyPoints = 10; // stała wartość udzial_zawody: parseInt(document.getElementById('udzial_zawody-punkty').value) || 15,
const uroczystosciPoints = 10; // stała wartość organizacja_imprez: parseInt(document.getElementById('organizacja_imprez-punkty').value) || 10,
const pocztaSztandarPoints = 20; // stała wartość funkcja_klasa: parseInt(document.getElementById('funkcja_klasa-punkty').value) || 10,
const pomocNauczycielaPoints = 10; // stała wartość uroczystosci: parseInt(document.getElementById('uroczystosci-punkty').value) || 10,
const wolontariatPoints = 10; // stała wartość poczta_sztandar: parseInt(document.getElementById('poczta_sztandar-punkty').value) || 20,
pomoc_nauczyciel: parseInt(document.getElementById('pomoc_nauczyciel-punkty').value) || 10,
wolontariat: parseInt(document.getElementById('wolontariat-punkty').value) || 10
};
let stats = ''; let stats = '';
@ -143,35 +278,23 @@ 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; for (const [criterion, value] of Object.entries(behavior)) {
if (behavior.brak_godzin) dayPoints += brakGodzinPoints; if (value && points[criterion]) {
if (behavior.min_85) dayPoints += min85Points; dayPoints += points[criterion];
if (behavior.etap_szkolny) dayPoints += etapSzkolnyPoints; }
if (behavior.etap_rejonowy) dayPoints += etapRejonowyPoints; }
if (behavior.etap_wojewodzki) dayPoints += etapWojewodzkiPoints;
if (behavior.etap_ogolnopolski) dayPoints += etapOgolnopolskiPoints;
if (behavior.udzial_konkurs) dayPoints += udzialKonkursPoints;
if (behavior.wyroznienie_konkurs) dayPoints += wyroznienieKonkursPoints;
if (behavior.reprezentacja_indywidualna) dayPoints += reprezentacjaIndPoints;
if (behavior.reprezentacja_zespolowa) dayPoints += reprezentacjaZesPoints;
if (behavior.udzial_zawody) dayPoints += udzialZawodyPoints;
if (behavior.organizacja_imprez) dayPoints += organizacjaImprezPoints;
if (behavior.funkcja_klasa) dayPoints += funkcjaKlasyPoints;
if (behavior.uroczystosci) dayPoints += uroczystosciPoints;
if (behavior.poczta_sztandar) dayPoints += pocztaSztandarPoints;
if (behavior.pomoc_nauciciel) dayPoints += pomocNauczycielaPoints;
if (behavior.wolontariat) dayPoints += wolontariatPoints;
totalPoints += dayPoints; totalPoints += dayPoints;
}); });
stats += `${student.name}: ${totalPoints} punktów (${getGrade(totalPoints)})\n`; stats += `${student.first_name} ${student.last_name}: ${totalPoints} punktów (${getGrade(totalPoints)})\n`;
}); });
document.getElementById('stats').innerText = stats; document.getElementById('stats-output').innerText = stats;
} }
// Funkcja do przypisywania ocen na podstawie punktów
function getGrade(points) { function getGrade(points) {
if (points >= 250) return "Wzorowe"; if (points >= 250) return "Wzorowe";
if (points >= 180) return "Bardzo dobre"; if (points >= 180) return "Bardzo dobre";
@ -181,8 +304,74 @@ function getGrade(points) {
return "Naganne"; return "Naganne";
} }
// Ustawienie daty na dziś // Funkcja do generowania tabeli uczniów na podstawie wybranej kategorii
document.getElementById('current-date').innerText = baseDate.toLocaleDateString(); async function generateTable(category) {
const table = document.getElementById('student-table');
const thead = table.querySelector('thead tr');
const tbody = table.querySelector('tbody');
// Generowanie tabeli przy starcie // Wyczyść istniejące nagłówki i wiersze
generateTable(); thead.innerHTML = '';
tbody.innerHTML = '';
// Dodaj nagłówek 'Imię i Nazwisko'
const thName = document.createElement('th');
thName.textContent = "Imię i Nazwisko";
thead.appendChild(thName);
// Pobierz kolumny dla wybranej kategorii
const categories = await getCategoriesWithCriteria()
console.log("łot:", categories)
const categoryColumns = categories[category];
// Dodaj nagłówki dla kryteriów w kategorii
categoryColumns.forEach(column => {
const th = document.createElement('th');
th.textContent = column.name;
thead.appendChild(th);
});
// Generuj wiersze dla uczniów
studentsData.forEach(student => {
const row = document.createElement('tr');
// Komórka z imieniem i nazwiskiem
const tdName = document.createElement('td');
tdName.textContent = `${student.first_name} ${student.last_name}`;
row.appendChild(tdName);
// Upewnij się, że 'behavior' jest zdefiniowany
if (!student.behavior) {
student.behavior = {};
}
// Komórki z checkboxami dla kryteriów
categoryColumns.forEach(column => {
const td = document.createElement('td');
const checkbox = document.createElement('input');
checkbox.type = 'checkbox';
const studentId = `${student.first_name}-${student.last_name}`.replace(/ /g, '-');
checkbox.id = `${column.id}-${studentId}`;
checkbox.onchange = calculateStats;
// Ustawienie stanu checkboxa na podstawie zapisanych danych
checkbox.checked = student.behavior[`day${currentDay}`]?.[column.id] || false;
td.appendChild(checkbox);
row.appendChild(td);
});
tbody.appendChild(row);
});
}
//window.onscroll = function() {
// const stickyElements = document.querySelectorAll('.sticky');
//stickyElements.forEach(element => {
// if (window.pageYOffset > element.offsetTop) {
// element.classList.add('active');
// } else {
// element.classList.remove('active');
//}
//});
//};

View File

@ -1,7 +0,0 @@
<div>
<h2>Kryteria Weryfikacyjne</h2>
<ul id="criteria-list">
<!-- Kryteria weryfikacyjne będą generowane dynamicznie -->
</ul>
</div>

View File

@ -1,51 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Behavior Assessment Dashboard</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Behavior Assessment Dashboard</h1>
<div class="filters">
<!-- Wybór roli -->
<label for="role">Select Role:</label>
<select id="role">
<option value="teacher">Teacher</option>
<option value="homeroom_teacher">Homeroom Teacher</option>
<option value="principal">Principal</option>
<option value="student">Student (Self-Assessment)</option>
</select>
<!-- Wybór osoby -->
<label for="person">Select Person:</label>
<select id="person">
<!-- Osoby będą generowane dynamicznie na podstawie roli -->
</select>
<!-- Wybór kategorii -->
<label for="category">Select Category:</label>
<select id="category">
<!-- Kategorie będą generowane dynamicznie na podstawie roli -->
</select>
</div>
<h2>Criteria Table</h2>
<table id="criteria-table">
<thead>
<tr>
<th>Student</th>
<!-- Nagłówki dla kryteriów zostaną dodane dynamicznie -->
</tr>
</thead>
<tbody>
<!-- Wiersze uczniów i kryteriów zostaną dodane dynamicznie -->
</tbody>
</table>
<script src="app.js"></script>
</body>
</html>

View File

@ -1,12 +0,0 @@
<div style="background-color: #4CAF50; color: white; padding: 10px;">
<h1>Ocena Zachowania</h1>
<p>Zalogowany jako: <span id="user-role">Nauczyciel</span></p>
</div>
<script>
// Skrypt do ustawiania roli użytkownika po zalogowaniu
// Można pobrać rolę z sesji po wdrożeniu API
const userRole = 'Nauczyciel'; // Tymczasowe dane
document.getElementById('user-role').innerText = userRole;
</script>

View File

@ -1,27 +0,0 @@
<div>
<h2>Statystyki i Ustalanie Wag</h2>
<!-- Wprowadź elementy do zarządzania wagami, np. suwaki lub pola numeryczne -->
<label for="waga-pomoc">Pomoc nauczycielowi:</label>
<input type="number" id="waga-pomoc" value="10"><br>
<label for="waga-spoznienie">Spóźnienie:</label>
<input type="number" id="waga-spoznienie" value="-5"><br>
<!-- Więcej wag dla innych kryteriów -->
<h3>Statystyki dla uczniów</h3>
<!-- Tabela statystyk dla uczniów -->
<table>
<thead>
<tr>
<th>Uczeń</th>
<th>Punkty</th>
<th>Ocena</th>
</tr>
</thead>
<tbody>
<!-- Dane będą dynamicznie ładowane -->
</tbody>
</table>
</div>