paypal

2026-05-19 12:48:41 +07:00
parent 208a91b971
commit 55a0133ed4
23 changed files with 3781 additions and 22 deletions
@@ -0,0 +1,71 @@
+"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>
+  );
+}