56 lines
3.3 KiB
Markdown
56 lines
3.3 KiB
Markdown
# 操作日志：配送订单设备参数展示
|
||
|
||
操作时间：2026-08-15
|
||
|
||
操作类型：修改
|
||
|
||
影响模块：平台总后台、配送订单详情、订单明细关联表
|
||
|
||
## 操作前状态
|
||
|
||
订单明细的 `product_params` 使用普通固定布局表格单元格展示，并统一启用省略号。较长 JSON 只能看到开头字符，列位于表格右侧时几乎无法辨认完整内容。
|
||
|
||
## 具体操作
|
||
|
||
- 将订单明细设备参数列改为宽度固定的“查看参数”入口。
|
||
- 悬浮或点击入口后，在受视口宽度和高度限制的浮层中展示完整参数。
|
||
- JSON 字符串和对象统一使用两空格缩进格式化；历史非 JSON 文本保持原样。
|
||
- 增加详情设备参数静态回归检查及 npm 脚本。
|
||
|
||
## 操作后状态
|
||
|
||
订单详情表格不再直接塞入被截断的参数原文。用户可通过“查看参数”读取完整格式化内容，长参数支持浮层内滚动，不会继续撑宽页面。
|
||
|
||
## 代码变更
|
||
|
||
- `frontend/platform_admin/src/views/resource/ResourceDetailContent.vue`：设备参数专用单元格、格式化逻辑及浮层样式。
|
||
- `frontend/platform_admin/scripts/check-resource-detail-json-display.mjs`：设备参数完整查看回归检查。
|
||
- `frontend/platform_admin/package.json`：新增 `resource-detail-json:check` 命令。
|
||
- `docs/项目文档_配送订单合同气瓶显示优化_v1.0.md`：同步订单详情参数展示规则。
|
||
|
||
## 验证结果
|
||
|
||
- `pnpm.cmd resource-detail-json:check`：通过。
|
||
- `pnpm.cmd type:check`：通过。
|
||
- `pnpm.cmd build`：通过，Vite 成功构建 2621 个模块。
|
||
|
||
## 风险评估
|
||
|
||
- 本次仅修改展示层，不改变数据库、订单快照或 API 响应结构。
|
||
- 非 `product_params` 列维持原表格展示逻辑。
|
||
- 历史空值显示“暂无参数”，历史非法 JSON 不会丢失，按原文本完整展示。
|
||
|
||
## 100% 缩放补充修复
|
||
|
||
操作前状态：关联表的内部最小宽度会参与详情页网格的固有宽度计算。在浏览器 100% 缩放、内容区约 1100 像素时，关联表可能反向撑宽整个详情页，导致基本信息右列和订单明细右侧列落到视口之外；缩小浏览器只能暂时掩盖问题。
|
||
|
||
具体操作：为记录页、详情栈、详情卡、页签内容和表格外壳补充宽度收缩边界；关联表改为在独立容器内处理横向溢出；长标识和值容器允许收缩换行。
|
||
|
||
操作后状态：页面按 100% 缩放下的真实内容区宽度布局，子表不能再扩张整页；宽度不足时仅表格区域内部滚动，基本信息和业务操作保持在可视区域内。
|
||
|
||
代码变更：`ResourceDetailContent.vue` 增加关联表宽度外壳和详情内容收缩约束；`ResourceRecordPage.less` 增加页面级最大宽度约束；静态检查同步覆盖整页横向溢出防护。
|
||
|
||
验证策略：在 1365×768 的 100% 等效视口验证页面壳宽度，并执行设备参数静态检查、类型检查和生产构建。目标历史订单在新 root 会话中返回“无权访问该记录”，因此该会话不能执行真实数据视觉回归，未通过修改权限或数据绕过限制。
|
||
|
||
风险评估：仅改变展示层的宽度收缩与溢出边界；不改变 API、订单状态、合同约束或设备参数内容。极窄视口下的多列表格可能出现表格内部横向滚动，这是保留列信息的预期兜底行为。
|