Update templates/teacher.html

templates/teacher.html

@@ -1016,7 +1016,7 @@
                 .then(response => response.json())
                 .then(data => {
                     const reportDiv = document.createElement('div');
-                    reportDiv.innerHTML = <h3>AI Generated Report</h3><p>${data.report}</p>;
+                    reportDiv.innerHTML = `<h3>AI Generated Report</h3><p>${data.report}</p>`;
                     studentExpandedInfo.appendChild(reportDiv);
                 })
                 .catch((error) => {
@@ -1043,11 +1043,11 @@
                     const numberOfSubjects = parseInt(this.value);
                     for (let i = 0; i < numberOfSubjects; i++) {
                         const subjectLabel = document.createElement('label');
-                        subjectLabel.textContent = Subject ${i + 1}:;
+                        subjectLabel.textContent = `Subject ${i + 1}:`;
 
                         const subjectInput = document.createElement('input');
                         subjectInput.type = 'text';
-                        subjectInput.name = subject_${i + 1};
+                        subjectInput.name = `subject_${i + 1}`;
                         subjectInput.required = true;
 
                         subjectsContainer.appendChild(subjectLabel);
@@ -1206,55 +1206,60 @@
             });
             
             </script>
-            <script>
-                // Extract weekly performance data from the template
-                const weeklyPerformanceData = JSON.parse('{{ teacher.weekly_class_performance|tojson|safe }}');
             
-                // Prepare data for Chart.js
-                const ctx = document.getElementById('performanceChart').getContext('2d');
-                const labels = Object.keys(weeklyPerformanceData);
-                const datasets = labels.map(label => ({
-                    label: label,
-                    data: weeklyPerformanceData[label],
-                    borderColor: getRandomColor(),
-                    fill: false
-                }));
-            
-                const performanceChart = new Chart(ctx, {
-                    type: 'line',
-                    data: {
-                        labels: Array.from({length: 7}, (_, i) => Week ${i + 1}),
-                        datasets: datasets
-                    },
-                    options: {
-                        responsive: true,
-                        scales: {
-                            x: {
-                                title: {
-                                    display: true,
-                                    text: 'Weeks'
-                                }
-                            },
-                            y: {
-                                title: {
-                                    display: true,
-                                    text: 'Performance Score'
-                                },
-                                beginAtZero: true
-                            }
-                        }
-                    }
-                });
-            
-                function getRandomColor() {
-                    const letters = '0123456789ABCDEF';
-                    let color = '#';
-                    for (let i = 0; i < 6; i++) {
-                        color += letters[Math.floor(Math.random() * 16)];
+
+<script>
+    // Extract weekly performance data from the template
+    const weeklyPerformanceData = JSON.parse('{{ teacher.weekly_class_performance|tojson|safe }}');
+
+    // Prepare data for Chart.js
+    const ctx = document.getElementById('performanceChart').getContext('2d');
+    const labels = Object.keys(weeklyPerformanceData);
+    const datasets = labels.map(label => ({
+        label: label,
+        data: weeklyPerformanceData[label],
+        borderColor: getRandomColor(),
+        fill: false
+    }));
+
+    const performanceChart = new Chart(ctx, {
+        type: 'line',
+        data: {
+            labels: Array.from({length: 7}, (_, i) => `Week ${i + 1}`),
+            datasets: datasets
+        },
+        options: {
+            responsive: true,
+            scales: {
+                x: {
+                    title: {
+                        display: true,
+                        text: 'Weeks'
                     }
-                    return color;
+                },
+                y: {
+                    title: {
+                        display: true,
+                        text: 'Performance Score'
+                    },
+                    beginAtZero: true
                 }
-            </script>
+            }
+        }
+    });
+
+    function getRandomColor() {
+        const letters = '0123456789ABCDEF';
+        let color = '#';
+        for (let i = 0; i < 6; i++) {
+            color += letters[Math.floor(Math.random() * 16)];
+        }
+        return color;
+    }
+</script>
+
+</body>
+</html>
 
             
 </body>