使用接口

src/pages/UI9/UI9.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useState, useEffect, useCallback } from "react";
 import "./UI9.css";
 import { useNavigate } from "react-router-dom";
 import DecorLine from "../../components/DecorLine";
@@ -16,15 +16,27 @@ const UI9: React.FC = () => {
     navigate(-1);
   };
 
-  const handleConfirm = () => {
-    // 是否套餐待定
-    const isPackageUndecided = true;
-    if (isPackageUndecided) {
-      //navigate("/u4");
-    } else {
-      //navigate("/u5");
+  const handleConfirm = useCallback(() => {
+    localStorage.removeItem("selectedExamId");
+    localStorage.removeItem("lastIdCardNo");
+    navigate("/");
+  }, [navigate]);
+
+  const [countdown, setCountdown] = useState(10);
+  const [backTime, setBackTime] = useState("确认(10S)");
+
+  useEffect(() => {
+    if (countdown > 0) {
+      setBackTime(`确认(${countdown}S)`);
+      const timer = setTimeout(() => setCountdown((prev) => prev - 1), 1000);
+      return () => clearTimeout(timer);
     }
-  };
+    if (countdown <= 0) {
+      navigate("/");
+      return;
+    }
+    setBackTime("确认");
+  }, [countdown, navigate]);
 
   return (
     <div className="ui9-root">
@@ -46,7 +58,7 @@ const UI9: React.FC = () => {
       )}
       <div className="ui9-confirm-section">
         <BackButton text="返回" onClick={handleBack} />
-        <ConfirmButton text="确认" onClick={handleConfirm} />
+        <ConfirmButton text={backTime} onClick={handleConfirm} />
       </div>
     </div>
   );