@tinyweb_dev/oe-exam-sdk 0.1.8 → 0.1.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/exams/entry/StudentExamEntryPageContainer.d.ts +4 -2
- package/dist/components/exams/entry/StudentExamEntryPageContainer.js +1 -1
- package/dist/components/exams/take/ExamTakingPageContainer.d.ts +4 -2
- package/dist/components/exams/take/ExamTakingPageContainer.js +1 -1
- package/dist/components/features/exam-entry/themed/CambridgeYleWaitingRoom.js +1 -1
- package/dist/components/features/exam-entry/themed/cambridge-yle-waiting-parts.js +1 -1
- package/dist/components/results/ResultReviewPageContainer.js +1 -1
- package/dist/components/themes/cambridge-yle/CambridgeYleSidebar.js +1 -1
- package/package.json +1 -1
|
@@ -7,8 +7,10 @@ export interface StudentExamEntryPageContainerProps {
|
|
|
7
7
|
inviteToken?: string | null;
|
|
8
8
|
/** API adapter; create one via `createExamEntryApi`. */
|
|
9
9
|
api: ExamEntrySdkApi;
|
|
10
|
-
/** Navigation callback; falls back to `window.location.href` when omitted. */
|
|
11
|
-
onNavigate?: (href: string
|
|
10
|
+
/** Navigation callback; falls back to `window.location.href`/`replace` when omitted. */
|
|
11
|
+
onNavigate?: (href: string, options?: {
|
|
12
|
+
replace?: boolean;
|
|
13
|
+
}) => void;
|
|
12
14
|
/** Path to navigate to when starting/continuing the attempt. */
|
|
13
15
|
takePath?: (roomId: string) => string;
|
|
14
16
|
/** Path to navigate to on close/back. Overrides the default contest/discover logic. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,Fragment as t,jsxs as a}from"react/jsx-runtime";import{useState as r,useEffect as n,useCallback as i,useMemo as o}from"react";import{Dialog as s,DialogContent as l,DialogDescription as d,DialogTitle as c}from"../../../components/ui/dialog";import{t as m}from"../../../shared/lib/i18n";import{ROUTES as h}from"../../../shared/constants/routes";import{normalizeExamTheme as x,resolveThemeConfig as u}from"../../../shared/lib/themes";import{unwrap as p}from"../take/exam-taking.utils";import{toast as g}from"sonner";import{Loader2 as b,Clock as f,Trophy as v,ArrowLeft as w}from"lucide-react";import y from"next/image";import{BeforeStartCard as N,ExpiredCard as _,AlreadySubmittedCard as k}from"../../../components/features/exam-entry";import{CloseButton as T}from"../../../components/features/exam-entry/themed/components";import{ToeicWaitingRoom as E}from"../../../components/features/exam-entry/themed/ToeicWaitingRoom";import{CambridgeYleWaitingRoom as D}from"../../../components/features/exam-entry/themed/CambridgeYleWaitingRoom";import{SummerSkyWaitingRoom as S}from"../../../components/themes/summer-sky/SummerSkyWaitingRoom";import{FullscreenLoading as R}from"./fullscreen-loading";export function StudentExamEntryPageContainer({roomId:I,inviteToken:A=null,api:O,onNavigate:M,takePath:C=e=>`/student/exams/${e}/take`,closePath:B,renderRegistrationForm:W}){const L=i(e=>{M?M(e):"undefined"!=typeof window&&(window.location.href=e)},[M]),[j,F]=r(null),[z,U]=r(null),[$,P]=r("LOADING"),[X,Y]=r(0),[H,V]=r(5),[G,K]=r(!1),[Q,q]=r(!1),[J,Z]=r(null),[ee,te]=r(!1),[ae,re]=r(!1),[ne,ie]=r(!1),oe=o(()=>{const e=j?.exam?.theme,t=j?.exam?.template?.theme;return u({examTheme:e,templateTheme:t,level:j?.exam?.level})},[j?.exam,I,j]),se=o(()=>B?B(j):j?.contest?.id?h.STUDENT.CONTEST_ROOMS(j.contest.id):h.STUDENT.CONTESTS_DISCOVER,[B,j]),le=i((e,t)=>{const a=!0===e.allowMultipleSubmissions;if(t){const e=t.status;if("SUBMITTED"===e||"GRADED"===e||"PUBLISHED"===e)return a?"WITHIN_WINDOW":"ALREADY_SUBMITTED";if("IN_PROGRESS"===e)return"WITHIN_WINDOW"}const r=(new Date).getTime(),n=e.startDatetime?new Date(e.startDatetime).getTime():null,i=e.endDatetime?new Date(e.endDatetime).getTime():null;return!a&&i&&r>i?"EXPIRED":n&&r<n?"BEFORE_START":"WITHIN_WINDOW"},[]);n(()=>{(async()=>{try{if(A)try{await(O.joinViaInvite?.(I,A))}catch{}const e=await O.getRoom(I),t=p(e);if(F(t),!t.canAccess&&!A)return void P("NO_ACCESS");if(t.registrationFormConfig?.enabled&&t.registrationFormConfig.fields?.length>0&&!t.hasSubmittedFormData)return void re(!0);if(!t.exam)return void P("NO_EXAM");const a=await O.getActiveAttemptByRoom(I),r=p(a);r&&(Z(r),U(r));const n=!0===t.allowMultipleSubmissions;if(t.hasJoined&&!r&&!n)return void P("ALREADY_SUBMITTED");const i=le(t,r??null);if(P(i),"BEFORE_START"===i&&t.startDatetime){const e=new Date(t.startDatetime).getTime(),a=(new Date).getTime();Y(Math.max(0,Math.floor((e-a)/1e3)))}}catch(e){console.error("Failed to load room data:",e),g.error(m("student.exam.entry.loadError"))}})()},[I,A,le]),n(()=>{if("BEFORE_START"!==$||X<=0)return;const e=setInterval(()=>{Y(e=>e<=1?(P("WITHIN_WINDOW"),0):e-1)},1e3);return()=>clearInterval(e)},[$,X]);const de=i(async()=>{try{K(!0),await O.startAttempt(I),L(C(I))}catch(e){const t=e,a=t.response?.data?.errorCode;"ROOM_NO_EXAM"===a?P("NO_EXAM"):"ROOM_NOT_STARTED"===a?(g.error(m("student.exam.entry.notStarted")),P("BEFORE_START"),q(!1),V(5)):"ROOM_ENDED"===a?(g.error(m("student.exam.entry.expired")),P("EXPIRED")):"ATTEMPT_ALREADY_SUBMITTED"===a?(g.error("Bạn đã hoàn thành bài thi này rồi."),P("ALREADY_SUBMITTED")):g.error(m("student.exam.entry.startError")),K(!1)}},[I]),ce=i(()=>{J?te(!0):de()},[J,de]),me=i(()=>{te(!1),g.success(m("student.exam.entry.continue")),L(C(I))},[I]),he=i(async()=>{if(J)try{te(!1),K(!0),await O.deleteAttempt(J.id),Z(null),await de()}catch(e){console.error("Failed to restart attempt:",e),g.error(m("student.exam.entry.restartError")),K(!1)}},[J,de]);n(()=>{if(!Q||H<=0)return;const e=setInterval(()=>{V(e=>e<=1?(L(C(I)),0):e-1)},1e3);return()=>clearInterval(e)},[Q,H,I]);const xe=i(async e=>{if(j?.contest?.id){ie(!0);try{await(O.registerContest?.(j.contest.id,e)),re(!1);const t=await O.getRoom(I),a=p(t);if(F(a),!a.exam)return void P("NO_EXAM");const r=await O.getActiveAttemptByRoom(I),n=p(r);n&&(Z(n),U(n));const i=!0===a.allowMultipleSubmissions;if(a.hasJoined&&!n&&!i)return void P("ALREADY_SUBMITTED");const o=le(a,n??null);if(P(o),"BEFORE_START"===o&&a.startDatetime){const e=new Date(a.startDatetime).getTime(),t=(new Date).getTime();Y(Math.max(0,Math.floor((e-t)/1e3)))}}catch{g.error("Không thể gửi thông tin đăng ký. Vui lòng thử lại.")}finally{ie(!1)}}},[j?.contest?.id,I,le]);if(ae&&j?.registrationFormConfig&&W)return a(t,{children:[e(R,{}),W({room:j,onSubmit:xe,isSubmitting:ne})]});if("LOADING"===$)return e(R,{});if("NO_EXAM"===$)return e("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden bg-gradient-to-b from-sky-100 via-blue-50 to-indigo-100",children:a("div",{className:"mx-auto max-w-md p-4 text-center",children:[e("div",{className:"mb-6 text-7xl",children:"📝✨"}),e("h2",{className:"mb-3 text-2xl font-bold text-sky-700",children:"Bài thi đang được chuẩn bị"}),j&&a("div",{className:"mb-4 rounded-xl bg-white/60 px-5 py-3 text-left text-sm text-sky-700 shadow-sm backdrop-blur-sm",children:[e("p",{className:"font-semibold text-base",children:j.name}),j.code&&a("p",{className:"mt-1 text-sky-500",children:["Mã phòng: ",e("span",{className:"font-mono font-medium",children:j.code})]}),(j.startDatetime||j.endDatetime)&&a("p",{className:"mt-1 text-sky-500",children:["Thời gian thi:"," ",j.startDatetime?new Date(j.startDatetime).toLocaleString("vi-VN"):"—"," → ",j.endDatetime?new Date(j.endDatetime).toLocaleString("vi-VN"):"—"]})]}),e("p",{className:"mb-6 text-base text-sky-600",children:"Thầy cô đang chuẩn bị đề thi cho phòng này. Bạn quay lại sau nhé! 😊"}),e("button",{className:"mx-auto inline-flex items-center gap-2 rounded-2xl border-b-4 border-sky-600 bg-sky-500 px-8 py-3 text-lg font-bold text-white shadow-md transition-all hover:brightness-110 active:translate-y-0.5 active:border-b-2 active:shadow-sm",onClick:()=>window.history.back(),children:"← Quay lại"})]})});if("NO_ACCESS"===$)return e("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden bg-gradient-to-b from-red-50 via-orange-50 to-amber-50",children:a("div",{className:"mx-auto max-w-md p-4 text-center",children:[e("div",{className:"mb-6 text-7xl",children:"🔒"}),e("h2",{className:"mb-3 text-2xl font-bold text-red-600",children:"Không có quyền truy cập"}),e("p",{className:"mb-6 text-base text-red-500",children:"Bạn chưa được đăng ký vào phòng thi này. Hãy liên hệ thầy cô để được thêm vào phòng thi nhé!"}),e("button",{className:"mx-auto inline-flex items-center gap-2 rounded-2xl border-b-4 border-red-600 bg-red-500 px-8 py-3 text-lg font-bold text-white shadow-md transition-all hover:brightness-110 active:translate-y-0.5 active:border-b-2 active:shadow-sm",onClick:()=>window.history.back(),children:"← Quay lại"})]})});const ue="TOEIC"===j?.exam?.template?.subTitle,pe="SUMMER_SKY"===x(j?.exam?.theme||j?.exam?.template?.theme);if("WITHIN_WINDOW"===$&&j)return a(t,{children:[ue?e(E,{room:j,onStart:ce,isStarting:G,showCountdown:Q,autoStartCountdown:H,closeRedirectUrl:se,onClose:()=>{L(se)}}):pe?e(S,{room:j,onStart:ce,isStarting:G,onExit:()=>{L(se)}}):e(D,{room:j,onStart:ce,isStarting:G,showCountdown:Q,autoStartCountdown:H,closeRedirectUrl:se,onClose:()=>{L(se)}}),e(s,{open:ee,onOpenChange:te,children:e(l,{className:"overflow-visible border-0 bg-transparent p-0 shadow-none sm:max-w-md",children:a("div",{className:"relative overflow-visible rounded-[28px] bg-gradient-to-br from-cyan-300/25 via-white/5 to-white/0 p-px shadow-[0_30px_80px_-20px_rgba(10,75,140,0.85)] backdrop-blur-xl",children:[e("div",{className:"pointer-events-none absolute -left-16 -top-16 h-48 w-48 rounded-full bg-cyan-400/35 blur-3xl"}),e("div",{className:"pointer-events-none absolute -right-16 -bottom-16 h-48 w-48 rounded-full bg-sky-500/30 blur-3xl"}),e("div",{className:"pointer-events-none absolute left-1/2 top-0 h-24 w-1/2 -translate-x-1/2 rounded-full bg-cyan-300/15 blur-2xl"}),a("div",{className:"relative overflow-hidden rounded-[calc(28px-1px)] bg-gradient-to-b from-[#0e3d70]/97 via-[#0a4b8c]/97 to-[#072d54]/97 ring-1 ring-cyan-300/25",children:[e("div",{className:"pointer-events-none absolute inset-0 opacity-[0.04]",style:{backgroundImage:"radial-gradient(circle at 1px 1px, white 1px, transparent 0)",backgroundSize:"24px 24px"}}),e("div",{className:"pointer-events-none absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-cyan-300/40 to-transparent"}),a("div",{className:"relative flex flex-col items-center gap-4 px-8 pt-10 pb-6",children:[a("div",{className:"relative",children:[e("div",{className:"absolute inset-0 animate-ping rounded-full bg-cyan-300/30",style:{animationDuration:"2.8s"}}),e("div",{className:"absolute -inset-3 rounded-full bg-gradient-to-br from-cyan-300/15 to-sky-500/10 blur-md"}),e("div",{className:"absolute -inset-1.5 rounded-full bg-gradient-to-br from-cyan-200/30 to-sky-400/20"}),e("div",{className:"relative flex h-16 w-16 items-center justify-center rounded-full bg-gradient-to-br from-cyan-300 via-sky-500 to-sky-700 shadow-[0_10px_30px_-6px_rgba(34,211,238,0.7),inset_0_2px_4px_rgba(255,255,255,0.4)] ring-[3px] ring-cyan-200/40",children:a("svg",{className:"h-8 w-8 text-white drop-shadow-[0_2px_3px_rgba(0,0,0,0.3)]",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:[e("path",{d:"M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"}),e("line",{x1:"12",y1:"9",x2:"12",y2:"13"}),e("line",{x1:"12",y1:"17",x2:"12.01",y2:"17"})]})})]}),a("div",{className:"flex flex-col items-center gap-2",children:[e(c,{className:"text-center text-xl font-black tracking-tight text-white drop-shadow-[0_2px_8px_rgba(34,211,238,0.4)]",children:"Bạn đang có bài thi dở"}),e(d,{className:"max-w-sm text-center text-[13px] font-medium leading-relaxed text-cyan-100/75",children:"Bạn đã bắt đầu làm bài thi này trước đó. Bạn muốn tiếp tục làm bài hay bắt đầu lại từ đầu?"})]})]}),e("div",{className:"mx-8 h-px bg-gradient-to-r from-transparent via-cyan-300/30 to-transparent"}),a("div",{className:"relative flex flex-col-reverse gap-3 px-8 py-6 sm:flex-row sm:justify-center",children:[a("button",{onClick:me,className:"group relative inline-flex min-w-[140px] cursor-pointer items-center justify-center gap-2 overflow-hidden rounded-full bg-white/[0.08] px-7 py-3 text-sm font-bold text-white ring-1 ring-cyan-200/30 backdrop-blur-md transition-all duration-200 hover:-translate-y-0.5 hover:bg-white/[0.14] hover:ring-cyan-200/60 hover:shadow-[0_8px_20px_-4px_rgba(34,211,238,0.3)] active:translate-y-0",children:[e("span",{className:"pointer-events-none absolute inset-0 -translate-x-full bg-gradient-to-r from-transparent via-white/20 to-transparent transition-transform duration-700 group-hover:translate-x-full"}),e("span",{className:"relative",children:"Làm tiếp"})]}),a("button",{onClick:he,disabled:G,className:"group relative inline-flex min-w-[160px] cursor-pointer items-center justify-center gap-2 overflow-hidden rounded-full bg-gradient-to-b from-[#ffd54a] via-[#ffb733] to-[#ff8a1f] px-7 py-3 text-sm font-black uppercase tracking-wide text-white shadow-[0_6px_0_0_#c46410,0_10px_22px_rgba(255,138,31,0.5)] ring-2 ring-orange-300/70 transition-all duration-150 hover:-translate-y-0.5 hover:brightness-110 hover:shadow-[0_8px_0_0_#c46410,0_14px_26px_rgba(255,138,31,0.55)] active:translate-y-1.5 active:shadow-[0_1px_0_0_#c46410,0_3px_8px_rgba(255,138,31,0.3)] disabled:cursor-not-allowed disabled:opacity-70",style:{textShadow:"0 2px 0 rgba(180,80,10,0.55)"},children:[e("span",{className:"pointer-events-none absolute inset-x-0 top-0 h-1/2 bg-gradient-to-b from-white/30 to-transparent"}),G?a(t,{children:[e(b,{className:"relative h-4 w-4 animate-spin"}),e("span",{className:"relative",children:"Đang xử lý..."})]}):e("span",{className:"relative",children:"Làm lại từ đầu"})]})]})]})]})})})]});const ge=oe.visuals?.backgroundFilter??"grayscale(1) blur(10px) saturate(0.85) brightness(0.9)",be=oe.visuals?.backgroundOverlay??"linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent, rgba(0, 0, 0, 0.3))",fe=oe.visuals?.cardBackground??"radial-gradient(60% 60% at 50% 40%, rgba(184, 229, 157, 0.85) 0%, rgba(115, 213, 133, 0.85) 100%)";return a("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden",children:[e("div",{className:"absolute inset-0 scale-110 bg-cover bg-center",style:{backgroundImage:`url(${oe.assets.background})`,filter:ge}}),e("div",{className:"absolute inset-0",style:{background:be}}),a("div",{className:"relative z-10 w-[88%] max-w-2xl sm:w-[70%] md:w-[50%] lg:w-[42%]",children:[e(T,{imageSrc:oe.assets.closeButton,onClick:()=>L(se),className:"absolute -right-3 -top-7 z-30",size:72}),a("div",{className:"absolute left-1/2 top-0 z-10 -translate-x-1/2 -translate-y-1/2",children:[e(y,{src:oe.assets.titleBar,alt:"",width:260,height:56,className:"drop-shadow-lg",priority:!0,unoptimized:!0}),e("span",{className:"absolute inset-0 mt-2.5 flex items-center justify-center pb-1 text-sm font-extrabold tracking-wider text-white drop-shadow",children:oe.displayName})]}),a("div",{className:"relative overflow-hidden rounded-3xl shadow-2xl ring-1 ring-white/20",children:[e("div",{className:"h-2 w-full",style:{backgroundImage:`url(${oe.assets.cardFrame})`,backgroundSize:"100% 100%"}}),a("div",{className:"relative p-6 pt-12 md:p-8 md:pt-14",style:{background:fe},children:[a("div",{className:"mb-4 rounded-2xl bg-black/20 px-4 py-3.5 text-center ring-1 ring-white/10 backdrop-blur-sm",children:[e("h2",{className:"text-base font-extrabold tracking-wide text-white drop-shadow-sm",children:j?.name}),j?.exam?.name&&e("p",{className:"mt-0.5 text-xs font-medium text-white/80",children:j.exam.name})]}),(j?.exam?.durationMinutes||j?.exam?.totalScore)&&a("div",{className:"mb-4 grid grid-cols-2 gap-3",children:[j?.exam?.durationMinutes&&a("div",{className:"flex flex-col items-center rounded-2xl bg-black/20 px-2 py-4 ring-1 ring-white/10 backdrop-blur-sm",children:[e("div",{className:"mb-2 flex h-8 w-8 items-center justify-center rounded-full bg-white/10",children:e(f,{className:"h-4 w-4 text-white"})}),e("span",{className:"text-2xl font-extrabold text-white",children:j.exam.durationMinutes}),e("span",{className:"text-xs font-semibold text-white/80",children:"Phút"})]}),j?.exam?.totalScore&&a("div",{className:"flex flex-col items-center rounded-2xl bg-black/20 px-2 py-4 ring-1 ring-white/10 backdrop-blur-sm",children:[e("div",{className:"mb-2 flex h-8 w-8 items-center justify-center rounded-full bg-white/10",children:e(v,{className:"h-4 w-4 text-white"})}),e("span",{className:"text-2xl font-extrabold text-white",children:j.exam.totalScore}),e("span",{className:"text-xs font-semibold text-white/80",children:"Thang điểm"})]})]}),"BEFORE_START"===$&&e(N,{countdown:X,formatCountdown:e=>{const t=Math.floor(e/86400),a=Math.floor(e%86400/3600),r=Math.floor(e%3600/60),n=e%60;return t>0?`${t} ngày ${a} giờ ${r} phút`:a>0?`${a} giờ ${r} phút ${n} giây`:r>0?`${r} phút ${n} giây`:`${n} giây`}}),"EXPIRED"===$&&e(_,{}),"ALREADY_SUBMITTED"===$&&e(k,{attempt:z}),e("div",{className:"mt-5 flex justify-center",children:a("button",{className:"group relative inline-flex cursor-pointer items-center gap-2 rounded-full bg-[#0473f9] px-8 py-3 shadow-[0_4px_0_0_#1d4ed8] transition-all duration-150 hover:brightness-110 active:translate-y-[2px] active:shadow-[0_2px_0_0_#1d4ed8]",onClick:()=>L(se),children:[e(w,{className:"h-5 w-5 text-white transition-transform group-hover:-translate-x-0.5"}),e("span",{className:"text-sm font-extrabold uppercase tracking-wider text-white",children:"Quay lại"})]})}),e("div",{className:"pointer-events-none absolute -bottom-1 -left-1 opacity-60",children:e(y,{src:oe.assets.bottomLeft,alt:"",width:80,height:80,unoptimized:!0})}),e("div",{className:"pointer-events-none absolute -bottom-1 -right-1 opacity-60",children:e(y,{src:oe.assets.bottomRight,alt:"",width:80,height:80,unoptimized:!0})})]})]})]})]})}
|
|
1
|
+
"use client";import{jsx as e,Fragment as t,jsxs as a}from"react/jsx-runtime";import{useState as r,useEffect as n,useCallback as i,useMemo as o}from"react";import{Dialog as s,DialogContent as l,DialogDescription as d,DialogTitle as c}from"../../../components/ui/dialog";import{t as m}from"../../../shared/lib/i18n";import{ROUTES as h}from"../../../shared/constants/routes";import{normalizeExamTheme as x,resolveThemeConfig as u}from"../../../shared/lib/themes";import{unwrap as p}from"../take/exam-taking.utils";import{toast as g}from"sonner";import{Loader2 as b,Clock as f,Trophy as v,ArrowLeft as w}from"lucide-react";import y from"next/image";import{BeforeStartCard as N,ExpiredCard as _,AlreadySubmittedCard as k}from"../../../components/features/exam-entry";import{CloseButton as T}from"../../../components/features/exam-entry/themed/components";import{ToeicWaitingRoom as E}from"../../../components/features/exam-entry/themed/ToeicWaitingRoom";import{CambridgeYleWaitingRoom as D}from"../../../components/features/exam-entry/themed/CambridgeYleWaitingRoom";import{SummerSkyWaitingRoom as S}from"../../../components/themes/summer-sky/SummerSkyWaitingRoom";import{FullscreenLoading as R}from"./fullscreen-loading";export function StudentExamEntryPageContainer({roomId:I,inviteToken:A=null,api:O,onNavigate:M,takePath:C=e=>`/student/exams/${e}/take`,closePath:B,renderRegistrationForm:W}){const L=i((e,t=!1)=>{M?M(e,{replace:t}):"undefined"!=typeof window&&(t?window.location.replace(e):window.location.href=e)},[M]),[j,F]=r(null),[z,U]=r(null),[$,P]=r("LOADING"),[X,Y]=r(0),[H,V]=r(5),[G,K]=r(!1),[Q,q]=r(!1),[J,Z]=r(null),[ee,te]=r(!1),[ae,re]=r(!1),[ne,ie]=r(!1),oe=o(()=>{const e=j?.exam?.theme,t=j?.exam?.template?.theme;return u({examTheme:e,templateTheme:t,level:j?.exam?.level})},[j?.exam,I,j]),se=o(()=>B?B(j):j?.contest?.id?h.STUDENT.CONTEST_ROOMS(j.contest.id):h.STUDENT.CONTESTS_DISCOVER,[B,j]),le=i((e,t)=>{const a=!0===e.allowMultipleSubmissions;if(t){const e=t.status;if("SUBMITTED"===e||"GRADED"===e||"PUBLISHED"===e)return a?"WITHIN_WINDOW":"ALREADY_SUBMITTED";if("IN_PROGRESS"===e)return"WITHIN_WINDOW"}const r=(new Date).getTime(),n=e.startDatetime?new Date(e.startDatetime).getTime():null,i=e.endDatetime?new Date(e.endDatetime).getTime():null;return!a&&i&&r>i?"EXPIRED":n&&r<n?"BEFORE_START":"WITHIN_WINDOW"},[]);n(()=>{(async()=>{try{if(A)try{await(O.joinViaInvite?.(I,A))}catch{}const e=await O.getRoom(I),t=p(e);if(F(t),!t.canAccess&&!A)return void P("NO_ACCESS");if(t.registrationFormConfig?.enabled&&t.registrationFormConfig.fields?.length>0&&!t.hasSubmittedFormData)return void re(!0);if(!t.exam)return void P("NO_EXAM");const a=await O.getActiveAttemptByRoom(I),r=p(a);r&&(Z(r),U(r));const n=!0===t.allowMultipleSubmissions;if(t.hasJoined&&!r&&!n)return void P("ALREADY_SUBMITTED");const i=le(t,r??null);if(P(i),"BEFORE_START"===i&&t.startDatetime){const e=new Date(t.startDatetime).getTime(),a=(new Date).getTime();Y(Math.max(0,Math.floor((e-a)/1e3)))}}catch(e){console.error("Failed to load room data:",e),g.error(m("student.exam.entry.loadError"))}})()},[I,A,le]),n(()=>{if("BEFORE_START"!==$||X<=0)return;const e=setInterval(()=>{Y(e=>e<=1?(P("WITHIN_WINDOW"),0):e-1)},1e3);return()=>clearInterval(e)},[$,X]);const de=i(async()=>{try{K(!0),await O.startAttempt(I),L(C(I),!0)}catch(e){const t=e,a=t.response?.data?.errorCode;"ROOM_NO_EXAM"===a?P("NO_EXAM"):"ROOM_NOT_STARTED"===a?(g.error(m("student.exam.entry.notStarted")),P("BEFORE_START"),q(!1),V(5)):"ROOM_ENDED"===a?(g.error(m("student.exam.entry.expired")),P("EXPIRED")):"ATTEMPT_ALREADY_SUBMITTED"===a?(g.error("Bạn đã hoàn thành bài thi này rồi."),P("ALREADY_SUBMITTED")):g.error(m("student.exam.entry.startError")),K(!1)}},[I]),ce=i(()=>{J?te(!0):de()},[J,de]),me=i(()=>{te(!1),g.success(m("student.exam.entry.continue")),L(C(I),!0)},[I]),he=i(async()=>{if(J)try{te(!1),K(!0),await O.deleteAttempt(J.id),Z(null),await de()}catch(e){console.error("Failed to restart attempt:",e),g.error(m("student.exam.entry.restartError")),K(!1)}},[J,de]);n(()=>{if(!Q||H<=0)return;const e=setInterval(()=>{V(e=>e<=1?(L(C(I),!0),0):e-1)},1e3);return()=>clearInterval(e)},[Q,H,I]);const xe=i(async e=>{if(j?.contest?.id){ie(!0);try{await(O.registerContest?.(j.contest.id,e)),re(!1);const t=await O.getRoom(I),a=p(t);if(F(a),!a.exam)return void P("NO_EXAM");const r=await O.getActiveAttemptByRoom(I),n=p(r);n&&(Z(n),U(n));const i=!0===a.allowMultipleSubmissions;if(a.hasJoined&&!n&&!i)return void P("ALREADY_SUBMITTED");const o=le(a,n??null);if(P(o),"BEFORE_START"===o&&a.startDatetime){const e=new Date(a.startDatetime).getTime(),t=(new Date).getTime();Y(Math.max(0,Math.floor((e-t)/1e3)))}}catch{g.error("Không thể gửi thông tin đăng ký. Vui lòng thử lại.")}finally{ie(!1)}}},[j?.contest?.id,I,le]);if(ae&&j?.registrationFormConfig&&W)return a(t,{children:[e(R,{}),W({room:j,onSubmit:xe,isSubmitting:ne})]});if("LOADING"===$)return e(R,{});if("NO_EXAM"===$)return e("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden bg-gradient-to-b from-sky-100 via-blue-50 to-indigo-100",children:a("div",{className:"mx-auto max-w-md p-4 text-center",children:[e("div",{className:"mb-6 text-7xl",children:"📝✨"}),e("h2",{className:"mb-3 text-2xl font-bold text-sky-700",children:"Bài thi đang được chuẩn bị"}),j&&a("div",{className:"mb-4 rounded-xl bg-white/60 px-5 py-3 text-left text-sm text-sky-700 shadow-sm backdrop-blur-sm",children:[e("p",{className:"font-semibold text-base",children:j.name}),j.code&&a("p",{className:"mt-1 text-sky-500",children:["Mã phòng: ",e("span",{className:"font-mono font-medium",children:j.code})]}),(j.startDatetime||j.endDatetime)&&a("p",{className:"mt-1 text-sky-500",children:["Thời gian thi:"," ",j.startDatetime?new Date(j.startDatetime).toLocaleString("vi-VN"):"—"," → ",j.endDatetime?new Date(j.endDatetime).toLocaleString("vi-VN"):"—"]})]}),e("p",{className:"mb-6 text-base text-sky-600",children:"Thầy cô đang chuẩn bị đề thi cho phòng này. Bạn quay lại sau nhé! 😊"}),e("button",{className:"mx-auto inline-flex items-center gap-2 rounded-2xl border-b-4 border-sky-600 bg-sky-500 px-8 py-3 text-lg font-bold text-white shadow-md transition-all hover:brightness-110 active:translate-y-0.5 active:border-b-2 active:shadow-sm",onClick:()=>window.history.back(),children:"← Quay lại"})]})});if("NO_ACCESS"===$)return e("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden bg-gradient-to-b from-red-50 via-orange-50 to-amber-50",children:a("div",{className:"mx-auto max-w-md p-4 text-center",children:[e("div",{className:"mb-6 text-7xl",children:"🔒"}),e("h2",{className:"mb-3 text-2xl font-bold text-red-600",children:"Không có quyền truy cập"}),e("p",{className:"mb-6 text-base text-red-500",children:"Bạn chưa được đăng ký vào phòng thi này. Hãy liên hệ thầy cô để được thêm vào phòng thi nhé!"}),e("button",{className:"mx-auto inline-flex items-center gap-2 rounded-2xl border-b-4 border-red-600 bg-red-500 px-8 py-3 text-lg font-bold text-white shadow-md transition-all hover:brightness-110 active:translate-y-0.5 active:border-b-2 active:shadow-sm",onClick:()=>window.history.back(),children:"← Quay lại"})]})});const ue="TOEIC"===j?.exam?.template?.subTitle,pe="SUMMER_SKY"===x(j?.exam?.theme||j?.exam?.template?.theme);if("WITHIN_WINDOW"===$&&j)return a(t,{children:[ue?e(E,{room:j,onStart:ce,isStarting:G,showCountdown:Q,autoStartCountdown:H,closeRedirectUrl:se,onClose:()=>{L(se)}}):pe?e(S,{room:j,onStart:ce,isStarting:G,onExit:()=>{L(se)}}):e(D,{room:j,onStart:ce,isStarting:G,showCountdown:Q,autoStartCountdown:H,closeRedirectUrl:se,onClose:()=>{L(se)}}),e(s,{open:ee,onOpenChange:te,children:e(l,{className:"overflow-visible border-0 bg-transparent p-0 shadow-none sm:max-w-md",children:a("div",{className:"relative overflow-visible rounded-[28px] bg-gradient-to-br from-cyan-300/25 via-white/5 to-white/0 p-px shadow-[0_30px_80px_-20px_rgba(10,75,140,0.85)] backdrop-blur-xl",children:[e("div",{className:"pointer-events-none absolute -left-16 -top-16 h-48 w-48 rounded-full bg-cyan-400/35 blur-3xl"}),e("div",{className:"pointer-events-none absolute -right-16 -bottom-16 h-48 w-48 rounded-full bg-sky-500/30 blur-3xl"}),e("div",{className:"pointer-events-none absolute left-1/2 top-0 h-24 w-1/2 -translate-x-1/2 rounded-full bg-cyan-300/15 blur-2xl"}),a("div",{className:"relative overflow-hidden rounded-[calc(28px-1px)] bg-gradient-to-b from-[#0e3d70]/97 via-[#0a4b8c]/97 to-[#072d54]/97 ring-1 ring-cyan-300/25",children:[e("div",{className:"pointer-events-none absolute inset-0 opacity-[0.04]",style:{backgroundImage:"radial-gradient(circle at 1px 1px, white 1px, transparent 0)",backgroundSize:"24px 24px"}}),e("div",{className:"pointer-events-none absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-cyan-300/40 to-transparent"}),a("div",{className:"relative flex flex-col items-center gap-4 px-8 pt-10 pb-6",children:[a("div",{className:"relative",children:[e("div",{className:"absolute inset-0 animate-ping rounded-full bg-cyan-300/30",style:{animationDuration:"2.8s"}}),e("div",{className:"absolute -inset-3 rounded-full bg-gradient-to-br from-cyan-300/15 to-sky-500/10 blur-md"}),e("div",{className:"absolute -inset-1.5 rounded-full bg-gradient-to-br from-cyan-200/30 to-sky-400/20"}),e("div",{className:"relative flex h-16 w-16 items-center justify-center rounded-full bg-gradient-to-br from-cyan-300 via-sky-500 to-sky-700 shadow-[0_10px_30px_-6px_rgba(34,211,238,0.7),inset_0_2px_4px_rgba(255,255,255,0.4)] ring-[3px] ring-cyan-200/40",children:a("svg",{className:"h-8 w-8 text-white drop-shadow-[0_2px_3px_rgba(0,0,0,0.3)]",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:[e("path",{d:"M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"}),e("line",{x1:"12",y1:"9",x2:"12",y2:"13"}),e("line",{x1:"12",y1:"17",x2:"12.01",y2:"17"})]})})]}),a("div",{className:"flex flex-col items-center gap-2",children:[e(c,{className:"text-center text-xl font-black tracking-tight text-white drop-shadow-[0_2px_8px_rgba(34,211,238,0.4)]",children:"Bạn đang có bài thi dở"}),e(d,{className:"max-w-sm text-center text-[13px] font-medium leading-relaxed text-cyan-100/75",children:"Bạn đã bắt đầu làm bài thi này trước đó. Bạn muốn tiếp tục làm bài hay bắt đầu lại từ đầu?"})]})]}),e("div",{className:"mx-8 h-px bg-gradient-to-r from-transparent via-cyan-300/30 to-transparent"}),a("div",{className:"relative flex flex-col-reverse gap-3 px-8 py-6 sm:flex-row sm:justify-center",children:[a("button",{onClick:me,className:"group relative inline-flex min-w-[140px] cursor-pointer items-center justify-center gap-2 overflow-hidden rounded-full bg-white/[0.08] px-7 py-3 text-sm font-bold text-white ring-1 ring-cyan-200/30 backdrop-blur-md transition-all duration-200 hover:-translate-y-0.5 hover:bg-white/[0.14] hover:ring-cyan-200/60 hover:shadow-[0_8px_20px_-4px_rgba(34,211,238,0.3)] active:translate-y-0",children:[e("span",{className:"pointer-events-none absolute inset-0 -translate-x-full bg-gradient-to-r from-transparent via-white/20 to-transparent transition-transform duration-700 group-hover:translate-x-full"}),e("span",{className:"relative",children:"Làm tiếp"})]}),a("button",{onClick:he,disabled:G,className:"group relative inline-flex min-w-[160px] cursor-pointer items-center justify-center gap-2 overflow-hidden rounded-full bg-gradient-to-b from-[#ffd54a] via-[#ffb733] to-[#ff8a1f] px-7 py-3 text-sm font-black uppercase tracking-wide text-white shadow-[0_6px_0_0_#c46410,0_10px_22px_rgba(255,138,31,0.5)] ring-2 ring-orange-300/70 transition-all duration-150 hover:-translate-y-0.5 hover:brightness-110 hover:shadow-[0_8px_0_0_#c46410,0_14px_26px_rgba(255,138,31,0.55)] active:translate-y-1.5 active:shadow-[0_1px_0_0_#c46410,0_3px_8px_rgba(255,138,31,0.3)] disabled:cursor-not-allowed disabled:opacity-70",style:{textShadow:"0 2px 0 rgba(180,80,10,0.55)"},children:[e("span",{className:"pointer-events-none absolute inset-x-0 top-0 h-1/2 bg-gradient-to-b from-white/30 to-transparent"}),G?a(t,{children:[e(b,{className:"relative h-4 w-4 animate-spin"}),e("span",{className:"relative",children:"Đang xử lý..."})]}):e("span",{className:"relative",children:"Làm lại từ đầu"})]})]})]})]})})})]});const ge=oe.visuals?.backgroundFilter??"grayscale(1) blur(10px) saturate(0.85) brightness(0.9)",be=oe.visuals?.backgroundOverlay??"linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent, rgba(0, 0, 0, 0.3))",fe=oe.visuals?.cardBackground??"radial-gradient(60% 60% at 50% 40%, rgba(184, 229, 157, 0.85) 0%, rgba(115, 213, 133, 0.85) 100%)";return a("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden",children:[e("div",{className:"absolute inset-0 scale-110 bg-cover bg-center",style:{backgroundImage:`url(${oe.assets.background})`,filter:ge}}),e("div",{className:"absolute inset-0",style:{background:be}}),a("div",{className:"relative z-10 w-[88%] max-w-2xl sm:w-[70%] md:w-[50%] lg:w-[42%]",children:[e(T,{imageSrc:oe.assets.closeButton,onClick:()=>L(se),className:"absolute -right-3 -top-7 z-30",size:72}),a("div",{className:"absolute left-1/2 top-0 z-10 -translate-x-1/2 -translate-y-1/2",children:[e(y,{src:oe.assets.titleBar,alt:"",width:260,height:56,className:"drop-shadow-lg",priority:!0,unoptimized:!0}),e("span",{className:"absolute inset-0 mt-2.5 flex items-center justify-center pb-1 text-sm font-extrabold tracking-wider text-white drop-shadow",children:oe.displayName})]}),a("div",{className:"relative overflow-hidden rounded-3xl shadow-2xl ring-1 ring-white/20",children:[e("div",{className:"h-2 w-full",style:{backgroundImage:`url(${oe.assets.cardFrame})`,backgroundSize:"100% 100%"}}),a("div",{className:"relative p-6 pt-12 md:p-8 md:pt-14",style:{background:fe},children:[a("div",{className:"mb-4 rounded-2xl bg-black/20 px-4 py-3.5 text-center ring-1 ring-white/10 backdrop-blur-sm",children:[e("h2",{className:"text-base font-extrabold tracking-wide text-white drop-shadow-sm",children:j?.name}),j?.exam?.name&&e("p",{className:"mt-0.5 text-xs font-medium text-white/80",children:j.exam.name})]}),(j?.exam?.durationMinutes||j?.exam?.totalScore)&&a("div",{className:"mb-4 grid grid-cols-2 gap-3",children:[j?.exam?.durationMinutes&&a("div",{className:"flex flex-col items-center rounded-2xl bg-black/20 px-2 py-4 ring-1 ring-white/10 backdrop-blur-sm",children:[e("div",{className:"mb-2 flex h-8 w-8 items-center justify-center rounded-full bg-white/10",children:e(f,{className:"h-4 w-4 text-white"})}),e("span",{className:"text-2xl font-extrabold text-white",children:j.exam.durationMinutes}),e("span",{className:"text-xs font-semibold text-white/80",children:"Phút"})]}),j?.exam?.totalScore&&a("div",{className:"flex flex-col items-center rounded-2xl bg-black/20 px-2 py-4 ring-1 ring-white/10 backdrop-blur-sm",children:[e("div",{className:"mb-2 flex h-8 w-8 items-center justify-center rounded-full bg-white/10",children:e(v,{className:"h-4 w-4 text-white"})}),e("span",{className:"text-2xl font-extrabold text-white",children:j.exam.totalScore}),e("span",{className:"text-xs font-semibold text-white/80",children:"Thang điểm"})]})]}),"BEFORE_START"===$&&e(N,{countdown:X,formatCountdown:e=>{const t=Math.floor(e/86400),a=Math.floor(e%86400/3600),r=Math.floor(e%3600/60),n=e%60;return t>0?`${t} ngày ${a} giờ ${r} phút`:a>0?`${a} giờ ${r} phút ${n} giây`:r>0?`${r} phút ${n} giây`:`${n} giây`}}),"EXPIRED"===$&&e(_,{}),"ALREADY_SUBMITTED"===$&&e(k,{attempt:z}),e("div",{className:"mt-5 flex justify-center",children:a("button",{className:"group relative inline-flex cursor-pointer items-center gap-2 rounded-full bg-[#0473f9] px-8 py-3 shadow-[0_4px_0_0_#1d4ed8] transition-all duration-150 hover:brightness-110 active:translate-y-[2px] active:shadow-[0_2px_0_0_#1d4ed8]",onClick:()=>L(se),children:[e(w,{className:"h-5 w-5 text-white transition-transform group-hover:-translate-x-0.5"}),e("span",{className:"text-sm font-extrabold uppercase tracking-wider text-white",children:"Quay lại"})]})}),e("div",{className:"pointer-events-none absolute -bottom-1 -left-1 opacity-60",children:e(y,{src:oe.assets.bottomLeft,alt:"",width:80,height:80,unoptimized:!0})}),e("div",{className:"pointer-events-none absolute -bottom-1 -right-1 opacity-60",children:e(y,{src:oe.assets.bottomRight,alt:"",width:80,height:80,unoptimized:!0})})]})]})]})]})}
|
|
@@ -4,8 +4,10 @@ export interface ExamTakingPageContainerProps {
|
|
|
4
4
|
roomId: string;
|
|
5
5
|
/** API adapter; create one via `createExamTakingApi`. */
|
|
6
6
|
api: ExamTakingSdkApi;
|
|
7
|
-
/** Navigation callback; falls back to `window.location.href` when omitted. */
|
|
8
|
-
onNavigate?: (href: string
|
|
7
|
+
/** Navigation callback; falls back to `window.location.href`/`replace` when omitted. */
|
|
8
|
+
onNavigate?: (href: string, options?: {
|
|
9
|
+
replace?: boolean;
|
|
10
|
+
}) => void;
|
|
9
11
|
/** Build the results page path from an attemptId. */
|
|
10
12
|
resultPath?: (attemptId: string) => string;
|
|
11
13
|
/** Path to navigate to when loading/close fails (e.g. discover page). */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import{useEffect as i,useRef as s,useState as r,useMemo as a,useCallback as o}from"react";import d from"next/image";import l from"../../../components/themes/summer-sky/assets/images/clock.png";import m from"../../../components/themes/summer-sky/assets/images/submit.png";import c from"../../../components/themes/summer-sky/assets/images/has_answered.png";import{toast as p}from"sonner";import{Loader2 as u}from"lucide-react";import{t as g}from"../../../shared/lib/i18n";import{transformAnswersForSubmission as h}from"./utils/answer-transformers";import{getThemeForLevel as x,normalizeExamTheme as b}from"../../../shared/lib/themes";import{useExamTakingStore as I}from"../../../shared/lib/stores/examTakingStore";import{useGradingTransientStore as f}from"../../../shared/lib/stores/gradingTransientStore";import{AlertDialog as w,AlertDialogAction as E,AlertDialogCancel as S,AlertDialogContent as _,AlertDialogDescription as y,AlertDialogFooter as v,AlertDialogHeader as N,AlertDialogTitle as A}from"../../../components/ui/alert-dialog";import{useExamTimer as T}from"./hooks/useExamTimer";import{useAutoSave as C}from"./hooks/useAutoSave";import{useProctoringCamera as k}from"./hooks/useProctoringCamera";import{getStandardExamTheme as P}from"../../../components/themes";import{QuestionRenderer as q}from"./components/QuestionRenderer";import{FullscreenLoading as R}from"../entry/fullscreen-loading";import{SummerSkySubmitModal as M}from"../../../components/themes/summer-sky/SummerSkySubmitModal";import{EnglishCertificationExamLayout as D,EnglishCertificationQuestionRenderer as L,scrollToEnglishCertQuestion as G}from"../../../components/themes/english-certification";import{groupQuestionsByPart as Q}from"./utils/question-transformers";import{unwrap as B,unwrapAttempt as O}from"./exam-taking.utils";import{ExamTakingApiProvider as Y}from"./ExamTakingApiContext";function F({roomId:Y,api:F,onNavigate:K,resultPath:U=e=>`/student/results/${e}`,fallbackPath:V="/student/contests/discover",proctoringEnabled:$=!1,achieversExamTitle:j,onSubmitted:H}){const z=I(),W=s(!1),J=o(e=>{K?K(e):"undefined"!=typeof window&&(window.location.href=e)},[K]),{isCameraActive:X}=k({api:F,attemptId:z.attemptId,intervalMs:1e4,enabled:$}),[Z,ee]=r(!0),te=z.currentPartIndex,ne=z.currentQuestionGlobalIndex,ie=o(e=>{const t=I.getState().currentPartIndex,n="function"==typeof e?e(t):e;I.getState().setCurrentPartIndex(n)},[]),se=o(e=>{const t=I.getState().currentQuestionGlobalIndex,n="function"==typeof e?e(t):e;I.getState().setCurrentQuestionGlobalIndex(n)},[]),[re,ae]=r([]),[oe,de]=r("SUMMER_SKY"),[le,me]=r(""),[ce,pe]=r(!1),[ue,ge]=r(null),[he,xe]=r(""),be=o(e=>{I.getState().markIntroPlayed(e)},[]),Ie="TOEIC"===z.examType||"ENGLISH_CERTIFICATION"===le,fe=a(()=>{if(!Ie||0===z.parts.length)return te;const e=z.currentIndex;for(let t=0;t<z.parts.length;t++){const n=z.parts[t],i=n.startIndex??0,s=n.endIndex??i;if(e>=i&&e<=s)return t}return 0},[Ie,z.currentIndex,z.parts,te]);i(()=>{(async()=>{try{ee(!0);let e=B(await F.getActiveAttempt(Y));e||(e=O(B(await F.startAttempt(Y))));let t=null;try{t=F.getRoom?B(await F.getRoom(Y)):null,t&&ge(t)}catch{}const{examTemplate:n,questions:i}=B(await F.getQuestions(e.id));n?.title&&xe(n.title);const s=n?.parts??e.exam?.template?.parts,r=Q(i,s),a=n?.subTitle??null,o=(r.every(e=>e.questions.every(e=>"SPEAKING"===e.question_skill_type)),r.some(e=>"SPEAKING"===e.category||e.questions.every(e=>"SPEAKING"===e.question_skill_type)));ae(r);const d=n?.theme||e?.exam?.template?.theme||e?.exam?.theme||t?.exam?.template?.theme||t?.exam?.theme||"",l=b(d);if(o){const e=["SUMMER_SKY"].includes(d);de(e?d:"SUMMER_SKY")}const m=new Date(e.startedAt),c=60*e.durationMinutes*1e3,u=m.getTime()+c,h=Date.now();if(0===Math.max(0,u-h)){p.info(g("student.exam.take.timeExpired"));try{await F.submitAttempt(e.id)}catch{}return I.persist.clearStorage(),void J(U(e.id))}z.hydrateFromServer({attemptId:e.id,examRoomId:Y,questions:i.map(e=>({id:e.id,question_type:e.question_type,content:e.content,is_example:e.is_example,total_points:e.total_points,part_id:e.part_id,part_no:e.part_no,question_number:e.question_number})),durationMinutes:e.durationMinutes,startedAt:e.startedAt,examType:a??void 0,examTitle:n?.title??void 0,parts:s}),a&&z.setExamType(a),me(l),s&&z.setParts(s),ee(!1)}catch(e){console.error("Failed to load exam data:",e),p.error(g("student.exam.take.loadError")),J(V)}})()},[Y]);const we=a(()=>re.length>0&&re.every(e=>e.questions.every(e=>"SPEAKING"===e.question_skill_type)),[re]),Ee=a(()=>{const e=re[te];return!!e&&(("SPEAKING_DESCRIBE_IMAGE"!==e.questionType&&"SPONTANEOUS_QA"!==e.questionType&&"SPEAKING_CUE_CARD"!==e.questionType&&"READ_DISPLAYED_CONTENT"!==e.questionType||"CAMBRIDGE_YLE"!==le)&&("SPEAKING"===e.category||e.questions.every(e=>"SPEAKING"===e.question_skill_type)))},[re,te,le]),{remainingSeconds:Se,warningLevel:_e}=T({onTimeExpired:async()=>{p.info(g("student.exam.take.autoSubmit")),await Ae()},onWarningThreshold:we||Ie?void 0:()=>{p.warning(g("student.exam.take.timeWarning"))},warningThresholdSeconds:we||Ie?void 0:300,warningThresholds:Ie?[{seconds:900,level:"warning",callback:()=>p.warning("Còn 15 phút!",{duration:3e3})},{seconds:300,level:"critical",callback:()=>p.warning("Còn 5 phút! Hãy ná»™p bà i ngay!",{duration:5e3})}]:we?[{seconds:300,level:"warning",callback:()=>p.warning("Còn 5 phút! Hãy hoà n thà nh bà i thi.",{duration:5e3})},{seconds:120,level:"critical",callback:()=>p.warning("Còn 2 phút! Bà i thi sẽ được tá»± động ná»™p.",{duration:5e3})}]:void 0}),ye=C({api:F,attemptId:z.attemptId||"",parts:re,intervalMs:Ie?15e3:3e4,onSaveError:e=>{console.error("Save error:",e)}}),ve=s(ye.saveNow),Ne=s(re);i(()=>{ve.current=ye.saveNow,Ne.current=re}),i(()=>{const e=()=>{const e=I.getState();if(!e.attemptId||!e.isDirty||e.isSubmitting)return;const t=h(e.answers,Ne.current);if(0!==t.length)try{F.saveAnswers?.({attemptId:e.attemptId,answers:t,keepalive:!0})}catch{}},t=()=>{"hidden"===document.visibilityState&&e()},n=()=>{const e=I.getState();e.isDirty&&!e.isSubmitting&&ve.current()};return document.addEventListener("visibilitychange",t),window.addEventListener("pagehide",e),window.addEventListener("online",n),()=>{document.removeEventListener("visibilitychange",t),window.removeEventListener("pagehide",e),window.removeEventListener("online",n)}},[]),i(()=>{we||ve.current()},[z.currentIndex,te,ne,we]);const Ae=async()=>{if(!W.current){W.current=!0,z.setIsSubmitting(!0),pe(!1);try{z.isDirty&&await ye.saveNow();const e=B(await F.submitAttempt(z.attemptId)),t=e?.pendingAnswerIds??[];z.attemptId&&(f.getState().setPending(z.attemptId,t),H?.({attemptId:z.attemptId,pendingAnswerIds:t})),0===t.length?p.success(g("student.exam.take.submitSuccess")):p.success(g("student.exam.take.submittedAIGradingInProgress")),I.persist.clearStorage(),J(U(z.attemptId))}catch(e){console.error("Failed to submit exam:",e);const t=e?.response?.data?.errorCode;if("ATTEMPT_ALREADY_SUBMITTED"===t)return I.persist.clearStorage(),void J(U(z.attemptId));p.warning(g("student.exam.take.submitError")),W.current=!1,z.setIsSubmitting(!1)}}},Te=o(()=>{pe(!0)},[]),Ce=s(new Map),ke=s([]),Pe=o((e,t)=>{z.setAnswer(e,t);const n=Ce.current.get(e)||e,i=ke.current.findIndex(e=>e.questionId===n);-1!==i&&se(e=>e!==i?i:e)},[]),qe=s("forward"),Re=e=>{if("CAMBRIDGE_YLE"!==le)return!1;const t=re[e];return"SPEAKING_DESCRIBE_IMAGE"===t?.questionType||"SPONTANEOUS_QA"===t?.questionType||"SPEAKING_CUE_CARD"===t?.questionType||"READ_DISPLAYED_CONTENT"===t?.questionType},Me=()=>{const e=()=>{window.scrollTo({top:0,behavior:"smooth"});const e=document.getElementById("exam-main-scroll-area");if(e){e.scrollTo({top:0,behavior:"smooth"});e.querySelectorAll(".overflow-y-auto").forEach(e=>{e.scrollTo({top:0,behavior:"smooth"})})}};requestAnimationFrame(e),setTimeout(e,100),setTimeout(e,250)},De=()=>{if("ENGLISH_CERTIFICATION"===le){const e=z.parts[fe+1];e&&z.goToQuestion(e.startIndex??0)}else if(Ie)z.goToQuestion(Math.min(z.currentIndex+1,z.questions.length-1));else if("CAMBRIDGE_YLE"===le&&Re(te)){const e=ne+1,t=Ve[e];t&&(t.partIndex!==te&&(qe.current="forward",ie(t.partIndex)),se(e))}else qe.current="forward",ie(e=>{const t=Math.min(e+1,re.length-1);if("CAMBRIDGE_YLE"===le){const e=Ve.find(e=>e.partIndex===t);e&&se(e.globalIndex)}return t});Me()},Le=()=>{if("ENGLISH_CERTIFICATION"===le){const e=z.parts[fe-1];e&&z.goToQuestion(e.startIndex??0)}else if(Ie)z.goToQuestion(Math.max(z.currentIndex-1,0));else if("CAMBRIDGE_YLE"===le&&Re(te)){const e=ne-1,t=Ve[e];t&&(t.partIndex!==te&&(qe.current="backward",ie(t.partIndex)),se(e))}else qe.current="backward",ie(e=>{const t=Math.max(e-1,0);if("CAMBRIDGE_YLE"===le){const e=Ve.find(e=>e.partIndex===t);e&&se(e.globalIndex)}return t});Me()},Ge=()=>{J(V)},Qe=a(()=>re.reduce((e,t)=>e+("CAMBRIDGE_YLE"===le?t.questions.length:t.questions.filter(e=>!e.is_example).length),0),[re,le]),Be=a(()=>{const e=new Map;return re.forEach(t=>{t.questions.forEach(n=>{if(n.is_example)return;const i=n.content;if("FILL_MISSING_WORDS_IN_GRID"===t.questionType&&i?.grid&&i.grid.forEach((t,i)=>{t.forEach((t,s)=>{e.set(`${i}-${s}`,n.id)})}),"LABEL_THE_PICTURE"===t.questionType&&i?.labels&&i.labels.forEach(t=>{t.id&&e.set(t.id,n.id)}),"READ_AND_COLOR_OBJECTS"===t.questionType){const t=i?.regions||i?.regionNodes;t?.forEach(t=>{t.id&&e.set(t.id,n.id)})}if("IMAGE_OBJECT_MATCHING"===t.questionType){const t=i?.regions||i?.regionNodes;t?.forEach(t=>{t.id&&e.set(t.id,n.id)})}if("LOOK_PICTURE_FILL_WORD_HINT"===t.questionType){const t=i?.word;if(t&&"string"==typeof t){const i=/\{(\d+)\}/g;let s;for(;null!==(s=i.exec(t));){const t=s[1];e.set(`${n.id}-blank-${t}`,n.id)}}}})}),e},[re]);i(()=>{Ce.current=Be},[Be]);const Oe=a(()=>{if(!z.answers)return new Set;const e=new Set(re.flatMap(e=>e.questions.filter(e=>!e.is_example).map(e=>e.id))),t=new Set;return Object.keys(z.answers).forEach(n=>{const i=z.answers[n];if(void 0===i||""===i)return;if(e.has(n))return void t.add(n);const s=Be.get(n);s&&e.has(s)&&t.add(s)}),t},[z.answers,re,Be]),Ye=Oe.size+("CAMBRIDGE_YLE"===le?re.reduce((e,t)=>e+t.questions.filter(e=>e.is_example).length,0):0),Fe=a(()=>ue?.exam?.name||ue?.name||(Ie?"TOEIC Listening and Reading Test":"Bà i thi"),[ue,Ie]),Ke=a(()=>x(ue?.exam?.level).displayName,[ue?.exam?.level]),{sidebarParts:Ue,sidebarQuestions:Ve}=a(()=>{const e=[],t=[];let n=0;return re.forEach((i,s)=>{const r="CAMBRIDGE_YLE"===le?i.questions:i.questions.filter(e=>!e.is_example);let a=0;r.forEach(e=>{const r=!("CAMBRIDGE_YLE"!==le||!e.is_example)||Oe.has(e.id);r&&a++;const o=i.questions.findIndex(t=>t.id===e.id);t.push({globalIndex:n,partIndex:s,indexInPart:o,questionNumber:e.question_number,isAnswered:r,questionId:e.id,isExample:e.is_example}),n++}),e.push({partIndex:s,partNo:i.partNo,name:i.name,category:i.category,points:i.points,totalQuestions:"CAMBRIDGE_YLE"===le?i.questions.length:i.questions.filter(e=>!e.is_example).length,answeredCount:a})}),{sidebarParts:e,sidebarQuestions:t}},[re,Oe,le]);if(i(()=>{ke.current=Ve},[Ve]),Z)return e(R,{});const $e=te,je=re[$e];if(!je)return e("div",{className:"flex min-h-screen items-center justify-center",children:t("div",{className:"text-center",children:[e("p",{className:"text-lg font-semibold text-red-500",children:"Không tìm thấy câu há»i"}),e("button",{type:"button",onClick:()=>J(V),className:"mt-4 rounded-lg bg-blue-500 px-4 py-2 text-white hover:bg-blue-600",children:"Quay lại"})]})});if(Ee)return t(n,{children:[e(q,{part:je,answers:z.answers||{},onAnswerChange:Pe,isReviewMode:!1,onExit:Ge,onPartComplete:$e<re.length-1?De:Te,onPartBack:$e>0?Le:void 0,speakingTheme:oe,initialQuestionIndex:"backward"===qe.current?je.questions.length-1:0,skipTeacherVideo:z.playedIntroParts.has($e)||he!==j,onTeacherIntroPlayed:()=>be($e)},`${je.partId}-${$e}`),"SUMMER_SKY"===oe?ce&&e(M,{onClose:()=>pe(!1),onSubmit:Ae,isSubmitting:z.isSubmitting}):e(w,{open:ce,onOpenChange:pe,children:t(_,{children:[t(N,{children:[e(A,{children:"Ná»™p bà i thi"}),e(y,{children:"Bạn có chắc chắn muốn ná»™p bà i không? Sau khi ná»™p, bạn sẽ không thể thay đổi câu trả lá»i."})]}),t(v,{children:[e(S,{disabled:z.isSubmitting,children:"Quay lại"}),e(E,{onClick:Ae,disabled:z.isSubmitting,children:z.isSubmitting?t(n,{children:[e(u,{className:"mr-2 h-4 w-4 animate-spin"}),"Äang ná»™p..."]}):"Ná»™p bà i"})]})]})}),t("div",{className:"fixed top-8 right-6 z-[100] flex flex-col items-end gap-4 sm:gap-6 lg:top-10 lg:right-16",children:[t("div",{className:"flex items-center gap-4 sm:gap-6",children:[Se>0&&t("div",{className:"flex items-center w-[130px] sm:w-[170px] h-[40px] sm:h-[50px] rounded-[33.5px] backdrop-blur-[8px] transition-all duration-300 ease-in-out border-none shadow-[0_4px_20px_rgba(0,0,0,0.25)] "+("critical"===_e?"bg-[rgba(220,38,38,0.85)] shadow-[0_0_24px_rgba(220,38,38,0.5)] animate-pulse":"warning"===_e?"bg-[rgba(180,120,0,0.85)]":"bg-[#001590]"),children:[e(d,{src:l,alt:"clock",width:75,height:75,className:"w-[50px] h-[50px] sm:w-[75px] sm:h-[75px] -ml-[5px] sm:-ml-[10px] -mt-[10px] sm:-mt-[15px] shrink-0 drop-shadow-[0_2px_6px_rgba(0,0,0,0.2)] pointer-events-none z-10"}),t("span",{className:"flex-1 text-center font-bold text-[18px] sm:text-[25px] leading-none tracking-[-0.03em] uppercase text-white pr-[10px] sm:pr-[16px]",style:{fontFamily:"'SVN-Volte Rounded', 'Quicksand', sans-serif",textShadow:"0 2px 4px rgba(0, 0, 0, 0.2)"},children:[Math.floor(Se/60).toString().padStart(2,"0"),":",(Se%60).toString().padStart(2,"0")]})]}),t("div",{className:"flex items-center w-[130px] sm:w-[170px] h-[40px] sm:h-[50px] rounded-[33.5px] bg-[#FF9900] shadow-[0_4px_20px_rgba(0,0,0,0.25)] border-none shrink-0",title:"Số câu há»i đã hoà n thà nh",children:[e(d,{src:c,alt:"Progress",width:75,height:75,className:"w-[50px] h-[50px] sm:w-[75px] sm:h-[75px] -ml-[5px] sm:-ml-[10px] -mt-[10px] sm:-mt-[15px] shrink-0 drop-shadow-[0_2px_6px_rgba(0,0,0,0.2)] pointer-events-none z-10"}),t("span",{className:"flex-1 text-center font-bold text-[18px] sm:text-[25px] leading-none tracking-[-0.03em] uppercase text-white pr-[10px] sm:pr-[16px]",style:{fontFamily:'"SVN-Volte Rounded", "Quicksand", sans-serif',textShadow:"0 2px 4px rgba(0,0,0,0.2)"},children:[Ye,"/",Qe]})]})]}),t("button",{onClick:Te,disabled:z.isSubmitting,className:"group cursor-pointer flex items-center h-[40px] sm:h-[50px] w-[130px] sm:w-[170px] rounded-[33.5px] shadow-[0_4px_20px_rgba(0,0,0,0.25)] transition-all duration-300 hover:scale-105 active:scale-95 disabled:pointer-events-none disabled:opacity-60 border-none "+(z.isSubmitting?"bg-slate-400":"bg-[#16CA3B] hover:bg-[#15b736]"),children:[e(d,{src:m,alt:"Submit",width:75,height:75,className:"w-[50px] h-[50px] sm:w-[75px] sm:h-[75px] -ml-[5px] sm:-ml-[10px] -mt-[10px] sm:-mt-[15px] shrink-0 drop-shadow-[0_2px_6px_rgba(0,0,0,0.2)] pointer-events-none transition-transform duration-300 group-hover:scale-110 z-10"}),z.isSubmitting?e("div",{className:"flex-1 flex justify-center pr-[10px] sm:pr-[16px]",children:e(u,{className:"h-6 w-6 animate-spin text-white"})}):e("span",{className:"flex-1 text-center font-bold text-[18px] sm:text-[25px] leading-none tracking-[-0.03em] uppercase text-white pr-[10px] sm:pr-[16px]",style:{fontFamily:'"SVN-Volte Rounded", "Quicksand", sans-serif',textShadow:"0 2px 4px rgba(0,0,0,0.2)"},children:"Ná»™p bà i"})]})]}),z.isSubmitting&&e("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm",children:t("div",{className:"rounded-xl bg-white p-8 text-center shadow-2xl",children:[e(u,{className:"mx-auto h-12 w-12 animate-spin text-green-500"}),e("p",{className:"mt-4 text-lg font-semibold text-gray-700",children:"Äang ná»™p bà i..."}),e("p",{className:"mt-2 text-sm text-gray-500",children:"Vui lòng đợi trong giây lát"})]})})]});if(Ie){const i=re[fe],s=z.parts[fe],r=s?Math.max(0,z.currentIndex-(s.startIndex??0)):0,a=(s?.startIndex??0)+1,o=(s?.endIndex??a-1)+1,d={examName:Fe,remainingSeconds:z.remainingSeconds,totalQuestions:Qe,answeredCount:Ye,isSubmitting:z.isSubmitting,onSubmit:Ae,onClose:Ge,lastSavedAt:z.lastSavedAt,isSaving:ye.isSaving,partLabel:(s?.name||i?.name||"").toUpperCase()||void 0,partSubLabel:s?.category||void 0,questionRange:`${a}–${o}`},l=i?.questions?.[r],m="ENGLISH_CERTIFICATION"===le,c={onPrevious:Le,onClear:m?void 0:()=>{l&&Pe(l.id,{optionId:null})},onToggleMark:m?void 0:()=>{l&&z.toggleFlag(l.id)},onNext:De,isMarked:!!l&&z.flaggedQuestions.has(l.id),showSecondaryActions:!m,isPreviousDisabled:m?fe<=0:z.currentIndex<=0,isNextDisabled:m?fe>=z.parts.length-1:z.currentIndex>=z.questions.length-1},p={parts:z.parts,questions:z.questions,answers:z.answers,flaggedQuestions:z.flaggedQuestions,currentIndex:z.currentIndex,onQuestionClick:e=>{z.goToQuestion(e);const t=z.questions[e];t&&G(t.id,{behavior:"smooth",block:"start"})},onPartClick:e=>{const t=z.parts[e];t&&(z.goToQuestion(t.startIndex??0),z.setCurrentPartIndex(e))}};if(i&&s)return t(n,{children:[e(D,{headerProps:d,navigationProps:p,footerProps:c,children:e(L,{part:i,partConfig:s,currentQuestionIndex:r,answers:z.answers,flaggedQuestions:z.flaggedQuestions,onAnswerChange:Pe,onToggleFlag:e=>z.toggleFlag(e),isReviewMode:!1,isAudioPlayed:z.playedListeningAudioParts.has(i.partId),onAudioFirstPlay:()=>z.markListeningAudioPlayed(i.partId)})}),z.isSubmitting&&e("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/50",children:t("div",{className:"rounded-xl bg-white p-8 text-center shadow-2xl",children:[e(u,{className:"mx-auto h-12 w-12 animate-spin text-green-500"}),e("p",{className:"mt-4 text-lg font-semibold text-gray-700",children:"Äang ná»™p bà i..."}),e("p",{className:"mt-2 text-sm text-gray-500",children:"Vui lòng đợi trong giây lát"})]})})]})}return t(n,{children:[(()=>{const{Layout:n,QuestionCard:i}=P(le),s={headerProps:{examName:Fe,examType:"EXAM",levelLabel:Ke,totalQuestions:Qe,answeredCount:Ye,remainingSeconds:z.remainingSeconds,isSubmitting:z.isSubmitting,isCameraActive:X,onSubmit:Te},onPrevious:Le,onNext:De,onClose:Ge,isNavDisabled:z.isNavDisabled,partName:je?.name||(je?.partNo?`PART ${je.partNo}`:void 0)};if("CAMBRIDGE_YLE"===le){const e=Re($e);s.isFirstQuestion=e?0===ne:0===$e,s.isLastQuestion=e?ne===Ve.length-1:$e===re.length-1,s.sidebarProps={parts:Ue,questions:Ve,currentQuestionGlobalIndex:ne,isNavDisabled:z.isNavDisabled,onPartClick:e=>{if(z.isNavDisabled)return;qe.current=e>$e?"forward":"backward",ie(e);const t=Ve.find(t=>t.partIndex===e);t&&se(t.globalIndex),Me()},onQuestionClick:e=>{if(z.isNavDisabled)return;const t=Ve[e];t&&t.partIndex!==$e&&(qe.current=t.partIndex>$e?"forward":"backward",ie(t.partIndex)),se(e),t&&setTimeout(()=>{const e=document.getElementById(`question-${t.questionId}`);e&&e.scrollIntoView({behavior:"smooth",block:"center"})},100)}}}else s.isFirstQuestion=0===$e,s.isLastQuestion=$e===re.length-1;const r="CAMBRIDGE_YLE"===le&&("SPEAKING_DESCRIBE_IMAGE"===je?.questionType||"SPONTANEOUS_QA"===je?.questionType||"SPEAKING_CUE_CARD"===je?.questionType||"READ_DISPLAYED_CONTENT"===je?.questionType),a=Ve[ne],o=r&&a?.partIndex===$e?a.indexInPart:void 0;return t(n,{...s,children:[e(i,{partName:je?.name||(je?.partNo?`PART ${je.partNo}`:void 0),children:e(q,{part:je,answers:z.answers||{},onAnswerChange:Pe,isReviewMode:!1,currentQuestionIndex:o,onExit:Ge,onPartComplete:$e<re.length-1?De:Te,onPartBack:$e>0?Le:void 0,speakingTheme:"CAMBRIDGE_YLE"===le?"CAMBRIDGE_YLE":oe,initialQuestionIndex:"backward"===qe.current?je?.questions.length-1:0,skipTeacherVideo:z.playedIntroParts.has($e)||he!==j,onTeacherIntroPlayed:()=>be($e)})}),z.isSubmitting&&e("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/50",children:t("div",{className:"rounded-xl bg-white p-8 text-center shadow-2xl",children:[e(u,{className:"mx-auto h-12 w-12 animate-spin text-green-500"}),e("p",{className:"mt-4 text-lg font-semibold text-gray-700",children:"Äang ná»™p bà i..."}),e("p",{className:"mt-2 text-sm text-gray-500",children:"Vui lòng đợi trong giây lát"})]})})]})})(),"CAMBRIDGE_YLE"===le?ce&&e(M,{onClose:()=>pe(!1),onSubmit:Ae,isSubmitting:z.isSubmitting}):e(w,{open:ce,onOpenChange:pe,children:t(_,{children:[t(N,{children:[e(A,{children:"Ná»™p bà i thi"}),e(y,{children:"Bạn có chắc chắn muốn ná»™p bà i không? Sau khi ná»™p, bạn sẽ không thể thay đổi câu trả lá»i."})]}),t(v,{children:[e(S,{disabled:z.isSubmitting,children:"Quay lại"}),e(E,{onClick:Ae,disabled:z.isSubmitting,children:z.isSubmitting?t(n,{children:[e(u,{className:"mr-2 h-4 w-4 animate-spin"}),"Äang ná»™p..."]}):"Ná»™p bà i"})]})]})})]})}export function ExamTakingPageContainer(t){return e(Y,{api:t.api,children:e(F,{...t})})}
|
|
1
|
+
"use client";import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import{useEffect as i,useRef as s,useState as r,useMemo as a,useCallback as o}from"react";import d from"next/image";import l from"../../../components/themes/summer-sky/assets/images/clock.png";import m from"../../../components/themes/summer-sky/assets/images/submit.png";import c from"../../../components/themes/summer-sky/assets/images/has_answered.png";import{toast as p}from"sonner";import{Loader2 as u}from"lucide-react";import{t as g}from"../../../shared/lib/i18n";import{transformAnswersForSubmission as h}from"./utils/answer-transformers";import{getThemeForLevel as x,normalizeExamTheme as b}from"../../../shared/lib/themes";import{useExamTakingStore as I}from"../../../shared/lib/stores/examTakingStore";import{useGradingTransientStore as f}from"../../../shared/lib/stores/gradingTransientStore";import{AlertDialog as w,AlertDialogAction as E,AlertDialogCancel as S,AlertDialogContent as _,AlertDialogDescription as y,AlertDialogFooter as v,AlertDialogHeader as N,AlertDialogTitle as A}from"../../../components/ui/alert-dialog";import{useExamTimer as T}from"./hooks/useExamTimer";import{useAutoSave as C}from"./hooks/useAutoSave";import{useProctoringCamera as k}from"./hooks/useProctoringCamera";import{getStandardExamTheme as P}from"../../../components/themes";import{QuestionRenderer as q}from"./components/QuestionRenderer";import{FullscreenLoading as M}from"../entry/fullscreen-loading";import{SummerSkySubmitModal as R}from"../../../components/themes/summer-sky/SummerSkySubmitModal";import{EnglishCertificationExamLayout as D,EnglishCertificationQuestionRenderer as L,scrollToEnglishCertQuestion as G}from"../../../components/themes/english-certification";import{groupQuestionsByPart as Q}from"./utils/question-transformers";import{unwrap as B,unwrapAttempt as O}from"./exam-taking.utils";import{ExamTakingApiProvider as Y}from"./ExamTakingApiContext";function F({roomId:Y,api:F,onNavigate:K,resultPath:U=e=>`/student/results/${e}`,fallbackPath:V="/student/contests/discover",proctoringEnabled:$=!1,achieversExamTitle:j,onSubmitted:H}){const z=I(),W=s(!1),J=o((e,t=!1)=>{K?K(e,{replace:t}):"undefined"!=typeof window&&(t?window.location.replace(e):window.location.href=e)},[K]),{isCameraActive:X}=k({api:F,attemptId:z.attemptId,intervalMs:1e4,enabled:$}),[Z,ee]=r(!0),te=z.currentPartIndex,ne=z.currentQuestionGlobalIndex,ie=o(e=>{const t=I.getState().currentPartIndex,n="function"==typeof e?e(t):e;I.getState().setCurrentPartIndex(n)},[]),se=o(e=>{const t=I.getState().currentQuestionGlobalIndex,n="function"==typeof e?e(t):e;I.getState().setCurrentQuestionGlobalIndex(n)},[]),[re,ae]=r([]),[oe,de]=r("SUMMER_SKY"),[le,me]=r(""),[ce,pe]=r(!1),[ue,ge]=r(null),[he,xe]=r(""),be=o(e=>{I.getState().markIntroPlayed(e)},[]),Ie="TOEIC"===z.examType||"ENGLISH_CERTIFICATION"===le,fe=a(()=>{if(!Ie||0===z.parts.length)return te;const e=z.currentIndex;for(let t=0;t<z.parts.length;t++){const n=z.parts[t],i=n.startIndex??0,s=n.endIndex??i;if(e>=i&&e<=s)return t}return 0},[Ie,z.currentIndex,z.parts,te]);i(()=>{(async()=>{try{ee(!0);let e=B(await F.getActiveAttempt(Y));e||(e=O(B(await F.startAttempt(Y))));let t=null;try{t=F.getRoom?B(await F.getRoom(Y)):null,t&&ge(t)}catch{}const{examTemplate:n,questions:i}=B(await F.getQuestions(e.id));n?.title&&xe(n.title);const s=n?.parts??e.exam?.template?.parts,r=Q(i,s),a=n?.subTitle??null,o=(r.every(e=>e.questions.every(e=>"SPEAKING"===e.question_skill_type)),r.some(e=>"SPEAKING"===e.category||e.questions.every(e=>"SPEAKING"===e.question_skill_type)));ae(r);const d=n?.theme||e?.exam?.template?.theme||e?.exam?.theme||t?.exam?.template?.theme||t?.exam?.theme||"",l=b(d);if(o){const e=["SUMMER_SKY"].includes(d);de(e?d:"SUMMER_SKY")}const m=new Date(e.startedAt),c=60*e.durationMinutes*1e3,u=m.getTime()+c,h=Date.now();if(0===Math.max(0,u-h)){p.info(g("student.exam.take.timeExpired"));try{await F.submitAttempt(e.id)}catch{}return I.persist.clearStorage(),void J(U(e.id))}z.hydrateFromServer({attemptId:e.id,examRoomId:Y,questions:i.map(e=>({id:e.id,question_type:e.question_type,content:e.content,is_example:e.is_example,total_points:e.total_points,part_id:e.part_id,part_no:e.part_no,question_number:e.question_number})),durationMinutes:e.durationMinutes,startedAt:e.startedAt,examType:a??void 0,examTitle:n?.title??void 0,parts:s}),a&&z.setExamType(a),me(l),s&&z.setParts(s),ee(!1)}catch(e){const t=e?.response?.data?.errorCode;if("ATTEMPT_ALREADY_SUBMITTED"===t)return p.info(g("student.exam.take.submitted")),void J(V,!0);console.error("Failed to load exam data:",e),p.error(g("student.exam.take.loadError")),J(V,!0)}})()},[Y]);const we=a(()=>re.length>0&&re.every(e=>e.questions.every(e=>"SPEAKING"===e.question_skill_type)),[re]),Ee=a(()=>{const e=re[te];return!!e&&(("SPEAKING_DESCRIBE_IMAGE"!==e.questionType&&"SPONTANEOUS_QA"!==e.questionType&&"SPEAKING_CUE_CARD"!==e.questionType&&"READ_DISPLAYED_CONTENT"!==e.questionType||"CAMBRIDGE_YLE"!==le)&&("SPEAKING"===e.category||e.questions.every(e=>"SPEAKING"===e.question_skill_type)))},[re,te,le]),{remainingSeconds:Se,warningLevel:_e}=T({onTimeExpired:async()=>{p.info(g("student.exam.take.autoSubmit")),await Ae()},onWarningThreshold:we||Ie?void 0:()=>{p.warning(g("student.exam.take.timeWarning"))},warningThresholdSeconds:we||Ie?void 0:300,warningThresholds:Ie?[{seconds:900,level:"warning",callback:()=>p.warning("Còn 15 phút!",{duration:3e3})},{seconds:300,level:"critical",callback:()=>p.warning("Còn 5 phút! Hãy ná»™p bà i ngay!",{duration:5e3})}]:we?[{seconds:300,level:"warning",callback:()=>p.warning("Còn 5 phút! Hãy hoà n thà nh bà i thi.",{duration:5e3})},{seconds:120,level:"critical",callback:()=>p.warning("Còn 2 phút! Bà i thi sẽ được tá»± động ná»™p.",{duration:5e3})}]:void 0}),ye=C({api:F,attemptId:z.attemptId||"",parts:re,intervalMs:Ie?15e3:3e4,onSaveError:e=>{console.error("Save error:",e)}}),ve=s(ye.saveNow),Ne=s(re);i(()=>{ve.current=ye.saveNow,Ne.current=re}),i(()=>{const e=()=>{const e=I.getState();if(!e.attemptId||!e.isDirty||e.isSubmitting)return;const t=h(e.answers,Ne.current);if(0!==t.length)try{F.saveAnswers?.({attemptId:e.attemptId,answers:t,keepalive:!0})}catch{}},t=()=>{"hidden"===document.visibilityState&&e()},n=()=>{const e=I.getState();e.isDirty&&!e.isSubmitting&&ve.current()};return document.addEventListener("visibilitychange",t),window.addEventListener("pagehide",e),window.addEventListener("online",n),()=>{document.removeEventListener("visibilitychange",t),window.removeEventListener("pagehide",e),window.removeEventListener("online",n)}},[]),i(()=>{we||ve.current()},[z.currentIndex,te,ne,we]);const Ae=async()=>{if(!W.current){W.current=!0,z.setIsSubmitting(!0),pe(!1);try{z.isDirty&&await ye.saveNow();const e=B(await F.submitAttempt(z.attemptId)),t=e?.pendingAnswerIds??[];z.attemptId&&(f.getState().setPending(z.attemptId,t),H?.({attemptId:z.attemptId,pendingAnswerIds:t})),0===t.length?p.success(g("student.exam.take.submitSuccess")):p.success(g("student.exam.take.submittedAIGradingInProgress")),I.persist.clearStorage(),J(U(z.attemptId),!0)}catch(e){console.error("Failed to submit exam:",e);const t=e?.response?.data?.errorCode;if("ATTEMPT_ALREADY_SUBMITTED"===t)return I.persist.clearStorage(),void J(U(z.attemptId),!0);p.warning(g("student.exam.take.submitError")),W.current=!1,z.setIsSubmitting(!1)}}},Te=o(()=>{pe(!0)},[]),Ce=s(new Map),ke=s([]),Pe=o((e,t)=>{z.setAnswer(e,t);const n=Ce.current.get(e)||e,i=ke.current.findIndex(e=>e.questionId===n);-1!==i&&se(e=>e!==i?i:e)},[]),qe=s("forward"),Me=e=>{if("CAMBRIDGE_YLE"!==le)return!1;const t=re[e];return"SPEAKING_DESCRIBE_IMAGE"===t?.questionType||"SPONTANEOUS_QA"===t?.questionType||"SPEAKING_CUE_CARD"===t?.questionType||"READ_DISPLAYED_CONTENT"===t?.questionType},Re=()=>{const e=()=>{window.scrollTo({top:0,behavior:"smooth"});const e=document.getElementById("exam-main-scroll-area");if(e){e.scrollTo({top:0,behavior:"smooth"});e.querySelectorAll(".overflow-y-auto").forEach(e=>{e.scrollTo({top:0,behavior:"smooth"})})}};requestAnimationFrame(e),setTimeout(e,100),setTimeout(e,250)},De=()=>{if("ENGLISH_CERTIFICATION"===le){const e=z.parts[fe+1];e&&z.goToQuestion(e.startIndex??0)}else if(Ie)z.goToQuestion(Math.min(z.currentIndex+1,z.questions.length-1));else if("CAMBRIDGE_YLE"===le&&Me(te)){const e=ne+1,t=Ve[e];t&&(t.partIndex!==te&&(qe.current="forward",ie(t.partIndex)),se(e))}else qe.current="forward",ie(e=>{const t=Math.min(e+1,re.length-1);if("CAMBRIDGE_YLE"===le){const e=Ve.find(e=>e.partIndex===t);e&&se(e.globalIndex)}return t});Re()},Le=()=>{if("ENGLISH_CERTIFICATION"===le){const e=z.parts[fe-1];e&&z.goToQuestion(e.startIndex??0)}else if(Ie)z.goToQuestion(Math.max(z.currentIndex-1,0));else if("CAMBRIDGE_YLE"===le&&Me(te)){const e=ne-1,t=Ve[e];t&&(t.partIndex!==te&&(qe.current="backward",ie(t.partIndex)),se(e))}else qe.current="backward",ie(e=>{const t=Math.max(e-1,0);if("CAMBRIDGE_YLE"===le){const e=Ve.find(e=>e.partIndex===t);e&&se(e.globalIndex)}return t});Re()},Ge=()=>{J(V)},Qe=a(()=>re.reduce((e,t)=>e+("CAMBRIDGE_YLE"===le?t.questions.length:t.questions.filter(e=>!e.is_example).length),0),[re,le]),Be=a(()=>{const e=new Map;return re.forEach(t=>{t.questions.forEach(n=>{if(n.is_example)return;const i=n.content;if("FILL_MISSING_WORDS_IN_GRID"===t.questionType&&i?.grid&&i.grid.forEach((t,i)=>{t.forEach((t,s)=>{e.set(`${i}-${s}`,n.id)})}),"LABEL_THE_PICTURE"===t.questionType&&i?.labels&&i.labels.forEach(t=>{t.id&&e.set(t.id,n.id)}),"READ_AND_COLOR_OBJECTS"===t.questionType){const t=i?.regions||i?.regionNodes;t?.forEach(t=>{t.id&&e.set(t.id,n.id)})}if("IMAGE_OBJECT_MATCHING"===t.questionType){const t=i?.regions||i?.regionNodes;t?.forEach(t=>{t.id&&e.set(t.id,n.id)})}if("LOOK_PICTURE_FILL_WORD_HINT"===t.questionType){const t=i?.word;if(t&&"string"==typeof t){const i=/\{(\d+)\}/g;let s;for(;null!==(s=i.exec(t));){const t=s[1];e.set(`${n.id}-blank-${t}`,n.id)}}}})}),e},[re]);i(()=>{Ce.current=Be},[Be]);const Oe=a(()=>{if(!z.answers)return new Set;const e=new Set(re.flatMap(e=>e.questions.filter(e=>!e.is_example).map(e=>e.id))),t=new Set;return Object.keys(z.answers).forEach(n=>{const i=z.answers[n];if(void 0===i||""===i)return;if(e.has(n))return void t.add(n);const s=Be.get(n);s&&e.has(s)&&t.add(s)}),t},[z.answers,re,Be]),Ye=Oe.size+("CAMBRIDGE_YLE"===le?re.reduce((e,t)=>e+t.questions.filter(e=>e.is_example).length,0):0),Fe=a(()=>ue?.exam?.name||ue?.name||(Ie?"TOEIC Listening and Reading Test":"Bà i thi"),[ue,Ie]),Ke=a(()=>x(ue?.exam?.level).displayName,[ue?.exam?.level]),{sidebarParts:Ue,sidebarQuestions:Ve}=a(()=>{const e=[],t=[];let n=0;return re.forEach((i,s)=>{const r="CAMBRIDGE_YLE"===le?i.questions:i.questions.filter(e=>!e.is_example);let a=0;r.forEach(e=>{const r=!("CAMBRIDGE_YLE"!==le||!e.is_example)||Oe.has(e.id);r&&a++;const o=i.questions.findIndex(t=>t.id===e.id);t.push({globalIndex:n,partIndex:s,indexInPart:o,questionNumber:e.question_number,isAnswered:r,questionId:e.id,isExample:e.is_example}),n++}),e.push({partIndex:s,partNo:i.partNo,name:i.name,category:i.category,points:i.points,totalQuestions:"CAMBRIDGE_YLE"===le?i.questions.length:i.questions.filter(e=>!e.is_example).length,answeredCount:a})}),{sidebarParts:e,sidebarQuestions:t}},[re,Oe,le]);if(i(()=>{ke.current=Ve},[Ve]),Z)return e(M,{});const $e=te,je=re[$e];if(!je)return e("div",{className:"flex min-h-screen items-center justify-center",children:t("div",{className:"text-center",children:[e("p",{className:"text-lg font-semibold text-red-500",children:"Không tìm thấy câu há»i"}),e("button",{type:"button",onClick:()=>J(V),className:"mt-4 rounded-lg bg-blue-500 px-4 py-2 text-white hover:bg-blue-600",children:"Quay lại"})]})});if(Ee)return t(n,{children:[e(q,{part:je,answers:z.answers||{},onAnswerChange:Pe,isReviewMode:!1,onExit:Ge,onPartComplete:$e<re.length-1?De:Te,onPartBack:$e>0?Le:void 0,speakingTheme:oe,initialQuestionIndex:"backward"===qe.current?je.questions.length-1:0,skipTeacherVideo:z.playedIntroParts.has($e)||he!==j,onTeacherIntroPlayed:()=>be($e)},`${je.partId}-${$e}`),"SUMMER_SKY"===oe?ce&&e(R,{onClose:()=>pe(!1),onSubmit:Ae,isSubmitting:z.isSubmitting}):e(w,{open:ce,onOpenChange:pe,children:t(_,{children:[t(N,{children:[e(A,{children:"Ná»™p bà i thi"}),e(y,{children:"Bạn có chắc chắn muốn ná»™p bà i không? Sau khi ná»™p, bạn sẽ không thể thay đổi câu trả lá»i."})]}),t(v,{children:[e(S,{disabled:z.isSubmitting,children:"Quay lại"}),e(E,{onClick:Ae,disabled:z.isSubmitting,children:z.isSubmitting?t(n,{children:[e(u,{className:"mr-2 h-4 w-4 animate-spin"}),"Äang ná»™p..."]}):"Ná»™p bà i"})]})]})}),t("div",{className:"fixed top-8 right-6 z-[100] flex flex-col items-end gap-4 sm:gap-6 lg:top-10 lg:right-16",children:[t("div",{className:"flex items-center gap-4 sm:gap-6",children:[Se>0&&t("div",{className:"flex items-center w-[130px] sm:w-[170px] h-[40px] sm:h-[50px] rounded-[33.5px] backdrop-blur-[8px] transition-all duration-300 ease-in-out border-none shadow-[0_4px_20px_rgba(0,0,0,0.25)] "+("critical"===_e?"bg-[rgba(220,38,38,0.85)] shadow-[0_0_24px_rgba(220,38,38,0.5)] animate-pulse":"warning"===_e?"bg-[rgba(180,120,0,0.85)]":"bg-[#001590]"),children:[e(d,{src:l,alt:"clock",width:75,height:75,className:"w-[50px] h-[50px] sm:w-[75px] sm:h-[75px] -ml-[5px] sm:-ml-[10px] -mt-[10px] sm:-mt-[15px] shrink-0 drop-shadow-[0_2px_6px_rgba(0,0,0,0.2)] pointer-events-none z-10"}),t("span",{className:"flex-1 text-center font-bold text-[18px] sm:text-[25px] leading-none tracking-[-0.03em] uppercase text-white pr-[10px] sm:pr-[16px]",style:{fontFamily:"'SVN-Volte Rounded', 'Quicksand', sans-serif",textShadow:"0 2px 4px rgba(0, 0, 0, 0.2)"},children:[Math.floor(Se/60).toString().padStart(2,"0"),":",(Se%60).toString().padStart(2,"0")]})]}),t("div",{className:"flex items-center w-[130px] sm:w-[170px] h-[40px] sm:h-[50px] rounded-[33.5px] bg-[#FF9900] shadow-[0_4px_20px_rgba(0,0,0,0.25)] border-none shrink-0",title:"Số câu há»i đã hoà n thà nh",children:[e(d,{src:c,alt:"Progress",width:75,height:75,className:"w-[50px] h-[50px] sm:w-[75px] sm:h-[75px] -ml-[5px] sm:-ml-[10px] -mt-[10px] sm:-mt-[15px] shrink-0 drop-shadow-[0_2px_6px_rgba(0,0,0,0.2)] pointer-events-none z-10"}),t("span",{className:"flex-1 text-center font-bold text-[18px] sm:text-[25px] leading-none tracking-[-0.03em] uppercase text-white pr-[10px] sm:pr-[16px]",style:{fontFamily:'"SVN-Volte Rounded", "Quicksand", sans-serif',textShadow:"0 2px 4px rgba(0,0,0,0.2)"},children:[Ye,"/",Qe]})]})]}),t("button",{onClick:Te,disabled:z.isSubmitting,className:"group cursor-pointer flex items-center h-[40px] sm:h-[50px] w-[130px] sm:w-[170px] rounded-[33.5px] shadow-[0_4px_20px_rgba(0,0,0,0.25)] transition-all duration-300 hover:scale-105 active:scale-95 disabled:pointer-events-none disabled:opacity-60 border-none "+(z.isSubmitting?"bg-slate-400":"bg-[#16CA3B] hover:bg-[#15b736]"),children:[e(d,{src:m,alt:"Submit",width:75,height:75,className:"w-[50px] h-[50px] sm:w-[75px] sm:h-[75px] -ml-[5px] sm:-ml-[10px] -mt-[10px] sm:-mt-[15px] shrink-0 drop-shadow-[0_2px_6px_rgba(0,0,0,0.2)] pointer-events-none transition-transform duration-300 group-hover:scale-110 z-10"}),z.isSubmitting?e("div",{className:"flex-1 flex justify-center pr-[10px] sm:pr-[16px]",children:e(u,{className:"h-6 w-6 animate-spin text-white"})}):e("span",{className:"flex-1 text-center font-bold text-[18px] sm:text-[25px] leading-none tracking-[-0.03em] uppercase text-white pr-[10px] sm:pr-[16px]",style:{fontFamily:'"SVN-Volte Rounded", "Quicksand", sans-serif',textShadow:"0 2px 4px rgba(0,0,0,0.2)"},children:"Ná»™p bà i"})]})]}),z.isSubmitting&&e("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm",children:t("div",{className:"rounded-xl bg-white p-8 text-center shadow-2xl",children:[e(u,{className:"mx-auto h-12 w-12 animate-spin text-green-500"}),e("p",{className:"mt-4 text-lg font-semibold text-gray-700",children:"Äang ná»™p bà i..."}),e("p",{className:"mt-2 text-sm text-gray-500",children:"Vui lòng đợi trong giây lát"})]})})]});if(Ie){const i=re[fe],s=z.parts[fe],r=s?Math.max(0,z.currentIndex-(s.startIndex??0)):0,a=(s?.startIndex??0)+1,o=(s?.endIndex??a-1)+1,d={examName:Fe,remainingSeconds:z.remainingSeconds,totalQuestions:Qe,answeredCount:Ye,isSubmitting:z.isSubmitting,onSubmit:Ae,onClose:Ge,lastSavedAt:z.lastSavedAt,isSaving:ye.isSaving,partLabel:(s?.name||i?.name||"").toUpperCase()||void 0,partSubLabel:s?.category||void 0,questionRange:`${a}–${o}`},l=i?.questions?.[r],m="ENGLISH_CERTIFICATION"===le,c={onPrevious:Le,onClear:m?void 0:()=>{l&&Pe(l.id,{optionId:null})},onToggleMark:m?void 0:()=>{l&&z.toggleFlag(l.id)},onNext:De,isMarked:!!l&&z.flaggedQuestions.has(l.id),showSecondaryActions:!m,isPreviousDisabled:m?fe<=0:z.currentIndex<=0,isNextDisabled:m?fe>=z.parts.length-1:z.currentIndex>=z.questions.length-1},p={parts:z.parts,questions:z.questions,answers:z.answers,flaggedQuestions:z.flaggedQuestions,currentIndex:z.currentIndex,onQuestionClick:e=>{z.goToQuestion(e);const t=z.questions[e];t&&G(t.id,{behavior:"smooth",block:"start"})},onPartClick:e=>{const t=z.parts[e];t&&(z.goToQuestion(t.startIndex??0),z.setCurrentPartIndex(e))}};if(i&&s)return t(n,{children:[e(D,{headerProps:d,navigationProps:p,footerProps:c,children:e(L,{part:i,partConfig:s,currentQuestionIndex:r,answers:z.answers,flaggedQuestions:z.flaggedQuestions,onAnswerChange:Pe,onToggleFlag:e=>z.toggleFlag(e),isReviewMode:!1,isAudioPlayed:z.playedListeningAudioParts.has(i.partId),onAudioFirstPlay:()=>z.markListeningAudioPlayed(i.partId)})}),z.isSubmitting&&e("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/50",children:t("div",{className:"rounded-xl bg-white p-8 text-center shadow-2xl",children:[e(u,{className:"mx-auto h-12 w-12 animate-spin text-green-500"}),e("p",{className:"mt-4 text-lg font-semibold text-gray-700",children:"Äang ná»™p bà i..."}),e("p",{className:"mt-2 text-sm text-gray-500",children:"Vui lòng đợi trong giây lát"})]})})]})}return t(n,{children:[(()=>{const{Layout:n,QuestionCard:i}=P(le),s={headerProps:{examName:Fe,examType:"EXAM",levelLabel:Ke,totalQuestions:Qe,answeredCount:Ye,remainingSeconds:z.remainingSeconds,isSubmitting:z.isSubmitting,isCameraActive:X,onSubmit:Te},onPrevious:Le,onNext:De,onClose:Ge,isNavDisabled:z.isNavDisabled,partName:je?.name||(je?.partNo?`PART ${je.partNo}`:void 0)};if("CAMBRIDGE_YLE"===le){const e=Me($e);s.isFirstQuestion=e?0===ne:0===$e,s.isLastQuestion=e?ne===Ve.length-1:$e===re.length-1,s.sidebarProps={parts:Ue,questions:Ve,currentQuestionGlobalIndex:ne,isNavDisabled:z.isNavDisabled,onPartClick:e=>{if(z.isNavDisabled)return;qe.current=e>$e?"forward":"backward",ie(e);const t=Ve.find(t=>t.partIndex===e);t&&se(t.globalIndex),Re()},onQuestionClick:e=>{if(z.isNavDisabled)return;const t=Ve[e];t&&t.partIndex!==$e&&(qe.current=t.partIndex>$e?"forward":"backward",ie(t.partIndex)),se(e),t&&setTimeout(()=>{const e=document.getElementById(`question-${t.questionId}`);e&&e.scrollIntoView({behavior:"smooth",block:"center"})},100)}}}else s.isFirstQuestion=0===$e,s.isLastQuestion=$e===re.length-1;const r="CAMBRIDGE_YLE"===le&&("SPEAKING_DESCRIBE_IMAGE"===je?.questionType||"SPONTANEOUS_QA"===je?.questionType||"SPEAKING_CUE_CARD"===je?.questionType||"READ_DISPLAYED_CONTENT"===je?.questionType),a=Ve[ne],o=r&&a?.partIndex===$e?a.indexInPart:void 0;return t(n,{...s,children:[e(i,{partName:je?.name||(je?.partNo?`PART ${je.partNo}`:void 0),children:e(q,{part:je,answers:z.answers||{},onAnswerChange:Pe,isReviewMode:!1,currentQuestionIndex:o,onExit:Ge,onPartComplete:$e<re.length-1?De:Te,onPartBack:$e>0?Le:void 0,speakingTheme:"CAMBRIDGE_YLE"===le?"CAMBRIDGE_YLE":oe,initialQuestionIndex:"backward"===qe.current?je?.questions.length-1:0,skipTeacherVideo:z.playedIntroParts.has($e)||he!==j,onTeacherIntroPlayed:()=>be($e)})}),z.isSubmitting&&e("div",{className:"fixed inset-0 z-50 flex items-center justify-center bg-black/50",children:t("div",{className:"rounded-xl bg-white p-8 text-center shadow-2xl",children:[e(u,{className:"mx-auto h-12 w-12 animate-spin text-green-500"}),e("p",{className:"mt-4 text-lg font-semibold text-gray-700",children:"Äang ná»™p bà i..."}),e("p",{className:"mt-2 text-sm text-gray-500",children:"Vui lòng đợi trong giây lát"})]})})]})})(),"CAMBRIDGE_YLE"===le?ce&&e(R,{onClose:()=>pe(!1),onSubmit:Ae,isSubmitting:z.isSubmitting}):e(w,{open:ce,onOpenChange:pe,children:t(_,{children:[t(N,{children:[e(A,{children:"Ná»™p bà i thi"}),e(y,{children:"Bạn có chắc chắn muốn ná»™p bà i không? Sau khi ná»™p, bạn sẽ không thể thay đổi câu trả lá»i."})]}),t(v,{children:[e(S,{disabled:z.isSubmitting,children:"Quay lại"}),e(E,{onClick:Ae,disabled:z.isSubmitting,children:z.isSubmitting?t(n,{children:[e(u,{className:"mr-2 h-4 w-4 animate-spin"}),"Äang ná»™p..."]}):"Ná»™p bà i"})]})]})})]})}export function ExamTakingPageContainer(t){return e(Y,{api:t.api,children:e(F,{...t})})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useState as n}from"react";import a from"next/image";import{Loader2 as i,Clock as l,Trophy as r,Layers as s,Target as c,HelpCircle as o,ChevronDown as h,X as m}from"lucide-react";import{PartRow as d,groupPartsByCategory as x}from"./cambridge-yle-waiting-parts";import p from"../../../../components/themes/cambridge-yle/assets/images/background-ocean-edu-2.png";import g from"../../../../components/themes/cambridge-yle/assets/images/frame.png";import u from"../../../../components/themes/cambridge-yle/assets/images/bg-title.png";import b from"../../../../components/themes/cambridge-yle/assets/images/close.png";import f from"../../../../components/themes/cambridge-yle/assets/images/rocket.png";const w=[{q:"Bài test này kéo dài bao lâu?",a:"Thời gian làm bài sẽ được hiển thị trên màn hình. Hãy theo dõi đồng hồ để phân bổ thời gian hợp lý."},{q:"Em có cần hoàn thành tất cả câu hỏi không?",a:"Để kết quả phản ánh chính xác nhất năng lực hiện tại, em cố gắng hoàn thành toàn bộ câu hỏi trong thời gian quy định."},{q:"Nếu mất mạng giữa chừng thì sao?",a:"Trong một số trường hợp, hệ thống có thể tự động lưu tiến trình làm bài. Hãy kết nối lại internet sớm nhất có thể. Tuy nhiên để tránh gián đoạn, em nên sử dụng kết nối internet ổn định trong suốt quá trình làm bài."},{q:"Em không nghe được audio thì phải làm sao?",a:"Em hãy kiểm tra loa, tai nghe và âm lượng thiết bị trước. Nếu vẫn gặp lỗi, hãy thử tải lại trang hoặc đổi sang trình duyệt khác để tiếp tục làm bài."},{q:"Trang web bị lag hoặc không tải được câu hỏi?",a:"Em có thể thử làm mới trang, kiểm tra lại kết nối internet hoặc đổi trình duyệt/thiết bị khác. Nếu tình trạng vẫn tiếp diễn, hãy liên hệ trung tâm để được hỗ trợ nhanh nhất."},{q:"Em có thể xem lại đáp án sau khi nộp bài không?",a:"Sau khi nộp bài, sẽ có phiếu kết quả AI chấm điểm trả về, phân tích từng câu hỏi em đã làm."},{q:"Nếu em nộp nhầm thì sao?",a:"Sau khi nộp bài, em sẽ không thể chỉnh sửa câu trả lời. Em có thể liên hệ thầy cô ở trung tâm để hỗ trợ làm lại bài khác."},{q:"Em có được dùng từ điển hoặc tài liệu không?",a:"Để kết quả phản ánh đúng năng lực hiện tại, em nên làm bài trong điều kiện tương tự một bài kiểm tra thực tế và hạn chế sử dụng tài liệu hỗ trợ."},{q:"Em cần chuẩn bị gì trước khi bắt đầu?",a:"Em nên chuẩn bị thiết bị có kết nối internet ổn định, tai nghe (nếu có phần Listening), không gian yên tĩnh và dành đủ thời gian để hoàn thành bài test liên tục."},{q:"Em nên làm gì nếu gặp lỗi hệ thống?",a:"Nếu gặp lỗi trong quá trình làm bài, em hãy chụp lại màn hình lỗi (nếu có) và liên hệ trung tâm để được hỗ trợ xử lý nhanh nhất."}];function v({className:t="",size:n=18}){return e("svg",{width:n,height:n,viewBox:"0 0 24 24",className:t,fill:"currentColor",children:e("path",{d:"M12 0l2.4 9.6L24 12l-9.6 2.4L12 24l-2.4-9.6L0 12l9.6-2.4L12 0z"})})}export function CambridgeYleWaitingRoom({room:i,onStart:f,isStarting:k,showCountdown:_,autoStartCountdown:C,closeRedirectUrl:z,onClose:j}){const q=i.exam?.name||"",S=i.contest?.name||"",E=i.exam?.parts??[],B=E.length>0?E.length:i.exam?.numberOfParts||1,I=i.exam?.durationMinutes||45,L=i.exam?.totalScore||100,W=i.exam?.passScore||0,P=i.exam?.level?.trim()||"",[T,$]=n(!1),[O,R]=n(0);return t("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden",children:[e("div",{className:"absolute inset-0 scale-105 bg-cover bg-center",style:{backgroundImage:`url(${p.src})`,filter:"blur(2px) brightness(0.8) saturate(0.9)"}}),e("div",{className:"absolute inset-0 bg-gradient-to-b from-blue-950/50 via-blue-900/40 to-blue-950/60"}),e(v,{className:"absolute left-[8%] top-[14%] text-yellow-300 drop-shadow-[0_0_8px_rgba(255,255,150,0.8)]",size:22}),e(v,{className:"absolute right-[10%] top-[10%] text-yellow-200 drop-shadow-[0_0_8px_rgba(255,255,150,0.8)]",size:16}),e(v,{className:"absolute left-[15%] bottom-[18%] text-white/80",size:14}),e(v,{className:"absolute right-[6%] bottom-[24%] text-yellow-300 drop-shadow-[0_0_8px_rgba(255,255,150,0.8)]",size:20}),e(v,{className:"absolute left-[45%] top-[8%] text-white/70",size:12}),e("div",{className:"relative z-10",style:{width:"min(98vw, calc(98vh * 1552 / 672), 1800px)"},children:t("div",{className:"relative aspect-[1552/672] w-full",children:[e(a,{src:g,alt:"",fill:!0,className:"object-contain",priority:!0,unoptimized:!0}),e("div",{className:"absolute left-1/2 top-0 z-20 max-w-[min(92%,720px,calc(100%-7rem))] -translate-x-1/2 -translate-y-1/2",children:e("div",{className:"relative flex h-[clamp(52px,7vw,72px)] min-w-[240px] max-w-full items-center justify-center px-6 pt-0.5 drop-shadow-xl sm:px-15",style:{borderStyle:"solid",borderColor:"transparent",borderWidth:0,borderImageSource:`url(${u.src})`,borderImageSlice:"10 85 fill",borderImageWidth:"0 calc(clamp(52px, 7vw, 72px) / 2)",borderImageRepeat:"stretch"},children:e("span",{className:"relative z-10 whitespace-nowrap text-center text-sm font-extrabold uppercase tracking-[0.12em] text-white drop-shadow sm:text-base sm:tracking-[0.15em]",children:S})})}),e("button",{onClick:()=>{j?j():z&&(window.location.href=z)},className:"absolute right-[7%] top-[-2%] z-30 cursor-pointer transition-transform hover:scale-110 active:scale-95","aria-label":"Close",children:e(a,{src:b,alt:"Close",width:56,height:56,unoptimized:!0})}),t("div",{className:"absolute inset-0 z-10 overflow-hidden px-[9%] pt-[4%] pb-[calc(7%+1.75rem)]",children:[t("div",{className:"flex h-full min-h-0 items-stretch gap-4",children:[t("div",{className:"mx-auto flex h-full w-full max-w-[560px] min-h-0 flex-[0_0_46%] flex-col gap-1",children:[e("h1",{className:"shrink-0 text-center text-2xl font-black uppercase tracking-wide text-white sm:text-3xl md:text-4xl lg:text-5xl 2xl:text-5xl",style:{fontWeight:900,margin:"0.1em 0",textShadow:["0 1px 0 #cfe3ff","0 2px 0 #a8c8ee","0 3px 0 #6f9cd4","0 4px 0 #4a7cb8","0 5px 0 #2f5e9c","0 6px 0 #1a4480","0 8px 12px rgba(0,0,0,0.45)","0 0 22px rgba(120,180,255,0.55)"].join(", ")},children:i.name}),P?e("div",{className:"flex w-full min-w-0 shrink-0 flex-col items-center gap-1 px-1",children:e("span",{className:"rounded-full bg-cyan-400/25 px-2 py-0.5 text-[10px] font-black uppercase tracking-wide text-white ring-1 ring-cyan-300/40",children:P})}):null,e("p",{className:"mt-0.5 hidden shrink-0 text-center text-sm font-bold text-[#21cffb] md:text-base 2xl:block 2xl:text-lg",children:"Đánh giá năng lực • Xác định lộ trình • Bứt phá tương lai"}),e("p",{className:"mx-auto mt-0.5 hidden max-w-2xl shrink-0 text-center text-xs text-white/95 md:text-sm 2xl:block",children:"Bài thi giúp bạn biết chính xác trình độ hiện tại và được Ocean Edu tư vấn lộ trình học tập phù hợp nhất."}),t("div",{className:"mt-1.5 hidden shrink-0 items-center justify-center gap-2 2xl:flex",children:[e("span",{className:"h-px w-10 bg-white"}),e(v,{className:"text-white",size:12}),e("span",{className:"text-xs font-extrabold uppercase tracking-[0.3em] text-white md:text-sm",children:"Bài thi bao gồm"}),e(v,{className:"text-white",size:12}),e("span",{className:"h-px w-10 bg-white"})]}),t("div",{className:"mt-1.5 grid shrink-0 grid-cols-3 gap-2",children:[e(y,{icon:e(s,{className:"h-5 w-5"}),value:B,label:"Phần thi"}),e(y,{icon:e(l,{className:"h-5 w-5"}),value:I,label:"Phút"}),e(y,{icon:e(r,{className:"h-5 w-5"}),value:L,label:"Tổng điểm"})]}),E.length>0?t("div",{className:"mt-1.5 flex min-h-0 flex-1 flex-col overflow-hidden rounded-2xl bg-black/15 p-2 ring-1 ring-white/10",children:[q?t("div",{className:"mb-1.5 flex w-full shrink-0 flex-col items-center gap-0.5 rounded-xl bg-gradient-to-r from-cyan-400/20 via-sky-300/25 to-cyan-400/20 px-2.5 py-1.5 ring-1 ring-cyan-200/40",title:q,children:[e("span",{className:"text-[10px] font-extrabold uppercase tracking-[0.2em] text-cyan-200",children:"Đề thi"}),e("p",{className:"w-full truncate text-center text-sm font-black leading-snug text-white drop-shadow-sm md:text-base",children:q})]}):null,t("div",{className:"mb-1 flex shrink-0 items-center justify-between px-1.5 pt-0.5",children:[e("span",{className:"text-xs font-extrabold uppercase tracking-[0.18em] text-white",children:"Cấu trúc bài thi"}),W>0&&t("span",{className:"text-xs font-semibold text-white",children:["Điểm đạt:"," ",t("span",{className:"font-black text-yellow-300",children:[W,"/",L]})]})]}),e("div",{className:"cambridge-scrollbar min-h-0 flex-1 overflow-y-auto pr-1.5",children:e("div",{className:"space-y-2.5",children:x(E).map(n=>t("div",{className:"space-y-1.5",children:[t("div",{className:"flex items-center gap-2 px-1",children:[e("span",{className:"flex-none text-[11px] font-extrabold uppercase tracking-[0.14em] text-cyan-200",children:n.label}),e("span",{className:"h-px flex-1 bg-white/15"}),n.totalPoints>0&&t("span",{className:"flex-none text-[11px] font-bold text-white/75",children:[n.totalPoints," điểm"]})]}),n.parts.map((t,a)=>e(d,{part:t,showSkill:!1},t.id||`${n.key}-${a}`))]},n.key))})})]}):W>0&&t("div",{className:"mt-1.5 flex shrink-0 items-center gap-3 rounded-xl bg-[#0000001c] px-3 py-2.5",children:[e("span",{className:"flex h-9 w-9 flex-none items-center justify-center rounded-full bg-[#00000021] text-white",children:e(c,{className:"h-4 w-4"})}),e("span",{className:"text-sm font-bold text-white md:text-base",children:"Điểm tối thiểu cần đạt"}),t("span",{className:"ml-auto text-sm font-black text-yellow-300 md:text-lg",children:[W,"/",L]})]})]}),e("div",{className:"relative hidden flex-[0_0_42%] md:block",children:e("div",{className:"absolute left-0 top-[4%] z-20 max-w-[60%]",children:t("div",{className:"relative rounded-2xl bg-white px-3 py-2 text-center text-[11px] font-semibold text-sky-900 shadow-xl ring-2 ring-sky-200 md:text-xs",children:["Cùng mình khám phá trình độ của bạn nhé!",e("span",{className:"absolute -bottom-1.5 right-6 h-3 w-3 rotate-45 bg-white ring-2 ring-sky-200"})]})})})]}),e("div",{className:"pointer-events-none absolute inset-x-[9%] bottom-[6%] z-20 flex justify-center",children:e("div",{className:"pointer-events-auto",children:e(N,{onClick:f,isStarting:k,showCountdown:_,autoStartCountdown:C})})})]})]})}),t("button",{type:"button",onClick:()=>$(!0),"aria-label":"Câu hỏi thường gặp",className:"group fixed bottom-5 right-5 z-40 inline-flex cursor-pointer items-center gap-2 rounded-full bg-gradient-to-b from-cyan-300 via-sky-500 to-sky-700 px-4 py-3 text-sm font-bold text-white shadow-[0_6px_0_0_#0c4a6e,0_10px_22px_rgba(14,165,233,0.45)] ring-2 ring-cyan-200/50 transition-all duration-150 hover:-translate-y-0.5 hover:brightness-110 active:translate-y-1 active:shadow-[0_1px_0_0_#0c4a6e,0_3px_8px_rgba(14,165,233,0.3)]",children:[e(o,{className:"h-5 w-5",strokeWidth:2.5}),e("span",{className:"hidden sm:inline",style:{textShadow:"0 1px 0 rgba(12,74,110,0.5)"},children:"Câu hỏi thường gặp"})]}),T&&t("div",{className:"fixed inset-0 z-[60] flex items-center justify-center p-4",role:"dialog","aria-modal":"true","aria-label":"Câu hỏi thường gặp",children:[e("div",{className:"absolute inset-0 bg-blue-950/70 backdrop-blur-sm",onClick:()=>$(!1)}),t("div",{className:"relative z-10 flex max-h-[85vh] w-full max-w-2xl flex-col overflow-hidden rounded-3xl bg-gradient-to-br from-cyan-300/20 via-white/5 to-white/0 p-px shadow-[0_20px_60px_-15px_rgba(10,75,140,0.7)] backdrop-blur-xl",children:[e("div",{className:"pointer-events-none absolute -left-12 -top-12 h-40 w-40 rounded-full bg-cyan-400/30 blur-3xl"}),e("div",{className:"pointer-events-none absolute -right-12 -bottom-12 h-40 w-40 rounded-full bg-sky-500/25 blur-3xl"}),t("div",{className:"relative flex max-h-[85vh] flex-col overflow-hidden rounded-[calc(1.5rem-1px)] bg-gradient-to-b from-[#0e3d70]/95 via-[#0a4b8c]/95 to-[#0a3866]/95 ring-1 ring-cyan-300/20",children:[t("div",{className:"flex items-center gap-3 px-6 py-5",children:[e("div",{className:"flex h-12 w-12 flex-none items-center justify-center rounded-full bg-gradient-to-br from-cyan-300 to-sky-600 shadow-[0_6px_18px_-4px_rgba(34,211,238,0.6)] ring-4 ring-cyan-300/20",children:e(o,{className:"h-6 w-6 text-white",strokeWidth:2.5})}),t("div",{className:"flex-1",children:[e("h2",{className:"text-lg font-extrabold tracking-tight text-white drop-shadow-md",children:"Câu hỏi thường gặp"}),e("p",{className:"mt-0.5 text-xs font-medium text-cyan-100/70",children:"Những điều cần biết trước khi làm bài"})]}),e("button",{type:"button",onClick:()=>$(!1),"aria-label":"Đóng",className:"flex h-9 w-9 flex-none cursor-pointer items-center justify-center rounded-full bg-white/10 text-white/80 ring-1 ring-white/15 transition-all duration-150 hover:bg-white/20 hover:text-white",children:e(m,{className:"h-5 w-5"})})]}),e("div",{className:"mx-6 h-px bg-gradient-to-r from-transparent via-cyan-300/25 to-transparent"}),e("div",{className:"flex-1 overflow-y-auto px-4 py-4 sm:px-6",children:e("ul",{className:"space-y-2",children:w.map((n,a)=>{const i=O===a;return t("li",{className:"overflow-hidden rounded-2xl ring-1 transition-colors duration-200 "+(i?"bg-white/[0.08] ring-cyan-300/30":"bg-white/[0.04] ring-white/10 hover:bg-white/[0.06]"),children:[t("button",{type:"button",onClick:()=>R(i?null:a),className:"flex w-full cursor-pointer items-center gap-3 px-4 py-3 text-left","aria-expanded":i,children:[e("span",{className:"flex h-7 w-7 flex-none items-center justify-center rounded-full text-xs font-black transition-colors "+(i?"bg-gradient-to-br from-yellow-300 to-orange-500 text-white":"bg-white/10 text-cyan-100"),children:a+1}),e("span",{className:"flex-1 text-sm font-bold text-white",children:n.q}),e(h,{className:"h-5 w-5 flex-none text-cyan-200 transition-transform duration-200 "+(i?"rotate-180":"")})]}),e("div",{className:"grid transition-all duration-200 "+(i?"grid-rows-[1fr] opacity-100":"grid-rows-[0fr] opacity-0"),children:e("div",{className:"overflow-hidden",children:e("p",{className:"px-4 pb-4 pl-14 text-sm leading-relaxed text-cyan-50/90",children:n.a})})})]},a)})})}),e("div",{className:"border-t border-white/10 bg-white/[0.03] px-6 py-3 text-center text-xs text-cyan-100/60",children:"Cần hỗ trợ thêm? Liên hệ trung tâm Ocean Edu để được giải đáp."})]})]})]})]})}function y({icon:n,value:a,label:i}){return t("div",{className:"flex items-center justify-center gap-2 rounded-2xl bg-[#0000001c] px-2 py-2",children:[e("span",{className:"flex h-8 w-8 flex-none items-center justify-center rounded-full bg-[#00bdff1a] text-white md:h-9 md:w-9",children:n}),t("div",{className:"flex flex-col items-start leading-tight",children:[e("div",{className:"text-xl font-black text-white md:text-2xl",children:a}),e("div",{className:"text-[11px] font-bold text-white/90 md:text-xs",children:i})]})]})}function N({onClick:n,isStarting:l,showCountdown:r,autoStartCountdown:s}){return r?e("div",{className:"inline-flex h-14 w-48 items-center justify-center rounded-full bg-yellow-400 text-2xl font-black text-[#1a3a6e]",children:s}):t("button",{onClick:n,disabled:l,className:"group relative inline-flex cursor-pointer items-center gap-3 rounded-full bg-gradient-to-b from-[#ffd54a] via-[#ffb733] to-[#ff8a1f] py-2.5 pl-8 pr-10 shadow-[0_6px_0_0_#c46410,0_10px_18px_rgba(0,0,0,0.4)] ring-2 ring-orange-300/60 transition-all duration-150 hover:-translate-y-0.5 hover:brightness-110 hover:shadow-[0_8px_0_0_#c46410,0_14px_22px_rgba(0,0,0,0.45)] active:translate-y-1.5 active:shadow-[0_1px_0_0_#c46410,0_2px_6px_rgba(0,0,0,0.3)] disabled:cursor-not-allowed disabled:opacity-70",children:[l?e(i,{className:"h-7 w-7 animate-spin text-white"}):e(a,{src:f,alt:"",width:36,height:36,unoptimized:!0}),e("span",{className:"text-xl font-black text-white",style:{color:"#685030"},children:"Bắt đầu"})]})}
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useState as n}from"react";import a from"next/image";import{Loader2 as i,Clock as l,Trophy as s,Layers as r,Target as c,HelpCircle as o,ChevronDown as h,X as m}from"lucide-react";import{PartRow as d,groupPartsByCategory as x}from"./cambridge-yle-waiting-parts";import p from"../../../../components/themes/cambridge-yle/assets/images/background-ocean-edu-2.png";import g from"../../../../components/themes/cambridge-yle/assets/images/frame.png";import u from"../../../../components/themes/cambridge-yle/assets/images/bg-title.png";import b from"../../../../components/themes/cambridge-yle/assets/images/close.png";import f from"../../../../components/themes/cambridge-yle/assets/images/rocket.png";const w=[{q:"Bài test này kéo dài bao lâu?",a:"Thời gian làm bài sẽ được hiển thị trên màn hình. Hãy theo dõi đồng hồ để phân bổ thời gian hợp lý."},{q:"Em có cần hoàn thành tất cả câu hỏi không?",a:"Để kết quả phản ánh chính xác nhất năng lực hiện tại, em cố gắng hoàn thành toàn bộ câu hỏi trong thời gian quy định."},{q:"Nếu mất mạng giữa chừng thì sao?",a:"Trong một số trường hợp, hệ thống có thể tự động lưu tiến trình làm bài. Hãy kết nối lại internet sớm nhất có thể. Tuy nhiên để tránh gián đoạn, em nên sử dụng kết nối internet ổn định trong suốt quá trình làm bài."},{q:"Em không nghe được audio thì phải làm sao?",a:"Em hãy kiểm tra loa, tai nghe và âm lượng thiết bị trước. Nếu vẫn gặp lỗi, hãy thử tải lại trang hoặc đổi sang trình duyệt khác để tiếp tục làm bài."},{q:"Trang web bị lag hoặc không tải được câu hỏi?",a:"Em có thể thử làm mới trang, kiểm tra lại kết nối internet hoặc đổi trình duyệt/thiết bị khác. Nếu tình trạng vẫn tiếp diễn, hãy liên hệ trung tâm để được hỗ trợ nhanh nhất."},{q:"Em có thể xem lại đáp án sau khi nộp bài không?",a:"Sau khi nộp bài, sẽ có phiếu kết quả AI chấm điểm trả về, phân tích từng câu hỏi em đã làm."},{q:"Nếu em nộp nhầm thì sao?",a:"Sau khi nộp bài, em sẽ không thể chỉnh sửa câu trả lời. Em có thể liên hệ thầy cô ở trung tâm để hỗ trợ làm lại bài khác."},{q:"Em có được dùng từ điển hoặc tài liệu không?",a:"Để kết quả phản ánh đúng năng lực hiện tại, em nên làm bài trong điều kiện tương tự một bài kiểm tra thực tế và hạn chế sử dụng tài liệu hỗ trợ."},{q:"Em cần chuẩn bị gì trước khi bắt đầu?",a:"Em nên chuẩn bị thiết bị có kết nối internet ổn định, tai nghe (nếu có phần Listening), không gian yên tĩnh và dành đủ thời gian để hoàn thành bài test liên tục."},{q:"Em nên làm gì nếu gặp lỗi hệ thống?",a:"Nếu gặp lỗi trong quá trình làm bài, em hãy chụp lại màn hình lỗi (nếu có) và liên hệ trung tâm để được hỗ trợ xử lý nhanh nhất."}];function v({className:t="",size:n=18}){return e("svg",{width:n,height:n,viewBox:"0 0 24 24",className:t,fill:"currentColor",children:e("path",{d:"M12 0l2.4 9.6L24 12l-9.6 2.4L12 24l-2.4-9.6L0 12l9.6-2.4L12 0z"})})}export function CambridgeYleWaitingRoom({room:i,onStart:f,isStarting:k,showCountdown:_,autoStartCountdown:C,closeRedirectUrl:z,onClose:j}){const q=i.exam?.name||"",S=i.contest?.name||"",E=i.exam?.parts??[],I=E.length>0?E.length:i.exam?.numberOfParts||1,B=i.exam?.durationMinutes||45,L=i.exam?.totalScore||100,T=i.exam?.passScore||0,W=i.exam?.level?.trim()||"",[P,$]=n(!1),[H,O]=n(0);return t("div",{className:"fixed inset-0 z-50 flex items-center justify-center overflow-hidden",children:[e("div",{className:"absolute inset-0 scale-105 bg-cover bg-center",style:{backgroundImage:`url(${p.src})`,filter:"blur(2px) brightness(0.8) saturate(0.9)"}}),e("div",{className:"absolute inset-0 bg-gradient-to-b from-blue-950/50 via-blue-900/40 to-blue-950/60"}),e(v,{className:"absolute left-[8%] top-[14%] text-yellow-300 drop-shadow-[0_0_8px_rgba(255,255,150,0.8)]",size:22}),e(v,{className:"absolute right-[10%] top-[10%] text-yellow-200 drop-shadow-[0_0_8px_rgba(255,255,150,0.8)]",size:16}),e(v,{className:"absolute left-[15%] bottom-[18%] text-white/80",size:14}),e(v,{className:"absolute right-[6%] bottom-[24%] text-yellow-300 drop-shadow-[0_0_8px_rgba(255,255,150,0.8)]",size:20}),e(v,{className:"absolute left-[45%] top-[8%] text-white/70",size:12}),e("div",{className:"relative z-10",style:{width:"min(98vw, calc(98vh * 1552 / 672), 1800px)"},children:t("div",{className:"relative aspect-[1552/672] w-full",children:[e(a,{src:g,alt:"",fill:!0,className:"object-contain",priority:!0,unoptimized:!0}),e("div",{className:"absolute left-1/2 top-0 z-20 max-w-[min(92%,720px,calc(100%-7rem))] -translate-x-1/2 -translate-y-1/2",children:e("div",{className:"relative flex h-[clamp(52px,7vw,72px)] min-w-[240px] max-w-full items-center justify-center px-6 pt-0.5 drop-shadow-xl sm:px-15",style:{borderStyle:"solid",borderColor:"transparent",borderWidth:0,borderImageSource:`url(${u.src})`,borderImageSlice:"10 85 fill",borderImageWidth:"0 calc(clamp(52px, 7vw, 72px) / 2)",borderImageRepeat:"stretch"},children:e("span",{className:"relative z-10 whitespace-nowrap text-center text-sm font-extrabold uppercase tracking-[0.12em] text-white drop-shadow sm:text-base sm:tracking-[0.15em]",children:S})})}),e("button",{onClick:()=>{j?j():z&&(window.location.href=z)},className:"absolute right-[7%] top-[-2%] z-30 cursor-pointer transition-transform hover:scale-110 active:scale-95","aria-label":"Close",children:e(a,{src:b,alt:"Close",width:56,height:56,unoptimized:!0})}),t("div",{className:"absolute inset-0 z-10 overflow-hidden px-[9%] pt-[4%] pb-[calc(7%+1.75rem)]",children:[t("div",{className:"flex h-full min-h-0 items-stretch gap-4",children:[t("div",{className:"mx-auto flex h-full w-full max-w-[560px] min-h-0 flex-[0_0_46%] flex-col gap-1",children:[e("h1",{className:"shrink-0 text-center text-2xl font-black uppercase tracking-wide text-white sm:text-3xl md:text-4xl lg:text-5xl 2xl:text-5xl",style:{fontWeight:900,margin:"0.1em 0",textShadow:["0 1px 0 #cfe3ff","0 2px 0 #a8c8ee","0 3px 0 #6f9cd4","0 4px 0 #4a7cb8","0 5px 0 #2f5e9c","0 6px 0 #1a4480","0 8px 12px rgba(0,0,0,0.45)","0 0 22px rgba(120,180,255,0.55)"].join(", ")},children:i.name}),W?e("div",{className:"flex w-full min-w-0 shrink-0 flex-col items-center gap-1 px-1",children:e("span",{className:"rounded-full bg-cyan-400/30 px-3 py-0.5 text-[11px] font-black uppercase tracking-wider text-cyan-100 ring-1 ring-cyan-300/60 shadow-sm backdrop-blur-xs",children:W})}):null,e("p",{className:"mt-0.5 hidden shrink-0 text-center text-sm font-bold text-[#21cffb] md:text-base 2xl:block 2xl:text-lg",children:"Đánh giá năng lực • Xác định lộ trình • Bứt phá tương lai"}),e("p",{className:"mx-auto mt-0.5 hidden max-w-2xl shrink-0 text-center text-xs font-medium text-cyan-50/90 drop-shadow-sm md:text-sm 2xl:block",children:"Bài thi giúp bạn biết chính xác trình độ hiện tại và được Ocean Edu tư vấn lộ trình học tập phù hợp nhất."}),t("div",{className:"mt-1.5 hidden shrink-0 items-center justify-center gap-2 2xl:flex",children:[e("span",{className:"h-px w-10 bg-white"}),e(v,{className:"text-white",size:12}),e("span",{className:"text-xs font-extrabold uppercase tracking-[0.3em] text-white md:text-sm",children:"Bài thi bao gồm"}),e(v,{className:"text-white",size:12}),e("span",{className:"h-px w-10 bg-white"})]}),t("div",{className:"mt-1.5 grid shrink-0 grid-cols-3 gap-2",children:[e(y,{icon:e(r,{className:"h-5 w-5"}),value:I,label:"Phần thi"}),e(y,{icon:e(l,{className:"h-5 w-5"}),value:B,label:"Phút"}),e(y,{icon:e(s,{className:"h-5 w-5"}),value:L,label:"Tổng điểm"})]}),E.length>0?t("div",{className:"mt-2 flex min-h-0 flex-1 flex-col overflow-hidden",children:[q?t("div",{className:"mb-2 flex w-full shrink-0 flex-col items-center py-1",title:q,children:[e("span",{className:"text-[11px] font-black uppercase tracking-[0.25em] text-cyan-300/90",children:"ĐỀ THI"}),e("h2",{className:"w-full truncate text-center text-base font-black uppercase tracking-wide text-white drop-shadow-sm sm:text-lg md:text-xl",children:q})]}):null,t("div",{className:"mb-2 flex shrink-0 items-center justify-between px-1",children:[e("span",{className:"text-xs font-black uppercase tracking-[0.2em] text-cyan-100 sm:text-sm",children:"Cấu trúc bài thi"}),T>0&&t("span",{className:"text-xs font-bold text-white/90 sm:text-sm",children:["Điểm đạt:"," ",t("span",{className:"font-black text-yellow-300",children:[T,"/",L]})]})]}),e("div",{className:"cambridge-scrollbar min-h-0 flex-1 overflow-y-auto pr-1 pb-2",children:e("div",{className:"space-y-2.5 pb-8",children:x(E).map(n=>t("div",{className:"space-y-1.5",children:[t("div",{className:"flex items-center gap-2 px-1",children:[e("span",{className:"flex-none text-[11px] font-extrabold uppercase tracking-[0.14em] text-cyan-200",children:n.label}),e("span",{className:"h-px flex-1 bg-white/15"}),n.totalPoints>0&&t("span",{className:"flex-none text-[11px] font-bold text-white/75",children:[n.totalPoints," điểm"]})]}),n.parts.map((t,a)=>e(d,{part:t,showSkill:!1},t.id||`${n.key}-${a}`))]},n.key))})})]}):T>0&&t("div",{className:"mt-1.5 flex shrink-0 items-center gap-3 rounded-xl bg-[#0000001c] px-3 py-2.5",children:[e("span",{className:"flex h-9 w-9 flex-none items-center justify-center rounded-full bg-[#00000021] text-white",children:e(c,{className:"h-4 w-4"})}),e("span",{className:"text-sm font-bold text-white md:text-base",children:"Điểm tối thiểu cần đạt"}),t("span",{className:"ml-auto text-sm font-black text-yellow-300 md:text-lg",children:[T,"/",L]})]})]}),e("div",{className:"relative hidden flex-[0_0_42%] md:block",children:e("div",{className:"absolute left-0 top-[4%] z-20 max-w-[60%]",children:t("div",{className:"relative rounded-2xl bg-white px-3 py-2 text-center text-[11px] font-semibold text-sky-900 shadow-xl ring-2 ring-sky-200 md:text-xs",children:["Cùng mình khám phá trình độ của bạn nhé!",e("span",{className:"absolute -bottom-1.5 right-6 h-3 w-3 rotate-45 bg-white ring-2 ring-sky-200"})]})})})]}),e("div",{className:"pointer-events-none absolute inset-x-[9%] bottom-[6%] z-20 flex justify-center",children:e("div",{className:"pointer-events-auto",children:e(N,{onClick:f,isStarting:k,showCountdown:_,autoStartCountdown:C})})})]})]})}),t("button",{type:"button",onClick:()=>$(!0),"aria-label":"Câu hỏi thường gặp",className:"group fixed bottom-5 right-5 z-40 inline-flex cursor-pointer items-center gap-2 rounded-full bg-gradient-to-b from-cyan-300 via-sky-500 to-sky-700 px-4 py-3 text-sm font-bold text-white shadow-[0_6px_0_0_#0c4a6e,0_10px_22px_rgba(14,165,233,0.45)] ring-2 ring-cyan-200/50 transition-all duration-150 hover:-translate-y-0.5 hover:brightness-110 active:translate-y-1 active:shadow-[0_1px_0_0_#0c4a6e,0_3px_8px_rgba(14,165,233,0.3)]",children:[e(o,{className:"h-5 w-5",strokeWidth:2.5}),e("span",{className:"hidden sm:inline",style:{textShadow:"0 1px 0 rgba(12,74,110,0.5)"},children:"Câu hỏi thường gặp"})]}),P&&t("div",{className:"fixed inset-0 z-[60] flex items-center justify-center p-4",role:"dialog","aria-modal":"true","aria-label":"Câu hỏi thường gặp",children:[e("div",{className:"absolute inset-0 bg-blue-950/70 backdrop-blur-sm",onClick:()=>$(!1)}),t("div",{className:"relative z-10 flex max-h-[85vh] w-full max-w-2xl flex-col overflow-hidden rounded-3xl bg-gradient-to-br from-cyan-300/20 via-white/5 to-white/0 p-px shadow-[0_20px_60px_-15px_rgba(10,75,140,0.7)] backdrop-blur-xl",children:[e("div",{className:"pointer-events-none absolute -left-12 -top-12 h-40 w-40 rounded-full bg-cyan-400/30 blur-3xl"}),e("div",{className:"pointer-events-none absolute -right-12 -bottom-12 h-40 w-40 rounded-full bg-sky-500/25 blur-3xl"}),t("div",{className:"relative flex max-h-[85vh] flex-col overflow-hidden rounded-[calc(1.5rem-1px)] bg-gradient-to-b from-[#0e3d70]/95 via-[#0a4b8c]/95 to-[#0a3866]/95 ring-1 ring-cyan-300/20",children:[t("div",{className:"flex items-center gap-3 px-6 py-5",children:[e("div",{className:"flex h-12 w-12 flex-none items-center justify-center rounded-full bg-gradient-to-br from-cyan-300 to-sky-600 shadow-[0_6px_18px_-4px_rgba(34,211,238,0.6)] ring-4 ring-cyan-300/20",children:e(o,{className:"h-6 w-6 text-white",strokeWidth:2.5})}),t("div",{className:"flex-1",children:[e("h2",{className:"text-lg font-extrabold tracking-tight text-white drop-shadow-md",children:"Câu hỏi thường gặp"}),e("p",{className:"mt-0.5 text-xs font-medium text-cyan-100/70",children:"Những điều cần biết trước khi làm bài"})]}),e("button",{type:"button",onClick:()=>$(!1),"aria-label":"Đóng",className:"flex h-9 w-9 flex-none cursor-pointer items-center justify-center rounded-full bg-white/10 text-white/80 ring-1 ring-white/15 transition-all duration-150 hover:bg-white/20 hover:text-white",children:e(m,{className:"h-5 w-5"})})]}),e("div",{className:"mx-6 h-px bg-gradient-to-r from-transparent via-cyan-300/25 to-transparent"}),e("div",{className:"flex-1 overflow-y-auto px-4 py-4 sm:px-6",children:e("ul",{className:"space-y-2",children:w.map((n,a)=>{const i=H===a;return t("li",{className:"overflow-hidden rounded-2xl ring-1 transition-colors duration-200 "+(i?"bg-white/[0.08] ring-cyan-300/30":"bg-white/[0.04] ring-white/10 hover:bg-white/[0.06]"),children:[t("button",{type:"button",onClick:()=>O(i?null:a),className:"flex w-full cursor-pointer items-center gap-3 px-4 py-3 text-left","aria-expanded":i,children:[e("span",{className:"flex h-7 w-7 flex-none items-center justify-center rounded-full text-xs font-black transition-colors "+(i?"bg-gradient-to-br from-yellow-300 to-orange-500 text-white":"bg-white/10 text-cyan-100"),children:a+1}),e("span",{className:"flex-1 text-sm font-bold text-white",children:n.q}),e(h,{className:"h-5 w-5 flex-none text-cyan-200 transition-transform duration-200 "+(i?"rotate-180":"")})]}),e("div",{className:"grid transition-all duration-200 "+(i?"grid-rows-[1fr] opacity-100":"grid-rows-[0fr] opacity-0"),children:e("div",{className:"overflow-hidden",children:e("p",{className:"px-4 pb-4 pl-14 text-sm leading-relaxed text-cyan-50/90",children:n.a})})})]},a)})})}),e("div",{className:"border-t border-white/10 bg-white/[0.03] px-6 py-3 text-center text-xs text-cyan-100/60",children:"Cần hỗ trợ thêm? Liên hệ trung tâm Ocean Edu để được giải đáp."})]})]})]})]})}function y({icon:n,value:a,label:i}){return t("div",{className:"flex items-center justify-center gap-2 rounded-2xl bg-black/25 px-2 py-2 ring-1 ring-white/10 shadow-inner",children:[e("span",{className:"flex h-8 w-8 flex-none items-center justify-center rounded-full bg-cyan-400/20 text-cyan-200 ring-1 ring-cyan-300/30 md:h-9 md:w-9",children:n}),t("div",{className:"flex flex-col items-start leading-tight",children:[e("div",{className:"text-xl font-black text-white md:text-2xl",children:a}),e("div",{className:"text-[11px] font-extrabold text-cyan-100/95 md:text-xs",children:i})]})]})}function N({onClick:n,isStarting:l,showCountdown:s,autoStartCountdown:r}){return s?e("div",{className:"inline-flex h-14 w-48 items-center justify-center rounded-full bg-yellow-400 text-2xl font-black text-[#1a3a6e]",children:r}):t("button",{onClick:n,disabled:l,className:"group relative inline-flex cursor-pointer items-center gap-3 rounded-full bg-gradient-to-b from-[#ffd54a] via-[#ffb733] to-[#ff8a1f] py-2.5 pl-8 pr-10 shadow-[0_6px_0_0_#c46410,0_10px_18px_rgba(0,0,0,0.4)] ring-2 ring-orange-300/60 transition-all duration-150 hover:-translate-y-0.5 hover:brightness-110 hover:shadow-[0_8px_0_0_#c46410,0_14px_22px_rgba(0,0,0,0.45)] active:translate-y-1.5 active:shadow-[0_1px_0_0_#c46410,0_2px_6px_rgba(0,0,0,0.3)] disabled:cursor-not-allowed disabled:opacity-70",children:[l?e(i,{className:"h-7 w-7 animate-spin text-white"}):e(a,{src:f,alt:"",width:36,height:36,unoptimized:!0}),e("span",{className:"text-xl font-black text-white",style:{color:"#685030"},children:"Bắt đầu"})]})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{BookOpen as n,Mic as a,Headphones as
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{BookOpen as n,Mic as a,Headphones as r,PenLine as s,MessageSquareText as o}from"lucide-react";const l={READING:{label:"Reading",Icon:n,iconWrap:"bg-emerald-400/20 text-emerald-200 ring-emerald-300/30"},WRITING:{label:"Writing",Icon:s,iconWrap:"bg-orange-400/20 text-orange-200 ring-orange-300/30"},LISTENING:{label:"Listening",Icon:r,iconWrap:"bg-sky-400/20 text-sky-200 ring-sky-300/30"},SPEAKING:{label:"Speaking",Icon:a,iconWrap:"bg-fuchsia-400/20 text-fuchsia-200 ring-fuchsia-300/30"}},i={label:"",Icon:o,iconWrap:"bg-white/15 text-white ring-white/20"};function c(e){const t=e?.trim();return t?t.replace(/_/g," ").toLowerCase().replace(/\band\b/g,"&").replace(/\s+/g," ").trim().replace(/\b\w/g,e=>e.toUpperCase()):"Khác"}export function groupPartsByCategory(e){const t=[],n=new Map;for(const a of e){const e=a.category||a.skill||"OTHER",r=e.toUpperCase();let s=n.get(r);s||(s={key:r,label:c(e),totalPoints:0,parts:[]},n.set(r,s),t.push(r)),s.parts.push(a),a.points>0&&(s.totalPoints+=a.points)}return t.map(e=>n.get(e))}export function PartRow({part:n,showSkill:a=!0}){const r=function(e){const t=(e.skill||"").toUpperCase();if(l[t])return l[t];const n=`${e.skill??""} ${e.category??""}`.toUpperCase();for(const e of Object.keys(l))if(n.includes(e))return l[e];return i}(n),{Icon:s}=r,o=r.label,c=n.questionCount>0?`${n.questionCount} câu`:"";return t("div",{className:"flex items-center gap-3.5 rounded-xl bg-white/[0.08] px-3.5 py-2 ring-1 ring-white/15 transition-colors hover:bg-white/[0.14]",children:[e("span",{className:`flex h-9 w-9 flex-none items-center justify-center rounded-full ring-1.5 ${r.iconWrap}`,children:e(s,{className:"h-5 w-5",strokeWidth:2.5})}),t("div",{className:"min-w-0 flex-1 truncate text-base leading-snug",children:[e("span",{className:"font-black text-white",children:n.name}),a&&o&&t("span",{className:"font-bold text-cyan-100/80",children:[" · ",o]}),c&&t("span",{className:"font-bold text-yellow-200/90",children:[" · ",c]})]}),n.points>0&&t("div",{className:"flex flex-none items-baseline gap-1 rounded-lg bg-black/20 px-2 py-0.5 ring-1 ring-yellow-400/20",children:[e("span",{className:"text-lg font-black text-yellow-300 md:text-xl",children:n.points}),e("span",{className:"text-xs font-black uppercase tracking-wider text-yellow-100",children:"ĐIỂM"})]})]})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import{useCallback as n,useEffect as o,useMemo as i,useState as a}from"react";import{ChevronLeft as s,Download as l,Loader2 as c,Sparkles as d}from"lucide-react";import{ResultTemplateType as m}from"../../api/result-review";import{useToast as u}from"../../shared/lib/hooks/useToast";import{ReviewQuestionRenderer as p}from"./ReviewQuestionRenderer";import{useResultReviewPolling as f}from"./hooks/useResultReviewPolling";import{BadgeTitle as g}from"./report/BadgeTitle";import{OceanEduExamReport as x}from"./report/OceanEduExamReport";import{OverallAssessmentSection as h}from"./report/OverallAssessmentSection";import{ResultErrorState as
|
|
1
|
+
"use client";import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import{useCallback as n,useEffect as o,useMemo as i,useState as a}from"react";import{ChevronLeft as s,Download as l,Loader2 as c,Sparkles as d}from"lucide-react";import{ResultTemplateType as m}from"../../api/result-review";import{useToast as u}from"../../shared/lib/hooks/useToast";import{ReviewQuestionRenderer as p}from"./ReviewQuestionRenderer";import{useResultReviewPolling as f}from"./hooks/useResultReviewPolling";import{BadgeTitle as g}from"./report/BadgeTitle";import{OceanEduExamReport as x}from"./report/OceanEduExamReport";import{OverallAssessmentSection as h}from"./report/OverallAssessmentSection";import{ResultErrorState as w}from"./report/ResultErrorState";import{ResultLoadingState as b}from"./report/ResultLoadingState";import{ResultNotPublicState as S}from"./report/ResultNotPublicState";import{SpeakingRubricSection as v}from"./report/SpeakingRubricSection";import{SpeakingReviewResult as N}from"./speaking/SpeakingReviewResult";import{transformResultAnswersForReview as R}from"./review-data";import{isResultNotPublic as E,setPdfReady as P}from"./review-status.utils";import{unwrap as y}from"./result-review.utils";import{formatTotalScore as k}from"./utils/review-score.utils";import{transformSpeakingResultForReview as A}from"./utils/transform-speaking-review";const L="/student/contests/my-contests";export var PartRubricTemplateCode;!function(e){e.KINDY_VER3="PLACEMENT_TEST_KINDY_VER3",e.PRESCHOOL="PLACEMENT_TEST_PRESCHOOL"}(PartRubricTemplateCode||(PartRubricTemplateCode={}));const T=new Set(Object.values(PartRubricTemplateCode));export function ResultReviewPageContainer({attemptId:s,token:l,api:c,isPrintMode:d=!1,canExportPdf:p=!1,reviewUrl:g,assetBaseUrl:k,loginHref:U,onBack:F,onNavigate:O,topActionsSlot:_,beforeReportSlot:j,afterReportSlot:Q}){const{error:M,success:$}=u(),[H,I]=a(null),[G,K]=a(null),[V,q]=a(!0),[W,X]=a(null),[Y,z]=a(!1),J=n(async e=>{e&&q(!0);try{const[e,t]=await Promise.all([c.getDetailedResult(s,l),c.getAttempt?.(s,l)]);I(y(e)),K(t?y(t):null),X(null)}catch(e){X(e),E(e,Boolean(l))||M({message:"Không thể tải kết quả",description:e instanceof Error?e.message:void 0})}finally{e&&q(!1)}},[c,s,l,M]);o(()=>{J(!0)},[J]);const Z=n(()=>{J(!1)},[J]),{hasPendingQuestions:ee,hasPendingLlm:te,hasFailedLlm:re,retryLlm:ne}=f({detail:H,isPrintMode:d,isLoading:V,onRefetch:Z});o(()=>{if(!d||V)return;const e=requestAnimationFrame(()=>P(!0));return()=>{cancelAnimationFrame(e),P(!1)}},[d,V]);const oe=G?.exam?.template,ie=oe?.parts,ae=G?.studentName??"Học sinh",se=G?.studentUsername??null,le=G?.branchName??"Chưa tham gia chi nhánh",ce=function(e){const t=e?new Date(e):new Date;return Number.isNaN(t.getTime())?(new Date).toLocaleDateString("vi-VN"):t.toLocaleDateString("vi-VN")}(H?.submittedAt),de=i(()=>function(e,t){const r=e??("undefined"!=typeof window?window.location.href:void 0);if(!r||!t)return r;try{const e=new URL(r,"undefined"!=typeof window?window.location.origin:void 0);return e.searchParams.set("token",t),e.toString()}catch{return r}}(g,l??G?.verificationToken),[g,l,G?.verificationToken]),me=i(()=>R(H?.answers??[],ie),[H?.answers,ie]),ue=i(()=>H&&oe?.type===m.SPEAKING?A(H,ae,ie):null,[H,ae,oe?.type,ie]),pe=!!H?.templateCode&&T.has(H.templateCode),fe=i(()=>function(e){const t={};return e?.speakingRubric?.criteria?.forEach(e=>{const r=/^C(\d+)$/.exec(e.code);if(!r)return;const n=null!=e.weightedScore&&null!=e.maxScore;t[Number(r[1])]=n?{score:e.weightedScore,maxScore:e.maxScore,weighted:n}:{score:e.score,maxScore:5,weighted:n}}),t}(H),[H?.speakingRubric]);o(()=>{if("undefined"==typeof window)return;window.history.pushState(null,"",window.location.href);const e=()=>{F?F():O?O(L):window.location.replace(L)};return window.addEventListener("popstate",e),()=>{window.removeEventListener("popstate",e)}},[F,O]);const ge=n(()=>{if(F)return F();O?O(L):"undefined"!=typeof window&&(window.location.href=L)},[F,O]),xe=async()=>{if(H&&c.exportPdf){z(!0);try{const{blob:e,filename:t}=await c.exportPdf(s,oe?.type);!function(e,t){const r=URL.createObjectURL(e),n=document.createElement("a");n.href=r,n.download=t,document.body.appendChild(n),n.click(),document.body.removeChild(n),URL.revokeObjectURL(r)}(e,t),$({message:"Xuất PDF thành công"})}catch(e){M({message:"Không xuất được PDF",description:e instanceof Error?e.message:void 0})}finally{z(!1)}}};return V?e(b,{}):E(W,Boolean(l))?e(S,{loginHref:U,assetBaseUrl:k,onLogin:O}):H?ue?e(N,{reviewData:ue,studentName:ae,studentCode:se,branchName:le,examDateText:ce,examTitle:oe?.title,showDetailedResults:H.showDetailedResults,speakingRubric:H.speakingRubric,reviewUrl:de,assetBaseUrl:k,canExportPdf:p&&Boolean(c.exportPdf),isExporting:Y,hasPendingQuestions:ee,onBack:ge,onExportPdf:xe,topActionsSlot:_,beforeReportSlot:j,afterReportSlot:Q}):e("div",{className:"min-h-screen bg-[#e0e0e0] py-4 md:py-6",children:r("div",{className:"mx-auto flex w-full max-w-[1160px] flex-col gap-4 px-0 sm:px-4",children:[e(D,{onBack:ge,onExport:xe,canExport:p&&Boolean(c.exportPdf),isExporting:Y,topActionsSlot:_}),ee?e(C,{}):null,j,e(x,{studentName:ae,studentCode:se,branchName:le,examDateText:ce,totalScore:H.totalScore,maxScore:H.maxScore,isPendingGrading:Boolean(H.isPendingGrading||ee),examSubTitle:H.roomName,examTitle:oe?.title,reviewUrl:de,assetBaseUrl:k,readingScore:H.readingScore,maxReadingScore:H.maxReadingScore,listeningScore:H.listeningScore,maxListeningScore:H.maxListeningScore,writingScore:H.writingScore,maxWritingScore:H.maxWritingScore,speakingScore:H.speakingScore,maxSpeakingScore:H.maxSpeakingScore,overallAssessmentSlot:r(t,{children:[e(h,{isPending:te,isFailed:re,onRetry:ne,llmOverallAssessment:H.llmOverallAssessment,llmSkillAssessment:H.llmSkillAssessment,correctAnswers:H.correctAnswers,totalQuestions:H.totalQuestions}),H.speakingRubric?.criteria?.length?e(v,{rubric:H.speakingRubric}):null]}),children:!1!==H.showDetailedResults?e(B,{reviewData:me,hidePerQuestionGrading:pe,rubricScores:fe}):null}),Q]})}):e(w,{error:W,onBack:ge})}function D({onBack:t,onExport:n,canExport:o,isExporting:i,topActionsSlot:a}){return r("div",{className:"flex items-center justify-between gap-3 px-3 print:hidden sm:px-0",children:[r("button",{type:"button",onClick:t,className:"inline-flex items-center gap-2 rounded-xl border border-slate-200 bg-white px-4 py-2.5 text-sm font-semibold text-slate-700 shadow-sm transition hover:bg-slate-50",children:[e(s,{className:"h-4 w-4"}),"Quay lại"]}),r("div",{className:"flex items-center gap-3",children:[o?r("button",{type:"button",onClick:()=>{n()},disabled:i,className:"inline-flex items-center gap-2 rounded-xl bg-gradient-to-r from-[#00AEEF] to-[#0099D6] px-5 py-2.5 text-sm font-bold text-white shadow-lg disabled:opacity-50",children:[i?e(c,{className:"h-4 w-4 animate-spin"}):e(l,{className:"h-4 w-4"}),i?"Đang xuất...":"Xuất PDF"]}):null,a]})]})}function C(){return r("div",{className:"mx-3 flex items-center gap-3 rounded-2xl border border-[#b3dfff] bg-gradient-to-r from-[#e8f6ff] to-[#f0f8ff] px-5 py-4 shadow-sm sm:mx-0",children:[e("div",{className:"flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-[#d0edff]",children:e(d,{className:"h-5 w-5 animate-pulse text-[#00AEEF]"})}),r("div",{children:[e("p",{className:"text-sm font-bold text-[#0054A6]",children:"AI đang chấm điểm..."}),e("p",{className:"text-xs text-[#0078c8]",children:"Trang sẽ tự động cập nhật cho đến khi hoàn tất."})]})]})}function B({reviewData:t,hidePerQuestionGrading:n,rubricScores:o}){return e("div",{className:"space-y-6",children:t.parts.map((i,a)=>{const s=n?o[i.partNo]:void 0,l=t.partScoresMap[a],c=s?`${s.weighted?Number(s.score.toFixed(1)):Math.round(s.score)} / ${Math.round(s.maxScore)}`:l?`${k(l.score)} / ${k(l.maxScore)}`:null;return r("section",{className:"relative rounded-[20px] border-2 border-[#00AEEF] bg-white px-5 pb-6 pt-11 md:px-8",children:[e(g,{number:String(i.partNo),title:i.name||`PHẦN ${i.partNo}`}),r("div",{className:"mb-6 flex flex-col gap-4",children:[c?e("div",{className:"flex justify-end",children:r("div",{className:"rounded-full bg-[#0054A6] px-4 py-2 text-sm font-bold text-white",children:["Điểm: ",c]})}):null,i.instructions?e(U,{value:i.instructions}):null]}),e(p,{part:i,reviewData:t,hidePerQuestionGrading:n})]},`${i.partId}-${a}`)})})}function U({value:t}){return/<[a-z][\s\S]*>/i.test(t)?e("div",{className:"text-[17px] font-bold leading-relaxed text-[#0054A6] [&_p]:mb-2 [&_p:last-child]:mb-0",dangerouslySetInnerHTML:{__html:t}}):e("h3",{className:"text-[17px] font-bold leading-relaxed text-[#0054A6]",children:t})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{cn as r}from"../../../shared/lib/utils";import s from"next/image";import l from"./assets/images/phao.png";import
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{cn as r}from"../../../shared/lib/utils";import s from"next/image";import{useEffect as l,useRef as a}from"react";import n from"./assets/images/phao.png";import o from"./assets/images/sanho.png";import i from"./assets/images/sao.png";import c from"./assets/images/vooc.png";const d=[n,o,i,c];export function CambridgeYleSidebar({parts:n,questions:o,currentQuestionGlobalIndex:i,onPartClick:c,onQuestionClick:p,isNavDisabled:m,className:h}){const u=o[i],b=u?u.partIndex:0,x=a(null),f=a([]);return l(()=>{const e=x.current,t=f.current[b];if(!e||!t)return;const r=e.getBoundingClientRect(),s=t.getBoundingClientRect(),l=s.top<r.top,a=s.bottom>r.bottom;(l||a)&&t.scrollIntoView({block:"nearest",behavior:"smooth"})},[b]),t("div",{className:r("flex flex-col w-full h-full pb-4",h),children:[t("div",{ref:x,className:"flex-1 overflow-y-auto custom-scrollbar p-4 lg:p-6 pb-2",children:[t("div",{className:"flex items-center gap-2 mb-4 justify-center uppercase tracking-widest text-[16px]",children:[e("div",{className:"flex items-center justify-center p-1.5 bg-gradient-to-br from-blue-400 to-blue-600 rounded-xl text-white",children:t("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:[e("polygon",{points:"12 2 2 7 12 12 22 7 12 2"}),e("polyline",{points:"2 17 12 22 22 17"}),e("polyline",{points:"2 12 12 17 22 12"})]})}),e("span",{className:"font-black bg-gradient-to-r from-blue-700 to-blue-500 bg-clip-text text-transparent",children:"Parts"})]}),e("div",{className:"flex flex-col gap-2.5",children:n.map((l,a)=>{const o=a===b,i=d[a%d.length],p=a>0?n[a-1].category:null,h=l.category&&l.category!==p;return t("div",{ref:e=>{f.current[a]=e},className:"flex flex-col",children:[h&&t("div",{className:"flex items-center gap-2 mt-5 mb-3 px-1",children:[e("div",{className:"h-[4px] w-4 rounded-full bg-blue-500"}),e("span",{className:"text-[14px] font-black uppercase tracking-[0.15em] text-blue-800",children:l.category?.replace(/_/g," ")}),e("div",{className:"h-[2px] flex-1 rounded-full bg-blue-100"})]}),t("button",{type:"button",onClick:()=>c(a),disabled:m,className:r("flex items-center justify-between p-2 px-[15px] rounded-[15px] transition-all border font-medium shadow-sm",o?"bg-blue-600 text-white border-blue-600":"bg-white text-slate-800 border-transparent",o||m?"":"hover:border-blue-200",m?"opacity-50 cursor-not-allowed":"cursor-pointer"),children:[t("div",{className:"flex items-center gap-3",children:[e("div",{className:"flex items-center justify-center w-8 h-8 shrink-0",children:e(s,{src:i,alt:`part icon ${a}`,className:"w-[30px] h-auto object-contain"})}),e("span",{className:"font-black text-[15px]",children:l.name||`Part ${l.partNo}`})]}),t("div",{className:"flex items-center gap-2 shrink-0",children:[null!=l.points&&l.points>0&&t("span",{className:r("text-[12px] font-black tracking-wide whitespace-nowrap",o?"text-yellow-200":"text-amber-500"),children:[l.points," điểm"]}),t("span",{className:r("text-[13px] font-bold tracking-wide",o?"text-blue-100":"text-blue-900/60"),children:[l.answeredCount,"/",l.totalQuestions]})]})]})]},a)})})]}),e("div",{className:"px-6",children:e("hr",{className:"border-t-2 border-dashed border-blue-100"})}),t("div",{className:"flex-1 p-4 lg:p-6 pt-4 flex flex-col min-h-0",children:[t("div",{className:"flex items-center gap-2 mb-4 justify-center uppercase tracking-widest text-[16px] shrink-0",children:[e("div",{className:"flex items-center justify-center p-1.5 bg-gradient-to-br from-blue-400 to-blue-600 rounded-xl text-white",children:t("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:[e("rect",{width:"8",height:"4",x:"8",y:"2",rx:"1",ry:"1"}),e("path",{d:"M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"}),e("path",{d:"M12 11h4"}),e("path",{d:"M12 16h4"}),e("path",{d:"M8 11h.01"}),e("path",{d:"M8 16h.01"})]})}),e("span",{className:"font-black bg-gradient-to-r from-blue-700 to-blue-500 bg-clip-text text-transparent",children:"Question List"})]}),e("div",{className:"flex-1 overflow-y-auto custom-scrollbar pr-1",children:e("div",{className:"grid grid-cols-5 gap-2",children:o.map(t=>{const s=t.globalIndex===i,l=t.isAnswered;let a="bg-white text-slate-800 shadow-sm border-transparent";return s?a="bg-blue-600 text-white border-blue-600 shadow-md":l&&(a="bg-[#4ade80] text-white border-transparent shadow-sm"),s||m||(a+=" hover:shadow-md hover:text-blue-600"),a+=m?" opacity-50 cursor-not-allowed":" cursor-pointer",e("button",{type:"button",onClick:()=>p(t.globalIndex),disabled:m,className:r("h-[44px] w-full rounded-[10px] flex items-center justify-center font-bold text-[15px] transition-all border",a),children:t.questionNumber},t.globalIndex)})})}),e("div",{className:"shrink-0 mt-4 pt-4 border-t border-blue-200/50",children:t("div",{className:"flex items-center justify-between text-[11px] xl:text-[11.5px] font-bold text-gray-700",children:[t("div",{className:"flex items-center gap-1.5",children:[e("div",{className:"w-3.5 h-3.5 rounded-full bg-blue-600 shadow-sm"}),e("span",{children:"Current"})]}),t("div",{className:"flex items-center gap-1.5",children:[e("div",{className:"w-3.5 h-3.5 rounded-full bg-green-500 shadow-sm"}),e("span",{children:"Answered"})]}),t("div",{className:"flex items-center gap-1.5",children:[e("div",{className:"w-3.5 h-3.5 rounded-full bg-[#f4f9ff] border border-blue-200 shadow-sm"}),e("span",{children:"Not answered"})]})]})})]})]})}
|