fix(shop): 修正路由路径和修复弹窗关闭按钮错位
- 将所有 '/shopOrder' 路径修正为 '/shop/shopOrder' 以保持路由一致性 - 将优惠券使用路径从 '/shopGoodsCoupon' 改为 '/market/coupon' - 修改今日统计数据 salesAmount 类型从字符串改为数字 - 在用户状态管理中添加额外菜单项 '/shop/shopExpressTemplateDetail',仅注册路由不显示侧边栏 - 修复 ant-modal 关闭按钮内部 span 尺寸,解决图标偏移和缩小问题 - 在样式文件末尾添加 .ant-modal-close-x 的宽高和行高样式并加 !important 覆盖默认样式
This commit is contained in:
@@ -29,3 +29,28 @@
|
||||
- `RegionsSelect` 组件位于 `src/components/RegionsSelect/`,数据源为 `public/json/regions-data.json`
|
||||
- 级联选择器 value 是字符串数组(如 `["110000", "110100"]`),需与 model 的 number 类型互转
|
||||
- 路由路径 `/shop/shopExpressTemplateDetail` 依赖后端菜单配置,如不一致需调整
|
||||
|
||||
## 修复 ant-modal 关闭按钮错位
|
||||
|
||||
### 问题
|
||||
弹窗的 X 关闭按钮 X 图标位置偏移/缩小,看起来像悬空在弹窗头部外。
|
||||
|
||||
### 根因
|
||||
- `src/styles/component.less` 之前覆盖了 `.ant-modal-close` 为 30x30px
|
||||
- 但 `ele-admin-pro/es/style/common.less` 第 468 行设置内部 span `.ant-modal-close-x` 为 54x54px
|
||||
- 按钮 30x30 装着 54x54 的内容 + 22px lineHeight,导致 X 图标向上溢出
|
||||
|
||||
### 修复
|
||||
在 `src/styles/component.less` 末尾添加:
|
||||
```less
|
||||
.ant-modal-close-x {
|
||||
width: 30px !important;
|
||||
height: 30px !important;
|
||||
line-height: 30px !important;
|
||||
}
|
||||
```
|
||||
让内部 span 尺寸与按钮一致,X 图标正常居中。
|
||||
|
||||
### 技术要点
|
||||
- antd CSS-in-JS 用 `:where(...)` 包裹,特异性为 0/2/0,需用 `!important` 覆盖
|
||||
- `.ant-modal-close-x` 内部包含 CloseOutlined icon,width/height 决定其容器大小
|
||||
|
||||
Reference in New Issue
Block a user