## 现状审计 - 高级表格使用: - 活动管理:`web/admin/src/views/activity/manage/index.vue:10-17` 使用 `ArtTable`(高级表格) - 期数管理:`web/admin/src/views/activity/issues/index.vue:6-14` 使用 `ArtTable` - 奖励管理:`web/admin/src/views/activity/rewards/index.vue:31-37` 使用 `ArtTable` - 操作栏一致性: - 活动管理中“模拟”按钮使用 `ElButton`(`manage/index.vue:32-39`),其余使用 `ArtButtonTable`;风格不一致 - 期数管理操作栏统一使用 `ArtButtonTable`(`issues/index.vue:21-33`) - 表格可视宽度:多列设置了固定 `width`(如 `manage/index.vue:291-297`;`issues/index.vue:83-88`),`name` 列使用 `showOverflowTooltip`(`manage/index.vue:292`),导致内容显示受限;未显式启用 `tableLayout="auto"` ## 优化目标 1. 全部使用高级表格组件,启用自适应布局以显示完整内容 2. 操作栏统一为图标标签按钮(`ArtButtonTable`),视觉与交互一致 3. 表格宽度与列长度自适应:移除过度固定宽度,采用 `minWidth` 与 `tableLayout="auto"`,仅对数值列设定最小宽度;必要时保留溢出提示 ## 具体改动 - 活动管理(`web/admin/src/views/activity/manage/index.vue`) - 在 `ArtTable` 上增加 `tableLayout="auto"` - 将 `columnsFactory` 中固定 `width` 改为 `minWidth`(如 `name` 列 `minWidth: 260`,`categoryName` `minWidth: 140`,`actions` `minWidth: 240`),取消 `showOverflowTooltip` 或仅对极长文本保留 - 将“模拟抽奖”按钮统一为 `ArtButtonTable`,图标 `ri:shuffle-line`,与现有按钮风格一致(替换 `ElButton`,位置 `index.vue:32-39`) - 期数管理(`web/admin/src/views/activity/issues/index.vue`) - 在 `ArtTable` 上增加 `tableLayout="auto"` - 将列宽改为 `minWidth`,例如:`issue_number` `minWidth: 160`、`status` `minWidth: 110`、`actions` `minWidth: 200` - 已统一使用 `ArtButtonTable`,无需额外调整 - 奖励管理(`web/admin/src/views/activity/rewards/index.vue`) - 已是 `ArtTable` 并启用 `tableLayout="auto"`;保留前次优化的汇总与列增强(剩余/总量、期望概率) ## 验收标准 - 三个页面均使用 `ArtTable`,内容在常见分辨率下完整显示(无不必要截断) - 操作栏按钮风格一致,皆为图标标签按钮,间距统一 - 表格宽度随容器自适应,长文本列通过 `minWidth` 与布局算法得到更好的展示;必要时保留 tooltip ## 风险与回滚 - 改动为前端表现层,低风险;如需回滚,可恢复原 `width` 配置与旧按钮类型。