improve: 尝试在选择首选 u2f 方式时显示更多信息

ncuhome · Oct 30, 2023 · 6d829c6 · 6d829c6
1 parent d82aef2
commit 6d829c6
Showing 1 changed file with 22 additions and 12 deletions.
diff --git a/web/src/pages/User/pages/Profile/index.tsx b/web/src/pages/User/pages/Profile/index.tsx
@@ -23,6 +23,7 @@ import {
   Checkbox,
   FormControlLabel,
   Stack,
+  Tooltip,
 } from "@mui/material";
 
 import { useUserApiV1 } from "@api/v1/user/hook";
@@ -128,18 +129,27 @@ export const Profile: FC = () => {
           {u2fStatus ? (
             <Stack flexDirection={"row"}>
               {u2fMethods.map((m) => (
-                <FormControlLabel
-                  key={m.value}
-                  label={m.label}
-                  control={
-                    <Checkbox
-                      checked={u2fStatus?.prefer === m.value}
-                      onChange={(e) =>
-                        onChangePrefer(e.target.checked ? m.value : "")
-                      }
-                    />
-                  }
-                />
+                <Tooltip
+                  title={!(u2fStatus as any)[m.value] ? "未启用" : undefined}
+                  placement={"top-start"}
+                  arrow
+                >
+                  <FormControlLabel
+                    key={m.value}
+                    label={m.label}
+                    control={
+                      <Checkbox
+                        checked={u2fStatus?.prefer === m.value}
+                        onChange={(e) =>
+                          onChangePrefer(e.target.checked ? m.value : "")
+                        }
+                        color={
+                          !(u2fStatus as any)[m.value] ? "warning" : undefined
+                        }
+                      />
+                    }
+                  />
+                </Tooltip>
               ))}
             </Stack>
           ) : (