update application page, table.

src/components/common/ComponentCard.tsx

@@ -5,6 +5,7 @@ interface ComponentCardProps {
   children: React.ReactNode;
   className?: string; // Additional custom classes for styling
   desc?: string; // Description text
+  headerAction?: React.ReactNode;
 }
 
 const ComponentCard: React.FC<ComponentCardProps> = ({
@@ -12,13 +13,14 @@ const ComponentCard: React.FC<ComponentCardProps> = ({
   children,
   className = "",
   desc = "",
+  headerAction,
 }) => {
   return (
     <div
       className={`rounded-2xl border border-gray-200 bg-white dark:border-gray-800 dark:bg-white/[0.03] ${className}`}
     >
       {/* Card Header */}
-      <div className="px-6 py-5">
+      <div className="px-6 py-5 flex items-center justify-between">
         <h3 className="text-base font-medium text-gray-800 dark:text-white/90">
           {title}
         </h3>
@@ -27,8 +29,9 @@ const ComponentCard: React.FC<ComponentCardProps> = ({
             {desc}
           </p>
         )}
+        {headerAction && <div>{headerAction}</div>}
       </div>
-
+      
       {/* Card Body */}
       <div className="p-4 border-t border-gray-100 dark:border-gray-800 sm:p-6">
         <div className="space-y-6">{children}</div>

src/components/tables/ApplicationDetailModal.tsx

@@ -9,6 +9,8 @@ import {
   apiUpdateApplicationStatus,
 } from "@/service/adminService";
 import { getMediaById } from "@/service/mediaService";
+import Link from "next/link";
+import { URL_MEDIA } from "../../../api";
 
 interface Props {
   isOpen: boolean;
@@ -23,6 +25,7 @@ export default function ApplicationDetailModal({
   application,
   onRefresh,
 }: Props) {
+
   const [userData, setUserData] = useState<any>(null);
   const [mediaList, setMediaList] = useState<any[]>([]);
   const [reviewNote, setReviewNote] = useState("");
@@ -46,7 +49,7 @@ export default function ApplicationDetailModal({
     try {
       const userRes = await apiGetUserById(application.user_id);
 
-      console.log("User data:", userRes);
+      // console.log("User data:", userRes);
 
       if (userRes?.data) setUserData(userRes.data);
 
@@ -55,7 +58,7 @@ export default function ApplicationDetailModal({
           getMediaById(m.id),
         );
         const mediaResponses = await Promise.all(mediaPromises);
-      
+
         setMediaList(mediaResponses.map((res) => res?.data || res));
       }
     } catch (error) {
@@ -83,7 +86,7 @@ export default function ApplicationDetailModal({
         status: status,
         review_note: reviewNote,
       };
-
+      // console.log("Payload gửi lên API:", payload, "Application ID:", application.id);
       await apiUpdateApplicationStatus(application.id, payload);
 
       Swal.fire(
@@ -115,7 +118,6 @@ export default function ApplicationDetailModal({
     if (isImage || isPdf) {
       window.open(media.url, "_blank");
     } else {
-    
       const link = document.createElement("a");
       link.href = media.url;
       link.download = media.original_name || "download";
@@ -124,6 +126,9 @@ export default function ApplicationDetailModal({
       document.body.removeChild(link);
     }
   };
+
+  // console.log("ApplicationDetailModal:", application);
+
   return (
     <div className="fixed inset-0 z-[9999] flex items-center justify-center p-4 bg-black/60 backdrop-blur-sm">
       <div className="w-full max-w-4xl max-h-[90vh] bg-white rounded-2xl shadow-xl dark:bg-gray-900 flex flex-col overflow-hidden">
@@ -186,15 +191,12 @@ export default function ApplicationDetailModal({
                     </p>
                     <div className="mt-1">
                       <span className="px-2 py-0.5 text-[10px] font-medium tracking-wide text-blue-600 bg-blue-100 rounded-full dark:bg-blue-500/20 dark:text-blue-400">
-                        {application.verify_type === 1
-                          ? "CĂN CƯỚC CÔNG DÂN"
-                          : "BẰNG CẤP / KHÁC"}
+                        {application.verify_type}
                       </span>
                     </div>
                   </div>
                 </div>
               </div>
-
               <div>
                 <h4 className="mb-3 text-sm font-bold text-gray-500 uppercase">
                   Nội dung ứng tuyển
@@ -245,8 +247,8 @@ export default function ApplicationDetailModal({
                               </span>
                             </div>
                           )}
-                          
-                          <button
+
+                          {/* <button
                             onClick={() => handleOpenFile(media)}
                             className="absolute inset-0 flex items-center justify-center transition-opacity bg-black/50 opacity-0 group-hover:opacity-100"
                           >
@@ -255,7 +257,12 @@ export default function ApplicationDetailModal({
                                 ? "Xem ảnh"
                                 : "Tải tài liệu"}
                             </span>
-                          </button>
+                          </button> */}
+                          <Link
+                            className="absolute inset-0 flex items-center justify-center transition-opacity bg-black/50 opacity-0 group-hover:opacity-100"
+                            href={`${URL_MEDIA}${media.storage_key}`}
+                            target="_blank"
+                          ></Link>
                         </div>
                       );
                     })}

src/components/tables/ApplicationTable.tsx

@@ -122,7 +122,7 @@ export default function ApplicationTable({
             <TableHeader className="border-b border-gray-100 dark:border-white/[0.05]">
               <TableRow>
                 <TableCell isHeader className="px-5 py-3 font-medium text-gray-500 text-start text-theme-xs dark:text-gray-400">
-                  Người dùng (ID)
+                  Người gửi (ID)
                 </TableCell>
                 <TableCell isHeader className="px-5 py-3 font-medium text-gray-500 text-start text-theme-xs dark:text-gray-400 min-w-[220px]">
                   Loại xác minh