添加关于页

back/services/system.ts

@@ -86,9 +86,9 @@ export default class SystemService {
       let lastLog = '';
       try {
         const result = await Promise.race([
-          got.get(config.lastVersionFile, { timeout: 1000, retry: 0 }),
+          got.get(config.lastVersionFile, { timeout: 6000, retry: 0 }),
           got.get(`https://ghproxy.com/${config.lastVersionFile}`, {
-            timeout: 5000,
+            timeout: 6000,
             retry: 0,
           }),
         ]);

src/pages/setting/about.tsx

@@ -0,0 +1,49 @@
+import React, { useEffect, useState } from 'react';
+import { Typography, Input, Form, Button, message } from 'antd';
+import styles from './index.less';
+
+const { Link } = Typography;
+
+const About = () => {
+  return (
+    <div className={styles.container}>
+      <img
+        alt="logo"
+        style={{ width: 140, marginRight: 20 }}
+        src="https://lf9-survey.bytetos.com/obj/web.business.image/202201205d0d7b5e576ee603497ab6f3"
+      />
+      <div className={styles.right}>
+        <span className={styles.title}>青龙</span>
+        <span className={styles.desc}>
+          支持python3、javaScript、shell、typescript 的定时任务管理面板（A timed
+          task management panel that supports typescript, javaScript, python3,
+          and shell.）
+        </span>
+        <div>
+          <Link
+            href="https://github.com/whyour/qinglong"
+            target="_blank"
+            style={{ marginRight: 15 }}
+          >
+            Github
+          </Link>
+          <Link
+            href="https://t.me/jiao_long"
+            target="_blank"
+            style={{ marginRight: 15 }}
+          >
+            Telegram频道
+          </Link>
+          <Link
+            href="https://github.com/whyour/qinglong/issues"
+            target="_blank"
+          >
+            提交BUG
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default About;

src/pages/setting/index.less

@@ -0,0 +1,20 @@
+.container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 50px 130px;
+  .right {
+    display: flex;
+    justify-content: center;
+    flex-direction: column;
+
+    .title {
+      font-size: 25px;
+      margin-bottom: 10px;
+    }
+
+    .desc {
+      margin-bottom: 10px;
+    }
+  }
+}

src/pages/setting/index.tsx

@@ -32,7 +32,7 @@ import SecuritySettings from './security';
 import LoginLog from './loginLog';
 import NotificationSetting from './notification';
 import CheckUpdate from './checkUpdate';
-import { useForm } from 'antd/lib/form/Form';
+import About from './about';
 
 const { Text } = Typography;
 const optionsWithDisabled = [
@@ -124,7 +124,7 @@ const Setting = ({
   const [loginLogData, setLoginLogData] = useState<any[]>([]);
   const [notificationInfo, setNotificationInfo] = useState<any>();
   const [logRemoveFrequency, setLogRemoveFrequency] = useState<number>();
-  const [form] = useForm();
+  const [form] = Form.useForm();
 
   const themeChange = (e: any) => {
     setTheme(e.target.value);
@@ -381,6 +381,9 @@ const Setting = ({
             </Form.Item>
           </Form>
         </Tabs.TabPane>
+        <Tabs.TabPane tab="关于" key="about">
+          <About />
+        </Tabs.TabPane>
       </Tabs>
       <AppModal
         visible={isModalVisible}