fix them de

management/src/components/ExamRoomWorkspace.tsx

@@ -77,8 +77,7 @@ export const ExamRoomWorkspace: React.FC<Props> = ({ examId, onBack }) => {
   const [searchHits, setSearchHits] = useState<{ studentRkId: number; fullName: string; studentCode: string; email: string; classCodes: string }[]>([]);
   const [selectedPickerRkIds, setSelectedPickerRkIds] = useState<number[]>([]);
   const [paperTitle, setPaperTitle] = useState('');
-  const [packagePdf, setPackagePdf] = useState<File | null>(null);
+  const [packagePdfs, setPackagePdfs] = useState<File[]>([]);
-  const [packageResources, setPackageResources] = useState<File[]>([]);
   const [creatingPackage, setCreatingPackage] = useState(false);
   const [sendSchedule, setSendSchedule] = useState('');
   const [msg, setMsg] = useState('');
@@ -294,21 +293,35 @@ export const ExamRoomWorkspace: React.FC<Props> = ({ examId, onBack }) => {
     }
   };
 
-  const createPackage = async () => {
+  const createPackagesBulk = async () => {
-    if (!packagePdf) {
+    if (!packagePdfs.length) {
-      setErr('Chọn file PDF cho gói đề');
+      setErr('Chọn ít nhất một file PDF đề chính');
       return;
     }
     setErr('');
     setCreatingPackage(true);
     try {
-      const title = paperTitle.trim() || packagePdf.name.replace(/\.pdf$/i, '') || 'Gói đề';
+      const prefix = paperTitle.trim();
-      const resCount = packageResources.length;
+      const createdTitle = packagePdfs.length === 1
-      await apiExam.uploadPackage(examId, title, packagePdf, packageResources);
+        ? (prefix || packagePdfs[0].name.replace(/\.pdf$/i, '') || 'Gói đề')
+        : '';
+      let created = 0;
+      for (let i = 0; i < packagePdfs.length; i++) {
+        const pdf = packagePdfs[i];
+        const baseName = pdf.name.replace(/\.pdf$/i, '') || 'Gói đề';
+        const title = packagePdfs.length === 1
+          ? (prefix || baseName)
+          : baseName;
+        await apiExam.uploadPackage(examId, title, pdf, []);
+        created++;
+      }
       setPaperTitle('');
-      setPackagePdf(null);
+      setPackagePdfs([]);
-      setPackageResources([]);
+      setMsg(
-      setMsg(`Đã tạo gói đề "${title}" (1 PDF${resCount ? ` + ${resCount} tài nguyên` : ''})`);
+        created === 1
+          ? `Đã tạo gói đề "${createdTitle}". Bổ sung tài nguyên bên dưới nếu cần.`
+          : `Đã tạo ${created} gói đề. Bổ sung tài nguyên cho từng gói bên dưới nếu cần.`,
+      );
       await load();
     } catch (e: any) {
       setErr(e?.message || 'Tạo gói đề thất bại');
@@ -317,6 +330,10 @@ export const ExamRoomWorkspace: React.FC<Props> = ({ examId, onBack }) => {
     }
   };
 
+  const removePackagePdf = (index: number) => {
+    setPackagePdfs((prev) => prev.filter((_, i) => i !== index));
+  };
+
   const uploadResource = async (paperId: number, e: React.ChangeEvent<HTMLInputElement>) => {
     const files = Array.from(e.target.files || []);
     if (!files.length) return;
@@ -805,7 +822,7 @@ export const ExamRoomWorkspace: React.FC<Props> = ({ examId, onBack }) => {
               <div className="config-card config-card-flat">
                 <div className="card-header-title">Gói đề & gửi cho sinh viên</div>
                 <p className="config-card-desc">
-                  Mỗi gói đề gồm <strong>1 file PDF</strong> (đề chính) và <strong>tài nguyên kèm</strong> (ảnh, zip, doc…). Chia ngẫu nhiên sẽ gán cả gói cho từng sinh viên.
+                  Chọn <strong>nhiều PDF đề chính</strong> cùng lúc để tạo gói hàng loạt. Sau đó bổ sung <strong>tài nguyên kèm</strong> (ảnh, zip, doc…) cho từng gói bên dưới.
                 </p>
                 {!canModifyPapers && (
                   <p className="config-card-desc" style={{ color: 'var(--danger)' }}>
@@ -816,44 +833,61 @@ export const ExamRoomWorkspace: React.FC<Props> = ({ examId, onBack }) => {
                   <div style={{ display: 'flex', flexDirection: 'column', gap: '0.65rem', marginBottom: '0.75rem' }}>
                     <input
                       className="search-input"
-                      placeholder="Tên gói đề (VD: Gói A)"
+                      placeholder="Tên gói đề (tùy chọn, chỉ khi tạo 1 PDF)"
                       value={paperTitle}
                       onChange={(e) => setPaperTitle(e.target.value)}
                     />
                     <label className="login-field">
-                      <span>PDF đề chính (bắt buộc)</span>
+                      <span>PDF đề chính (chọn nhiều file)</span>
                       <input
                         type="file"
                         accept=".pdf"
-                        onChange={(e) => setPackagePdf(e.target.files?.[0] || null)}
-                      />
-                    </label>
-                    <label className="login-field">
-                      <span>Tài nguyên kèm (tùy chọn, many files)</span>
-                      <input
-                        type="file"
                         multiple
-                        onChange={(e) => setPackageResources(Array.from(e.target.files || []))}
+                        onChange={(e) => {
+                          const files = Array.from(e.target.files || []).filter((f) => /\.pdf$/i.test(f.name));
+                          if (!files.length) {
+                            setPackagePdfs([]);
+                            return;
+                          }
+                          setPackagePdfs(files);
+                          e.target.value = '';
+                        }}
                       />
                     </label>
-                    {packageResources.length > 0 && (
+                    {packagePdfs.length > 0 && (
-                      <p className="config-card-desc" style={{ margin: 0 }}>
+                      <div style={{ display: 'flex', flexDirection: 'column', gap: '0.35rem' }}>
-                        {packageResources.length} tài nguyên: {packageResources.map((f) => f.name).join(', ')}
+                        <p className="config-card-desc" style={{ margin: 0 }}>
-                      </p>
+                          Đã chọn {packagePdfs.length} PDF — mỗi file sẽ thành 1 gói đề:
+                        </p>
+                        <ul className="config-card-desc" style={{ margin: 0, paddingLeft: '1.1rem' }}>
+                          {packagePdfs.map((f, i) => (
+                            <li key={`${f.name}-${i}`} style={{ display: 'flex', justifyContent: 'space-between', gap: '0.5rem', alignItems: 'center' }}>
+                              <span>📄 {paperTitle.trim() && packagePdfs.length === 1 ? paperTitle.trim() : f.name.replace(/\.pdf$/i, '')}</span>
+                              <button type="button" className="btn btn-ghost btn-sm" onClick={() => removePackagePdf(i)}>
+                                Bỏ
+                              </button>
+                            </li>
+                          ))}
+                        </ul>
+                      </div>
                     )}
                     <button
                       type="button"
                       className="btn btn-primary"
                       style={{ width: '100%' }}
-                      disabled={creatingPackage || !packagePdf}
+                      disabled={creatingPackage || packagePdfs.length === 0}
-                      onClick={createPackage}
+                      onClick={createPackagesBulk}
                     >
-                      {creatingPackage ? 'Đang tạo...' : 'Tạo gói đề'}
+                      {creatingPackage
+                        ? 'Đang tạo...'
+                        : packagePdfs.length > 1
+                          ? `Tạo ${packagePdfs.length} gói đề`
+                          : 'Tạo gói đề'}
                     </button>
                   </div>
                 )}
                 {papers.length === 0 ? (
-                  <p className="config-card-desc">Chưa có gói đề. Tạo gói gồm PDF + tài nguyên.</p>
+                  <p className="config-card-desc">Chưa có gói đề. Chọn nhiều PDF để tạo hàng loạt.</p>
                 ) : (
                   <div style={{ display: 'flex', flexDirection: 'column', gap: '0.65rem' }}>
                     {papers.map((p) => (

management/src/components/WorkspaceSeatingChart.tsx

@@ -422,8 +422,8 @@ export const WorkspaceSeatingChart: React.FC<WorkspaceSeatingChartProps> = ({
                   </button>
                 )}
                 <StudentAvatar fullName={student.fullName} avatar={student.avatar} isOnline={isOnline} size={40} />
-                <span className="seating-seat-name">
+                <span className="seating-seat-name" title={student.fullName}>
-                  {student.fullName.split(' ').pop()}
+                  {student.fullName}
                 </span>
                 <span className="seating-seat-code">
                   {student.studentCode}

management/src/index.css

@@ -2582,8 +2582,8 @@ input:checked + .slider:before {
 }
 
 .seating-grid-board {
-  --seating-cell-min-width: 136px;
+  --seating-cell-min-width: 148px;
-  --seating-cell-min-height: 156px;
+  --seating-cell-min-height: 176px;
   display: grid;
   gap: 10px;
   flex: 1;
@@ -2646,15 +2646,19 @@ input:checked + .slider:before {
 }
 
 .seating-seat-name {
-  font-size: 0.8rem;
+  font-size: 0.72rem;
   font-weight: 700;
   margin-top: 2px;
-  white-space: nowrap;
+  white-space: normal;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
   overflow: hidden;
-  text-overflow: ellipsis;
+  word-break: break-word;
   width: 100%;
   padding: 0 2px;
-  line-height: 1.2;
+  line-height: 1.25;
+  max-height: 3.75em;
 }
 
 .seating-seat-code {