LabelChange-server/spec.md

规格说明：BOL 标签模板优化

目标

优化 d:\EPproject\LabelReplaceServer\src\BillOfLadingTemplate.html 文件，使其成为一个高度适应性的 BOL（提货单）标签模板，能够完美适应各种纸张尺寸进行打印，同时确保内容的完整性、清晰度和可读性。

当前状态

当前的 BillOfLadingTemplate.html 文件包含基本的 HTML 结构和内联 CSS 样式。它已经包含了一些 @media print 媒体查询，用于处理打印时的样式。在之前的步骤中，我们已经对冗余的 @media print 规则进行了初步合并和清理。

主要改进领域

1. 打印布局适应性：

   • 确保模板在打印时能够根据不同的纸张尺寸（如 A4、Letter、自定义标签尺寸 100mm x 150mm 等）进行智能缩放和布局调整。
   • 防止内容在打印时出现溢出、截断或重叠，确保所有信息都能完整呈现。
   • 实现响应式字体大小和元素间距，以在不同纸张尺寸下保持最佳可读性。

2. 视觉层级增强：

   • 突出显示关键业务数据，例如“渠道 (channel)”和“提货单号 (bolNumber)”，通过加粗或适当增大字体等方式，使其在视觉上更具辨识度，方便用户快速获取重要信息。

3. 表格可读性优化：

   • 改进 details-table 的样式，特别是其字体大小。当前 6px 的字体在打印时可能难以阅读，需要调整为更合适的尺寸（例如，8pt 或 9pt）。
   • 审查表格单元格的内边距和行高，以确保数据清晰分隔，提高整体可读性。

4. 代码整洁性与可维护性：

   • 进一步审查和重构 CSS 代码，消除任何剩余的冗余或不一致的样式规则。
   • 确保 CSS 结构清晰，易于理解和未来的维护。

预期结果

经过优化后，BillOfLadingTemplate.html 将能够：

• 在任何标准或自定义纸张尺寸上进行高质量打印。
• 打印输出清晰、专业，所有关键信息一目了然。
• CSS 代码更加精简、高效，易于维护和扩展。

验证标准

将通过以下方式验证优化效果：

• 在不同纸张尺寸下进行打印预览和实际打印测试，检查布局、字体和内容完整性。
• 目视检查关键业务数据的突出显示效果。
• 代码审查，确保 CSS 样式符合整洁性和可维护性标准。