forked from UKSOURCE/ipv6
72 lines
2.6 KiB
TypeScript
72 lines
2.6 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { useSearchParams } from "next/navigation";
|
|
import Link from "next/link";
|
|
|
|
export default function RegistrationCancelPage() {
|
|
const searchParams = useSearchParams();
|
|
const token = searchParams.get("token");
|
|
const [cancelled, setCancelled] = useState(false);
|
|
|
|
useEffect(() => {
|
|
if (token) {
|
|
fetch("/ipv6/api/payments/cancel", {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({ token }),
|
|
}).finally(() => setCancelled(true));
|
|
} else {
|
|
setCancelled(true);
|
|
}
|
|
}, [token]);
|
|
|
|
return (
|
|
<main className="min-h-screen bg-[var(--color-background)] flex items-center justify-center px-[var(--spacing-gutter)] py-[80px]">
|
|
<div className="w-full max-w-[560px]">
|
|
<div className="glass-panel rounded-xl p-[48px] text-center relative overflow-hidden">
|
|
<div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-primary/20 to-transparent" />
|
|
|
|
<div className="flex justify-center mb-6">
|
|
<span className="material-symbols-outlined text-[64px] text-yellow-400">
|
|
cancel
|
|
</span>
|
|
</div>
|
|
|
|
<h1 className="font-[var(--font-display-lg)] text-[clamp(1.5rem,3vw,2rem)] text-on-surface mb-3 leading-[1.2]">
|
|
Thanh toán đã bị hủy
|
|
</h1>
|
|
|
|
<p className="text-on-surface-variant text-base mb-8">
|
|
Bạn đã hủy quá trình thanh toán. Đăng ký của bạn chưa được xác nhận.
|
|
</p>
|
|
|
|
<div className="flex flex-col sm:flex-row items-center justify-center gap-4">
|
|
<Link
|
|
href="/registration"
|
|
className="inline-flex items-center gap-2 px-6 py-3 rounded-lg gold-gradient-bg text-on-primary font-medium transition-opacity hover:opacity-90"
|
|
>
|
|
<span className="material-symbols-outlined text-[18px]">refresh</span>
|
|
Thử lại thanh toán
|
|
</Link>
|
|
|
|
<Link
|
|
href="/"
|
|
className="inline-flex items-center gap-2 text-on-surface-variant hover:text-primary transition-colors text-sm"
|
|
>
|
|
<span className="material-symbols-outlined text-[18px]">home</span>
|
|
Về trang chủ
|
|
</Link>
|
|
</div>
|
|
|
|
{!cancelled && (
|
|
<p className="mt-6 text-on-surface-variant text-xs opacity-60">
|
|
Đang cập nhật trạng thái...
|
|
</p>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</main>
|
|
);
|
|
}
|