From 7688c844f3790c5461956b1f8620462f0b3a77d8 Mon Sep 17 00:00:00 2001
From: moonrailgun <moonrailgun@gmail.com>
Date: Mon, 6 Mar 2023 19:52:28 +0800
Subject: [PATCH] feat(admin): add basic system config

---
 server/admin/app/ra/App.tsx                 |  2 +
 server/admin/app/ra/i18n/custom.ts          | 10 ++++
 server/admin/app/ra/layout/Menu.tsx         |  7 +++
 server/admin/app/ra/routes/system/index.tsx | 56 +++++++++++++++++++++
 server/admin/app/server/router/api.ts       |  2 +
 server/admin/app/server/router/config.ts    | 19 +++++++
 6 files changed, 96 insertions(+)
 create mode 100644 server/admin/app/ra/routes/system/index.tsx
 create mode 100644 server/admin/app/server/router/config.ts

diff --git a/server/admin/app/ra/App.tsx b/server/admin/app/ra/App.tsx
index 05808df5..150e7946 100644
--- a/server/admin/app/ra/App.tsx
+++ b/server/admin/app/ra/App.tsx
@@ -18,6 +18,7 @@ import { TailchatLayout } from './layout';
 import { i18nProvider } from './i18n/index';
 import { httpClient } from './request';
 import { SocketIOAdmin } from './routes/socketio';
+import { SystemConfig } from './routes/system';
 
 const dataProvider = jsonServerProvider(
   // 'https://jsonplaceholder.typicode.com'
@@ -65,6 +66,7 @@ export const App = () => (
 
     <CustomRoutes>
       {/* 添加完毕以后还需要到 layout/Menu 增加侧边栏 */}
+      <Route path="/system" element={<SystemConfig />} />
       <Route path="/network" element={<TailchatNetwork />} />
       <Route path="/socketio" element={<SocketIOAdmin />} />
     </CustomRoutes>
diff --git a/server/admin/app/ra/i18n/custom.ts b/server/admin/app/ra/i18n/custom.ts
index 61ee9f04..26583849 100644
--- a/server/admin/app/ra/i18n/custom.ts
+++ b/server/admin/app/ra/i18n/custom.ts
@@ -11,6 +11,7 @@ export const englishCustom = {
     menu: {
       network: 'Tailchat Network',
       socket: 'Socket.IO TCP',
+      system: 'System Config',
     },
     dashboard: {
       welcomeTitle: 'Welcome to Tailchat Admin',
@@ -61,6 +62,10 @@ export const englishCustom = {
       tip2: 'The account password is the account password of Tailchat Admin',
       btn: 'Open the Admin platform',
     },
+    config: {
+      uploadFileLimit: 'Upload file limit (KB)',
+      emailVerification: 'Mandatory Email Verification',
+    },
   },
 };
 
@@ -77,6 +82,7 @@ export const chineseCustom = {
     menu: {
       network: 'Tailchat 网络',
       socket: 'Socket.IO 长链接',
+      system: '系统设置',
     },
     dashboard: {
       welcomeTitle: '欢迎使用 Tailchat 后台管理程序',
@@ -125,5 +131,9 @@ export const chineseCustom = {
       tip2: '账号密码为Tailchat后台的账号密码',
       btn: '打开管理平台',
     },
+    config: {
+      uploadFileLimit: '上传文件限制(KB)',
+      emailVerification: '邮箱强制验证',
+    },
   },
 };
diff --git a/server/admin/app/ra/layout/Menu.tsx b/server/admin/app/ra/layout/Menu.tsx
index e6753472..1a286ad5 100644
--- a/server/admin/app/ra/layout/Menu.tsx
+++ b/server/admin/app/ra/layout/Menu.tsx
@@ -8,6 +8,7 @@ import {
 } from 'react-admin';
 import FilterDramaIcon from '@mui/icons-material/FilterDrama';
 import LinkIcon from '@mui/icons-material/Link';
+import SettingsIcon from '@mui/icons-material/Settings';
 
 export const TailchatMenu: React.FC<MenuProps> = React.memo((props) => {
   const resources = useResourceDefinitions();
@@ -21,6 +22,12 @@ export const TailchatMenu: React.FC<MenuProps> = React.memo((props) => {
         .filter((name) => resources[name].hasList)
         .map((name) => <ResourceMenuItem key={name} name={name} />)}
 
+      <Menu.Item
+        to="/admin/system"
+        primaryText={translate('custom.menu.system')}
+        leftIcon={<SettingsIcon />}
+      />
+
       <Menu.Item
         to="/admin/network"
         primaryText={translate('custom.menu.network')}
diff --git a/server/admin/app/ra/routes/system/index.tsx b/server/admin/app/ra/routes/system/index.tsx
new file mode 100644
index 00000000..cf0cee5c
--- /dev/null
+++ b/server/admin/app/ra/routes/system/index.tsx
@@ -0,0 +1,56 @@
+import React from 'react';
+import { request } from '../../request';
+import { useRequest } from 'ahooks';
+import { CircularProgress, Box, Grid } from '@mui/material';
+import _uniq from 'lodash/uniq';
+import { BooleanField, useTranslate } from 'react-admin';
+import DoneIcon from '@mui/icons-material/Done';
+import ClearIcon from '@mui/icons-material/Clear';
+
+/**
+ * Tailchat 系统设置
+ */
+export const SystemConfig: React.FC = React.memo(() => {
+  const translate = useTranslate();
+  const { data: config, loading } = useRequest(async () => {
+    const { data } = await request('/config/client');
+
+    return data.config ?? {};
+  });
+
+  if (loading) {
+    return <CircularProgress />;
+  }
+
+  return (
+    <Box
+      sx={{
+        paddingTop: 2,
+        paddingBottom: 2,
+        maxWidth: '100vw',
+      }}
+    >
+      <Grid container spacing={2}>
+        <Grid item xs={4}>
+          {translate('custom.config.uploadFileLimit')}
+        </Grid>
+        <Grid item xs={8}>
+          {config.uploadFileLimit}
+        </Grid>
+      </Grid>
+      <Grid container spacing={2}>
+        <Grid item xs={4}>
+          {translate('custom.config.emailVerification')}
+        </Grid>
+        <Grid item xs={8}>
+          {config.emailVerification ? (
+            <DoneIcon fontSize="small" />
+          ) : (
+            <ClearIcon fontSize="small" />
+          )}
+        </Grid>
+      </Grid>
+    </Box>
+  );
+});
+SystemConfig.displayName = 'SystemConfig';
diff --git a/server/admin/app/server/router/api.ts b/server/admin/app/server/router/api.ts
index 5afe6b8e..15b36b12 100644
--- a/server/admin/app/server/router/api.ts
+++ b/server/admin/app/server/router/api.ts
@@ -3,6 +3,7 @@ import raExpressMongoose from 'express-mongoose-ra-json-server';
 import jwt from 'jsonwebtoken';
 import { call } from '../broker';
 import { adminAuth, auth, authSecret } from '../middleware/auth';
+import { configRouter } from './config';
 import { networkRouter } from './network';
 
 const router = Router();
@@ -39,6 +40,7 @@ router.post('/login', (req, res) => {
 });
 
 router.use('/network', networkRouter);
+router.use('/config', configRouter);
 
 router.use(
   '/users',
diff --git a/server/admin/app/server/router/config.ts b/server/admin/app/server/router/config.ts
new file mode 100644
index 00000000..992ffdac
--- /dev/null
+++ b/server/admin/app/server/router/config.ts
@@ -0,0 +1,19 @@
+/**
+ * Network 相关接口
+ */
+
+import { Router } from 'express';
+import { broker } from '../broker';
+import { auth } from '../middleware/auth';
+
+const router = Router();
+
+router.get('/client', auth(), async (req, res) => {
+  const config = await broker.call('config.client');
+
+  res.json({
+    config,
+  });
+});
+
+export { router as configRouter };