diff --git a/src/components/Navbars/HomeNavbar.js b/src/components/Navbars/HomeNavbar.js
index e864a34c..33d7dd90 100644
--- a/src/components/Navbars/HomeNavbar.js
+++ b/src/components/Navbars/HomeNavbar.js
@@ -152,7 +152,7 @@ export default function HomeNavbar() {
borderColor={navbarBorder}
py={{ base: 2, md: 3 }}
>
-
+
{/* Logo - 价小前投研 */}
@@ -177,7 +177,7 @@ export default function HomeNavbar() {
followingEvents={followingEvents}
/>
-
+
{/* 移动端抽屉菜单 (Phase 5 优化) */}
{
return (
-
-
+
@@ -32,7 +31,6 @@ const AppFooter = () => {
-
);
};
diff --git a/src/layouts/MainLayout.js b/src/layouts/MainLayout.js
index c61bea72..4e673f5e 100644
--- a/src/layouts/MainLayout.js
+++ b/src/layouts/MainLayout.js
@@ -9,7 +9,7 @@ import BackToTopButton from "./components/BackToTopButton";
import ErrorBoundary from "../components/ErrorBoundary";
import PageLoader from "../components/Loading/PageLoader";
import GlobalSidebar from "../components/GlobalSidebar";
-import { BACK_TO_TOP_CONFIG, LAYOUT_SIZE } from "./config/layoutConfig";
+import { BACK_TO_TOP_CONFIG, LAYOUT_SIZE, LAYOUT_PADDING } from "./config/layoutConfig";
// ✅ P0 性能优化:缓存静态组件,避免路由切换时不必要的重新渲染
// HomeNavbar (1623行) 和 AppFooter 不依赖路由参数,使用 memo 可大幅减少渲染次数
@@ -40,7 +40,7 @@ export default function MainLayout() {
{/* 页面内容区域 - 全宽度,与导航栏对齐 */}
-
+
}>
diff --git a/src/layouts/config/layoutConfig.js b/src/layouts/config/layoutConfig.js
index 68c514e9..51eee300 100644
--- a/src/layouts/config/layoutConfig.js
+++ b/src/layouts/config/layoutConfig.js
@@ -170,6 +170,15 @@ export const LAYOUT_SIZE = {
contentMinHeight: 'calc(100vh - 60px)', // 100vh - navbar高度
};
+/**
+ * 布局内边距配置
+ * 统一控制页面内容的水平内边距
+ * 右侧预留空间给 GlobalSidebar(收起宽度 72px)
+ */
+export const LAYOUT_PADDING = {
+ x: { base: 4, md: 6, lg: '80px' }, // 移动端 16px,中屏 24px,大屏 80px(容纳工具栏)
+};
+
/**
* 响应式断点
* 与 Chakra UI 断点保持一致
@@ -189,5 +198,6 @@ export default {
BACK_TO_TOP_CONFIG,
PAGE_LOADER_CONFIG,
LAYOUT_SIZE,
+ LAYOUT_PADDING,
BREAKPOINTS
};
diff --git a/src/views/Center/index.tsx b/src/views/Center/index.tsx
index 459b4756..e660d252 100644
--- a/src/views/Center/index.tsx
+++ b/src/views/Center/index.tsx
@@ -23,7 +23,8 @@ const Center: React.FC = () => {
return (
-
+ {/* padding 由 MainLayout 统一设置 */}
+
{/* 市场概览仪表盘 */}
diff --git a/src/views/Community/index.js b/src/views/Community/index.js
index 5245a209..3b397414 100644
--- a/src/views/Community/index.js
+++ b/src/views/Community/index.js
@@ -8,8 +8,6 @@ import {
} from '@/store/slices/communityDataSlice';
import {
Box,
- Container,
- useBreakpointValue,
Skeleton,
} from '@chakra-ui/react';
@@ -45,23 +43,6 @@ const Community = () => {
// Ref:用于首次滚动到内容区域
const containerRef = useRef(null);
- // 响应式容器宽度
- const containerMaxW = useBreakpointValue({
- base: '100%', // 移动端:全宽
- sm: '100%', // 小屏:全宽
- md: '100%', // 中屏:全宽
- lg: '1200px', // 大屏:1200px
- xl: '1400px', // 超大屏:1400px
- });
-
- // 响应式内边距
- const containerPx = useBreakpointValue({
- base: 2, // 移动端:最小内边距
- sm: 3,
- md: 4,
- lg: 6,
- });
-
// ⚡ 通知权限引导
const { browserPermission, requestBrowserPermission, registerEventUpdateCallback } = useNotification();
@@ -165,8 +146,8 @@ const Community = () => {
return (
- {/* 主内容区域 */}
-
+ {/* 主内容区域 - padding 由 MainLayout 统一设置 */}
+
{/* ⚡ 顶部说明面板(懒加载):产品介绍 + 沪深指数 + 热门概念词云 */}
@@ -200,7 +181,7 @@ const Community = () => {
events={hotEvents}
onEventClick={communityEvents.trackNewsArticleClicked}
/>
-
+
);
};
diff --git a/src/views/Company/components/CompanyHeader/index.tsx b/src/views/Company/components/CompanyHeader/index.tsx
index 494efcbe..7150788d 100644
--- a/src/views/Company/components/CompanyHeader/index.tsx
+++ b/src/views/Company/components/CompanyHeader/index.tsx
@@ -7,6 +7,7 @@ import { Box, Flex, HStack, VStack, Text } from '@chakra-ui/react';
import { AutoComplete, Input, Spin } from 'antd';
import { SearchOutlined } from '@ant-design/icons';
import { useStockSearch } from '@hooks/useStockSearch';
+import { LAYOUT_PADDING } from '@/layouts/config/layoutConfig';
import { THEME } from '../../config';
import { FUI_COLORS, FUI_GLOW } from '../../theme/fui';
import type { CompanyHeaderProps, StockSearchResult } from '../../types';
@@ -115,17 +116,17 @@ SearchBox.displayName = 'SearchBox';
const CompanyHeader: React.FC = memo(({ onStockChange }) => (
diff --git a/src/views/Company/index.tsx b/src/views/Company/index.tsx
index 431915bb..6704c643 100644
--- a/src/views/Company/index.tsx
+++ b/src/views/Company/index.tsx
@@ -332,7 +332,8 @@ const CompanyIndex: React.FC = () => {
position="relative"
bg={THEME.bg}
minH="calc(100vh - 60px)"
- overflow="hidden"
+ overflowX="visible"
+ overflowY="hidden"
>
{/* ========================================
全局环境光效果
@@ -371,12 +372,10 @@ const CompanyIndex: React.FC = () => {
{/*
内容容器
- - maxW="container.xl": 最大宽度限制,保持内容可读性
- - mx="auto": 水平居中
- - px={4}: 左右内边距 16px
- py={6}: 上下内边距 24px
+ - 水平 padding 由 MainLayout 统一设置
*/}
-
+
{/* ========================================
股票行情卡片
========================================
diff --git a/src/views/Concept/index.js b/src/views/Concept/index.js
index 9ce1b7b5..47a9bcd1 100644
--- a/src/views/Concept/index.js
+++ b/src/views/Concept/index.js
@@ -4,7 +4,6 @@ import { logger } from '../../utils/logger';
import defaultEventImage from '../../assets/img/default-event.jpg';
import {
Box,
- Container,
Heading,
Text,
Input,
@@ -1538,12 +1537,14 @@ const ConceptCenter = () => {
{/* 导航栏已由 MainLayout 提供 */}
{/* Hero Section - 精简版 */}
+ {/* Hero Section - 使用负 margin 抵消 Layout 的 padding 实现全宽背景 */}
{/* 科幻网格背景 */}
{
filter="blur(50px)"
/>
-
+
{/* 标题区域 */}
@@ -1743,11 +1744,11 @@ const ConceptCenter = () => {
-
+
- {/* 主内容区域 - 深色主题 */}
-
+ {/* 主内容区域 - padding 由 MainLayout 统一设置 */}
+
@@ -2102,7 +2103,7 @@ const ConceptCenter = () => {
-
+
{/* 股票详情Modal - 复用通用组件 */}
{
pointerEvents="none"
/>
-
+ {/* padding 由 MainLayout 统一设置 */}
+
{/* 标题区域 */}
{
-
+
{/* 指标数据详情模态框 */}
{selectedMetric && (
diff --git a/src/views/LimitAnalyse/index.js b/src/views/LimitAnalyse/index.js
index ac0a1e7b..72e44dec 100755
--- a/src/views/LimitAnalyse/index.js
+++ b/src/views/LimitAnalyse/index.js
@@ -1,7 +1,6 @@
import React, { useState, useEffect } from 'react';
import {
Box,
- Container,
VStack,
HStack,
Heading,
@@ -263,8 +262,7 @@ export default function LimitAnalyse() {
{/* 导航栏已由 MainLayout 提供 */}
{/* 顶部Header */}
-
-
+
{/* 左侧:标题置顶,注释与图例贴底 */}
@@ -366,11 +364,10 @@ export default function LimitAnalyse() {
-
- {/* 主内容区 */}
-
+ {/* 主内容区 - padding 由 MainLayout 统一设置 */}
+
{/* 搜索框 */}
@@ -402,7 +399,7 @@ export default function LimitAnalyse() {
{/* 高位股统计 */}
-
+
{/* 弹窗 */}
+
{/* 页面标题 */}
@@ -627,6 +627,6 @@ export default function ProfilePage() {
-
+
);
}
\ No newline at end of file
diff --git a/src/views/Profile/index.js b/src/views/Profile/index.js
index 336fcbf3..375c06cb 100644
--- a/src/views/Profile/index.js
+++ b/src/views/Profile/index.js
@@ -135,7 +135,6 @@ const ProfilePage = () => {
return (
-
{/* 用户信息头部 */}
{
-
);
};
diff --git a/src/views/Settings/SettingsPage.js b/src/views/Settings/SettingsPage.js
index 4837f2c5..41693b4e 100644
--- a/src/views/Settings/SettingsPage.js
+++ b/src/views/Settings/SettingsPage.js
@@ -2,7 +2,6 @@
import React, { useState } from 'react';
import {
Box,
- Container,
VStack,
HStack,
Text,
@@ -219,7 +218,7 @@ export default function SettingsPage() {
};
return (
-
+
{/* 页面标题 */}
账户设置
@@ -543,6 +542,6 @@ export default function SettingsPage() {
-
+
);
}
\ No newline at end of file
diff --git a/src/views/StockOverview/index.js b/src/views/StockOverview/index.js
index ad113709..c2d32061 100644
--- a/src/views/StockOverview/index.js
+++ b/src/views/StockOverview/index.js
@@ -3,7 +3,6 @@ import { useNavigate } from 'react-router-dom';
import { getApiBase } from '@utils/apiConfig';
import {
Box,
- Container,
Heading,
Text,
Input,
@@ -633,6 +632,7 @@ const StockOverview = () => {
pt={{ base: 20, md: 24 }}
pb={{ base: 16, md: 20 }}
borderBottom={`1px solid rgba(139, 92, 246, 0.3)`}
+ borderRadius="xl"
zIndex={1}
>
{/* 背景装饰 */}
@@ -648,7 +648,7 @@ const StockOverview = () => {
filter="blur(60px)"
/>
-
+
@@ -855,11 +855,11 @@ const StockOverview = () => {
-
+
{/* 主内容区 */}
-
+
{/* 日期选择器 */}
@@ -1195,7 +1195,7 @@ const StockOverview = () => {
)}
-
+
{/* 个股列表弹窗 */}
{
return (
-
{/* 返回按钮 */}
}
@@ -374,7 +372,6 @@ const PostDetail = () => {
-
{/* 图片预览弹窗 */}
{
return (
-
{/* 头部:返回按钮 */}
-
{/* 交易模态框 */}
{
pt="80px"
pb="20"
>
-
+ {/* padding 由 MainLayout 统一设置 */}
+
{/* 顶部横幅 */}
{
-
+
{/* 发帖模态框 */}