https://petwellhk.com/assets/MidAutumnFestivalPayment-B2DglGtG.js

1import{q as T,n as F,r as a,j as e,L as $}from"./react-vendor-BDHNqS4B.js";import{b as D}from"./Header-BkbupWq-.js";import{F as q}from"./Footer-CtylQEAH.js";import{e as H,n as M,B as A,L as P,I as O,U as x}from"./main-m_sUF2N4.js";import{u as W}from"./useSEO-CoArDrdl.js";import{e as G,g as E,M as Y,f as u,k as d}from"./midAutumnFestival2026-GVaMxjdF.js";import{f as z,a as J,b as K,c as X}from"./midAutumnMetaPixel-CU7nfzNg.js";import{M as Q}from"./message-circle-B5m25ymx.js";import{U as V}from"./upload-B1g5jdtK.js";import"./amplify-DYDcjoow.js";import"./chevron-right-CpkQxGj-.js";import"./check-DS0-tR9o.js";import"./tag-D40gy_Nl.js";import"./query-7-WHkg5t.js";import"./textarea-D7qsgB_p.js";import"./reportService-tEzofQZ6.js";import"./phone-B2rvvDkK.js";import"./type-CVgQCqWZ.js";const Z=5*1024*1024,ee=["image/jpeg","image/png","image/webp","image/heic","image/heif"];function te(r){switch(r.kind){case"item":case"bundle":return u(r.price);case"gift":return"贈送";case"discount":return`−${u(r.amount)}`;default:return r}}function se(r){switch(r.kind){case"item":case"bundle":case"gift":return r.label;case"discount":return`${r.label}（${r.code}）`;default:return r}}function re(r){if(r<=0)return"00:00:00";const o=Math.floor(r/1e3),p=Math.floor(o/3600),m=Math.floor(o%3600/60),c=o%60;return[p,m,c].map(s=>String(s).padStart(2,"0")).join(":")}const ve=()=>{const[r]=T(),o=F(),{isAuthenticated:p,userInfo:m}=H(),c=r.get("ref")??"",[s,_]=a.useState(null),[U,f]=a.useState(!1),[h,l]=a.useState(!0),[I,R]=a.useState(Date.now()),[g,j]=a.useState(null),[i,N]=a.useState(null),[y,S]=a.useState(""),[v,k]=a.useState(!1);W({title:"付款確認｜毛孩沉浸式台灣中秋祭",description:"請儘快付款並上傳收據，以確認工作坊名額。",canonicalUrl:`https://petwellhk.com${G}`,noindex:!0}),a.useEffect(()=>{let t=!1;if(!c){f(!0),l(!1);return}return l(!0),z(c).then(n=>{if(!t){if(!n){f(!0),l(!1);return}if(n.status==="paid"||n.status==="registered"){o(`${E}?ref=${encodeURIComponent(n.id)}`,{replace:!0});return}_(n),l(!1)}}).catch(n=>{console.error("Failed to load mid-autumn booking:",n),t||(f(!0),l(!1))}),()=>{t=!0}},[o,c]),a.useEffect(()=>{s&&J(K(s))},[s]),a.useEffect(()=>{const t=window.setInterval(()=>R(Date.now()),1e3);return()=>window.clearInterval(t)},[]),a.useEffect(()=>()=>{i&&URL.revokeObjectURL(i)},[i]);const w=s?Date.parse(s.payBy)-I:0,b=w<=0,C=a.useMemo(()=>s?new Date(s.payBy).toLocaleString("zh-HK",{month:"numeric",day:"numeric",hour:"2-digit",minute:"2-digit"}):"",[s]),L=t=>{if(i&&URL.revokeObjectURL(i),N(null),j(null),!!t){if(t.size>Z){x.error("請上傳小於 5MB 的圖片");return}if(t.type&&!ee.includes(t.type)&&!t.type.startsWith("image/")){x.error("請上傳 JPG、PNG、WEBP 或 HEIC 圖片");return}j(t),N(URL.createObjectURL(t))}},B=async()=>{if(s){if(!g){x.error("請上傳付款截圖");return}k(!0);try{const t=await X({booking:s,file:g,paymentReference:y,reporterId:p===!0?(m==null?void 0:m.userId)??null:null});o(`${E}?ref=${encodeURIComponent(t.id)}`,{replace:!0})}catch(t){console.error("Failed to submit payment proof:",t),x.error("上傳失敗，請稍後再試或 WhatsApp 聯絡我們",{duration:4e3}),k(!1)}}};return e.jsxs("div",{className:"min-h-[100dvh] bg-[hsl(30_20%_97%)]",children:[e.jsx(D,{}),e.jsxs("main",{className:"container mx-auto max-w-xl px-4 py-10 md:py-14",children:[h&&e.jsxs("div",{className:"rounded-lg border border-border bg-background p-8 text-center shadow-sm",children:[e.jsx(M,{className:"mx-auto h-6 w-6 animate-spin text-muted-foreground"}),e.jsx("p",{className:"mt-3 text-sm text-muted-foreground",children:"正在載入報名資料"})]}),!h&&U&&e.jsxs("div",{className:"rounded-lg border border-border bg-background p-8 text-center shadow-sm",children:[e.jsx("h1",{className:"text-xl font-semibold",children:"找不到此報名紀錄"}),e.jsx("p",{className:"mt-2 text-sm text-muted-foreground",children:"付款連結可能已過期或編號不正確。請重新報名，或 WhatsApp 聯絡我們並提供報名編號。"}),e.jsx(A,{asChild:!0,className:"mt-6",children:e.jsx($,{to:Y,children:"返回報名頁"})})]}),!h&&s&&e.jsxs("div",{className:"rounded-lg border border-border bg-background shadow-sm",children:[e.jsxs("div",{className:"border-b border-border px-6 py-5 md:px-8",children:[e.jsx("p",{className:"text-xs font-medium uppercase tracking-wider text-muted-foreground",children:"付款確認"}),e.jsx("h1",{className:"mt-1 text-xl font-semibold",children:"請於 24 小時內付款"}),e.jsx("p",{className:"mt-2 text-sm text-muted-foreground",children:"工作坊名額已暫時保留。請儘快完成付款並上傳收據。"})]}),e.jsxs("div",{className:"space-y-6 px-6 py-6 md:px-8",children:[e.jsxs("div",{className:b?"rounded-md border border-destructive/30 bg-destructive/[0.04] px-4 py-4 text-center":"rounded-md border border-primary/30 bg-primary/[0.04] px-4 py-4 text-center",children:[e.jsx("p",{className:"text-xs text-muted-foreground",children:"剩餘時間"}),e.jsx("p",{className:"mt-1 font-mono text-3xl font-semibold tabular-nums tracking-wide",children:re(w)}),e.jsx("p",{className:b?"mt-1 text-sm font-medium text-destructive":"mt-1 text-sm font-medium text-primary",children:b?"時間已到，請儘快":"請儘快"}),e.jsxs("p",{className:"mt-1 text-xs text-muted-foreground",children:["截止 ",C]})]}),e.jsxs("div",{className:"rounded-2xl border border-border bg-muted/15 px-4 py-4 sm:px-5",children:[e.jsx("p",{className:"text-[11px] font-semibold uppercase tracking-[0.14em] text-muted-foreground",children:"應付金額"}),e.jsxs("div",{className:"mt-1 flex flex-wrap items-baseline gap-x-3 gap-y-1",children:[e.jsx("p",{className:"text-3xl font-semibold tabular-nums tracking-tight text-foreground",children:u(s.quote.total)}),s.quote.discountAmount>0&&s.quote.subtotal>s.quote.total&&e.jsx("p",{className:"text-base text-muted-foreground line-through tabular-nums",children:u(s.quote.subtotal)}),s.quote.discountAmount>0&&e.jsxs("span",{className:"rounded-full bg-primary/10 px-2.5 py-0.5 text-sm font-semibold text-primary",children:["已減 ",u(s.quote.discountAmount)]})]}),e.jsxs("p",{className:"mt-1.5 text-xs text-muted-foreground",children:["報名編

1號 ",s.id]}),e.jsx("ul",{className:"mt-4 space-y-2 border-t border-border/80 pt-3 text-sm",children:s.quote.lines.map((t,n)=>e.jsxs("li",{className:t.kind==="discount"?"flex justify-between gap-3 font-medium text-primary":"flex justify-between gap-3",children:[e.jsx("span",{className:t.kind==="discount"?void 0:"text-muted-foreground",children:se(t)}),e.jsx("span",{className:"tabular-nums",children:te(t)})]},`${t.kind}-${n}`))})]}),e.jsxs("p",{className:"flex flex-wrap items-center gap-x-1.5 gap-y-1 text-sm leading-relaxed",children:[e.jsx(Q,{className:"h-4 w-4 shrink-0 text-primary"}),e.jsx("span",{children:"有問題或上傳有困難，可"}),e.jsxs("a",{href:`https://wa.me/${d.whatsapp}?text=`+encodeURIComponent(`你好，我想查詢毛孩沉浸式台灣中秋祭付款。報名編號 ${s.id}`),target:"_blank",rel:"noopener noreferrer",className:"font-medium text-primary underline underline-offset-2",children:["WhatsApp ",d.whatsappDisplay]}),e.jsx("span",{children:"，並註明報名編號。"})]}),e.jsxs("div",{className:"space-y-4 rounded-md border border-border bg-muted/20 p-4 text-sm",children:[e.jsx("p",{className:"font-semibold",children:"付款方法"}),e.jsxs("div",{children:[e.jsx("p",{className:"font-medium",children:"1. 銀行轉帳"}),e.jsxs("dl",{className:"mt-2 grid grid-cols-[7.5rem_1fr] gap-x-3 gap-y-1.5",children:[e.jsx("dt",{className:"text-muted-foreground",children:"Account Name"}),e.jsx("dd",{children:d.accountName}),e.jsx("dt",{className:"text-muted-foreground",children:"Bank Code"}),e.jsx("dd",{children:d.bankCode}),e.jsx("dt",{className:"text-muted-foreground",children:"Branch Code"}),e.jsx("dd",{children:d.branchCode}),e.jsx("dt",{className:"text-muted-foreground",children:"Bank Name"}),e.jsx("dd",{children:d.bankName}),e.jsx("dt",{className:"text-muted-foreground",children:"Account Number"}),e.jsx("dd",{className:"font-medium tabular-nums",children:d.accountNumber})]})]}),e.jsxs("div",{children:[e.jsx("p",{className:"font-medium",children:"2. PayMe"}),e.jsx("a",{href:d.paymeUrl,target:"_blank",rel:"noopener noreferrer",className:"mt-1 inline-block font-medium text-primary underline underline-offset-2",children:d.paymeUrl})]}),e.jsx("p",{children:"付完請回覆「已付款」並上傳截圖。名額有限，確認收款後先算正式報名成功。"}),e.jsxs("p",{className:"text-xs text-muted-foreground",children:["付款備註請填寫報名編號 ",s.id,"，以便核對。"]})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs(P,{htmlFor:"paymentReference",className:"text-sm font-medium",children:["付款參考號碼或轉帳時間",e.jsx("span",{className:"ml-1 font-normal text-muted-foreground",children:"（選填）"})]}),e.jsx("p",{className:"text-xs text-muted-foreground",children:"例如：PayMe 12:30 / 參考號碼 123456"}),e.jsx(O,{id:"paymentReference",value:y,onChange:t=>S(t.target.value),className:"bg-background"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs(P,{htmlFor:"receipt",className:"text-sm font-medium",children:["上傳已付款截圖",e.jsx("span",{className:"ml-0.5 text-destructive",children:"*"})]}),e.jsxs("label",{htmlFor:"receipt",className:"flex cursor-pointer flex-col items-center justify-center rounded-md border border-dashed border-border bg-muted/10 px-4 py-8 text-center transition-colors hover:border-primary/40",children:[e.jsx(V,{className:"mb-2 h-5 w-5 text-muted-foreground"}),e.jsx("span",{className:"text-sm font-medium",children:"點擊上傳付款截圖"}),e.jsx("span",{className:"mt-1 text-xs text-muted-foreground",children:"JPG / PNG / WEBP / HEIC，最大 5MB"}),e.jsx("input",{id:"receipt",type:"file",accept:"image/*",className:"sr-only",onChange:t=>{var n;return L(((n=t.target.files)==null?void 0:n[0])??null)}})]}),i&&e.jsx("img",{src:i,alt:"付款證明預覽",className:"mt-2 max-h-56 w-full rounded-md border border-border object-contain bg-muted/20"})]}),e.jsx(A,{type:"button",onClick:B,disabled:v,className:"min-h-11 w-full",children:v?e.jsxs(e.Fragment,{children:[e.jsx(M,{className:"mr-2 h-4 w-4 animate-spin"}),"上傳中"]}):"確認已付款"})]})]})]}),e.jsx(q,{})]})};export{ve as default};