Compare commits

...

4 Commits

Author SHA1 Message Date
zdl
30520542c8 Merge branch 'feature' of https://git.valuefrontier.cn/vf/vf_react into feature 2025-10-23 11:22:36 +08:00
zdl
035bb9a66d feat: 补充翻页功能 2025-10-23 11:22:07 +08:00
zdl
8bd7f59d35 feat: 事件刷新滚动到希望的特定位置 2025-10-23 10:57:54 +08:00
zdl
db0d0ed269 feat: 去掉路由无用路由 2025-10-22 16:49:46 +08:00
3 changed files with 71 additions and 22 deletions

View File

@@ -32,7 +32,6 @@ export default function Home() {
<Routes>
{/* 首页默认路由 */}
<Route path="/" element={<HomePage />} />
<Route path="/dashboard" element={<HomePage />} />
<Route
path="/center"
element={

View File

@@ -765,6 +765,49 @@ const EventList = ({ events, pagination, onPageChange, onEventClick, onViewDetai
const Pagination = ({ current, total, pageSize, onChange }) => {
const totalPages = Math.ceil(total / pageSize);
// 计算要显示的页码数组(智能分页)
const getPageNumbers = () => {
const delta = 2; // 当前页左右各显示2个页码
const range = [];
const rangeWithDots = [];
// 始终显示第1页
range.push(1);
// 显示当前页附近的页码
for (let i = current - delta; i <= current + delta; i++) {
if (i > 1 && i < totalPages) {
range.push(i);
}
}
// 始终显示最后一页(如果总页数>1
if (totalPages > 1) {
range.push(totalPages);
}
// 去重并排序
const uniqueRange = [...new Set(range)].sort((a, b) => a - b);
// 添加省略号
let prev = 0;
for (const page of uniqueRange) {
if (page - prev === 2) {
// 如果只差一个页码,直接显示
rangeWithDots.push(prev + 1);
} else if (page - prev > 2) {
// 如果差距大于2显示省略号
rangeWithDots.push('...');
}
rangeWithDots.push(page);
prev = page;
}
return rangeWithDots;
};
const pageNumbers = getPageNumbers();
return (
<Flex justify="center" align="center" mt={8} gap={2}>
<Button
@@ -777,31 +820,26 @@ const EventList = ({ events, pagination, onPageChange, onEventClick, onViewDetai
</Button>
<HStack spacing={1}>
{[...Array(Math.min(5, totalPages))].map((_, i) => {
const pageNum = i + 1;
{pageNumbers.map((page, index) => {
if (page === '...') {
return (
<Text key={`ellipsis-${index}`} px={2} color="gray.500">
...
</Text>
);
}
return (
<Button
key={pageNum}
key={page}
size="sm"
variant={current === pageNum ? 'solid' : 'ghost'}
colorScheme={current === pageNum ? 'blue' : 'gray'}
onClick={() => onChange(pageNum)}
variant={current === page ? 'solid' : 'ghost'}
colorScheme={current === page ? 'blue' : 'gray'}
onClick={() => onChange(page)}
>
{pageNum}
{page}
</Button>
);
})}
{totalPages > 5 && <Text>...</Text>}
{totalPages > 5 && (
<Button
size="sm"
variant={current === totalPages ? 'solid' : 'ghost'}
colorScheme={current === totalPages ? 'blue' : 'gray'}
onClick={() => onChange(totalPages)}
>
{totalPages}
</Button>
)}
</HStack>
<Button

View File

@@ -1,5 +1,5 @@
// src/views/Community/index.js
import React, { useState, useEffect, useCallback } from 'react';
import React, { useState, useEffect, useCallback, useRef } from 'react';
import { useSearchParams, useNavigate } from 'react-router-dom';
import {
Box,
@@ -97,6 +97,9 @@ const Community = () => {
const { isOpen: isEventModalOpen, onOpen: onEventModalOpen, onClose: onEventModalClose } = useDisclosure();
const { isOpen: isStockDrawerOpen, onOpen: onStockDrawerOpen, onClose: onStockDrawerClose } = useDisclosure();
// Ref用于滚动到实时事件时间轴
const eventTimelineRef = useRef(null);
// ⚡ 通知权限引导
const { showCommunityGuide } = useNotification();
@@ -214,7 +217,16 @@ const Community = () => {
const handlePageChange = useCallback((page) => {
updateUrlParams({ page });
loadEvents(page);
window.scrollTo(0, 0);
// 滚动到实时事件时间轴(平滑滚动)
setTimeout(() => {
if (eventTimelineRef.current) {
eventTimelineRef.current.scrollIntoView({
behavior: 'smooth', // 平滑滚动
block: 'start' // 滚动到元素顶部
});
}
}, 100); // 延迟100ms确保DOM更新
}, [updateUrlParams, loadEvents]);
// 处理事件点击
@@ -326,7 +338,7 @@ const Community = () => {
)}
{/* 事件列表卡片 */}
<Card bg={cardBg} borderColor={borderColor}>
<Card ref={eventTimelineRef} bg={cardBg} borderColor={borderColor}>
<CardHeader>
<Flex justify="space-between" align="center">
<VStack align="start" spacing={1}>