feat(ValueForum): 优化页面布局和加载状态

- 添加响应式左右 padding
- 使用 PageLoader 统一加载样式
- 修复预测市场数据格式处理

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
zdl
2025-12-25 18:48:38 +08:00
parent 476f4ad826
commit d6d5885c10

View File

@@ -16,7 +16,6 @@ import {
InputGroup,
InputLeftElement,
Select,
Spinner,
Center,
useDisclosure,
Flex,
@@ -38,6 +37,7 @@ import PredictionTopicCard from './components/PredictionTopicCard';
import CreatePostModal from './components/CreatePostModal';
import CreatePredictionModal from './components/CreatePredictionModal';
import PredictionGuideModal from './components/PredictionGuideModal';
import PageLoader from '@components/Loading/PageLoader';
const MotionBox = motion(Box);
@@ -97,10 +97,15 @@ const ValueForum = () => {
setLoading(true);
const response = await getTopics({ status: 'active', sort_by: sortBy });
if (response.success) {
setPredictionTopics(response.data);
// 支持两种返回格式:直接数组或带分页的对象
const topicsData = Array.isArray(response.data)
? response.data
: (response.data?.topics || []);
setPredictionTopics(topicsData);
}
} catch (error) {
console.error('获取预测话题失败:', error);
setPredictionTopics([]);
} finally {
setLoading(false);
}
@@ -153,8 +158,8 @@ const ValueForum = () => {
pt="80px"
pb="20"
>
{/* padding 由 MainLayout 统一设置 */}
<Box>
{/* 内容区域 */}
<Box px={{ base: "4", md: "6", lg: "8" }} maxW="1600px" mx="auto">
{/* 顶部横幅 */}
<MotionBox
initial={{ opacity: 0, y: -20 }}
@@ -345,17 +350,7 @@ const ValueForum = () => {
{/* 普通帖子标签页 */}
<TabPanel p="0">
{loading && page === 1 ? (
<Center py="20">
<VStack spacing="4">
<Spinner
size="xl"
thickness="4px"
speed="0.8s"
color={forumColors.primary[500]}
/>
<Text color={forumColors.text.secondary}>加载中...</Text>
</VStack>
</Center>
<PageLoader inline />
) : posts.length === 0 ? (
<Center py="20">
<VStack spacing="4">
@@ -420,17 +415,7 @@ const ValueForum = () => {
{/* 预测市场标签页 */}
<TabPanel p="0">
{loading ? (
<Center py="20">
<VStack spacing="4">
<Spinner
size="xl"
thickness="4px"
speed="0.8s"
color={forumColors.primary[500]}
/>
<Text color={forumColors.text.secondary}>加载中...</Text>
</VStack>
</Center>
<PageLoader inline />
) : predictionTopics.length === 0 ? (
<Center py="20">
<VStack spacing="4">