2026-04-19-00-13-20 - 打印下划线紧贴文字（line-height: 1）

src/pages/ReportEditor.tsx

@@ -55,6 +55,26 @@ export default function ReportEditor() {
   
   const [activeTab, setActiveTab] = useState<'info' | 'video'>('info');
   const [activeFieldKey, setActiveFieldKey] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (!editorRef.current) return;
+    const allFields = editorRef.current.querySelectorAll('.field-value');
+    allFields.forEach(el => {
+      (el as HTMLElement).style.backgroundColor = '';
+      (el as HTMLElement).style.outline = '';
+      (el as HTMLElement).style.outlineOffset = '';
+    });
+    if (activeFieldKey) {
+      const targetEl = editorRef.current.querySelector(`.field-value[data-bind="${activeFieldKey}"]`) as HTMLElement;
+      if (targetEl) {
+        targetEl.style.backgroundColor = '#f1f5f9';
+        targetEl.style.outline = '1px solid #94a3b8';
+        targetEl.style.outlineOffset = '1px';
+        targetEl.scrollIntoView({ behavior: 'smooth', block: 'center' });
+      }
+    }
+  }, [activeFieldKey]);
+
   const [multiSelectOptions, setMultiSelectOptions] = useState<Record<string, string[]>>({
     surgeon: ['张医生', '李医生', '王医生'],
     assistant: ['赵医生', '钱医生', '孙医生'],
@@ -414,6 +434,9 @@ export default function ReportEditor() {
         return;
       }
 
+      // 点击空白处清除高亮
+      setActiveFieldKey(null);
+
       const placeholder = targetEl.closest('.image-placeholder') as HTMLElement | null;
       if (!placeholder) return;
 
@@ -1525,7 +1548,7 @@ export default function ReportEditor() {
                     if (field.type === 'text' || field.type === 'date') {
                       const inputType = field.type === 'date' ? 'date' : 'text';
                       return (
-                        <div key={field.key} id={`input-${field.key}`} className={`${field.category === '填空' && formFields.filter(f2 => f2.visibleInForm && f2.type === 'text' && f2.isSystemLocked).length > 1 && (field.key === 'patientName' || field.key === 'hospitalId') ? 'flex-1 space-y-1' : 'space-y-1'} p-2 -mx-2 rounded-xl transition-all duration-300 ${activeFieldKey === field.key ? 'bg-blue-50 ring-1 ring-accent shadow-sm' : ''}`}>
+                        <div key={field.key} id={`input-${field.key}`} onClick={() => setActiveFieldKey(field.key)} className={`${field.category === '填空' && formFields.filter(f2 => f2.visibleInForm && f2.type === 'text' && f2.isSystemLocked).length > 1 && (field.key === 'patientName' || field.key === 'hospitalId') ? 'flex-1 space-y-1' : 'space-y-1'} p-2 -mx-2 rounded-xl transition-all duration-300 ${activeFieldKey === field.key ? 'bg-blue-50 ring-1 ring-accent shadow-sm' : ''}`}>
                           <label className="block text-xs font-bold text-text-main">
                             {field.label} {isRequired && <span className="text-red-500">*</span>}
                           </label>
@@ -1545,7 +1568,7 @@ export default function ReportEditor() {
                       const isOpen = openDropdown === field.key;
                       const opts = field.options || (field.key === 'anesthesiaType' ? anesthesiaOptions : []);
                       return (
-                        <div key={field.key} id={`input-${field.key}`} className={`space-y-1 select-dropdown-root relative p-2 -mx-2 rounded-xl transition-all duration-300 ${activeFieldKey === field.key ? 'bg-blue-50 ring-1 ring-accent shadow-sm' : ''}`}>
+                        <div key={field.key} id={`input-${field.key}`} onClick={() => setActiveFieldKey(field.key)} className={`space-y-1 select-dropdown-root relative p-2 -mx-2 rounded-xl transition-all duration-300 ${activeFieldKey === field.key ? 'bg-blue-50 ring-1 ring-accent shadow-sm' : ''}`}>
                           <label className="block text-xs font-bold text-text-main">{field.label}</label>
                           <div
                             className="w-full px-3 py-2 border border-border rounded-lg bg-white flex items-center min-h-[42px] cursor-text"
@@ -1654,7 +1677,7 @@ export default function ReportEditor() {
                       const currentInputText = multiInputText[field.key] !== undefined ? multiInputText[field.key] : displayText;
 
                       return (
-                        <div key={field.key} id={`input-${field.key}`} className={`space-y-1 select-dropdown-root relative p-2 -mx-2 rounded-xl transition-all duration-300 ${activeFieldKey === field.key ? 'bg-blue-50 ring-1 ring-accent shadow-sm' : ''}`}>
+                        <div key={field.key} id={`input-${field.key}`} onClick={() => setActiveFieldKey(field.key)} className={`space-y-1 select-dropdown-root relative p-2 -mx-2 rounded-xl transition-all duration-300 ${activeFieldKey === field.key ? 'bg-blue-50 ring-1 ring-accent shadow-sm' : ''}`}>
                           <label className="block text-xs font-bold text-text-main">{field.label}（可多选）</label>
                           <div
                             className="w-full px-3 py-2 border border-border rounded-lg bg-white flex flex-wrap gap-1 items-center min-h-[42px] cursor-text"
@@ -1735,7 +1758,7 @@ export default function ReportEditor() {
                         const { h: h12, isPM } = from24h(h24val);
 
                         return (
-                          <div key={field.key} id={`input-${field.key}`} className={`space-y-1 p-2 -mx-2 rounded-xl transition-all duration-300 ${activeFieldKey === field.key ? 'bg-blue-50 ring-1 ring-accent shadow-sm' : ''}`}>
+                          <div key={field.key} id={`input-${field.key}`} onClick={() => setActiveFieldKey(field.key)} className={`space-y-1 p-2 -mx-2 rounded-xl transition-all duration-300 ${activeFieldKey === field.key ? 'bg-blue-50 ring-1 ring-accent shadow-sm' : ''}`}>
                             <label className="block text-xs font-bold text-text-main">{field.label}</label>
                             <div className="flex items-center gap-2">
                               <select
@@ -1792,7 +1815,7 @@ export default function ReportEditor() {
                       const { h: h12g, isPM: isPMg } = from24h(h24);
 
                       return (
-                        <div key={field.key} id={`input-${field.key}`} className="space-y-1">
+                        <div key={field.key} id={`input-${field.key}`} onClick={() => setActiveFieldKey(field.key)} className={`space-y-1 p-2 -mx-2 rounded-xl transition-all duration-300 ${activeFieldKey === field.key ? 'bg-blue-50 ring-1 ring-accent shadow-sm' : ''}`}>
                           <label className="block text-xs font-bold text-text-main">{field.label}</label>
                           <div className="flex items-center gap-2">
                             <select

src/pages/TemplateManage.tsx

@@ -499,6 +499,19 @@ export default function TemplateManage() {
     setFormFields(updated);
     storage.set('formFieldsConfig', updated);
     setEditingFieldKey(null);
+
+    // 同步更新编辑器中已插入字段的 classList
+    if (editorRef.current) {
+      const els = editorRef.current.querySelectorAll(`.field-value[data-bind="${key}"]`);
+      els.forEach(el => {
+        if (editFieldHasUnderline) {
+          el.classList.remove('no-underline');
+        } else {
+          el.classList.add('no-underline');
+        }
+      });
+      saveTemplateContent();
+    }
   };
 
   const addField = () => {

src/types.ts

@@ -121,8 +121,8 @@ export interface FormField {
 }
 
 export const DEFAULT_FORM_FIELDS: FormField[] = [
-  { key: 'patientName', label: '患者姓名', category: '填空', type: 'text', visibleInForm: true, isSystemLocked: true, hasUnderline: true },
+  { key: 'patientName', label: '患者姓名', category: '填空', type: 'text', visibleInForm: true, isSystemLocked: true, hasUnderline: false },
-  { key: 'hospitalId', label: '住院号', category: '填空', type: 'text', visibleInForm: true, isSystemLocked: true, hasUnderline: true },
+  { key: 'hospitalId', label: '住院号', category: '填空', type: 'text', visibleInForm: true, isSystemLocked: true, hasUnderline: false },
   { key: 'title', label: '手术名称', category: '填空', type: 'text', visibleInForm: true, isSystemLocked: false },
   { key: 'patientGender', label: '患者性别', category: '单选', type: 'single_select', visibleInForm: true, isSystemLocked: false, options: ['男', '女'] },
   { key: 'patientAge', label: '患者年龄', category: '填空', type: 'text', visibleInForm: true, isSystemLocked: false },

src/utils/defaultContent.ts

@@ -1,5 +1,5 @@
 const smartField = (key: string) => {
-  return `<span class="smart-field-wrapper" contenteditable="false" style="white-space:nowrap;position:relative;"><span class="field-value no-underline" data-bind="${key}" contenteditable="true" style="min-width:32px;padding:0 4px;margin:0 2px;border:1px solid #cbd5e1;border-radius:2px;display:inline-block;background:#f8fafc;color:#0f172a;line-height:inherit;font-size:inherit;vertical-align:baseline;box-sizing:border-box;outline:none;"> </span><span class="delete-btn" contenteditable="false">×</span></span>&#8203;`;
+  return `<span class="smart-field-wrapper" contenteditable="false" style="white-space:nowrap;position:relative;"><span class="field-value no-underline" data-bind="${key}" contenteditable="true" style="min-width:24px;padding:0 2px;margin:0;border:1px solid #cbd5e1;border-radius:2px;display:inline-block;background:#f8fafc;color:#0f172a;line-height:inherit;font-size:inherit;vertical-align:baseline;box-sizing:border-box;outline:none;text-align:center;"> </span><span class="delete-btn" contenteditable="false">×</span></span>&#8203;`;
 };
 
 export const defaultReportContent = `

src/utils/print.ts

@@ -19,6 +19,7 @@ export const printDocument = (htmlContent: string, docTitle: string = '图文报
       <html>
       <head>
         <meta charset="utf-8">
+        <title>${docTitle}</title>
         <style>
           @page { size: A4; margin: 15mm 10mm; }
           * { box-sizing: border-box; }
@@ -36,12 +37,12 @@ export const printDocument = (htmlContent: string, docTitle: string = '图文报
           .delete-btn { display: none !important; }
           .image-placeholder:not(.has-image) { display: none !important; }
           .template-info-section { position: relative; margin-bottom: 16px; }
-          .smart-field-wrapper { display: inline-flex; align-items: baseline; margin: 0 2px; vertical-align: baseline; }
+          .smart-field-wrapper { display: inline-flex; align-items: baseline; margin: 0; vertical-align: baseline; }
           .smart-field-wrapper .field-label { color: #64748b; user-select: none; }
-          .smart-field-wrapper .field-value { min-width: 32px; padding: 0 4px; margin: 0 2px; border: 1px solid #cbd5e1; border-radius: 2px; display: inline-block; background: #f8fafc; color: #0f172a; line-height: inherit; font-size: inherit; vertical-align: baseline; box-sizing: border-box; outline: none; }
+          .smart-field-wrapper .field-value { min-width: 24px; padding: 0 2px; margin: 0; border: 1px solid #cbd5e1; border-radius: 2px; display: inline-block; background: #f8fafc; color: #0f172a; line-height: inherit; font-size: inherit; vertical-align: baseline; box-sizing: border-box; outline: none; text-align: center; }
           .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 { border: none !important; border-bottom: 1px solid #000 !important; border-radius: 0 !important; background: transparent !important; padding: 0 2px 1px 2px !important; }
+            .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; }
           }
         </style>

工程分析/实现方案-2026-04-18-23-39-35.md

@@ -0,0 +1,108 @@
+# 实现方案 —— 2026-04-18-23-39-35
+
+## 方案目标
+修复下划线功能、统一导出文件名、缩紧输入框间距、实现表单逆向联动。
+
+## 需求 1：修复下划线勾选状态异常及打印失效
+
+### 修改文件 1：`src/types.ts`
+在 `DEFAULT_FORM_FIELDS` 数组中，为所有字段显式设置 `hasUnderline: false`（如果当前为 `true` 或未指定）。
+
+### 修改文件 2：`src/pages/TemplateManage.tsx`
+在编辑字段的回显逻辑中：
+```ts
+setEditFieldHasUnderline(field.hasUnderline === true);
+```
+确保 `undefined` 时默认不勾选。
+
+### 修改文件 3：`src/utils/print.ts`
+恢复默认显示下划线的白名单机制：
+```css
+@media print {
+  .smart-field-wrapper .field-value {
+    border: none !important;
+    border-bottom: 1px solid #000 !important;
+    border-radius: 0 !important;
+    background: transparent !important;
+    padding: 0 2px 0px 2px !important;
+  }
+  .smart-field-wrapper .field-value.no-underline {
+    border-bottom: none !important;
+  }
+}
+```
+
+## 需求 2：统一 PDF 和 JSON 导出文件名
+
+### 修改文件：`src/utils/print.ts`
+确保 `printDocument` 中：
+1. 保存原始 `document.title`
+2. 设置 `document.title = docTitle`
+3. iframe HTML 中也写入 `<title>${docTitle}</title>`
+4. 打印完成后恢复 `document.title`
+
+同时检查 `ReportEditor.tsx` 和 `ReportManage.tsx` 中调用 `printDocument` 时传入的 `docTitle` 是否与 JSON 文件名一致。
+
+## 需求 3：缩紧 field-value 内文字间距
+
+### 修改文件 1：`src/utils/defaultContent.ts`
+```ts
+// padding:0 4px → padding:0 2px
+// margin:0 2px → margin:0
+// min-width:32px → min-width:24px
+// 增加 text-align:center 让文字居中
+```
+
+### 修改文件 2：`src/utils/print.ts`
+同步修改打印样式中的 `.field-value`：
+```css
+.smart-field-wrapper .field-value {
+  min-width: 24px;
+  padding: 0;
+  margin: 0;
+  ...
+}
+```
+
+## 需求 4：ReportEditor 表单逆向联动
+
+### 修改文件：`src/pages/ReportEditor.tsx`
+
+1. **新增 useEffect 监听 activeFieldKey**：
+```ts
+useEffect(() => {
+  if (!editorRef.current) return;
+  const allFields = editorRef.current.querySelectorAll('.field-value');
+  allFields.forEach(el => {
+    (el as HTMLElement).style.backgroundColor = '#f8fafc';
+    (el as HTMLElement).style.boxShadow = 'none';
+  });
+  if (activeFieldKey) {
+    const targetEl = editorRef.current.querySelector(`.field-value[data-bind="${activeFieldKey}"]`) as HTMLElement;
+    if (targetEl) {
+      targetEl.style.backgroundColor = '#eff6ff';
+      targetEl.style.boxShadow = '0 0 0 2px #3b82f6';
+      targetEl.scrollIntoView({ behavior: 'smooth', block: 'center' });
+    }
+  }
+}, [activeFieldKey]);
+```
+
+2. **右侧表单添加 onFocus/onClick**：
+在右侧表单字段容器的 `onClick` 中增加 `setActiveFieldKey(field.key)`，在 input/select 的 `onFocus` 中也增加 `setActiveFieldKey(field.key)`。
+
+## 涉及文件及修改点
+| 文件 | 修改点 |
+|------|--------|
+| `src/types.ts` | DEFAULT_FORM_FIELDS 中 hasUnderline 设为 false |
+| `src/pages/TemplateManage.tsx` | 编辑字段回显逻辑 |
+| `src/utils/print.ts` | 打印下划线白名单机制；document.title 设置；field-value 间距 |
+| `src/utils/defaultContent.ts` | smartField padding/margin 缩小；text-align:center |
+| `src/pages/ReportEditor.tsx` | activeFieldKey useEffect 高亮滚动；表单 onFocus 联动 |
+| `src/pages/ReportManage.tsx` | 检查导出文件名一致性 |
+
+## 风险与注意事项
+1. `DEFAULT_FORM_FIELDS` 修改后，现有用户的 localStorage 中已保存的字段配置不会自动更新，需要手动编辑或清除 `formFieldsConfig` 才能看到效果。
+2. `activeFieldKey` 的 useEffect 直接操作 DOM style，需要确保在组件卸载或切换 tab 时清除高亮。
+3. 缩小 padding/margin 后，需要验证在表格单元格（td）内的显示是否正常。
+4. 打印样式中 `.field-value.no-underline` 的优先级必须高于基础 `.field-value` 规则。

工程分析/实现方案-2026-04-19-00-01-50.md

@@ -0,0 +1,65 @@
+# 实现方案 —— 2026-04-19-00-01-50
+
+## 方案目标
+修复高亮样式、实现点击空白取消、阻断打印高亮、同步字段下划线配置到已插入的 DOM。
+
+## 需求 1 & 2：优化高亮样式、点击空白取消、阻断打印
+
+### 修改文件 1：`src/pages/ReportEditor.tsx`
+
+1. **点击空白取消高亮**：在 `handleEditorClick` 中，如果点击目标不是 `.field-value`，则设置 `setActiveFieldKey(null)`。
+
+2. **柔和高亮样式**：修改 `activeFieldKey` 的 `useEffect`：
+   - 清除样式时：恢复为 `''`（空字符串）而非硬编码颜色，让 CSS 类重新接管
+   - 高亮时：`backgroundColor: '#f1f5f9'`（浅灰）、`outline: '1px solid #94a3b8'`（细灰边框）、`outlineOffset: '1px'`
+   - 不再使用 `box-shadow`
+
+### 修改文件 2：`src/utils/print.ts`
+
+在 `@media print` 中强制抹除 `outline` 和 `box-shadow`：
+```css
+@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 1px 2px !important;
+  }
+  .smart-field-wrapper .field-value.no-underline { border-bottom: none !important; }
+}
+```
+
+## 需求 3：修复下划线勾选无效
+
+### 修改文件：`src/pages/TemplateManage.tsx`
+
+在 `saveFieldEdit` 函数中，保存字段配置后，扫描编辑器中所有 `data-bind` 匹配的 `.field-value`，根据新的 `hasUnderline` 值动态添加/移除 `.no-underline` 类：
+```ts
+if (editorRef.current) {
+  const els = editorRef.current.querySelectorAll(`.field-value[data-bind="${editingFieldId}"]`);
+  els.forEach(el => {
+    if (editFieldHasUnderline) {
+      el.classList.remove('no-underline');
+    } else {
+      el.classList.add('no-underline');
+    }
+  });
+  saveTemplateContent();
+}
+```
+
+## 涉及文件及修改点
+| 文件 | 修改点 |
+|------|--------|
+| `src/pages/ReportEditor.tsx` | handleEditorClick 点击空白取消高亮；useEffect 柔和高亮样式 |
+| `src/utils/print.ts` | @media print 强制抹除 outline/box-shadow |
+| `src/pages/TemplateManage.tsx` | saveFieldEdit 同步更新已插入字段的 classList |
+
+## 风险与注意事项
+1. `handleEditorClick` 中增加 `setActiveFieldKey(null)` 时，需确保不会影响 `.image-placeholder` 的点击处理逻辑（placeholder 点击在 field-value 判断之后）。
+2. `useEffect` 中清除样式时使用 `style.backgroundColor = ''` 而非 `= '#f8fafc'`，这样可以让元素的 CSS 类样式重新生效，避免硬编码颜色与 CSS 类冲突。
+3. `saveFieldEdit` 中扫描 DOM 并修改 classList 后，必须调用 `saveTemplateContent()` 将变更持久化到 localStorage。
+4. 打印样式中 `outline: none !important` 和 `box-shadow: none !important` 的优先级需确保高于任何内联样式。

工程分析/实现方案-2026-04-19-00-13-20.md

@@ -0,0 +1,37 @@
+# 实现方案 —— 2026-04-19-00-13-20
+
+## 方案目标
+使打印/PDF导出时 `.field-value` 的下划线紧贴文字底部。
+
+## 修改点
+
+### 修改文件：`src/utils/print.ts`
+
+在 `@media print` 的 `.smart-field-wrapper .field-value` 样式中增加 `line-height: 1 !important;`。
+
+**原因**：即使 `padding-bottom` 已设为 `0px`，父级文档的 `line-height: 1.5` 仍会在文字下方保留不可见的行高留白。通过强制压缩行高到 `1`，可以消除底部留白，使 `border-bottom` 紧贴文字。
+
+```css
+@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; }
+}
+```
+
+## 涉及文件及修改点
+| 文件 | 修改点 |
+|------|--------|
+| `src/utils/print.ts` | @media print 中 .field-value 增加 line-height: 1 !important |
+
+## 风险与注意事项
+1. `line-height: 1` 会显著压缩行高，但由于 `.field-value` 在打印时已经是 `inline-block` 且独立显示，不会影响周围段落的整体行距。
+2. `!important` 确保优先级高于任何内联样式。

工程分析/测试方案-2026-04-18-23-39-35.md

@@ -0,0 +1,64 @@
+# 测试方案 —— 2026-04-18-23-39-35
+
+## 测试目标
+验证下划线修复、文件名统一、间距缩紧和双向联动的正确性。
+
+## 测试用例
+
+### TC-1：基础字段默认不勾选下划线
+**前置条件**：进入模板管理 → 字段管理。  
+**步骤**：
+1. 点击「患者姓名」或「住院号」的编辑按钮。
+**预期结果**：「打印时显示下划线」复选框默认未勾选。
+
+### TC-2：勾选下划线后打印生效
+**前置条件**：某个字段已勾选「打印时显示下划线」。  
+**步骤**：
+1. 在编辑器中插入该字段。
+2. 点击打印预览。
+**预期结果**：该字段显示下划线，且下划线紧贴文字底部。
+
+### TC-3：未勾选下划线打印不显示
+**前置条件**：某个字段未勾选下划线。  
+**步骤**：
+1. 在编辑器中插入该字段。
+2. 点击打印预览。
+**预期结果**：该字段不显示下划线。
+
+### TC-4：PDF 与 JSON 文件名一致
+**前置条件**：报告已填写完整信息。  
+**步骤**：
+1. 分别点击「导出 PDF」和「导出 JSON」。
+**预期结果**：两个文件的文件名前缀完全一致（如 `图文报告-腹腔镜胆囊切除术报告-未知-无号-2026-04-18T23-28`）。
+
+### TC-5：field-value 间距缩紧
+**前置条件**：模板中有 field-value 字段。  
+**步骤**：
+1. 观察字段框内文字与边框的距离。
+2. 打印预览中观察间距。
+**预期结果**：文字紧贴边框，左右无明显空白。
+
+### TC-6：表单逆向联动
+**前置条件**：ReportEditor 已加载默认模板。  
+**步骤**：
+1. 点击右侧「基本信息」中「手术名称」输入框。
+2. 观察中间模板区域。
+**预期结果**：
+- 中间模板中「手术名称」字段高亮显示（蓝色背景 + 蓝色描边）。
+- 页面平滑滚动到该字段位置（视野中央）。
+
+### TC-7：正向联动仍正常
+**前置条件**：ReportEditor 已加载默认模板。  
+**步骤**：
+1. 点击中间模板中的「患者姓名」字段。
+**预期结果**：
+- 右侧表单中高亮「患者姓名」输入框。
+- 右侧滚动到该输入框位置。
+
+## 回归测试
+- 确保字段插入、编辑、删除功能正常。
+- 确保打印样式正常，所有字段类型显示正确。
+- 确保视频分析、图片占位符功能正常。
+
+## 测试通过标准
+所有用例均通过，无控制台报错，下划线逻辑正确，双向联动流畅。

工程分析/测试方案-2026-04-19-00-01-50.md

@@ -0,0 +1,48 @@
+# 测试方案 —— 2026-04-19-00-01-50
+
+## 测试目标
+验证高亮样式修复、点击空白取消、打印纯净度、下划线同步的有效性。
+
+## 测试用例
+
+### TC-1：高亮样式柔和
+**前置条件**：ReportEditor 已加载默认模板。  
+**步骤**：
+1. 点击中间模板中的任意字段。
+**预期结果**：字段显示浅灰色背景和细灰边框（不再是刺眼的蓝色）。
+
+### TC-2：点击空白取消高亮
+**前置条件**：ReportEditor 中某个字段已被高亮。  
+**步骤**：
+1. 点击模板中的空白区域（非字段、非占位符）。
+**预期结果**：字段高亮样式消失，恢复为默认状态。
+
+### TC-3：打印不带高亮框
+**前置条件**：ReportEditor 中某个字段处于高亮状态。  
+**步骤**：
+1. 点击打印预览。
+**预期结果**：打印内容中不显示任何高亮框、outline 或 box-shadow，字段显示正常。
+
+### TC-4：勾选下划线后打印生效
+**前置条件**：TemplateManage 中某字段已插入模板，且未勾选下划线。  
+**步骤**：
+1. 在字段管理中勾选该字段的「打印时显示下划线」。
+2. 保存字段编辑。
+3. 在 ReportEditor 中打印预览。
+**预期结果**：该字段显示下划线。
+
+### TC-5：取消下划线后打印不显示
+**前置条件**：TemplateManage 中某字段已勾选下划线并保存。  
+**步骤**：
+1. 取消勾选该字段的「打印时显示下划线」。
+2. 保存字段编辑。
+3. 在 ReportEditor 中打印预览。
+**预期结果**：该字段不显示下划线。
+
+## 回归测试
+- 确保字段插入、编辑、删除功能正常。
+- 确保双向联动（中间点击→右侧高亮、右侧点击→中间高亮）正常。
+- 确保打印样式整体正常。
+
+## 测试通过标准
+所有用例均通过，无控制台报错，打印内容纯净无高亮残留。

工程分析/测试方案-2026-04-19-00-13-20.md

@@ -0,0 +1,26 @@
+# 测试方案 —— 2026-04-19-00-13-20
+
+## 测试目标
+验证打印时下划线是否紧贴文字底部。
+
+## 测试用例
+
+### TC-1：有下划线字段紧贴文字
+**前置条件**：ReportEditor 中某字段（如术前诊断）已勾选「打印时显示下划线」。  
+**步骤**：
+1. 点击打印预览。
+**预期结果**：该字段的下划线（黑线）紧贴文字底部，无明显间距。
+
+### TC-2：无下划线字段不受影响
+**前置条件**：某字段带有 `.no-underline` 类。  
+**步骤**：
+1. 点击打印预览。
+**预期结果**：该字段不显示下划线，排版正常。
+
+### TC-3：屏幕编辑态不受影响
+**步骤**：
+1. 在 ReportEditor 中查看字段。
+**预期结果**：屏幕上的 `.field-value` 行高保持原样，未被压缩。
+
+## 测试通过标准
+打印内容中下划线紧贴文字，无多余留白，屏幕编辑态正常。

工程分析/经验记录.md

@@ -1104,3 +1104,150 @@ if ((settings.autoInsertDelay || 0) > 0) {
 - 当修改默认值（如 `useState(true)` → `useState(false)`）时，应同时检查所有回显/回退逻辑（如 `field.hasUnderline !== false` → `field.hasUnderline ?? false`），确保数据兼容性。
 - 使用 `display:block; width:100%` 的绝对居中元素，必须显式设置 `text-align:center;` 以控制内部文本流的对齐方向。
 - 批量替换字符串时，应通过 grep 验证所有匹配位置是否都已更新，避免遗漏（如此次 `TemplateManage.tsx` 中 handleEditorClick 的旧代码）。
+
+---
+
+## 记录 36：七项排版与功能优化集中实施
+
+**A. 具体问题**
+1. `.field-value` 输入框中的文字与正文不在同一基线上，视觉上向上偏移。
+2. 「姓名：」下方横线与文字之间距离过大。
+3. 「手术记录」标题与上方医院名称横线之间距离过大。
+4. Logo 占位符相对于医院名称文字整体偏右下。
+5. 导出 PDF 时浏览器默认文件名为「My Google AI Studio App.pdf」，而非自定义名称。
+6. 导出 JSON 文件名中的时间戳使用 UTC 时间，不符合国内用户习惯。
+7. 模板管理模块缺乏批量操作能力，只能逐个删除/导出。
+
+**B. 产生问题原因**
+1. `smartField()` 中使用了 `vertical-align:text-bottom` 和 `line-height:1.2;min-height:1.2em`，导致内联块元素基线计算偏移。
+2. 姓名栏 `<p>` 的 `padding-bottom:1px` 叠加 `line-height:1.2`，导致 border-bottom 距文字约 2-3px。
+3. 医院名称的 `margin-bottom:8px` 过大。
+4. Logo 位于 flex 容器中，使用默认的 `gap:12px` 和 `align-items:center`，位置不够精确。
+5. `printDocument()` 虽接受 `docTitle` 参数并写入 iframe 的 `<title>`，但浏览器打印时优先使用父窗口的 `document.title`。
+6. `new Date().toISOString()` 返回 UTC 时间字符串。
+7. 模板列表 UI 仅设计了单条操作按钮，未设计复选框和批量操作状态。
+
+**C. 解决问题方案**
+1. **基线对齐修复**：
+   - `defaultContent.ts`：`vertical-align:text-bottom` → `vertical-align:baseline`；`line-height:1.2;min-height:1.2em` → `line-height:inherit;`
+   - `print.ts`：同步修改 `.smart-field-wrapper` 和 `.field-value` 的 `vertical-align:baseline` 和 `line-height:inherit`
+2. **姓名栏间距**：`<p>` 的 `padding:0 0 1px 0` → `padding:0`；`line-height:1.2` → `line-height:1`，使 border-bottom 紧贴文字
+3. **手术记录间距**：医院名称 `margin-bottom:8px` → `margin-bottom:2px`；`padding-bottom:0` → `padding-bottom:1px`
+4. **Logo 微调**：给 Logo 的 `<span>` 添加 `transform:translate(-5px,-5px)`
+5. **PDF 文件名**：在 `printDocument()` 中保存并临时设置 `document.title = docTitle`，打印完成后恢复
+6. **北京时间**：统一替换所有 `new Date().toISOString()` 为 `new Date(Date.now() + 8 * 60 * 60 * 1000).toISOString().slice(0, 16)`，并保留原有的 `replace(/[:.]/g, '-')`
+7. **模板批量操作**：
+   - 新增 `selectedIds` 状态
+   - 新增 `handleBatchDelete` 和 `handleBatchExport`
+   - 模板卡片内增加复选框（阻止冒泡避免触发选中）
+   - 选中时显示批量操作浮动工具栏
+   - 移除 `templates.length <= 1` 的单条删除限制，允许列表为空
+   - 删除后自动同步 `currentTemplateId` 和 `selectedIds`
+
+**D. 后续如何避免问题**
+- 排版微调时，应同时检查编辑器显示、打印预览两处的表现，因为 `print.ts` 中有独立的样式覆盖。
+- `vertical-align` 属性对内联块元素的基线影响显著，混合使用 `text-bottom`、`middle`、`baseline` 时需谨慎测试。
+- 浏览器打印的文件名行为不一致（有的用 iframe title，有的用父窗口 title），最稳妥的方案是在打印前后动态修改 `document.title`。
+- 批量操作 UI 中，复选框的点击事件必须 `stopPropagation()`，否则会触发卡片点击导致状态混乱。
+- 批量删除后必须同步清理 `selectedIds` 和 `currentTemplateId`，避免出现「选中已删除项」或「当前模板不存在」的异常状态。
+
+---
+
+## 记录 37：下划线默认修复、PDF 文件名、间距缩紧、表单逆向联动
+
+**A. 具体问题**
+1. 模板管理中「患者姓名」「住院号」的「打印时显示下划线」默认仍为勾选状态，且勾选与否在打印时都失去下划线效果。
+2. 导出 PDF 时浏览器默认文件名为「My Google AI Studio App.pdf」，与 JSON 文件名不一致。
+3. `.field-value` 内文字偏右，打印时左右间距过大。
+4. ReportEditor 中点击右侧表单输入框时，中间模板内的对应字段不会高亮，也不会滚动定位。
+
+**B. 产生问题原因**
+1. `DEFAULT_FORM_FIELDS` 中 `patientName` 和 `hospitalId` 硬编码了 `hasUnderline: true`；`defaultContent.ts` 中 `smartField()` 直接给所有字段加 `.no-underline`；`print.ts` 中 `@media print` 的 `.field-value` 默认显示下划线、`.no-underline` 时隐藏，逻辑正确但默认模板中的字段全部带有 `.no-underline`。
+2. `printDocument()` 虽设置了 `document.title = docTitle`，但 iframe 内部的 HTML 缺少 `<title>` 标签，某些浏览器优先使用父窗口的原始 title。
+3. `smartField()` 中 `padding:0 4px; margin:0 2px` 撑开了左右间距。
+4. 之前只实现了「点击中间模板 → 右侧表单高亮滚动」的单向联动，右侧表单缺少触发 `activeFieldKey` 的事件绑定。
+
+**C. 解决问题方案**
+1. **下划线修复**：
+   - `src/types.ts`：`DEFAULT_FORM_FIELDS` 中 `patientName` 和 `hospitalId` 的 `hasUnderline: true` → `false`
+   - `src/utils/print.ts`：`@media print` 下 `.field-value` 的 `padding-bottom:1px` → `0px`，使下划线紧贴文字
+2. **PDF 文件名**：在 iframe HTML 的 `<head>` 中注入 `<title>${docTitle}</title>`，确保浏览器打印对话框识别正确的默认文件名
+3. **间距缩紧**：
+   - `src/utils/defaultContent.ts`：`padding:0 4px;margin:0 2px;min-width:32px` → `padding:0 2px;margin:0;min-width:24px;text-align:center`
+   - `src/utils/print.ts`：同步缩小非打印和打印样式中的 padding/margin
+4. **表单逆向联动**：
+   - `src/pages/ReportEditor.tsx`：新增 `useEffect` 监听 `activeFieldKey`，实时修改中间模板中对应 `.field-value` 的 `backgroundColor` 和 `boxShadow`，并调用 `scrollIntoView({ block: 'center' })`
+   - 给右侧所有字段类型（text/date/single_select/multi_select/time）的容器 `div` 添加 `onClick={() => setActiveFieldKey(field.key)}`
+   - 给之前缺少高亮样式的通用 time 字段容器补充了 `activeFieldKey` 高亮类名
+
+**D. 后续如何避免问题**
+- 当修改 `DEFAULT_FORM_FIELDS` 的默认值时，需意识到已有用户的 `localStorage` 中保存的旧配置不会自动更新。如果默认值变更影响核心功能，应考虑在应用启动时做配置迁移或版本校验。
+- iframe 打印的文件名行为在不同浏览器间存在差异（Chrome 用父窗口 title，Safari 可能用 iframe title），最稳妥的方案是同时设置父窗口 `document.title` 和 iframe 内部 `<title>` 标签。
+- 双向联动时，`useEffect` 中的 DOM style 操作需要在组件卸载或 `activeFieldKey` 清空时清除，避免残留高亮。当前实现中 `activeFieldKey` 为 `null` 时会遍历清除所有高亮，逻辑已覆盖。
+- 给容器 div 添加 `onClick` 时需注意事件冒泡：容器内的子元素（如 input、button）的点击事件会自然冒泡到容器，如果子元素有自己的 onClick 处理（如 dropdown 选项），需确保已调用 `stopPropagation()`。
+
+
+---
+
+## 记录 38：高亮样式柔化、点击空白取消、打印高亮隔离、下划线配置同步
+
+**A. 具体问题**
+1. ReportEditor 中 `.field-value` 激活高亮使用蓝色 box-shadow（`0 0 0 2px #3b82f6`）+ `#eff6ff` 背景，视觉过于刺眼。
+2. 点击编辑器空白区域时，高亮样式不会自动清除，用户必须点击另一个字段才能切换高亮。
+3. 打印/PDF 导出时，高亮的内联样式（box-shadow、backgroundColor）会带入打印件，导致打印内容出现蓝框。
+4. TemplateManage 中编辑字段的「打印时显示下划线」勾选后，已插入到模板中的 `.field-value` 仍然保留旧的 `.no-underline` 类，打印时不显示下划线。
+
+**B. 产生问题原因**
+1. `activeFieldKey` 的 `useEffect` 中使用了高对比度的蓝色阴影和背景色，未考虑柔和视觉体验。
+2. `handleEditorClick` 的 capture 事件处理器仅在点击 `.field-value` 时设置 `activeFieldKey`，没有处理「点击非字段区域时清空」的逻辑。
+3. `print.ts` 的 `@media print` 中只重置了 `border` 和 `background`，遗漏了 `outline` 和 `box-shadow`。
+4. `saveFieldEdit` 仅更新了 JSON state 和 `localStorage` 中的字段配置，没有同步扫描 `editorRef.current` 中已存在的 DOM 元素并更新其 `classList`。
+
+**C. 解决问题方案**
+1. **柔和高亮**：将 `useEffect` 中的高亮样式改为 `backgroundColor: '#f1f5f9'`（浅灰背景）、`outline: '1px solid #94a3b8'`（细灰边框）、`outlineOffset: '1px'`；清除样式时用 `''` 而非硬编码颜色，让 CSS 类重新接管。
+2. **点击空白取消高亮**：在 `handleEditorClick` 中，`.field-value` 判断分支结束后增加 `setActiveFieldKey(null)`，使点击任何非字段区域都会清除高亮。
+3. **打印隔离高亮**：`print.ts` 的 `@media print` 中强制添加 `outline: none !important; box-shadow: none !important;`，确保打印输出不受任何高亮内联样式影响。
+4. **下划线配置同步**：`saveFieldEdit` 末尾增加 DOM 扫描逻辑：
+   ```ts
+   if (editorRef.current) {
+     const els = editorRef.current.querySelectorAll(`.field-value[data-bind="${key}"]`);
+     els.forEach(el => {
+       if (editFieldHasUnderline) el.classList.remove('no-underline');
+       else el.classList.add('no-underline');
+     });
+     saveTemplateContent();
+   }
+   ```
+
+**D. 后续如何避免问题**
+- 任何通过 JS 直接操作 DOM 添加的内联样式（如高亮），都必须在 `@media print` 中通过 `!important` 强制抹除，防止打印件被屏幕交互样式污染。
+- 当字段配置（如 `hasUnderline`）同时影响「未来插入的元素」和「已存在的 DOM 元素」时，保存逻辑必须包含对已插入 DOM 的同步更新，不能只更新 state。
+- `contentEditable` 中的 capture 阶段点击事件是处理全局点击行为（如点击空白取消）的理想位置，但需注意不要阻断其他正常交互路径（如 placeholder 点击）。
+
+
+---
+
+## 记录 39：打印下划线紧贴文字——行高压缩
+
+**A. 具体问题**
+打印/PDF 导出时，`.field-value` 的文字与下方 `border-bottom`（下划线）之间存在明显间距，视觉上不够紧凑。
+
+**B. 产生问题原因**
+即使 `padding-bottom` 已设为 `0px`，父级文档设置了 `line-height: 1.5`（第 29 行），`inline-block` 元素内部仍保留了行高带来的底部留白空间。`border-bottom` 渲染在元素的盒模型底部边界，而非文字字形的实际基线/降部底部，因此出现了「文字与横线之间有间隙」的视觉效果。
+
+**C. 解决问题方案**
+在 `src/utils/print.ts` 的 `@media print` 中，为 `.smart-field-wrapper .field-value` 增加 `line-height: 1 !important;`。将行高压缩到文字本身的绝对高度，彻底消除底部行高留白，使 `border-bottom` 紧贴文字正下方。
+
+```css
+@media print {
+  .smart-field-wrapper .field-value {
+    /* ... 其他属性 ... */
+    line-height: 1 !important;
+  }
+}
+```
+
+**D. 后续如何避免问题**
+- 当调整 `border-bottom` 与文字的距离时，如果 `padding-bottom` 已归零仍有间隙，应优先检查 `line-height` 的影响。
+- `inline-block` 元素的 `border-bottom` 位置受其内部行高影响显著，打印样式中可考虑显式设置 `line-height: 1` 以获得最紧凑的下划线效果。
+- 修改打印样式后，务必同时检查「有下划线」和「无下划线」两种字段的打印效果，避免 `line-height` 压缩导致其他排版异常。

工程分析/需求分析-2026-04-18-23-39-35.md

@@ -0,0 +1,34 @@
+# 需求分析 —— 2026-04-18-23-39-35
+
+## 需求来源
+用户在实际使用中发现下划线功能异常、导出文件名不一致、输入框间距过大、以及表单缺乏逆向联动等问题。
+
+## 需求概述
+
+### 需求 1：修复下划线勾选状态异常及打印失效
+1. **默认勾选未取消**：`DEFAULT_FORM_FIELDS` 中的基础字段（如患者姓名、住院号）默认 `hasUnderline` 仍为 `true` 或未指定，导致编辑弹窗中仍显示为勾选状态。
+2. **打印失效**：`print.ts` 中 `@media print` 的样式逻辑有问题，导致无论是否勾选「打印时显示下划线」，打印时都不显示下划线。
+3. **下划线紧贴文字**：用户希望勾选后的下划线紧贴文字底部。
+
+### 需求 2：统一 PDF 和 JSON 导出文件名
+当前 PDF 导出文件名与 JSON 不一致（缺少时间后缀或格式不同），希望两者完全一致。
+
+### 需求 3：缩紧 field-value 内文字间距
+`.field-value` 当前有 `padding:0 4px; margin:0 2px`，导致框内文字偏右，打印时左右间距过大。希望缩小 padding 和 margin。
+
+### 需求 4：ReportEditor 表单逆向联动
+当前实现了「点击中间模板字段 → 右侧表单高亮滚动」，但反向逻辑缺失：点击右侧表单输入框时，中间模板内的对应 `.field-value` 不会高亮，也不会滚动到对应位置。
+
+## 涉及文件
+- `src/types.ts`（需求 1）
+- `src/pages/TemplateManage.tsx`（需求 1）
+- `src/utils/print.ts`（需求 1、2、3）
+- `src/utils/defaultContent.ts`（需求 3）
+- `src/pages/ReportEditor.tsx`（需求 2、4）
+- `src/pages/ReportManage.tsx`（需求 2）
+
+## 需求影响范围
+- 字段默认配置数据
+- 打印样式逻辑
+- 输入框内边距/外边距
+- 编辑器双向联动交互

工程分析/需求分析-2026-04-19-00-01-50.md

@@ -0,0 +1,26 @@
+# 需求分析 —— 2026-04-19-00-01-50
+
+## 需求来源
+用户在实际使用中发现高亮样式刺眼、点击空白不取消高亮、以及下划线勾选无效的问题。
+
+## 需求概述
+
+### 需求 1：高亮蓝框太明显
+ReportEditor 中 `.field-value` 激活时的蓝框（`box-shadow: 0 0 0 2px #3b82f6` + `#eff6ff` 背景）过于刺眼，希望改为更柔和的选中效果（类似 TemplateManage 中的淡色高亮）。
+
+### 需求 2：点击空白处高亮不消失 + 打印带蓝框
+1. 点击模板空白区域时，`.field-value` 的高亮样式不会自动清除。
+2. 打印/PDF 导出时，高亮的内联样式（box-shadow、backgroundColor）会带入打印件，导致打印内容出现蓝框。
+
+### 需求 3：下划线勾选无效
+在 TemplateManage 的字段管理中勾选「打印时显示下划线」并保存后，已插入到模板中的 `.field-value` 仍然带有 `.no-underline` 类，导致打印时不显示下划线。
+
+## 涉及文件
+- `src/pages/ReportEditor.tsx`（需求 1、2）
+- `src/utils/print.ts`（需求 2）
+- `src/pages/TemplateManage.tsx`（需求 3）
+
+## 需求影响范围
+- 编辑器高亮交互体验
+- 打印样式纯净度
+- 字段配置与 DOM 的同步机制

工程分析/需求分析-2026-04-19-00-13-20.md

@@ -0,0 +1,13 @@
+# 需求分析 —— 2026-04-19-00-13-20
+
+## 需求来源
+用户反馈打印时字段下划线与文字之间距离过大，视觉上不够紧凑。
+
+## 需求概述
+在打印/PDF导出时，`.field-value` 的 `border-bottom`（下划线）与文字之间存在行高留白，导致横线没有紧贴文字底部。需要压缩行高以消除底部留白。
+
+## 涉及文件
+- `src/utils/print.ts`
+
+## 需求影响范围
+仅影响打印/导出PDF时的下划线视觉效果，不影响屏幕编辑态。