feat(web): 输入控件与按钮放大、设置卡片收窄加阴影、设置页增加取消按钮

- 主题 components:Input/Select/InputNumber/DatePicker/Button 文本
  16px、高度 40px(小号按钮 32px);表格/菜单等正文保持 14px
- 设置卡片 max-width 720→560px,四周柔和阴影
- 修改密码页保存按钮右侧、修改资料页重置按钮右侧增加取消按钮,
  点击回首页
This commit is contained in:
2026-09-03 22:13:11 +08:00
parent 5bf5f80b34
commit 24a25dcbd1
4 changed files with 16 additions and 3 deletions
+3 -2
View File
@@ -9,10 +9,11 @@
.settings-card {
width: 100%;
max-width: 720px;
max-width: 560px;
background: #fff;
border-radius: 8px;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08);
/* 四周柔和阴影,与内容区背景拉开层次 */
box-shadow: 0 0 24px 0 rgba(17, 24, 39, 0.12);
}
.settings-card-title {
+9 -1
View File
@@ -13,11 +13,19 @@ function App() {
token: {
colorPrimary: '#8b5cf6',
borderRadius: 8,
// 全局默认字号 14px;输入类控件默认高度在 32px 基础上同步加高一点
// 全局正文字号 14px;输入类控件与按钮经 components 单独放大
fontSize: 14,
controlHeight: 34,
controlHeightSM: 26,
},
components: {
// 文本框与按钮:文本 16px、高度同步加高;表格/菜单等正文不受影响
Input: { fontSize: 16, controlHeight: 40 },
Select: { fontSize: 16, controlHeight: 40 },
InputNumber: { fontSize: 16, controlHeight: 40 },
DatePicker: { fontSize: 16, controlHeight: 40 },
Button: { fontSize: 16, controlHeight: 40, controlHeightSM: 32 },
},
}}
>
<AntdApp>
@@ -116,6 +116,7 @@ const PasswordSettingsPage = () => {
<Button type="primary" htmlType="submit" loading={submitting}>
保存修改
</Button>
<Button onClick={() => navigate('/')}>取消</Button>
</div>
</Form>
</div>
@@ -1,4 +1,5 @@
import { useMemo, useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { App as AntdApp, Avatar, Button, Form, Input } from 'antd';
import axios from 'axios';
import { authApi } from '@/services/auth';
@@ -15,6 +16,7 @@ interface ProfileFormValues {
*/
const ProfileSettingsPage = () => {
const { message } = AntdApp.useApp();
const navigate = useNavigate();
const { session, applyProfileUpdate } = useSession();
const [form] = Form.useForm<ProfileFormValues>();
const [saving, setSaving] = useState(false);
@@ -100,6 +102,7 @@ const ProfileSettingsPage = () => {
保存修改
</Button>
<Button onClick={handleReset}>重 置</Button>
<Button onClick={() => navigate('/')}>取消</Button>
</div>
</Form>
</div>