Merge 204f2ae0c6 into 99c8c77504

2026-02-04 21:25:56 +08:00 · 2024-09-21 23:25:20 +08:00
parent 99c8c77504 204f2ae0c6
commit 7ce535500f
17 changed files with 69 additions and 53 deletions
--- a/web/default/package.json
+++ b/web/default/package.json
@@ -1,6 +1,7 @@
 {
  "name": "react-template",
  "version": "0.1.0",
+  "homepage": "",
  "private": true,
  "dependencies": {
    "axios": "^0.27.2",
--- a/web/default/public/index.html
+++ b/web/default/public/index.html
@@ -2,7 +2,7 @@
 <html lang="zh-CN">
  <head>
    <meta charset="utf-8" />
-    <link rel="icon" href="logo.png" />
+    <link id="favicon" rel="icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#ffffff" />
    <meta
--- a/web/default/src/components/Header.js
+++ b/web/default/src/components/Header.js
@@ -1,7 +1,7 @@
 import React, { useContext, useState } from 'react';
 import { Link, useNavigate } from 'react-router-dom';
 import { UserContext } from '../context/User';
-
+import { BASE_URL } from "../config";
 import { Button, Container, Dropdown, Icon, Menu, Segment } from 'semantic-ui-react';
 import { API, getLogo, getSystemName, isAdmin, isMobile, showSuccess } from '../helpers';
 import '../index.css';
@@ -119,19 +119,14 @@ const Header = () => {
          size='large'
          style={
            showSidebar
-              ? {
-                borderBottom: 'none',
-                marginBottom: '0',
-                borderTop: 'none',
-                height: '51px'
-              }
+              ? { borderBottom: 'none', marginBottom: '0', borderTop: 'none', height: '51px' }
              : { borderTop: 'none', height: '52px' }
          }
        >
          <Container>
            <Menu.Item as={Link} to='/'>
              <img
-                src={logo}
+                src={ BASE_URL + logo}
                alt='logo'
                style={{ marginRight: '0.75em' }}
              />
@@ -188,7 +183,7 @@ const Header = () => {
      <Menu borderless style={{ borderTop: 'none' }}>
        <Container>
          <Menu.Item as={Link} to='/' className={'hide-on-mobile'}>
-            <img src={logo} alt='logo' style={{ marginRight: '0.75em' }} />
+            <img src={ BASE_URL + logo} alt='logo' style={{ marginRight: '0.75em' }} />
            <div style={{ fontSize: '20px' }}>
              <b>{systemName}</b>
            </div>
--- a/web/default/src/components/LoginForm.js
+++ b/web/default/src/components/LoginForm.js
@@ -4,6 +4,7 @@ import { Link, useNavigate, useSearchParams } from 'react-router-dom';
 import { UserContext } from '../context/User';
 import { API, getLogo, showError, showSuccess, showWarning } from '../helpers';
 import { onGitHubOAuthClicked, onLarkOAuthClicked } from './utils';
+import { BASE_URL } from '../config';
 import larkIcon from '../images/lark.svg';

 const LoginForm = () => {
@@ -87,7 +88,7 @@ const LoginForm = () => {
    <Grid textAlign='center' style={{ marginTop: '48px' }}>
      <Grid.Column style={{ maxWidth: 450 }}>
        <Header as='h2' color='' textAlign='center'>
-          <Image src={logo} /> 用户登录
+          <Image src={ BASE_URL + logo} /> 用户登录
        </Header>
        <Form size='large'>
          <Segment>
@@ -151,13 +152,13 @@ const LoginForm = () => {
              )}
              {status.lark_client_id ? (
                <div style={{
-                  background: "radial-gradient(circle, #FFFFFF, #FFFFFF, #00D6B9, #2F73FF, #0a3A9C)",
-                  width: "36px",
-                  height: "36px",
-                  borderRadius: "10em",
-                  display: "flex",
-                  cursor: "pointer"
-                }}
+                    background: "radial-gradient(circle, #FFFFFF, #FFFFFF, #00D6B9, #2F73FF, #0a3A9C)",
+                    width: "36px",
+                    height: "36px",
+                    borderRadius: "10em",
+                    display: "flex",
+                    cursor: "pointer"
+                  }}
                  onClick={() => onLarkOAuthClicked(status.lark_client_id)}
                >
                  <Image
--- a/web/default/src/components/PasswordResetConfirm.js
+++ b/web/default/src/components/PasswordResetConfirm.js
@@ -1,6 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import { Button, Form, Grid, Header, Image, Segment } from 'semantic-ui-react';
 import { API, copy, showError, showInfo, showNotice, showSuccess } from '../helpers';
+import { BASE_URL } from '../config';
 import { useSearchParams } from 'react-router-dom';

 const PasswordResetConfirm = () => {
@@ -37,7 +38,7 @@ const PasswordResetConfirm = () => {
      setDisableButton(false);
      setCountdown(30);
    }
-    return () => clearInterval(countdownInterval); 
+    return () => clearInterval(countdownInterval);
  }, [disableButton, countdown]);

  async function handleSubmit(e) {
@@ -59,12 +60,12 @@ const PasswordResetConfirm = () => {
    }
    setLoading(false);
  }
-  
+
  return (
    <Grid textAlign='center' style={{ marginTop: '48px' }}>
      <Grid.Column style={{ maxWidth: 450 }}>
        <Header as='h2' color='' textAlign='center'>
-          <Image src='/logo.png' /> 密码重置确认
+          <Image src={ BASE_URL + '/logo.png'} /> 密码重置确认
        </Header>
        <Form size='large'>
          <Segment>
@@ -79,19 +80,19 @@ const PasswordResetConfirm = () => {
            />
            {newPassword && (
              <Form.Input
-              fluid
-              icon='lock'
-              iconPosition='left'
-              placeholder='新密码'
-              name='newPassword'
-              value={newPassword}
-              readOnly
-              onClick={(e) => {
-                e.target.select();
-                navigator.clipboard.writeText(newPassword);
-                showNotice(`密码已复制到剪贴板：${newPassword}`);
-              }}
-            />            
+                fluid
+                icon='lock'
+                iconPosition='left'
+                placeholder='新密码'
+                name='newPassword'
+                value={newPassword}
+                readOnly
+                onClick={(e) => {
+                  e.target.select();
+                  navigator.clipboard.writeText(newPassword);
+                  showNotice(`密码已复制到剪贴板：${newPassword}`);
+                }}
+              />
            )}
            <Button
              color='green'
@@ -107,7 +108,7 @@ const PasswordResetConfirm = () => {
        </Form>
      </Grid.Column>
    </Grid>
-  );  
+  );
 };

 export default PasswordResetConfirm;
--- a/web/default/src/components/PasswordResetForm.js
+++ b/web/default/src/components/PasswordResetForm.js
@@ -1,6 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import { Button, Form, Grid, Header, Image, Segment } from 'semantic-ui-react';
 import { API, showError, showInfo, showSuccess } from '../helpers';
+import { BASE_URL } from '../config';
 import Turnstile from 'react-turnstile';

 const PasswordResetForm = () => {
@@ -70,7 +71,7 @@ const PasswordResetForm = () => {
    <Grid textAlign='center' style={{ marginTop: '48px' }}>
      <Grid.Column style={{ maxWidth: 450 }}>
        <Header as='h2' color='' textAlign='center'>
-          <Image src='/logo.png' /> 密码重置
+          <Image src={ BASE_URL + '/logo.png'} /> 密码重置
        </Header>
        <Form size='large'>
          <Segment>
--- a/web/default/src/components/RegisterForm.js
+++ b/web/default/src/components/RegisterForm.js
@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
 import { Button, Form, Grid, Header, Image, Message, Segment } from 'semantic-ui-react';
 import { Link, useNavigate } from 'react-router-dom';
 import { API, getLogo, showError, showInfo, showSuccess } from '../helpers';
+import { BASE_URL } from '../config';
 import Turnstile from 'react-turnstile';

 const RegisterForm = () => {
@@ -101,7 +102,7 @@ const RegisterForm = () => {
    <Grid textAlign='center' style={{ marginTop: '48px' }}>
      <Grid.Column style={{ maxWidth: 450 }}>
        <Header as='h2' color='' textAlign='center'>
-          <Image src={logo} /> 新用户注册
+          <Image src={ BASE_URL + logo} /> 新用户注册
        </Header>
        <Form size='large'>
          <Segment>
--- a/web/default/src/config.js
+++ b/web/default/src/config.js
@@ -0,0 +1 @@
+export const BASE_URL = process.env.REACT_APP_BASE_URL || '';
--- a/web/default/src/helpers/api.js
+++ b/web/default/src/helpers/api.js
@@ -1,8 +1,11 @@
 import { showError } from './utils';
+import { BASE_URL } from '../config';
 import axios from 'axios';

 export const API = axios.create({
-  baseURL: process.env.REACT_APP_SERVER ? process.env.REACT_APP_SERVER : '',
+  baseURL:
+    (process.env.REACT_APP_SERVER ? process.env.REACT_APP_SERVER : '') +
+    BASE_URL,
 });

 API.interceptors.response.use(
--- a/web/default/src/index.js
+++ b/web/default/src/index.js
@@ -11,13 +11,14 @@ import { UserProvider } from './context/User';
 import { ToastContainer } from 'react-toastify';
 import 'react-toastify/dist/ReactToastify.css';
 import { StatusProvider } from './context/Status';
+import { BASE_URL } from './config';

 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(
  <React.StrictMode>
    <StatusProvider>
      <UserProvider>
-        <BrowserRouter>
+        <BrowserRouter basename={BASE_URL}>
          <Header />
          <Container className={'main-content'}>
            <App />
				`@@ -0,0 +1 @@`
				`export const BASE_URL = process.env.REACT_APP_BASE_URL \|\| '';`