From 623999d9d97a57523fd6e988ec98189ee9db94ae Mon Sep 17 00:00:00 2001
From: yezian <jueweijue@gmail.com>
Date: Mon, 17 Mar 2025 17:59:39 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E6=94=AF=E4=BB=98=E6=88=90?=
 =?UTF-8?q?=E5=8A=9F=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/success/page.jsx | 85 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 85 insertions(+)
 create mode 100644 app/success/page.jsx

diff --git a/app/success/page.jsx b/app/success/page.jsx
new file mode 100644
index 0000000..8151b25
--- /dev/null
+++ b/app/success/page.jsx
@@ -0,0 +1,85 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { FiArrowLeft, FiCheckCircle } from "react-icons/fi";
+import toast from "react-hot-toast";
+
+export default function SuccessPage() {
+  const [closeAttempted, setCloseAttempted] = useState(false);
+
+  // 页面加载时的动画效果
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      const successIcon = document.getElementById("success-icon");
+      if (successIcon) {
+        successIcon.classList.add("scale-100");
+        successIcon.classList.remove("scale-0");
+      }
+    }, 100);
+
+    return () => clearTimeout(timer);
+  }, []);
+
+  // 尝试关闭页面
+  const handleClose = () => {
+    try {
+      window.close();
+
+      // 设置一个短暂的延迟，检查页面是否仍然打开
+      setTimeout(() => {
+        // 如果页面仍然打开，说明关闭失败
+        if (document.visibilityState !== "hidden") {
+          setCloseAttempted(true);
+          // 显示toast提示
+          toast.error("请手动关闭此页面并返回应用", {
+            icon: "👋",
+            duration: 5000,
+            style: {
+              background: "#333",
+              color: "#fff",
+              borderRadius: "8px",
+            },
+          });
+        }
+      }, 300);
+    } catch (error) {
+      console.error("关闭页面失败:", error);
+      setCloseAttempted(true);
+      toast.error("请手动关闭此页面返回应用");
+    }
+  };
+
+  return (
+    <div
+      className="flex flex-col items-center justify-center min-h-screen px-4 py-12"
+      style={{ backgroundColor: "#07050A" }}
+    >
+      <div className="w-full max-w-md p-8 mx-auto bg-[#17161A] rounded-xl shadow-lg border border-gray-800">
+        <div className="flex flex-col items-center">
+          <div
+            id="success-icon"
+            className="p-3 bg-green-900/30 rounded-full transition-transform duration-500 ease-in-out transform scale-0"
+          >
+            <FiCheckCircle className="w-16 h-16 text-green-400" />
+          </div>
+
+          <h2 className="mt-6 text-2xl font-bold text-center text-white">
+            支付成功
+          </h2>
+
+          <p className="mt-4 text-lg text-center text-gray-300">
+            请关闭当前页面返回应用
+          </p>
+
+          <button
+            onClick={handleClose}
+            className="flex items-center justify-center w-full mt-8 px-4 py-3 text-white bg-[#FF669E] rounded-md hover:bg-[#FF4A8E] transition-colors"
+          >
+            <FiArrowLeft className="w-5 h-5 mr-2" />
+            关闭页面
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}