feat: thêm hạn nộp quiz và cải thiện at-risk scoring

- Thêm field due_at cho quiz với deadline validation
- Cải thiện at-risk scoring: tăng thresholds (warning: 4.0, critical: 7.5)
- Preserves score_breakdown và weights_applied cho UI display
- Hiển thị chi tiết tín hiệu risk: vắng mặt, stuck, unanswered questions, frustration
- Update UI QuizWorkflow với datetime picker cho hạn nộp
- Cải thiện RiskCard hiển thị score breakdown với điểm chi tiết từng nguồn
- Thêm migration files cho changes

src/components/ta/QuizWorkflow.jsx

@@ -115,6 +115,7 @@ const QuizWorkflow = ({ quizId, spaceId, onBack, onSave, onSend, onViewResults }
     description: quiz.description,
     status: quiz.status,
     passing_score: quiz.passing_score || 60,
+    due_at: quiz.due_at || null,
     questions: questions.map(toQuestionPayload)
   });
 
@@ -287,6 +288,17 @@ const QuizWorkflow = ({ quizId, spaceId, onBack, onSave, onSend, onViewResults }
               <span style={{ fontSize: '24px', fontWeight: 700, color: 'var(--primary)', fontFamily: 'inherit' }}>%</span>
             </div>
           </div>
+          <div>
+            <label style={{ display: 'block', fontSize: '11px', fontWeight: 700, color: 'var(--text-muted)', textTransform: 'uppercase', marginBottom: '8px', fontFamily: 'inherit' }}>Hạn nộp</label>
+            <input
+              className="ta-input"
+              type="datetime-local"
+              value={quiz.due_at || ''}
+              onChange={(e) => setQuiz({ ...quiz, due_at: e.target.value || null })}
+              placeholder="Chọn hạn nộp..."
+            />
+            <div style={{ fontSize: '10px', color: 'var(--text-muted)', marginTop: '4px' }}>Để trống nếu không giới hạn</div>
+          </div>
           <div>
             <label style={{ display: 'block', fontSize: '11px', fontWeight: 700, color: 'var(--text-muted)', textTransform: 'uppercase', marginBottom: '8px', fontFamily: 'inherit' }}>Trạng thái</label>
             <select

src/components/ta/RiskCard.jsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { FiClock, FiMessageSquare, FiCheckCircle, FiUser, FiBarChart2, FiInfo } from 'react-icons/fi';
+import { FiClock, FiMessageSquare, FiCheckCircle, FiUser, FiBarChart2, FiInfo, FiZap } from 'react-icons/fi';
 
 const RiskCard = ({ student, spaceName, onResolve, onGetContext, formatOfflineTime }) => {
   const [showBreakdown, setShowBreakdown] = useState(false);
@@ -7,17 +7,16 @@ const RiskCard = ({ student, spaceName, onResolve, onGetContext, formatOfflineTi
   const score = student.metadata?.score || 0;
   const level = student.level || (score >= 6 ? 'critical' : score >= 3 ? 'warning' : 'safe');
 
-  const signals = student.metadata?.signals || {};
+  const signals = student.metadata?.signal_details || student.metadata?.signals || {};
   const absencePoints = signals.absence_points || 0;
   const stuckPoints = signals.stuck_points || 0;
   const quizAvg = signals.quiz_avg_score !== undefined ? signals.quiz_avg_score : null;
 
-  // Score breakdown from 3 sources
-  const breakdown = student.score_breakdown || {
-    last_seen_normalized: 0,
-    fastapi_normalized: 0,
-    quiz_normalized: 0
-  };
+  // Score breakdown from 3 sources - use nullish coalescing for missing fields
+  const breakdown = student.score_breakdown || {};
+  const lastSeenNormalized = breakdown.last_seen_normalized ?? 0;
+  const fastApiNormalized = breakdown.fastapi_normalized ?? 0;
+  const quizNormalized = breakdown.quiz_normalized ?? 0;
 
   const riskColor = level === 'critical' ? 'var(--ta-red)' : level === 'warning' ? 'var(--ta-amber)' : 'var(--ta-green)';
   const riskLabel = level === 'critical' ? 'Nghiêm trọng' : level === 'warning' ? 'Cần chú ý' : 'An toàn';
@@ -73,17 +72,27 @@ const RiskCard = ({ student, spaceName, onResolve, onGetContext, formatOfflineTi
         <div style={{ display: 'flex', gap: '4px', flexWrap: 'wrap' }}>
           {absencePoints > 0 && (
             <span style={{ fontSize: '10px', padding: '2px 6px', borderRadius: '4px', background: 'var(--ta-amber-bg)', color: 'var(--ta-amber)', fontWeight: 600 }}>
-              <FiClock size={10} style={{ verticalAlign: 'middle', marginRight: '2px' }} />Vắng {Math.floor(student.hours_since_active || 0)}h
+              <FiClock size={10} style={{ verticalAlign: 'middle', marginRight: '2px' }} />Vắng {Math.floor(student.hours_since_active || 0)}h ({absencePoints}đ)
             </span>
           )}
           {stuckPoints > 0 && (
             <span style={{ fontSize: '10px', padding: '2px 6px', borderRadius: '4px', background: 'var(--ta-blue-bg)', color: 'var(--ta-blue)', fontWeight: 600 }}>
-              <FiMessageSquare size={10} style={{ verticalAlign: 'middle', marginRight: '2px' }} />Khó khăn
+              <FiMessageSquare size={10} style={{ verticalAlign: 'middle', marginRight: '2px' }} />Stuck ({stuckPoints}đ)
             </span>
           )}
-          {quizAvg !== null && quizAvg < 70 && (
+          {signals.unanswered_q_points > 0 && (
             <span style={{ fontSize: '10px', padding: '2px 6px', borderRadius: '4px', background: 'var(--ta-purple-bg)', color: 'var(--ta-purple)', fontWeight: 600 }}>
-              <FiBarChart2 size={10} style={{ verticalAlign: 'middle', marginRight: '2px' }} />Điểm {quizAvg.toFixed(0)}
+              <FiMessageSquare size={10} style={{ verticalAlign: 'middle', marginRight: '2px' }} />Chưa trả lời ({signals.unanswered_q_points}đ)
+            </span>
+          )}
+          {signals.frustration_points > 0 && (
+            <span style={{ fontSize: '10px', padding: '2px 6px', borderRadius: '4px', background: 'var(--ta-red-bg)', color: 'var(--ta-red)', fontWeight: 600 }}>
+              <FiZap size={10} style={{ verticalAlign: 'middle', marginRight: '2px' }} />Frustration ({signals.frustration_points}đ)
+            </span>
+          )}
+          {quizAvg !== null && quizAvg < 70 && (
+            <span style={{ fontSize: '10px', padding: '2px 6px', borderRadius: '4px', background: 'var(--ta-green-bg)', color: 'var(--ta-green)', fontWeight: 600 }}>
+              <FiBarChart2 size={10} style={{ verticalAlign: 'middle', marginRight: '2px' }} />Quiz: {quizAvg.toFixed(0)}
             </span>
           )}
         </div>
@@ -120,13 +129,13 @@ const RiskCard = ({ student, spaceName, onResolve, onGetContext, formatOfflineTi
             <div style={{ marginBottom: '6px' }}>
               <div style={{ display: 'flex', justifyContent: 'space-between', fontSize: '10px', marginBottom: '2px' }}>
                 <span>Vắng mặt</span>
-                <span>{breakdown.last_seen_normalized?.toFixed(1)} / 10</span>
+                <span>{lastSeenNormalized.toFixed(1)} / 10</span>
               </div>
               <div style={{ height: '6px', background: 'var(--border-primary)', borderRadius: '3px', overflow: 'hidden' }}>
                 <div style={{
-                  width: `${(breakdown.last_seen_normalized || 0) * 10}%`,
+                  width: `${lastSeenNormalized * 10}%`,
                   height: '100%',
-                  background: getScoreBarColor(breakdown.last_seen_normalized || 0, 'last_seen')
+                  background: getScoreBarColor(lastSeenNormalized, 'last_seen')
                 }} />
               </div>
             </div>
@@ -135,13 +144,13 @@ const RiskCard = ({ student, spaceName, onResolve, onGetContext, formatOfflineTi
             <div style={{ marginBottom: '6px' }}>
               <div style={{ display: 'flex', justifyContent: 'space-between', fontSize: '10px', marginBottom: '2px' }}>
                 <span>Tín hiệu chat</span>
-                <span>{breakdown.fastapi_normalized?.toFixed(1)} / 10</span>
+                <span>{fastApiNormalized.toFixed(1)} / 10</span>
               </div>
               <div style={{ height: '6px', background: 'var(--border-primary)', borderRadius: '3px', overflow: 'hidden' }}>
                 <div style={{
-                  width: `${(breakdown.fastapi_normalized || 0) * 10}%`,
+                  width: `${fastApiNormalized * 10}%`,
                   height: '100%',
-                  background: getScoreBarColor(breakdown.fastapi_normalized || 0, 'fastapi')
+                  background: getScoreBarColor(fastApiNormalized, 'fastapi')
                 }} />
               </div>
             </div>
@@ -150,13 +159,13 @@ const RiskCard = ({ student, spaceName, onResolve, onGetContext, formatOfflineTi
             <div style={{ marginBottom: '8px' }}>
               <div style={{ display: 'flex', justifyContent: 'space-between', fontSize: '10px', marginBottom: '2px' }}>
                 <span>Điểm Quiz</span>
-                <span>{breakdown.quiz_normalized?.toFixed(1)} / 10</span>
+                <span>{quizNormalized.toFixed(1)} / 10</span>
               </div>
               <div style={{ height: '6px', background: 'var(--border-primary)', borderRadius: '3px', overflow: 'hidden' }}>
                 <div style={{
-                  width: `${(breakdown.quiz_normalized || 0) * 10}%`,
+                  width: `${quizNormalized * 10}%`,
                   height: '100%',
-                  background: getScoreBarColor(breakdown.quiz_normalized || 0, 'quiz')
+                  background: getScoreBarColor(quizNormalized, 'quiz')
                 }} />
               </div>
             </div>