feat: Replace Card components with PageCard

web/src/pages/SystemSettingsPage/BackupPage.tsx

@@ -1,5 +1,6 @@
 import { memo, useState } from 'react';
-import { Card, Button, Typography, Upload, message, Modal } from 'antd';
+import { Button, Typography, Upload, message, Modal } from 'antd';
+import PageCard from '../../components/PageCard';
 import { UploadOutlined, DownloadOutlined } from '@ant-design/icons';
 import { backupApi } from '../../api/backup';
 
@@ -49,13 +50,10 @@ const BackupPage = memo(function BackupPage() {
   };
 
   return (
-    <Card>
-      <Title level={4}>备份与恢复</Title>
-      <Paragraph>
-        在这里，您可以导出整个站点的数据作为备份，或从备份文件中恢复。
-      </Paragraph>
+    <PageCard title="备份和恢复">
+
       <div style={{ display: 'flex', gap: '16px' }}>
-        <Card title="导出" style={{ flex: 1 }}>
+        <PageCard title="导出" style={{ flex: 1 }}>
           <Paragraph>
             点击下面的按钮将所有数据（包括存储、用户、自动化任务和分享）导出为一个 JSON 文件。
             <Text strong>请妥善保管您的备份文件。</Text>
@@ -67,8 +65,8 @@ const BackupPage = memo(function BackupPage() {
           >
             导出备份
           </Button>
-        </Card>
-        <Card title="恢复" style={{ flex: 1 }}>
+        </PageCard>
+        <PageCard title="恢复" style={{ flex: 1 }}>
           <Paragraph>
             从之前导出的JSON文件恢复数据。
             <Text strong type="danger">警告：此操作将清除并覆盖现有数据。</Text>
@@ -81,9 +79,9 @@ const BackupPage = memo(function BackupPage() {
               选择文件并恢复
             </Button>
           </Upload>
-        </Card>
+        </PageCard>
       </div>
-    </Card>
+    </PageCard>
   );
 });
 

web/src/pages/SystemSettingsPage/SystemSettingsPage.tsx

@@ -1,5 +1,6 @@
-import { Card, Form, Input, Button, message, Tabs, Space } from 'antd';
+import { Form, Input, Button, message, Tabs, Space } from 'antd';
 import { useEffect, useState } from 'react';
+import PageCard from '../../components/PageCard';
 import { getAllConfig, setConfig } from '../../api/config';
 import { API_BASE_URL } from '../../api/client';
 import { AppstoreOutlined, RobotOutlined } from '@ant-design/icons';
@@ -42,11 +43,11 @@ export default function SystemSettingsPage() {
 
   // 加载中时不渲染表单
   if (!config) {
-    return <Card title='系统设置'><div>加载中...</div></Card>;
+    return <PageCard title='系统设置'><div>加载中...</div></PageCard>;
   }
 
   return (
-    <Card
+    <PageCard
     title='系统设置'
     >
       <Space direction="vertical" style={{ width: '100%' }} size={32}>
@@ -121,6 +122,6 @@ export default function SystemSettingsPage() {
           ]}
         />
       </Space>
-    </Card>
+    </PageCard>
   );
 }