fix(ui): 打印隐藏AI区域蓝框 + diff弹窗字体统一
- print.ts的iframe样式中增加.ai-region隐藏规则:去除边框/背景/内边距,隐藏右上角标签 - diffModal右侧AI提议版本容器增加style属性:fontFamily SimSun、fontSize 12pt、lineHeight 1.5 - 确保打印输出和diff对比的视觉一致性
This commit is contained in:
58
工程分析/20260419_1822/实现方案.md
Normal file
58
工程分析/20260419_1822/实现方案.md
Normal file
@@ -0,0 +1,58 @@
|
||||
# 实现方案
|
||||
|
||||
## 修改文件 1:`src/utils/print.ts`
|
||||
|
||||
在 iframe 的 `<style>` 标签中,增加 `.ai-region` 的打印隐藏样式。
|
||||
|
||||
**原代码**(line 23-48 的 style 块):
|
||||
```css
|
||||
.report-signature-img { max-width: 120px; max-height: 40px; width: auto; height: auto; object-fit: contain; vertical-align: middle; display: inline-block; }
|
||||
@media print {
|
||||
.smart-field-wrapper .field-value { outline: none !important; box-shadow: none !important; border: none !important; border-bottom: 1px solid #000 !important; border-radius: 0 !important; background: transparent !important; padding: 0 2px 0px 2px !important; line-height: 1 !important; }
|
||||
.smart-field-wrapper .field-value.no-underline { border-bottom: none !important; }
|
||||
}
|
||||
```
|
||||
|
||||
**新代码**:
|
||||
```css
|
||||
.report-signature-img { max-width: 120px; max-height: 40px; width: auto; height: auto; object-fit: contain; vertical-align: middle; display: inline-block; }
|
||||
.ai-region { border: none !important; background: transparent !important; padding: 0 !important; margin: 0 !important; }
|
||||
.ai-region > [contenteditable="false"] { display: none !important; }
|
||||
@media print {
|
||||
.smart-field-wrapper .field-value { outline: none !important; box-shadow: none !important; border: none !important; border-bottom: 1px solid #000 !important; border-radius: 0 !important; background: transparent !important; padding: 0 2px 0px 2px !important; line-height: 1 !important; }
|
||||
.smart-field-wrapper .field-value.no-underline { border-bottom: none !important; }
|
||||
}
|
||||
```
|
||||
|
||||
**变更点**:
|
||||
1. 新增 `.ai-region` 样式:去除边框、背景、内边距、外边距
|
||||
2. 新增 `.ai-region > [contenteditable="false"]` 样式:隐藏右上角标签
|
||||
|
||||
## 修改文件 2:`src/pages/ReportEditor.tsx`
|
||||
|
||||
在 diffModal 右侧「AI 提议版本」容器上增加 `style` 属性。
|
||||
|
||||
**原代码**(line 2630-2636):
|
||||
```tsx
|
||||
<div
|
||||
className="p-4 flex-1 overflow-y-auto outline-none custom-scrollbar"
|
||||
contentEditable
|
||||
suppressContentEditableWarning
|
||||
onBlur={(e) => setDiffModal(prev => prev ? { ...prev, newHtml: e.target.innerHTML } : null)}
|
||||
dangerouslySetInnerHTML={{ __html: diffModal.newHtml }}
|
||||
></div>
|
||||
```
|
||||
|
||||
**新代码**:
|
||||
```tsx
|
||||
<div
|
||||
className="p-4 flex-1 overflow-y-auto outline-none custom-scrollbar"
|
||||
contentEditable
|
||||
suppressContentEditableWarning
|
||||
onBlur={(e) => setDiffModal(prev => prev ? { ...prev, newHtml: e.target.innerHTML } : null)}
|
||||
dangerouslySetInnerHTML={{ __html: diffModal.newHtml }}
|
||||
style={{ fontFamily: 'SimSun, "Microsoft YaHei", serif', fontSize: '12pt', lineHeight: '1.5' }}
|
||||
></div>
|
||||
```
|
||||
|
||||
**变更点**:增加 `style` 属性,指定宋体 12pt、行高 1.5,与编辑器正文样式一致。
|
||||
Reference in New Issue
Block a user