feat(extension): NoteForm 字段对齐 web 端（style 预设 + format 完整 + extras）

之前插件 popup / options 的笔记选项跟 web 端 NoteForm 不齐，存在三处差距：

1. style 字段实质 broken
   · backend prompt_builder.get_style_format 是 enum 映射（minimal/detailed/
     academic/tutorial/xiaohongshu/life_journal/task_oriented/business/
     meeting_minutes 共 9 个），不命中直接 return ''
   · 插件原来给的是自由文本框，用户填什么都对不上 enum，等于没传
   · 改：popup + options 都换成 9 个预设的下拉框，与 backend 严格对齐
2. format 字段缺一半
   · backend 支持 toc / link / screenshot / summary 四个
   · 插件只暴露了 screenshot / link 两个 checkbox
   · 改：types.ts 新增 NOTE_FORMATS 常量，UI 渲染完整 4 个 checkbox。
     生成请求时 format 数组、screenshot/link 单布尔由 settings.formats 派生，单一真相源
3. 缺 extras 字段
   · backend VideoRequest.extras 直接拼到 prompt 末尾给 LLM
   · 改：popup 折叠的"高级"区 + options 默认生成选项区都加 textarea

Settings 默认值：style='minimal'、formats=['toc','summary']、extras=''。
旧 settings 里若 style 是无效字符串，下拉会显示空白，用户重选一次即可。

logic/types.ts：
- 新增 NoteStyle / NoteFormat type alias 与 NOTE_STYLES / NOTE_FORMATS 常量
- Settings 接口加 formats: NoteFormat[] / extras: string，style 改为 NoteStyle
- 老的 screenshot / link 布尔保留（向后兼容旧 storage），但 UI 不再绑定，submit 时也由 formats 派生

popup / background / options 三处提交 generate_note 的逻辑同步收口。

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

BillNote_extension/src/popup/Popup.vue

@@ -4,7 +4,7 @@ import { detectPlatform } from '~/logic/platform'
 import { settings, settingsReady, tasks, tasksReady, upsertTask } from '~/logic/storage'
 import { generateNote, getTaskStatus, resolveImageUrl } from '~/logic/api'
 import { fetchBilibiliSubtitle } from '~/logic/bilibili-subtitle'
-import type { TaskRecord } from '~/logic/types'
+import { NOTE_FORMATS, NOTE_STYLES, type NoteFormat, type TaskRecord } from '~/logic/types'
 
 const tabUrl = ref<string>('')
 const tabTitle = ref<string>('')
@@ -67,19 +67,19 @@ async function start() {
   try {
     // B 站：在用户浏览器里直接抓字幕（带本地登录态 cookie），跳过后端的 download_subtitles 与音频转写
     const prefetched = platform.value === 'bilibili' ? await fetchBilibiliSubtitle(tabUrl.value) : null
+    const formats = settings.value.formats || []
     const { task_id } = await generateNote({
       video_url: tabUrl.value,
       platform: platform.value!,
       quality: settings.value.quality,
       provider_id: settings.value.providerId,
       model_name: settings.value.modelName,
-      screenshot: settings.value.screenshot,
-      link: settings.value.link,
+      // backend VideoRequest 同时接受 format 数组与 screenshot/link 单独布尔，从 formats 派生保持单一真相源
+      format: [...formats],
+      screenshot: formats.includes('screenshot'),
+      link: formats.includes('link'),
       style: settings.value.style || undefined,
-      format: [
-        ...(settings.value.screenshot ? ['screenshot'] : []),
-        ...(settings.value.link ? ['link'] : []),
-      ],
+      extras: settings.value.extras || undefined,
       prefetched_transcript: prefetched ?? undefined,
     })
     activeTaskId.value = task_id
@@ -108,6 +108,13 @@ function openOptions() {
   browser.runtime.openOptionsPage()
 }
 
+function toggleFormat(value: NoteFormat, checked: boolean) {
+  const cur = settings.value.formats || []
+  settings.value.formats = checked
+    ? Array.from(new Set([...cur, value]))
+    : cur.filter(v => v !== value)
+}
+
 async function openSidePanel() {
   // 只能在用户操作触发的同步上下文里调，且需要明确的 tabId
   try {
@@ -176,7 +183,7 @@ onUnmounted(() => {
     </div>
 
     <fieldset class="border rounded p-2 flex flex-col gap-2" :disabled="!supported || submitting">
-      <div class="grid grid-cols-3 gap-2 text-xs">
+      <div class="grid grid-cols-2 gap-2 text-xs">
         <label class="flex flex-col gap-1">
           <span class="text-gray-600">画质</span>
           <select v-model="settings.quality" class="border rounded px-1 py-0.5">
@@ -185,14 +192,41 @@ onUnmounted(() => {
             <option value="slow">高质</option>
           </select>
         </label>
-        <label class="flex items-center gap-1 mt-4">
-          <input v-model="settings.screenshot" type="checkbox"> 截图
-        </label>
-        <label class="flex items-center gap-1 mt-4">
-          <input v-model="settings.link" type="checkbox"> 跳转
+        <label class="flex flex-col gap-1">
+          <span class="text-gray-600">笔记风格</span>
+          <select v-model="settings.style" class="border rounded px-1 py-0.5">
+            <option v-for="s in NOTE_STYLES" :key="s.value" :value="s.value">{{ s.label }}</option>
+          </select>
         </label>
       </div>
 
+      <div class="flex flex-col gap-1 text-xs">
+        <span class="text-gray-600">输出形式</span>
+        <div class="flex flex-wrap gap-x-3 gap-y-1">
+          <label v-for="f in NOTE_FORMATS" :key="f.value" class="flex items-center gap-1">
+            <input
+              type="checkbox"
+              :checked="(settings.formats || []).includes(f.value)"
+              @change="toggleFormat(f.value, ($event.target as HTMLInputElement).checked)"
+            >
+            {{ f.label }}
+          </label>
+        </div>
+      </div>
+
+      <details class="text-xs">
+        <summary class="cursor-pointer text-gray-500">高级</summary>
+        <label class="flex flex-col gap-1 mt-2">
+          <span class="text-gray-600">额外提示词（追加到 prompt 末尾）</span>
+          <textarea
+            v-model="settings.extras"
+            class="border rounded px-1 py-1 resize-y"
+            rows="2"
+            placeholder="例如：重点关注游戏开发部分；保留所有专业术语原文"
+          />
+        </label>
+      </details>
+
       <div class="text-xs text-gray-600">
         <span v-if="settings.providerId && settings.modelName">
           模型：{{ settings.modelName }}