init

2026-10-05 23:26:38 +08:00 · 2026-03-09 22:43:14 +08:00
commit 34f317fe6f
98 changed files with 20718 additions and 0 deletions
@@ -0,0 +1,51 @@
+import React, { useEffect, useState } from 'react';
+import { Header, Segment } from 'semantic-ui-react';
+import { API, showError } from '../../helpers';
+import { marked } from 'marked';
+
+const About = () => {
+  const [about, setAbout] = useState('');
+  const [aboutLoaded, setAboutLoaded] = useState(false);
+
+  const displayAbout = async () => {
+    setAbout(localStorage.getItem('about') || '');
+    const res = await API.get('/api/about');
+    const { success, message, data } = res.data;
+    if (success) {
+      let HTMLAbout = marked.parse(data);
+      setAbout(HTMLAbout);
+      localStorage.setItem('about', HTMLAbout);
+    } else {
+      showError(message);
+      setAbout('加载关于内容失败...');
+    }
+    setAboutLoaded(true);
+  };
+
+  useEffect(() => {
+    displayAbout().then();
+  }, []);
+
+  return (
+    <>
+      <Segment>
+        {aboutLoaded && about === '' ? (
+          <>
+            <Header as='h3'>关于</Header>
+            <p>可在设置页面设置关于内容，支持 HTML & Markdown</p>
+            项目仓库地址：
+            <a href='https://github.com/songquanpeng/gin-template'>
+              https://github.com/songquanpeng/gin-template
+            </a>
+          </>
+        ) : (
+          <>
+            <div dangerouslySetInnerHTML={{ __html: about }}></div>
+          </>
+        )}
+      </Segment>
+    </>
+  );
+};
+
+export default About;
@@ -0,0 +1,14 @@
+import React from 'react';
+import { Header, Segment } from 'semantic-ui-react';
+import FilesTable from '../../components/FilesTable';
+
+const File = () => (
+  <>
+    <Segment>
+      <Header as='h3'>管理文件</Header>
+      <FilesTable />
+    </Segment>
+  </>
+);
+
+export default File;
@@ -0,0 +1,110 @@
+import React, { useContext, useEffect } from 'react';
+import { Card, Grid, Header, Segment } from 'semantic-ui-react';
+import { API, showError, showNotice, timestamp2string } from '../../helpers';
+import { StatusContext } from '../../context/Status';
+
+const Home = () => {
+  const [statusState, statusDispatch] = useContext(StatusContext);
+  const homePageLink = localStorage.getItem('home_page_link') || '';
+
+  const displayNotice = async () => {
+    const res = await API.get('/api/notice');
+    const { success, message, data } = res.data;
+    if (success) {
+      let oldNotice = localStorage.getItem('notice');
+      if (data !== oldNotice && data !== '') {
+        showNotice(data);
+        localStorage.setItem('notice', data);
+      }
+    } else {
+      showError(message);
+    }
+  };
+
+  const getStartTimeString = () => {
+    const timestamp = statusState?.status?.start_time;
+    return timestamp2string(timestamp);
+  };
+
+  useEffect(() => {
+    displayNotice().then();
+  }, []);
+  return (
+    <>
+      {homePageLink !== '' ? (
+        <>
+          <iframe
+            src={homePageLink}
+            style={{ width: '100%', height: '100vh', border: 'none' }}
+          />
+        </>
+      ) : (
+        <>
+          <Segment>
+            <Header as='h3'>系统状况</Header>
+            <Grid columns={2} stackable>
+              <Grid.Column>
+                <Card fluid>
+                  <Card.Content>
+                    <Card.Header>系统信息</Card.Header>
+                    <Card.Meta>系统信息总览</Card.Meta>
+                    <Card.Description>
+                      <p>名称：{statusState?.status?.system_name}</p>
+                      <p>版本：{statusState?.status?.version}</p>
+                      <p>
+                        源码：
+                        <a
+                          href='https://github.com/songquanpeng/gin-template'
+                          target='_blank'
+                        >
+                          https://github.com/songquanpeng/gin-template
+                        </a>
+                      </p>
+                      <p>启动时间：{getStartTimeString()}</p>
+                    </Card.Description>
+                  </Card.Content>
+                </Card>
+              </Grid.Column>
+              <Grid.Column>
+                <Card fluid>
+                  <Card.Content>
+                    <Card.Header>系统配置</Card.Header>
+                    <Card.Meta>系统配置总览</Card.Meta>
+                    <Card.Description>
+                      <p>
+                        邮箱验证：
+                        {statusState?.status?.email_verification === true
+                          ? '已启用'
+                          : '未启用'}
+                      </p>
+                      <p>
+                        GitHub 身份验证：
+                        {statusState?.status?.github_oauth === true
+                          ? '已启用'
+                          : '未启用'}
+                      </p>
+                      <p>
+                        微信身份验证：
+                        {statusState?.status?.wechat_login === true
+                          ? '已启用'
+                          : '未启用'}
+                      </p>
+                      <p>
+                        Turnstile 用户校验：
+                        {statusState?.status?.turnstile_check === true
+                          ? '已启用'
+                          : '未启用'}
+                      </p>
+                    </Card.Description>
+                  </Card.Content>
+                </Card>
+              </Grid.Column>
+            </Grid>
+          </Segment>
+        </>
+      )}
+    </>
+  );
+};
+
+export default Home;
@@ -0,0 +1,20 @@
+import React from 'react';
+import { Segment, Header } from 'semantic-ui-react';
+
+const NotFound = () => (
+  <>
+    <Header
+      block
+      as="h4"
+      content="404"
+      attached="top"
+      icon="info"
+      className="small-icon"
+    />
+    <Segment attached="bottom">
+      未找到所请求的页面
+    </Segment>
+  </>
+);
+
+export default NotFound;
@@ -0,0 +1,46 @@
+import React from 'react';
+import { Segment, Tab } from 'semantic-ui-react';
+import SystemSetting from '../../components/SystemSetting';
+import { isRoot } from '../../helpers';
+import OtherSetting from '../../components/OtherSetting';
+import PersonalSetting from '../../components/PersonalSetting';
+
+const Setting = () => {
+  let panes = [
+    {
+      menuItem: '个人设置',
+      render: () => (
+        <Tab.Pane attached={false}>
+          <PersonalSetting />
+        </Tab.Pane>
+      )
+    }
+  ];
+
+  if (isRoot()) {
+    panes.push({
+      menuItem: '系统设置',
+      render: () => (
+        <Tab.Pane attached={false}>
+          <SystemSetting />
+        </Tab.Pane>
+      )
+    });
+    panes.push({
+      menuItem: '其他设置',
+      render: () => (
+        <Tab.Pane attached={false}>
+          <OtherSetting />
+        </Tab.Pane>
+      )
+    });
+  }
+
+  return (
+    <Segment>
+      <Tab menu={{ secondary: true, pointing: true }} panes={panes} />
+    </Segment>
+  );
+};
+
+export default Setting;
@@ -0,0 +1,77 @@
+import React, { useState } from 'react';
+import { Button, Form, Header, Segment } from 'semantic-ui-react';
+import { API, showError, showSuccess } from '../../helpers';
+
+const AddUser = () => {
+  const originInputs = {
+    username: '',
+    display_name: '',
+    password: '',
+  };
+  const [inputs, setInputs] = useState(originInputs);
+  const { username, display_name, password } = inputs;
+
+  const handleInputChange = (e, { name, value }) => {
+    setInputs((inputs) => ({ ...inputs, [name]: value }));
+  };
+
+  const submit = async () => {
+    if (inputs.username === '' || inputs.password === '') return;
+    const res = await API.post(`/api/user/`, inputs);
+    const { success, message } = res.data;
+    if (success) {
+      showSuccess('用户账户创建成功！');
+      setInputs(originInputs);
+    } else {
+      showError(message);
+    }
+  };
+
+  return (
+    <>
+      <Segment>
+        <Header as="h3">创建新用户账户</Header>
+        <Form autoComplete="off">
+          <Form.Field>
+            <Form.Input
+              label="用户名"
+              name="username"
+              placeholder={'请输入用户名'}
+              onChange={handleInputChange}
+              value={username}
+              autoComplete="off"
+              required
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label="显示名称"
+              name="display_name"
+              placeholder={'请输入显示名称'}
+              onChange={handleInputChange}
+              value={display_name}
+              autoComplete="off"
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label="密码"
+              name="password"
+              type={'password'}
+              placeholder={'请输入密码'}
+              onChange={handleInputChange}
+              value={password}
+              autoComplete="off"
+              required
+            />
+          </Form.Field>
+          <Button type={'submit'} onClick={submit}>
+            提交
+          </Button>
+        </Form>
+      </Segment>
+    </>
+  );
+};
+
+export default AddUser;
@@ -0,0 +1,132 @@
+import React, { useEffect, useState } from 'react';
+import { Button, Form, Header, Segment } from 'semantic-ui-react';
+import { useParams } from 'react-router-dom';
+import { API, showError, showSuccess } from '../../helpers';
+
+const EditUser = () => {
+  const params = useParams();
+  const userId = params.id;
+  const [loading, setLoading] = useState(true);
+  const [inputs, setInputs] = useState({
+    username: '',
+    display_name: '',
+    password: '',
+    github_id: '',
+    wechat_id: '',
+    email: '',
+  });
+  const { username, display_name, password, github_id, wechat_id, email } =
+    inputs;
+  const handleInputChange = (e, { name, value }) => {
+    setInputs((inputs) => ({ ...inputs, [name]: value }));
+  };
+
+  const loadUser = async () => {
+    let res = undefined;
+    if (userId) {
+      res = await API.get(`/api/user/${userId}`);
+    } else {
+      res = await API.get(`/api/user/self`);
+    }
+    const { success, message, data } = res.data;
+    if (success) {
+      data.password = '';
+      setInputs(data);
+    } else {
+      showError(message);
+    }
+    setLoading(false);
+  };
+  useEffect(() => {
+    loadUser().then();
+  }, []);
+
+  const submit = async () => {
+    let res = undefined;
+    if (userId) {
+      res = await API.put(`/api/user/`, { ...inputs, id: parseInt(userId) });
+    } else {
+      res = await API.put(`/api/user/self`, inputs);
+    }
+    const { success, message } = res.data;
+    if (success) {
+      showSuccess('用户信息更新成功！');
+    } else {
+      showError(message);
+    }
+  };
+
+  return (
+    <>
+      <Segment loading={loading}>
+        <Header as='h3'>更新用户信息</Header>
+        <Form autoComplete='new-password'>
+          <Form.Field>
+            <Form.Input
+              label='用户名'
+              name='username'
+              placeholder={'请输入新的用户名'}
+              onChange={handleInputChange}
+              value={username}
+              autoComplete='new-password'
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label='密码'
+              name='password'
+              type={'password'}
+              placeholder={'请输入新的密码'}
+              onChange={handleInputChange}
+              value={password}
+              autoComplete='new-password'
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label='显示名称'
+              name='display_name'
+              placeholder={'请输入新的显示名称'}
+              onChange={handleInputChange}
+              value={display_name}
+              autoComplete='new-password'
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label='已绑定的 GitHub 账户'
+              name='github_id'
+              value={github_id}
+              autoComplete='new-password'
+              placeholder='此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改'
+              readOnly
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label='已绑定的微信账户'
+              name='wechat_id'
+              value={wechat_id}
+              autoComplete='new-password'
+              placeholder='此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改'
+              readOnly
+            />
+          </Form.Field>
+          <Form.Field>
+            <Form.Input
+              label='已绑定的邮箱账户'
+              name='email'
+              value={email}
+              autoComplete='new-password'
+              placeholder='此项只读，需要用户通过个人设置页面的相关绑定按钮进行绑定，不可直接修改'
+              readOnly
+            />
+          </Form.Field>
+          <Button onClick={submit}>提交</Button>
+        </Form>
+      </Segment>
+    </>
+  );
+};
+
+export default EditUser;
@@ -0,0 +1,14 @@
+import React from 'react';
+import { Segment, Header } from 'semantic-ui-react';
+import UsersTable from '../../components/UsersTable';
+
+const User = () => (
+  <>
+    <Segment>
+      <Header as='h3'>管理用户</Header>
+      <UsersTable/>
+    </Segment>
+  </>
+);
+
+export default User;