update:1.添加页面底部版本显示
This commit is contained in:
xiamuceer
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "frontend",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"version": "1.0.1",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
|
||||
@@ -21,6 +21,7 @@ import UserManagement from './pages/UserManagement';
|
||||
import Login from './pages/Login';
|
||||
import AuthCallback from './pages/AuthCallback';
|
||||
import ProtectedRoute from './components/ProtectedRoute';
|
||||
import AppFooter from './components/AppFooter';
|
||||
import './App.css';
|
||||
|
||||
function App() {
|
||||
@@ -33,11 +34,11 @@ function App() {
|
||||
}}
|
||||
>
|
||||
<Routes>
|
||||
<Route path="/login" element={<Login />} />
|
||||
<Route path="/login" element={<><Login /><AppFooter /></>} />
|
||||
<Route path="/auth/callback" element={<AuthCallback />} />
|
||||
|
||||
<Route path="/" element={<ProtectedRoute><ProjectList /></ProtectedRoute>} />
|
||||
<Route path="/projects" element={<ProtectedRoute><ProjectList /></ProtectedRoute>} />
|
||||
<Route path="/" element={<ProtectedRoute><><ProjectList /><AppFooter /></></ProtectedRoute>} />
|
||||
<Route path="/projects" element={<ProtectedRoute><><ProjectList /><AppFooter /></></ProtectedRoute>} />
|
||||
<Route path="/wizard" element={<ProtectedRoute><ProjectWizardNew /></ProtectedRoute>} />
|
||||
<Route path="/inspiration" element={<ProtectedRoute><Inspiration /></ProtectedRoute>} />
|
||||
<Route path="/settings" element={<ProtectedRoute><Settings /></ProtectedRoute>} />
|
||||
|
||||
@@ -0,0 +1,193 @@
|
||||
import { Typography, Space, Divider } from 'antd';
|
||||
import { GithubOutlined, CopyrightOutlined, HeartFilled, ClockCircleOutlined } from '@ant-design/icons';
|
||||
import { VERSION_INFO, getVersionString } from '../config/version';
|
||||
|
||||
const { Text, Link } = Typography;
|
||||
|
||||
export default function AppFooter() {
|
||||
const isMobile = window.innerWidth <= 768;
|
||||
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
position: 'fixed',
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
backdropFilter: 'blur(20px) saturate(180%)',
|
||||
WebkitBackdropFilter: 'blur(20px) saturate(180%)',
|
||||
borderTop: '1px solid rgba(255, 255, 255, 0.2)',
|
||||
padding: isMobile ? '8px 12px' : '10px 16px',
|
||||
zIndex: 100,
|
||||
boxShadow: '0 -4px 16px rgba(0, 0, 0, 0.1), 0 -1px 4px rgba(0, 0, 0, 0.06)',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
maxWidth: 1400,
|
||||
margin: '0 auto',
|
||||
textAlign: 'center',
|
||||
}}
|
||||
>
|
||||
{isMobile ? (
|
||||
// 移动端：紧凑单行布局
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
gap: 8,
|
||||
flexWrap: 'wrap'
|
||||
}}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 11,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: 4,
|
||||
color: '#fff',
|
||||
textShadow: '0 1px 3px rgba(0, 0, 0, 0.3)',
|
||||
}}
|
||||
>
|
||||
<strong style={{ color: '#fff' }}>{VERSION_INFO.projectName}</strong>
|
||||
<span>{getVersionString()}</span>
|
||||
</Text>
|
||||
<Divider type="vertical" style={{ margin: '0 4px', borderColor: 'rgba(255, 255, 255, 0.3)' }} />
|
||||
<Link
|
||||
href={VERSION_INFO.githubUrl}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
style={{
|
||||
fontSize: 11,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: 4,
|
||||
color: '#fff',
|
||||
textShadow: '0 1px 3px rgba(0, 0, 0, 0.3)',
|
||||
}}
|
||||
>
|
||||
<GithubOutlined style={{ fontSize: 12 }} />
|
||||
</Link>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 10,
|
||||
color: 'rgba(255, 255, 255, 0.8)',
|
||||
textShadow: '0 1px 2px rgba(0, 0, 0, 0.3)',
|
||||
}}
|
||||
>
|
||||
<ClockCircleOutlined style={{ fontSize: 10, marginRight: 4 }} />
|
||||
{VERSION_INFO.buildTime}
|
||||
</Text>
|
||||
</div>
|
||||
) : (
|
||||
// PC端：完整布局
|
||||
<Space
|
||||
direction="horizontal"
|
||||
size={12}
|
||||
split={<Divider type="vertical" style={{ borderColor: 'rgba(255, 255, 255, 0.3)' }} />}
|
||||
style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center'
|
||||
}}
|
||||
>
|
||||
{/* 版本信息 */}
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 12,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: 6,
|
||||
color: '#fff',
|
||||
textShadow: '0 1px 3px rgba(0, 0, 0, 0.3)',
|
||||
}}
|
||||
>
|
||||
<strong style={{ color: '#fff' }}>{VERSION_INFO.projectName}</strong>
|
||||
<span>{getVersionString()}</span>
|
||||
</Text>
|
||||
|
||||
{/* GitHub 链接 */}
|
||||
<Link
|
||||
href={VERSION_INFO.githubUrl}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
style={{
|
||||
fontSize: 12,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: 6,
|
||||
color: '#fff',
|
||||
textShadow: '0 1px 3px rgba(0, 0, 0, 0.3)',
|
||||
}}
|
||||
>
|
||||
<GithubOutlined style={{ fontSize: 13 }} />
|
||||
<span>GitHub</span>
|
||||
</Link>
|
||||
|
||||
{/* LinuxDO 社区 */}
|
||||
<Link
|
||||
href={VERSION_INFO.linuxDoUrl}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
style={{
|
||||
fontSize: 12,
|
||||
color: '#fff',
|
||||
textShadow: '0 1px 3px rgba(0, 0, 0, 0.3)',
|
||||
}}
|
||||
>
|
||||
LinuxDO 社区
|
||||
</Link>
|
||||
|
||||
{/* 许可证 */}
|
||||
<Link
|
||||
href={VERSION_INFO.licenseUrl}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
style={{
|
||||
fontSize: 12,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: 6,
|
||||
color: '#fff',
|
||||
textShadow: '0 1px 3px rgba(0, 0, 0, 0.3)',
|
||||
}}
|
||||
>
|
||||
<CopyrightOutlined style={{ fontSize: 11 }} />
|
||||
<span>{VERSION_INFO.license}</span>
|
||||
</Link>
|
||||
|
||||
{/* 更新时间 */}
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 12,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: 4,
|
||||
color: 'rgba(255, 255, 255, 0.9)',
|
||||
textShadow: '0 1px 3px rgba(0, 0, 0, 0.3)',
|
||||
}}
|
||||
>
|
||||
<ClockCircleOutlined style={{ fontSize: 12 }} />
|
||||
<span>{VERSION_INFO.buildTime}</span>
|
||||
</Text>
|
||||
|
||||
{/* 致谢信息 */}
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 12,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: 4,
|
||||
color: '#fff',
|
||||
textShadow: '0 1px 3px rgba(0, 0, 0, 0.3)',
|
||||
}}
|
||||
>
|
||||
<span>Made with</span>
|
||||
<HeartFilled style={{ color: '#ff4d4f', fontSize: 11 }} />
|
||||
<span>by {VERSION_INFO.author}</span>
|
||||
</Text>
|
||||
</Space>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,41 @@
|
||||
/**
|
||||
* 应用版本信息配置
|
||||
* 版本号遵循语义化版本规范 (Semantic Versioning)
|
||||
*/
|
||||
|
||||
export const VERSION_INFO = {
|
||||
// 应用版本号
|
||||
version: '1.0.1',
|
||||
|
||||
// 构建时间（将在构建时由 Vite 注入）
|
||||
buildTime: import.meta.env.VITE_BUILD_TIME || new Date().toISOString().split('T')[0],
|
||||
|
||||
// 项目信息
|
||||
projectName: 'MuMuAINovel',
|
||||
projectFullName: 'MuMu AI 小说创作助手',
|
||||
|
||||
// 链接信息
|
||||
githubUrl: 'https://github.com/xiamuceer-j/MuMuAINovel',
|
||||
linuxDoUrl: 'https://linux.do/t/topic/1106333',
|
||||
|
||||
// 许可证
|
||||
license: 'GPL v3.0',
|
||||
licenseUrl: 'https://www.gnu.org/licenses/gpl-3.0.html',
|
||||
|
||||
// 作者信息
|
||||
author: 'xiamuceer-j',
|
||||
};
|
||||
|
||||
/**
|
||||
* 获取格式化的版本信息
|
||||
*/
|
||||
export const getVersionString = () => {
|
||||
return `v${VERSION_INFO.version}`;
|
||||
};
|
||||
|
||||
/**
|
||||
* 获取完整的版本描述
|
||||
*/
|
||||
export const getFullVersionInfo = () => {
|
||||
return `${VERSION_INFO.projectName} ${getVersionString()} - Build ${VERSION_INFO.buildTime}`;
|
||||
};
|
||||
@@ -4,6 +4,12 @@ import react from '@vitejs/plugin-react'
|
||||
// https://vite.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
// 定义全局常量，在构建时注入
|
||||
define: {
|
||||
'import.meta.env.VITE_BUILD_TIME': JSON.stringify(
|
||||
new Date().toISOString().split('T')[0]
|
||||
),
|
||||
},
|
||||
build: {
|
||||
outDir: '../backend/static',
|
||||
emptyOutDir: true,
|
||||
|
||||
Reference in New Issue
Block a user