fix: 优化反馈日期筛选控件

This commit is contained in:
2026-08-11 18:58:11 +08:00
parent 83b259af2d
commit c4231f268b
3 changed files with 78 additions and 13 deletions

View File

@@ -1,3 +1,48 @@
# 反馈管理日期筛选控件修复验收2026-08-11
## 对照范围
- 问题截图:`/var/folders/hn/vg5lxj0j60d2cp0k6vv_k0mw0000gn/T/codex-clipboard-be50c66c-d924-4925-a90c-64b716ab635c.png`
- 修复后截图:`design-qa-feedback-date-fixed.png`
- 验收地址:`http://127.0.0.1:8080/`
- 页面状态:系统管理员已登录 / 反馈管理 / 开始日期获得焦点
- 浏览器视口1280 × 720 CSS px问题截图1182 × 1064 px实现截图1280 × 720 px
## 完整视图与重点区域证据
- 修复前的双月日历缺失 Element Plus 内部样式,月份、星期、日期和翻页按钮挤在狭窄浮层中,遮挡反馈表格。
- 修复后参考数据看板、记录审计等后台页面,统一为状态下拉框、开始日期、结束日期、查询、重置和导出操作的单行筛选栏。
- 日期输入框均为 210 × 40px标签、日期值和日历图标垂直居中筛选栏为 1012 × 70px与下方表格左右边界一致。
- 1280px 视口下页面 `scrollWidth``clientWidth` 均为 1280px无横向滚动日期控件不会再弹出失控的双月面板。
## 必查视觉面
- 字体与排版:沿用后台现有标题、说明、字段标签和按钮字号,日期占位符由浏览器本地化展示。
- 间距与布局:筛选项高度统一,字段间距、按钮间距和容器内边距与其他后台筛选栏一致。
- 颜色与设计令牌:继续使用现有雾白背景、浅灰边框和蓝色主操作按钮,没有引入新色系。
- 图片与资源:本次不涉及图片或外部资源;日历图标使用浏览器原生日期控件。
- 文案与内容:状态选项明确为“全部反馈 / 未读反馈 / 已读反馈”,操作明确为“查询 / 重置 / 导出 Excel”。
## 交互与工程检查
- 已验证反馈状态、开始日期、结束日期、查询、重置和导出入口均可见且可操作。
- 已验证反馈列表和分页在筛选栏重构后正常显示。
- 浏览器控制台错误和警告0。
- `npm --prefix apps/admin-web run build`:通过。
- `git diff --check`:通过。
## 对比历史
1. [P1] 初始问题:双月日历样式缺失,控件内容拥挤并遮挡主要内容。
2. 修复:移除该页不稳定的双月浮层,改用其他后台页面已验证的原生日期范围输入模式。
3. [P2] 初始问题:筛选动作依赖控件变更自动触发,缺少明确的查询和重置入口。
4. 修复:增加查询与重置按钮,导出仍要求完整起止日期,避免误导出。
5. 复验:全页布局、日期重点区域、横向溢出、控制台和生产构建均通过;未发现剩余 P0、P1、P2 问题。
final result: passed
---
# 用户端聊天页设计验收
## 对照范围