From 013ac0047a7d0341ab92e4c303c514025080d802 Mon Sep 17 00:00:00 2001
From: zdl <3489966805@qq.com>
Date: Wed, 7 Jan 2026 13:09:27 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=81=A2=E5=A4=8D=E5=90=88=E5=B9=B6?=
 =?UTF-8?q?=E4=B8=A2=E5=A4=B1=E7=9A=84=E5=8F=91=E7=A5=A8=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 添加 Invoice 组件懒加载配置
- 添加发票管理路由 /home/pages/account/invoice
- 添加 invoice mock handlers
- 恢复 Settings 页面的"账单与发票" Tab

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

Co-Authored-By: Claude <noreply@anthropic.com>
---
 src/mocks/handlers/index.js        |  2 +
 src/routes/homeRoutes.js           | 11 +++++
 src/routes/lazy-components.js      |  2 +
 src/views/Settings/SettingsPage.js | 68 +++++++++++++++++++++++++++++-
 4 files changed, 82 insertions(+), 1 deletion(-)

diff --git a/src/mocks/handlers/index.js b/src/mocks/handlers/index.js
index 5070d1cf..f075f008 100644
--- a/src/mocks/handlers/index.js
+++ b/src/mocks/handlers/index.js
@@ -19,6 +19,7 @@ import { agentHandlers } from './agent';
 import { bytedeskHandlers } from './bytedesk';
 import { predictionHandlers } from './prediction';
 import { forumHandlers } from './forum';
+import { invoiceHandlers } from './invoice';
 
 // 可以在这里添加更多的 handlers
 // import { userHandlers } from './user';
@@ -42,5 +43,6 @@ export const handlers = [
     ...bytedeskHandlers,  // ⚡ Bytedesk 客服 Widget passthrough
     ...predictionHandlers,  // 预测市场
     ...forumHandlers,  // 价值论坛帖子 (ES)
+    ...invoiceHandlers,  // 发票管理
     // ...userHandlers,
 ];
diff --git a/src/routes/homeRoutes.js b/src/routes/homeRoutes.js
index 04918aa3..b6c9e25e 100644
--- a/src/routes/homeRoutes.js
+++ b/src/routes/homeRoutes.js
@@ -69,6 +69,17 @@ export const homeRoutes = [
         }
     },
 
+    // 发票管理 - /home/pages/account/invoice
+    {
+        path: 'pages/account/invoice',
+        component: lazyComponents.Invoice,
+        protection: PROTECTION_MODES.REDIRECT,
+        meta: {
+            title: '发票管理',
+            description: '发票申请与管理'
+        }
+    },
+
     // 隐私政策 - /home/privacy-policy
     {
         path: 'privacy-policy',
diff --git a/src/routes/lazy-components.js b/src/routes/lazy-components.js
index 6f281c06..86c1f34f 100644
--- a/src/routes/lazy-components.js
+++ b/src/routes/lazy-components.js
@@ -17,6 +17,7 @@ export const lazyComponents = {
     ForumMyPoints: React.lazy(() => import('@views/Profile')),
     SettingsPage: React.lazy(() => import('@views/Settings/SettingsPage')),
     Subscription: React.lazy(() => import('@views/Pages/Account/Subscription')),
+    Invoice: React.lazy(() => import('@views/Pages/Account/Invoice')),
     PrivacyPolicy: React.lazy(() => import('@views/Pages/PrivacyPolicy')),
     UserAgreement: React.lazy(() => import('@views/Pages/UserAgreement')),
     WechatCallback: React.lazy(() => import('@views/Pages/WechatCallback')),
@@ -64,6 +65,7 @@ export const {
     ForumMyPoints,
     SettingsPage,
     Subscription,
+    Invoice,
     PrivacyPolicy,
     UserAgreement,
     WechatCallback,
diff --git a/src/views/Settings/SettingsPage.js b/src/views/Settings/SettingsPage.js
index 36cb1f14..92dc7168 100644
--- a/src/views/Settings/SettingsPage.js
+++ b/src/views/Settings/SettingsPage.js
@@ -31,7 +31,7 @@ import {
     PinInput,
     PinInputField
 } from '@chakra-ui/react';
-import { Link2, Trash2, Pencil, Smartphone, Mail } from 'lucide-react';
+import { Link2, Trash2, Pencil, Smartphone, Mail, FileText, CreditCard } from 'lucide-react';
 import { WechatOutlined } from '@ant-design/icons';
 import { useAuth } from '../../contexts/AuthContext';
 import { getApiBase } from '../../utils/apiConfig';
@@ -224,6 +224,7 @@ export default function SettingsPage() {
                 <Tabs variant="enclosed" colorScheme="blue">
                     <TabList>
                         <Tab color={textColor} _selected={{ color: 'blue.500', borderColor: 'blue.500' }}>账户绑定</Tab>
+                        <Tab color={textColor} _selected={{ color: 'blue.500', borderColor: 'blue.500' }}>账单与发票</Tab>
                     </TabList>
 
                     <TabPanels>
@@ -405,6 +406,71 @@ export default function SettingsPage() {
 
                             </VStack>
                         </TabPanel>
+
+                        {/* 账单与发票 */}
+                        <TabPanel>
+                            <VStack spacing={6} align="stretch">
+                                {/* 订阅管理 */}
+                                <Card bg={cardBg} borderColor={borderColor}>
+                                    <CardHeader>
+                                        <Heading size="md" color={headingColor}>订阅管理</Heading>
+                                    </CardHeader>
+                                    <CardBody>
+                                        <HStack justify="space-between">
+                                            <VStack align="start" spacing={1}>
+                                                <HStack>
+                                                    <CreditCard size={20} />
+                                                    <Text fontWeight="medium" color={textColor}>
+                                                        {user?.subscription_type === 'max' ? 'Max 会员' :
+                                                         user?.subscription_type === 'pro' ? 'Pro 会员' : '免费版'}
+                                                    </Text>
+                                                    {user?.subscription_type && user?.subscription_type !== 'free' && (
+                                                        <Badge colorScheme="purple" size="sm">有效</Badge>
+                                                    )}
+                                                </HStack>
+                                                <Text fontSize="sm" color={subTextColor}>
+                                                    管理您的会员订阅和续费
+                                                </Text>
+                                            </VStack>
+                                            <Button
+                                                colorScheme="purple"
+                                                onClick={() => navigate('/home/pages/account/subscription')}
+                                            >
+                                                管理订阅
+                                            </Button>
+                                        </HStack>
+                                    </CardBody>
+                                </Card>
+
+                                {/* 发票管理 */}
+                                <Card bg={cardBg} borderColor={borderColor}>
+                                    <CardHeader>
+                                        <Heading size="md" color={headingColor}>发票管理</Heading>
+                                    </CardHeader>
+                                    <CardBody>
+                                        <HStack justify="space-between">
+                                            <VStack align="start" spacing={1}>
+                                                <HStack>
+                                                    <FileText size={20} />
+                                                    <Text fontWeight="medium" color={textColor}>
+                                                        电子发票申请与下载
+                                                    </Text>
+                                                </HStack>
+                                                <Text fontSize="sm" color={subTextColor}>
+                                                    已支付的订单可申请开具电子发票
+                                                </Text>
+                                            </VStack>
+                                            <Button
+                                                colorScheme="teal"
+                                                onClick={() => navigate('/home/pages/account/invoice')}
+                                            >
+                                                管理发票
+                                            </Button>
+                                        </HStack>
+                                    </CardBody>
+                                </Card>
+                            </VStack>
+                        </TabPanel>
                     </TabPanels>
                 </Tabs>
             </VStack>