feat: global config

GZTimeWalker · Aug 27, 2022 · 060da39 · 060da39
1 parent 8cfb947
commit 060da39
Show file tree

Hide file tree

Showing 8 changed files with 100 additions and 12 deletions.
diff --git a/GZCTF/ClientApp/src/components/admin/WithAdminTab.tsx b/GZCTF/ClientApp/src/components/admin/WithAdminTab.tsx
@@ -18,8 +18,8 @@ const pages = [
   { icon: mdiFlagOutline, title: '比赛管理', path: 'games', color: 'yellow' },
   { icon: mdiAccountGroupOutline, title: '队伍管理', path: 'teams', color: 'green' },
   { icon: mdiAccountCogOutline, title: '用户管理', path: 'users', color: 'cyan' },
-  { icon: mdiCogOutline, title: '全局设置', path: 'configs', color: 'white' },
   { icon: mdiFileDocumentOutline, title: '系统日志', path: 'logs', color: 'red' },
+  { icon: mdiCogOutline, title: '全局设置', path: 'configs', color: 'orange' },
 ]
 
 export interface AdminTabProps extends React.PropsWithChildren {

diff --git a/GZCTF/ClientApp/src/components/admin/WithGameEditTab.tsx b/GZCTF/ClientApp/src/components/admin/WithGameEditTab.tsx
@@ -43,7 +43,7 @@ const WithGameEditTab: FC<GameEditTabProps> = ({ children, isLoading, ...others
 
   return (
     <AdminPage {...others}>
-      <Group position="apart" align="flex-start">
+      <Group position="apart" align="flex-start" style={{ width: '100%' }}>
         <Tabs
           orientation="vertical"
           value={activeTab}

diff --git a/GZCTF/ClientApp/src/pages/admin/Configs.tsx b/GZCTF/ClientApp/src/pages/admin/Configs.tsx
@@ -1,22 +1,104 @@
-import { FC } from 'react'
-import { Divider, SimpleGrid, Stack, Switch, Title } from '@mantine/core'
+import { FC, useState } from 'react'
+import { Divider, SimpleGrid, Stack, Switch, Title, Text } from '@mantine/core'
 import AdminPage from '@Components/admin/AdminPage'
-import api from '@Api'
+import { showErrorNotification } from '@Utils/ApiErrorHandler'
+import api, { GlobalConfig } from '@Api'
 
 const Configs: FC = () => {
-  const { data: configs } = api.admin.useAdminGetConfigs({
+  const { data: configs, mutate } = api.admin.useAdminGetConfigs({
     refreshInterval: 0,
     revalidateIfStale: false,
     revalidateOnFocus: false,
   })
 
+  const [disabled, setDisabled] = useState(false)
+
+  const updateConfig = (conf: GlobalConfig) => {
+    setDisabled(true)
+    api.admin
+      .adminUpdateConfigs(conf)
+      .then(() => {
+        mutate({ ...conf })
+      })
+      .catch(showErrorNotification)
+      .finally(() => {
+        setDisabled(false)
+      })
+  }
+
+  const SwitchLabel = (title: string, desrc: string) => (
+    <Stack spacing={1}>
+      <Text size="md" weight={500}>
+        {title}
+      </Text>
+      <Text size="xs" color="dimmed">
+        {desrc}
+      </Text>
+    </Stack>
+  )
+
   return (
     <AdminPage isLoading={!configs}>
       <Stack style={{ width: '80%', minWidth: '70vw' }}>
         <Title order={2}>账户策略</Title>
         <Divider />
         <SimpleGrid cols={2}>
-          <Switch/>
+          <Switch
+            checked={configs?.accoutPolicy?.allowRegister ?? true}
+            disabled={disabled}
+            label={SwitchLabel('允许新用户注册', '是否允许用户注册新账户')}
+            onChange={(e) =>
+              updateConfig({
+                accoutPolicy: {
+                  allowRegister: e.target.checked,
+                  ...configs?.accoutPolicy,
+                },
+                ...configs,
+              })
+            }
+          />
+          <Switch
+            checked={configs?.accoutPolicy?.emailConfirmationRequired ?? true}
+            disabled={disabled}
+            label={SwitchLabel('需要邮箱确认', '用户注册、更换邮箱、找回密码是否需要邮件确认')}
+            onChange={(e) =>
+              updateConfig({
+                accoutPolicy: {
+                  emailConfirmationRequired: e.target.checked,
+                  ...configs?.accoutPolicy,
+                },
+                ...configs,
+              })
+            }
+          />
+          <Switch
+            checked={configs?.accoutPolicy?.activeOnRegister ?? false}
+            disabled={disabled}
+            label={SwitchLabel('注册后自动激活', '是否在新用户注册后自动激活账户')}
+            onChange={(e) =>
+              updateConfig({
+                accoutPolicy: {
+                  activeOnRegister: e.target.checked,
+                  ...configs?.accoutPolicy,
+                },
+                ...configs,
+              })
+            }
+          />
+          <Switch
+            checked={configs?.accoutPolicy?.useGoogleRecaptcha ?? false}
+            disabled={disabled}
+            label={SwitchLabel('使用谷歌验证码', '是否在用户发送验证邮件时检查谷歌验证码有效性')}
+            onChange={(e) =>
+              updateConfig({
+                accoutPolicy: {
+                  useGoogleRecaptcha: e.target.checked,
+                  ...configs?.accoutPolicy,
+                },
+                ...configs,
+              })
+            }
+          />
         </SimpleGrid>
       </Stack>
     </AdminPage>

diff --git a/GZCTF/ClientApp/src/pages/admin/Logs.tsx b/GZCTF/ClientApp/src/pages/admin/Logs.tsx
@@ -141,7 +141,7 @@ const Logs: FC = () => {
         </>
       }
     >
-      <Paper shadow="md" p="md">
+      <Paper shadow="md" p="md" style={{ width: '100%' }}>
         <ScrollArea offsetScrollbars scrollbarSize={4} style={{ height: 'calc(100vh - 190px)' }}>
           <Table className={classes.table}>
             <thead>

diff --git a/GZCTF/ClientApp/src/pages/admin/Teams.tsx b/GZCTF/ClientApp/src/pages/admin/Teams.tsx
@@ -98,7 +98,7 @@ const Teams: FC = () => {
         </>
       }
     >
-      <Paper shadow="md" p="md">
+      <Paper shadow="md" p="md" style={{ width: '100%' }}>
         <ScrollArea offsetScrollbars style={{ height: 'calc(100vh - 190px)' }}>
           <Table className={classes.table}>
             <thead>

diff --git a/GZCTF/ClientApp/src/pages/admin/Users.tsx b/GZCTF/ClientApp/src/pages/admin/Users.tsx
@@ -177,7 +177,7 @@ const Users: FC = () => {
         </>
       }
     >
-      <Paper shadow="md" p="xs">
+      <Paper shadow="md" p="xs" style={{ width: '100%' }}>
         <ScrollArea offsetScrollbars scrollbarSize={4} style={{ height: 'calc(100vh - 190px)' }}>
           <Table className={classes.table}>
             <thead>

diff --git a/GZCTF/ClientApp/src/pages/admin/games/Index.tsx b/GZCTF/ClientApp/src/pages/admin/games/Index.tsx
@@ -73,7 +73,7 @@ const Games: FC = () => {
         </>
       }
     >
-      <Paper shadow="md" p="md">
+      <Paper shadow="md" p="md" style={{ width: '100%' }}>
         <ScrollArea offsetScrollbars style={{ height: 'calc(100vh - 190px)' }}>
           <Table className={classes.table}>
             <thead>

diff --git a/GZCTF/ClientApp/src/utils/ThemeOverride.ts b/GZCTF/ClientApp/src/utils/ThemeOverride.ts
@@ -1,4 +1,5 @@
 import { createStyles, keyframes, MantineThemeOverride } from '@mantine/core'
+import { MIME_TYPES } from '@mantine/dropzone'
 
 export const ThemeOverride: MantineThemeOverride = {
   colors: {
@@ -113,4 +114,9 @@ export const useTooltipStyles = createStyles((theme) => ({
   },
 }))
 
-export declare const ACCEPT_IMAGE_MIME_TYPE: ("image/png" | "image/gif" | "image/jpeg" | "image/webp")[];
+export const ACCEPT_IMAGE_MIME_TYPE = [
+  MIME_TYPES.png,
+  MIME_TYPES.webp,
+  MIME_TYPES.jpeg,
+  MIME_TYPES.gif,
+];