feat: 错误页添加可选的重试按钮

ncuhome · Sep 14, 2023 · b7fc2d4 · b7fc2d4
1 parent 3a26fb7
commit b7fc2d4
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 11 deletions.
diff --git a/web/src/components/auth/LoginForm.tsx b/web/src/components/auth/LoginForm.tsx
@@ -30,7 +30,7 @@ export const LoginForm: FC = () => {
       enableLoading: true,
       onError(err) {
         if (err.msg !== ErrNetwork) {
-          ThrowError(nav, "登录对象异常", err.msg);
+          ThrowError(nav, "登录对象异常", err.msg, appCode);
         }
       },
     }

diff --git a/web/src/components/auth/ThirdPartyCallback.tsx b/web/src/components/auth/ThirdPartyCallback.tsx
@@ -42,7 +42,7 @@ export const ThirdPartyCallback = memo<Props>(
         if (!data.mfa) window.open(data.callback!, "_self");
         else setMfaToken(data.token);
       } catch ({ msg }) {
-        if (msg) ThrowError(nav, "登录失败", msg as string);
+          if (msg) ThrowError(nav, "登录失败", msg as string, appCode);
       }
     }
 
@@ -75,7 +75,7 @@ export const ThirdPartyCallback = memo<Props>(
 
     useMount(() => {
       if (!code) {
-        ThrowError(nav, "登录失败", "参数缺失");
+          ThrowError(nav, "登录失败", "参数缺失", appCode);
         return;
       }
       login();

diff --git a/web/src/pages/Authoritarian/pages/Login/index.tsx b/web/src/pages/Authoritarian/pages/Login/index.tsx
@@ -29,13 +29,13 @@ export const Login: FC = () => {
       setAuth(res.token, res.groups);
       nav("/user/");
     } catch ({ msg }) {
-      if (msg) ThrowError(nav, "登录失败", msg as string);
+      if (msg) ThrowError(nav, "登录失败", msg as string, "");
     }
   }
 
   useMount(() => {
     if (token == "") {
-      ThrowError(nav, "登录失败", "参数缺失");
+      ThrowError(nav, "登录失败", "参数缺失", "");
       return;
     }
 

diff --git a/web/src/pages/Error/index.tsx b/web/src/pages/Error/index.tsx
@@ -1,16 +1,18 @@
 import { FC, useMemo } from "react";
-import { useLocation } from "react-router-dom";
+import { useLocation, useNavigate } from "react-router-dom";
 import "./styles.css";
 
 import { Box, Typography, ButtonGroup, Button } from "@mui/material";
 import { ClearRounded } from "@mui/icons-material";
 
+import { GoLogin } from "@util/nav";
+
 export const Error: FC = () => {
+  const nav = useNavigate();
   const loc = useLocation();
   const state: ErrorState | undefined = useMemo(() => loc.state, [loc]);
 
   const title = useMemo(() => state?.title || "未知错误", [state]);
-  const content = useMemo(() => state?.content || "", [state]);
 
   return (
     <Box
@@ -59,19 +61,26 @@ export const Error: FC = () => {
         >
           {title}
         </Typography>
-        {content ? (
+        {state?.content ? (
           <Typography
             sx={{
               color: "#999",
               wordBreak: "break-all",
             }}
           >
-            {content}
+            {state.content}
           </Typography>
         ) : undefined}
 
         <Box mt={3.5}>
-          <ButtonGroup variant="text">
+          <ButtonGroup
+            variant="text"
+            sx={{
+              "&>button": {
+                border: "unset!important",
+              },
+            }}
+          >
             <Button
               onClick={() =>
                 window.open(
@@ -82,6 +91,12 @@ export const Error: FC = () => {
             >
               反馈
             </Button>
+
+            {state?.retryAppCode !== undefined ? (
+              <Button onClick={() => GoLogin(nav, state!.retryAppCode!)}>
+                重试
+              </Button>
+            ) : undefined}
           </ButtonGroup>
         </Box>
       </Box>

diff --git a/web/src/util/nav.ts b/web/src/util/nav.ts
@@ -1,5 +1,4 @@
 import { NavigateFunction } from "react-router-dom";
-import { ErrorState } from "@/typings/error";
 
 export function ThrowError(
   nav: NavigateFunction,
@@ -9,3 +8,7 @@ export function ThrowError(
 ) {
   nav("/error", { state: { title, content, retryAppCode } as ErrorState });
 }
+
+export function GoLogin(nav: NavigateFunction, appCode: string) {
+  nav("/?appCode=" + appCode);
+}