fix(extension): 完善任务标题展示和思维导图高清导出

[techotaku39]

改动概述

修复浏览器插件任务列表在生成过程中仍显示视频链接的问题，并完善插件端 / 网页端思维导图的预览、复制和 PNG 导出体验。

这次改动主要解决原项目里两个实际使用痛点：

1. 插件任务在下载中 / 生成中阶段不容易识别具体视频；
2. 思维导图虽然已经生成，但在插件侧边栏里显示不完整，且缺少可用的复制 / 下载高清图片能力。

最终效果是：插件任务从开始处理到生成完成都尽量展示视频标题；思维导图在插件端能完整预览、能复制、能下载高清 PNG；网页端也同步修复 PNG 导出 / 复制，并将导出尺寸校准到接近插件端已验证的清晰度和文件体积。

为什么

原项目在这些场景下体验不够完整：

1. 任务生成过程中难以识别视频
   之前虽然笔记生成完成后能显示视频标题，但下载中 / 生成中阶段仍然显示视频链接。用户如果同时处理多个视频，只看链接很难快速判断每个任务对应哪个视频。

2. 插件端思维导图“生成了但不好用”
   插件侧边栏和打开笔记页里的思维导图原本容易只显示半框或一条内容，实际阅读价值很低。这个问题不是合理设计，而是 markmap 在插件窄容器、图片节点和尺寸变化场景下没有正确适配。

3. 插件端缺少和笔记页一致的思维导图操作能力
   笔记页已有复制 / 下载能力，但插件端思维导图没有对应工具栏。用户在插件里看到导图后，还需要能直接复制成图片或下载 PNG，而不是只能看预览。

4. 原有导出不是“可放大查看”的高清图
   早期按侧边栏当前显示尺寸导出，得到的 PNG 尺寸很小，放大后文字发糊。固定写死宽度也不可靠，因为不同思维导图的宽高和文字大小差异很大。更合理的方式是根据实际内容 bbox 和字体大小反推导出倍率，让导出的文字有足够像素高度。

5. 网页端和插件端导出行为不一致
   网页端也存在 PNG 下载 / 复制无反应、导出偏移、大面积空白、无处理中提示、导出尺寸过大等问题。尤其同一视频下，插件端导出尺寸已经足够清晰，而网页端会被放大到接近浏览器 canvas 单边上限，导致 PNG 体积明显偏大。

因此这次不是只改一个常数，而是把插件端和网页端的思维导图导出链路整体整理了一遍：先保证能完整预览，再保证能复制 / 下载，再保证导出清晰，最后校准网页端和插件端的尺寸差异。

做了什么

插件任务标题展示

• 新增 BillNote_extension/src/logic/task-display.ts，集中处理任务展示标题。
• Popup、Sidepanel、历史任务列表都统一优先展示：
  1. 后端生成后的 audio_meta.title
  2. 浏览器提交任务时抓到的 tab.title
  3. 最后才回退到视频链接 / 任务 ID
• 轮询任务状态时保留已有标题，避免下载中 / 生成中阶段又退回显示链接。

插件端思维导图预览

• 思维导图渲染前过滤 Markdown 图片 / 截图节点，避免大图把 markmap 布局挤坏。
• 增加容器最小高度和 ResizeObserver，侧边栏尺寸变化后自动重新适配。
• 修复插件侧边栏中思维导图只显示半框、内容不完整的问题。

插件端思维导图复制 / 下载

• 在插件思维导图视图中新增和笔记页一致的操作：
  • 复制
  • 下载
• 复制和下载共用同一套 PNG 导出逻辑。
• 修复直接 canvas 导出时可能出现的 Tainted canvases may not be exported：
  • 导出前清理可能污染 canvas 的节点
  • 将 markmap 的 foreignObject 转换为纯 SVG 文本
• PNG 导出不再按侧边栏当前显示尺寸，而是按实际 SVG 内容 bbox 导出。
• 根据导图文字字号、内容宽度、最大倍率和 canvas 单边限制动态计算导出倍率，保证导出的文字放大后仍然清晰。

网页端思维导图导出 / 复制

• 网页端思维导图预览同样过滤图片，只保留文字结构，避免图片节点影响导图可读性。
• 修复“保存 PNG 点了只恢复默认尺寸但没有下载”的问题：
  • 导出 / 复制不再调用可见导图的 mm.fit()
  • 避免导出操作影响当前预览视图
• 新增相邻的复制 PNG 图标按钮，保持原工具栏风格。
• 复制时使用 ClipboardItem({ 'image/png': Promise<Blob> })，尽量保留用户点击手势权限。
• PNG 生成失败时支持降低倍率重试。
• 修复导出图片跑到左下角、大面积空白的问题：
  • 导出克隆 SVG 时移除 markmap 顶层 pan / zoom transform
  • 保留内部节点布局 transform
  • 避免 bbox 裁剪和视口 transform 叠加导致双重偏移
• 增加导出 / 复制过程提示：
  • 正在生成高清 PNG…
  • 正在复制高清 PNG…
  • PNG 已开始下载
  • PNG 已复制
  • 按钮处理中临时禁用，避免用户误以为没反应。

网页端和插件端导出尺寸校准

• 插件端保留最终调试后认可的高清导出参数：
  • MIN_EXPORT_FONT_PX = 256
  • MIN_EXPORT_WIDTH = 12800
  • MAX_EXPORT_SCALE = 24
  • MAX_CANVAS_SIDE = 32767
• 网页端沿用同一套内容 bbox / 字号 / 宽度倍率算法。
• 没有采用简单限制长边，也没有采用固定目标长边。
• 最终在网页端增加 WEB_EXPORT_SCALE_FACTOR = 0.34，用于校准网页端和插件端因为 bbox / 字体渲染差异导致的倍率偏差。
• 这样可以让网页端导出尺寸更接近插件端已经验证够用的效果，避免同一导图在网页端被放大到接近 32767px 长边，生成过大的 PNG。

相比原项目的改进

• 下载中 / 生成中的任务也能尽量显示视频标题，任务列表更容易识别。
• 插件端思维导图从“只显示半框 / 不好阅读”变成可完整预览。
• 插件端补齐复制 / 下载 PNG 能力，和笔记页操作一致。
• 复制 / 下载导出的不再是低分辨率截图，而是根据内容和文字大小动态计算的高清 PNG。
• 网页端 PNG 下载 / 复制从“可能无反应或只重置视图”变成可用操作。
• 网页端导出偏移、大面积空白和无处理中反馈的问题被修复。
• 网页端和插件端导出结果更接近，不再出现网页端明显过大的 PNG。

测试方式

• pnpm typecheck && pnpm build（浏览器插件）通过
• npm run build（Web 前端）通过
• 后端验证不适用：本 PR 不涉及 backend 代码
• 手动验证步骤：
  • 插件任务下载中 / 生成中阶段优先显示视频标题，标题缺失时回退链接。
  • 插件 Sidepanel / Popup / 历史任务列表展示标题逻辑一致。
  • 插件思维导图能完整显示，不再只显示半框。
  • 插件思维导图可复制 PNG、下载 PNG，按钮文案为“复制 / 下载”。
  • 插件导出的 PNG 放大后文字仍可读。
  • 网页端思维导图过滤图片后结构可读。
  • 网页端 PNG 下载和复制按钮可正常工作。
  • 网页端导出的 PNG 不再跑到左下角或出现大面积空白。
  • 网页端导出 / 复制高清 PNG 时有处理中提示。
  • 同一类导图下，网页端导出尺寸不再明显大于插件端。

回归风险

影响范围集中在：

• 插件任务标题展示；
• 插件 Sidepanel / Popup / 历史任务列表；
• 插件端思维导图预览、复制和下载；
• 网页端思维导图预览、复制和 PNG 下载。

主要风险：

• 极端复杂、极宽或极高的思维导图仍可能触及浏览器 canvas 尺寸或内存限制；
• 不同浏览器对 Clipboard API / extension 页面 canvas 导出的支持可能存在差异；
• 过滤图片后，思维导图会更偏向文字结构展示，图片内容仍保留在 Markdown 笔记中。

本 PR 不涉及后端接口、数据库、配置或部署流程变更。

Checklist

• 分支命名遵循 CONTRIBUTING.md §3（feature/* / fix/* / release/* / hotfix/*）
• base 分支正确（常规改动 → develop；线上紧急 → master；发版 → 见 §4.3）
• Commit message 遵循 type(scope): subject 格式（CONTRIBUTING.md §5.1）
• 已自测核心流程
• 已更新相关文档（不适用：本 PR 为插件 / 前端体验修复，不涉及文档）
• 未夹带 secrets / .env / 大型二进制
• 单 PR 不跨多个工作区做无关改动