优化:全站共享分页组件新增 100 条/页档位 #177

Closed
opened 2026-08-31 17:32:54 +08:00 by ila · 2 comments
Owner

Gitea MCP 未向当前会话暴露,按仓库规则回退项目根目录安全配置与 Gitea API 创建本工单;凭据未写入工单、代码或日志。

原始需求摘要

来源:用户于 2026-08-31 提问「所有页面翻页组件是不是同一个,现在最多 50 条一页,加 100 条一页和 200 条一页是否合适」。在只读核验后用户确认按建议范围建单:只加 100,不加 200。

目的:让数据量较大的列表页可以一页看 100 条,减少翻页次数;不引入"选了 200 实际只拿到 100"的误导性行为。

基线与已核实事实

代码基线:5338dd0(2026-08-31)。核验日期 2026-08-31。

  • 全站共用同一个分页组件 web/src/components/Pagination/index.vue,默认 pageSizes: [10, 20, 30, 50];goauto 模块下至少 10 个列表页、admin 系统管理模块下至少 12 个页面均使用该组件,多数未覆盖默认值。
  • 唯一例外:web/src/views/goauto/syb-inner-codes/index.vue:34 单独传入 :page-sizes="[20, 50, 100, 200]",对应后端 sybinnercode/service.go:122-125 有专属白名单,只接受 20/50/100/200 四个值,不合规则时报 invalid("pageSize 只允许 20、50、100、200")。
  • 已核实的 goauto 列表接口服务端分页上限:
    • 上限 100:device/list.go:55-56、product/service.go:250-253(pdd-products)、product/related.go:107-108(related-syb-products)、purchase/admin_query.go:116-117、replacement/service.go:194-195、shopeeproduct/service.go:227-228、sybimport/service.go:68-69、task/admin_service.go:182-183。
    • 上限 200(专属白名单):sybinnercode/service.go:122-125,不在本单范围。
    • sybshop/service.go:66-67:PageSize < 1 或 > 200 才重置为 50,实际没有开放到 200 的合法输入路径,行为特殊,本单不处理。
  • 结论:把共享组件默认 pageSizes 加上 100,对上述"上限 100"的全部接口都是安全的(选 100 就能拿到完整 100 条);加 200 会导致这些接口在选 200 时被服务端悄悄截成 100 条返回,且前端没有任何提示,是一个真实的误导性问题,因此本单不加 200。

判断边界

  • 已确认:加 100 对已核实的 8 类接口安全;sybinnercode、sybshop 行为特殊,明确排除在外,不因本单改动。
  • 尚未核实:admin 系统管理模块(sys-user、sys-role、sys-config 等 12 个页面)各自后端分页上限是否也是 100 或更高;本单改动是共享组件的默认值,会同时影响这些页面。前端加 100 时若这些接口上限低于 100(如更早期实现可能限制为 50),会出现同样的"选了拿不到"问题。

目标

  1. 共享分页组件 Pagination/index.vue 的默认 pageSizes 增加 100 档:[10, 20, 30, 50, 100]。
  2. 核实 admin 系统管理模块相关列表接口的分页上限,确保新增的 100 档在这些页面同样安全;上限低于 100 的接口不在本次default变更范围内生效(保持原状或单独处理,视核实结果决定)。
  3. 不改变现有页面对分页组件的显式覆盖(如 syb-inner-codes 的 [20, 50, 100, 200])。

非目标

  • 不新增 200 档;不修改 sybinnercode 现有的专属白名单和其 200 档。
  • 不修改 sybshop 的分页上限或重置逻辑。
  • 不修改任何列表接口的服务端分页上限;如核实发现某接口上限低于 100,处理方式是让该页面继续使用原分页档位或后续单独建单调整接口上限,不在本单内改动接口。
  • 不修改分页组件之外的其他布局、样式或交互。

前置依赖与并行性

  • 纯前端改动为主;若核实中发现 admin 模块某接口上限低于 100,需要额外判断处理方式,不预先假设该接口会被一并放开。
  • 与 #172、#175 无代码重叠,可并行。

固定实施方案

  1. 核实 admin 系统管理模块(sys-user、sys-role、sys-config、sys-api、sys-login-log、sys-oper-log、sys-post、dict、dict/data、dev-tools/gen/importTable 等)对应后端列表接口的分页上限,逐一记录结果。
  2. 对上限 ≥100 的接口:新增 100 档全局生效,无需页面改动。
  3. 对上限 <100 的接口(如存在):该页面在共享组件默认值变更后会出现"选 100 拿不到 100"的问题,需单独处理,处理方式二选一并在工单记录:
    • 该页面显式覆盖 page-sizes,排除 100 档;或
    • 记录为已知限制并提示用户,不在本单内修改接口上限。
  4. 修改 web/src/components/Pagination/index.vue 的 pageSizes prop 默认值为 [10, 20, 30, 50, 100]。
  5. 未被步骤 3 排除的页面无需逐一改动,自动获得新档位。

设计证据

现有分页组件的默认值调整,属最小范围界面改动,不新增组件、不改变交互模式,只增加一个可选档位。实施前提供包含新档位下拉选项的标注截图交用户确认,覆盖:goauto 一个典型列表页(如 pdd-products)与 admin 一个典型列表页(如 sys-user)两个状态。

验收标准

  • 分页组件下拉可选 100 条/页。
  • 已核实的全部「上限 100」goauto 接口选择 100 条/页后,实际返回 100 条(当总数足够时)。
  • admin 系统管理模块相关接口逐一核实完成,结果记录在工单;上限低于 100 的接口按步骤 3 处理并说明理由。
  • syb-inner-codes 页面行为不受影响,仍保留 [20, 50, 100, 200] 覆盖。
  • sybshop、sybinnercode 相关接口与页面未被修改。
  • 未出现"选择某档位但实际返回条数少于该档位"的情况(数据量充足时)。
  • Web 单元测试与既有 e2e 测试通过。

必测场景

  • goauto 侧:pdd-products、shopee-products、purchase-tasks、collection-tasks、devices 等页面选择 100 条/页,核对实际返回条数与总数。
  • admin 侧:核实后选定的 1~2 个典型页面选择 100 条/页,核对行为。
  • syb-inner-codes 页面:确认仍显示 20/50/100/200 四档,行为不变。
  • 总数小于 100 时选择 100 条/页,页面正常显示全部数据,不报错。
  • 页面间切换(从加了 100 档的页面跳转到未核实/已知上限较低的页面)分页档位不串页。

风险与安全门禁

  • 改动是全站共享组件的默认值,影响面覆盖 goauto 与 admin 两个模块的所有列表页,实施前必须完成步骤 1 的逐接口核实,避免引入"选了拿不到"的误导性问题。
  • 不涉及权限、安全、并发、数据库结构变化。
  • 100 条/页对渲染性能的影响未逐页评估(尤其含图片缩略图的列表,如 pdd-products、shopee-products 关联弹窗),如核实中发现明显卡顿,记录在工单,不在本单内做虚拟滚动等性能优化。

文档影响

无长期文档影响。 未新增接口、参数或数据结构,仅调整前端共享组件的默认展示档位;启动、测试、部署与排错方式均未变化。因此跳过 Wiki 更新与同步。

状态

待确认(2026-08-31 创建,等待用户确认方案与界面截图后方可实施)。

> Gitea MCP 未向当前会话暴露,按仓库规则回退项目根目录安全配置与 Gitea API 创建本工单;凭据未写入工单、代码或日志。 ## 原始需求摘要 来源:用户于 2026-08-31 提问「所有页面翻页组件是不是同一个,现在最多 50 条一页,加 100 条一页和 200 条一页是否合适」。在只读核验后用户确认按建议范围建单:只加 100,不加 200。 目的:让数据量较大的列表页可以一页看 100 条,减少翻页次数;不引入"选了 200 实际只拿到 100"的误导性行为。 ## 基线与已核实事实 代码基线:`5338dd0`(2026-08-31)。核验日期 2026-08-31。 - 全站共用同一个分页组件 `web/src/components/Pagination/index.vue`,默认 `pageSizes: [10, 20, 30, 50]`;goauto 模块下至少 10 个列表页、admin 系统管理模块下至少 12 个页面均使用该组件,多数未覆盖默认值。 - 唯一例外:`web/src/views/goauto/syb-inner-codes/index.vue:34` 单独传入 `:page-sizes="[20, 50, 100, 200]"`,对应后端 `sybinnercode/service.go:122-125` 有专属白名单,只接受 `20/50/100/200` 四个值,不合规则时报 `invalid("pageSize 只允许 20、50、100、200")`。 - 已核实的 goauto 列表接口服务端分页上限: - **上限 100**:`device/list.go:55-56`、`product/service.go:250-253`(pdd-products)、`product/related.go:107-108`(related-syb-products)、`purchase/admin_query.go:116-117`、`replacement/service.go:194-195`、`shopeeproduct/service.go:227-228`、`sybimport/service.go:68-69`、`task/admin_service.go:182-183`。 - **上限 200(专属白名单)**:`sybinnercode/service.go:122-125`,不在本单范围。 - `sybshop/service.go:66-67`:`PageSize < 1 或 > 200` 才重置为 50,实际没有开放到 200 的合法输入路径,行为特殊,本单不处理。 - 结论:把共享组件默认 `pageSizes` 加上 100,对上述"上限 100"的全部接口都是安全的(选 100 就能拿到完整 100 条);加 200 会导致这些接口在选 200 时被服务端悄悄截成 100 条返回,且前端没有任何提示,是一个真实的误导性问题,因此本单不加 200。 ## 判断边界 - 已确认:加 100 对已核实的 8 类接口安全;`sybinnercode`、`sybshop` 行为特殊,明确排除在外,不因本单改动。 - 尚未核实:admin 系统管理模块(`sys-user`、`sys-role`、`sys-config` 等 12 个页面)各自后端分页上限是否也是 100 或更高;本单改动是共享组件的默认值,会同时影响这些页面。前端加 100 时若这些接口上限低于 100(如更早期实现可能限制为 50),会出现同样的"选了拿不到"问题。 ## 目标 1. 共享分页组件 `Pagination/index.vue` 的默认 `pageSizes` 增加 100 档:`[10, 20, 30, 50, 100]`。 2. 核实 admin 系统管理模块相关列表接口的分页上限,确保新增的 100 档在这些页面同样安全;上限低于 100 的接口不在本次default变更范围内生效(保持原状或单独处理,视核实结果决定)。 3. 不改变现有页面对分页组件的显式覆盖(如 `syb-inner-codes` 的 `[20, 50, 100, 200]`)。 ## 非目标 - 不新增 200 档;不修改 `sybinnercode` 现有的专属白名单和其 200 档。 - 不修改 `sybshop` 的分页上限或重置逻辑。 - 不修改任何列表接口的服务端分页上限;如核实发现某接口上限低于 100,处理方式是让该页面继续使用原分页档位或后续单独建单调整接口上限,不在本单内改动接口。 - 不修改分页组件之外的其他布局、样式或交互。 ## 前置依赖与并行性 - 纯前端改动为主;若核实中发现 admin 模块某接口上限低于 100,需要额外判断处理方式,不预先假设该接口会被一并放开。 - 与 #172、#175 无代码重叠,可并行。 ## 固定实施方案 1. 核实 admin 系统管理模块(`sys-user`、`sys-role`、`sys-config`、`sys-api`、`sys-login-log`、`sys-oper-log`、`sys-post`、`dict`、`dict/data`、`dev-tools/gen/importTable` 等)对应后端列表接口的分页上限,逐一记录结果。 2. 对上限 ≥100 的接口:新增 100 档全局生效,无需页面改动。 3. 对上限 <100 的接口(如存在):该页面在共享组件默认值变更后会出现"选 100 拿不到 100"的问题,需单独处理,处理方式二选一并在工单记录: - 该页面显式覆盖 `page-sizes`,排除 100 档;或 - 记录为已知限制并提示用户,不在本单内修改接口上限。 4. 修改 `web/src/components/Pagination/index.vue` 的 `pageSizes` prop 默认值为 `[10, 20, 30, 50, 100]`。 5. 未被步骤 3 排除的页面无需逐一改动,自动获得新档位。 ## 设计证据 现有分页组件的默认值调整,属最小范围界面改动,不新增组件、不改变交互模式,只增加一个可选档位。实施前提供包含新档位下拉选项的标注截图交用户确认,覆盖:goauto 一个典型列表页(如 pdd-products)与 admin 一个典型列表页(如 sys-user)两个状态。 ## 验收标准 - [ ] 分页组件下拉可选 100 条/页。 - [ ] 已核实的全部「上限 100」goauto 接口选择 100 条/页后,实际返回 100 条(当总数足够时)。 - [ ] admin 系统管理模块相关接口逐一核实完成,结果记录在工单;上限低于 100 的接口按步骤 3 处理并说明理由。 - [ ] `syb-inner-codes` 页面行为不受影响,仍保留 `[20, 50, 100, 200]` 覆盖。 - [ ] `sybshop`、`sybinnercode` 相关接口与页面未被修改。 - [ ] 未出现"选择某档位但实际返回条数少于该档位"的情况(数据量充足时)。 - [ ] Web 单元测试与既有 e2e 测试通过。 ## 必测场景 - goauto 侧:pdd-products、shopee-products、purchase-tasks、collection-tasks、devices 等页面选择 100 条/页,核对实际返回条数与总数。 - admin 侧:核实后选定的 1~2 个典型页面选择 100 条/页,核对行为。 - syb-inner-codes 页面:确认仍显示 `20/50/100/200` 四档,行为不变。 - 总数小于 100 时选择 100 条/页,页面正常显示全部数据,不报错。 - 页面间切换(从加了 100 档的页面跳转到未核实/已知上限较低的页面)分页档位不串页。 ## 风险与安全门禁 - 改动是全站共享组件的默认值,影响面覆盖 goauto 与 admin 两个模块的所有列表页,实施前必须完成步骤 1 的逐接口核实,避免引入"选了拿不到"的误导性问题。 - 不涉及权限、安全、并发、数据库结构变化。 - 100 条/页对渲染性能的影响未逐页评估(尤其含图片缩略图的列表,如 pdd-products、shopee-products 关联弹窗),如核实中发现明显卡顿,记录在工单,不在本单内做虚拟滚动等性能优化。 ## 文档影响 **无长期文档影响。** 未新增接口、参数或数据结构,仅调整前端共享组件的默认展示档位;启动、测试、部署与排错方式均未变化。因此跳过 Wiki 更新与同步。 ## 状态 待确认(2026-08-31 创建,等待用户确认方案与界面截图后方可实施)。
Author
Owner

实施完成,待验收

设计证据:用户于 2026-08-31 确认共享分页增加 100 条/页档位。

Admin 接口核验:

  • sys-user、sys-role、sys-config、sys-api、sys-login-log、sys-oper-log、sys-post、dict/type、dict/data 与代码生成列表统一使用 common/dto.Pagination。
  • GetPageSize 只把非正数回退为 10,不对 100 截断,因此无需页面排除。
  • goauto 已核实的主列表接口上限均为 100。
  • syb-inner-codes 显式覆盖 [20,50,100,200],保持不变;未修改 sybshop/sybinnercode 服务端。

实现:共享 Pagination/index.vue 默认档位由 [10,20,30,50] 改为 [10,20,30,50,100],未新增 200,未改变任何页面初始 pageSize。

验证:

  • pnpm exec eslint src/components/Pagination/index.vue tests/unit/pagination.spec.js:0 错误,仅组件原有属性排序 warning。
  • pnpm exec jest tests/unit/pagination.spec.js --runInBand:2/2 通过,覆盖共享默认包含 100 和显式 [20,50,100,200] 覆盖不变。
  • pnpm build:prod:通过;仅有仓库既有 CSS 伪类和 chunk-size 警告。

文档影响:无长期文档影响,跳过 Wiki。

提交:55ded8b,已推送 origin/main。工作区中的 SYB 文档和 server/config/settings.yml 修改未纳入本提交。状态:待用户验收。

## 实施完成,待验收 设计证据:用户于 2026-08-31 确认共享分页增加 100 条/页档位。 Admin 接口核验: - sys-user、sys-role、sys-config、sys-api、sys-login-log、sys-oper-log、sys-post、dict/type、dict/data 与代码生成列表统一使用 `common/dto.Pagination`。 - `GetPageSize` 只把非正数回退为 10,不对 100 截断,因此无需页面排除。 - goauto 已核实的主列表接口上限均为 100。 - `syb-inner-codes` 显式覆盖 `[20,50,100,200]`,保持不变;未修改 sybshop/sybinnercode 服务端。 实现:共享 `Pagination/index.vue` 默认档位由 `[10,20,30,50]` 改为 `[10,20,30,50,100]`,未新增 200,未改变任何页面初始 pageSize。 验证: - `pnpm exec eslint src/components/Pagination/index.vue tests/unit/pagination.spec.js`:0 错误,仅组件原有属性排序 warning。 - `pnpm exec jest tests/unit/pagination.spec.js --runInBand`:2/2 通过,覆盖共享默认包含 100 和显式 `[20,50,100,200]` 覆盖不变。 - `pnpm build:prod`:通过;仅有仓库既有 CSS 伪类和 chunk-size 警告。 文档影响:无长期文档影响,跳过 Wiki。 提交:`55ded8b`,已推送 `origin/main`。工作区中的 SYB 文档和 `server/config/settings.yml` 修改未纳入本提交。状态:待用户验收。
Author
Owner

验收通过(2026-09-01,用户确认)。实施内容与设计证据见上方评论;无新增长期事实变化,未触发额外 Wiki 同步。工单关闭。

验收通过(2026-09-01,用户确认)。实施内容与设计证据见上方评论;无新增长期事实变化,未触发额外 Wiki 同步。工单关闭。
ila closed this issue 2026-09-01 09:04:20 +08:00
Sign in to join this conversation.
No labels
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: OPC/goauto#177