/* eslint-disable @next/next/no-img-element */ "use client"; import { X, ZoomIn, ZoomOut, Download, FileText } from "lucide-react"; import { useState } from "react"; import { RegQR, RegQRHidden } from "../QR/RegQR"; import { Student } from "../admin-students/types/admin-students.types"; // ── Helper: format ISO date → "08 Nov 1978" const formatDOB = (dob: string): string => { if (!dob) return "—"; try { const date = new Date(dob); if (isNaN(date.getTime())) return dob; return date.toLocaleDateString("en-GB", { day: "2-digit", month: "short", year: "numeric", }); } catch { return dob; } }; export const RegCardModal = ({ student, onClose }: { student: Student; onClose: () => void }) => { const [scale, setScale] = useState(1); const handleDownload = () => { const printWindow = window.open("", "_blank"); if (!printWindow) return; const today = new Date().toLocaleDateString("en-GB", { day: "2-digit", month: "short", year: "numeric", }); const qrSvgEl = document.getElementById("reg-qr-code"); const qrSvgString = qrSvgEl ? qrSvgEl.outerHTML : ""; printWindow.document.write(` Registration Card
Serial: ${student.studentId}
${qrSvgString}
Student Name
:
${student.name || "—"}
Father's Name
:
${student.fatherName || "—"}
Mother's Name
:
${student.motherName || "—"}
Date of Birth
:
${formatDOB(student.dob)}
Sex
:
${student.gender || "—"}
Name of the Institute
:
${student.institute || "—"}
Institute Code
:
${student.studentId?.slice(0, 6) || "—"}
Post Office
:
${student.thana || "—"}
Upazilla/Thana
:
${student.thana || "—"}
District
:
${student.district || "—"}
Trade Code & Name
:
${student.educationQualification || "—"}
Registration Number
:
${student.regNumber || "—"}
Session
:
${student.month1} - ${student.month2} ${student.year1}
Course Duration
:
${student.duration || "—"}
Note: This registration card is valid for six (6) months. For all communications with the board, the institute code, registration number and study session are to be mentioned.
Print Date: ${today}
`); printWindow.document.close(); }; const rows: [string, string | undefined][] = [ ["Student Name", student.name], ["Father's Name", student.fatherName], ["Mother's Name", student.motherName], ["Date of Birth", formatDOB(student.dob)], ["Sex", student.gender], ["Name of the Institute", student.institute], ["Institute Code", student.studentId?.slice(0, 6)], ["Post Office", student.thana], ["Upazilla/Thana", student.thana], ["District", student.district], ["Trade Code & Name", student.educationQualification], ["Registration Number", student.regNumber], ["Session", `${student.month1} - ${student.month2} ${student.year1}`], ["Course Duration", student.duration], ]; return (
{/* ── Header ── */}

Registration Card Preview

{student.name} · {student.studentId}

{Math.round(scale * 100)}%
{/* ── Preview area ── */}
{/* Serial */}

Serial: {student.studentId}

{/* Photo + QR — top right */}
{/* Info rows */}
{rows.map(([label, value], i) => (
{label} : {value || "—"}
))}
{/* Note */}
Note: This registration card is valid for six (6) months. For all communications with the board, the institute code, registration number and study session are to be mentioned. This registration card is generated by BTET ESHEBA (btetbd.com). The registration card must be printed in color.
{/* Print date */}
Print Date: {new Date().toLocaleDateString("en-GB", { day: "2-digit", month: "short", year: "numeric" })}
{/* ── Footer ── */}
); };