Mdeical_Sur_Report/工程分析/20260419_2344/功能变更实现方案文档.md

功能变更实现方案文档（20260419_2344）

实现方案 A：切换模板时重置 AI 对话

变更点

ReportEditor.tsx line 1240-1251（模板应用 useEffect 中）。

具体实现

在 setCapturedFrames([]) 之后、updatePageHeight() 之前，添加：

setChatMessages([]);
setChatInput('');
setAiUploadedImages([]);
setAiSelectedFrames([]);
stateRef.current = {
  ...stateRef.current,
  chatMessages: [],
  chatInput: '',
  videos: [],
  capturedFrames: []
};

同时更新 stateRef.current，确保草稿保存时不会残留旧 AI 数据。

---

实现方案 B：修复 diff modal 段落间距

变更点

ReportEditor.tsx line 835-838 的 stripHtml 函数。

具体实现

从：

tmp.innerHTML = html.replace(/<\/p>/gi, '</p>\n').replace(/<br\s*\/?>/gi, '\n');

改为：

tmp.innerHTML = html.replace(/<br\s*\/?>/gi, '\n');

innerText 本身会在块级 <p> 元素之间自动插入换行，无需手动添加。去掉手动插入后，段落间距恢复正常。

---

实现方案 C：API 密钥 DOM 暴露修复

变更点

src/pages/SystemSettings.tsx line 362-377 的 API Key input。

具体实现

1. 导入 useRef
2. 创建 apiKeyInputRef = useRef<HTMLInputElement>(null)
3. 使用 useEffect 在 apiKey 变化时通过 ref 设置 DOM value：

const apiKeyInputRef = useRef<HTMLInputElement>(null);

useEffect(() => {
  if (apiKeyInputRef.current) {
    const targetValue = settings.aiProviders[settings.activeAiProvider]?.apiKey || '';
    if (apiKeyInputRef.current.value !== targetValue) {
      apiKeyInputRef.current.value = targetValue;
    }
  }
}, [settings.aiProviders[settings.activeAiProvider]?.apiKey]);

4. input 标签移除 value prop：

<input 
  ref={apiKeyInputRef}
  type="password" 
  onChange={...}
  onCopy={(e) => e.preventDefault()}
  onCut={(e) => e.preventDefault()}
  placeholder="sk-xxxxxxxxxxxxxxxx"
  className="input-minimal"
/>

DOM 中不再出现 value="sk-..." HTML 属性。

---

实现方案 D：默认模型名切换

变更点

• src/types.ts line 92：modelName: 'moonshot-v1-32k-vision-preview'
• src/pages/SystemSettings.tsx migration fallback line 41：同步修改
• src/pages/ReportEditor.tsx fallback line 901：同步修改

---

依赖与兼容性

• 无新增 npm 依赖
• API Key input 改为非受控后，不影响现有 onChange 保存逻辑
• stripHtml 修改仅影响 diff modal 渲染，不影响编辑器本身