tool_test/tutor_dashboard.html at main · dimaykerby/tool_test · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Tutor Dashboard</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <!-- Header: logo a sinistra e saluto + logout a destra -->
  <header class="portale-header">
    <div class="portale-header-content">
      <img src="https://elrwpaezjnemmiegkyin.supabase.co/storage/v1/object/public/images//6_Logo_trasparente.png"
           alt="Logo Università" class="portale-logo">
      <div class="header-right">
        <span class="greeting">Ciao, Utente</span>
        <button id="logoutBtn" class="logout-btn">Logout</button>
      </div>
    </div>
  </header>

  <div class="container">
    <div class="dashboard-header">
      <h2>Dashboard</h2>
      <button id="modifyTestsBtn" class="modify-btn">Gestione test</button>
      <!-- New Button for Assigning New Tests -->
      <button id="assignTestsBtn" class="modify-btn">Assegna nuovi test</button>
    </div>

    <!-- Lista degli studenti -->
    <h3>I tuoi studenti</h3>
    <div id="studentsContainer">
      <!-- Gli elementi saranno aggiunti dinamicamente -->
    </div>
  </div>

  <script type="module">
    import { createClient } from "https://esm.sh/@supabase/supabase-js@2";

    const SUPABASE_URL = "https://elrwpaezjnemmiegkyin.supabase.co";
    const SUPABASE_KEY = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6ImVscndwYWV6am5lbW1pZWdreWluIiwicm9sZSI6ImFub24iLCJpYXQiOjE3MzgwNzAyMDUsImV4cCI6MjA1MzY0NjIwNX0.p6R2S1HK8kPFYiEAYtYaxIAH8XSmzjQBWQ_ywy3akdI";

    const supabase = createClient(SUPABASE_URL, SUPABASE_KEY);

    // Aggiorna il saluto in header usando la parte prima della "@" dell'email
    document.addEventListener("DOMContentLoaded", async () => {
      const { data: sessionData, error: sessionError } = await supabase.auth.getSession();
      if (sessionError || !sessionData || !sessionData.session) {
        document.querySelector('.greeting').textContent = "Ciao, Utente";
      } else {
        const userId = sessionData.session.user.id;
        const { data: tutor, error: tutorError } = await supabase
          .from("tutors")
          .select("name")
          .eq("auth_uid", userId)
          .single();
        if (tutorError || !tutor) {
          document.querySelector('.greeting').textContent = "Ciao, Utente";
        } else {
          document.querySelector('.greeting').textContent = `Ciao, ${tutor.name}`;
        }
      }
    });

    async function getTutorId() {
      const { data: userData, error: authError } = await supabase.auth.getUser();
      if (authError || !userData || !userData.user) {
          console.error("❌ Error getting authenticated tutor:", authError);
          alert("Session expired. Please log in again.");
          window.location.href = "login.html";
          return null;
      }
      const authUid = userData.user.id;
      const { data: tutorData, error: tutorError } = await supabase
          .from("tutors")
          .select("id")
          .eq("auth_uid", authUid)
          .single();
      if (tutorError || !tutorData) {
          console.error("❌ Error fetching tutor ID:", tutorError);
          alert("Tutor account not found.");
          window.location.href = "login.html";
      }
      return tutorData.id;
    }

    async function fetchStudents() {
      const tutorId = await getTutorId();
      if (!tutorId) return;
      // Now select also the "tests" column.
      const { data: students, error: studentError } = await supabase
          .from("students")
          .select("id, auth_uid, name, tests")
          .eq("tutor_id", tutorId);

      if (studentError) {
          console.error("❌ Error fetching students:", studentError);
          return;
      }
      displayStudentProgress(students);
    }

    async function displayStudentProgress(students) {
      const studentsContainer = document.getElementById("studentsContainer");
      studentsContainer.innerHTML = "";
      // For each student, create a container.
      for (const student of students) {
        const studentDiv = document.createElement("div");
        studentDiv.classList.add("student-progress");
        studentDiv.innerHTML = `<h3>${student.name}</h3>`;

        // For each test in the student's tests array, create a row with two buttons.
        if (student.tests && student.tests.length > 0) {
          student.tests.forEach(testOption => {
            const rowDiv = document.createElement("div");
            rowDiv.classList.add("test-row");
            // Optionally, display the test name.
            const testLabel = document.createElement("span");
            testLabel.textContent = testOption;
            testLabel.style.marginRight = "10px";
            rowDiv.appendChild(testLabel);

            // Button for "Visualizza test assegnati"
            const viewTestsBtn = document.createElement("button");
            viewTestsBtn.classList.add("viewTestsBtn");
            viewTestsBtn.textContent = "Visualizza test assegnati";
            viewTestsBtn.onclick = () => viewStudentTests(student.auth_uid, student.name, testOption);
            rowDiv.appendChild(viewTestsBtn);

            // Button for "Visualizza i risultati"
            const dashboardBtn = document.createElement("button");
            dashboardBtn.classList.add("dashboardBtn");
            dashboardBtn.textContent = "Visualizza i risultati";
            dashboardBtn.onclick = () => viewStudentDashboard(student.auth_uid, student.name, testOption);
            rowDiv.appendChild(dashboardBtn);

            studentDiv.appendChild(rowDiv);
          });
        } else {
          // If no tests are available.
          const noTests = document.createElement("p");
          noTests.textContent = "Nessun test disponibile";
          studentDiv.appendChild(noTests);
        }
        studentsContainer.appendChild(studentDiv);
      }
    }

    // Update the click handlers to also store the selected test.
    window.viewStudentTests = function (studentId, studentName, selectedTest) {
      sessionStorage.setItem("selectedStudentId", studentId);
      sessionStorage.setItem("selectedStudentName", studentName);
      sessionStorage.setItem("selectedTestType", selectedTest);
      window.location.href = "view_tests.html";
    };

    window.viewStudentDashboard = function (studentId, studentName, selectedTest) {
      sessionStorage.setItem("selectedStudentId", studentId);
      sessionStorage.setItem("selectedStudentName", studentName);
      sessionStorage.setItem("selectedTestType", selectedTest);
      window.location.href = "dashboard.html";
    };

    document.getElementById("logoutBtn").addEventListener("click", async () => {
      await supabase.auth.signOut();
      window.location.href = "login.html";
    });

    document.getElementById("modifyTestsBtn").addEventListener("click", () => {
      window.location.href = "modify_tests.html";
    });

    // New event listener to go to the "Assegna nuovi test" page.
    document.getElementById("assignTestsBtn").addEventListener("click", () => {
      window.location.href = "assign_tests.html";
    });

    fetchStudents();
  </script>
</body>
</html>