feat: 支持视频上传、预览及移动端适配
Some checks failed
test/timeline-frontend/pipeline/head There was a failure building this commit

1. 功能增强:
- 支持视频文件的上传、存储及缩略图自动生成
- 新增视频播放组件,支持在画廊和时间线中预览视频
- 引入 STOMP 协议支持 WebSocket 实时通知功能
- 增加分享页面(SSR 友好),支持通过 shareId 访问公开内容

2. 移动端优化:
- 新增 BottomNav 底部导航组件,优化移动端交互体验
- 引入 useIsMobile 钩子,实现响应式布局切换
- 优化时间线卡片在小屏幕下的显示效果

3. 架构与组件:
- 新增 ClientOnly 组件解决 SSR 激活不一致问题
- 新增 ResponsiveGrid 响应式网格布局组件
- 完善 Nginx 配置,增加 MinIO 对象存储代理
- 优化图片懒加载组件 TimelineImage,支持低分辨率占位图
This commit is contained in:
2026-02-12 16:55:05 +08:00
parent 336208b7ce
commit cd752d97d8
39 changed files with 1729 additions and 537 deletions

View File

@@ -0,0 +1,19 @@
.bottom-nav {
position: fixed;
bottom: 0;
width: 100%;
background: #fff;
border-top: 1px solid #f0f0f0;
z-index: 100;
.ant-menu {
display: flex;
justify-content: space-around;
border: none;
.ant-menu-item {
flex: 1;
text-align: center;
}
}
}

View File

@@ -0,0 +1,32 @@
import React from 'react';
import { Menu } from 'antd';
import { HomeOutlined, UserOutlined, ClockCircleOutlined } from '@ant-design/icons';
import { history, useLocation } from '@umijs/max';
import './BottomNav.less';
const BottomNav: React.FC = () => {
const location = useLocation();
const items = [
{ key: '/', icon: <HomeOutlined />, label: '首页' },
{ key: '/story', icon: <ClockCircleOutlined />, label: '时间线' },
{ key: '/profile', icon: <UserOutlined />, label: '我的' },
];
const onClick = (e: any) => {
history.push(e.key);
};
return (
<div className="bottom-nav">
<Menu
onClick={onClick}
selectedKeys={[location.pathname]}
mode="horizontal"
items={items}
/>
</div>
);
};
export default BottomNav;