本卡屬 FR-166（母卡 CM-母卡號（建完補）），卡 P2-3，階段 P2 離線能做事、批 6。只改 FE（compliance-manager-fe）。依賴：P1-7b、P2-2。

這張卡做什麼（白話）

掃描工具分頁：三步驟選工具、選目標、填參數，執行中看進度。

為什麼切這一張

四個畫面變化、表單動態繪製

reuse／extend／new

reuse：參數表單用主站 DetectionConfigField；步驟條照主站派任務精靈；上傳走既有 scan-input 元件

在哪裡

repo：~/Projects/Billows/Audit-Manager/compliance-manager-fe
改既有：console/Shell.vue（加選單項）
新開：console/views/Scan.vue
新開：console/scanApi.js

怎麼做

細節在 design.md 對應段（~/Projects/Billows/Audit-Manager/compliance-manager-be/docs/features/FR-166-2610-agent-standalone-console/design.md §5，開 design.html 看導覽），本段只列本卡要做到的點：

• Scan.vue：步驟條（照主站派任務精靈）、工具卡八支、清冊目標表＋手打驗網段、DetectionConfigField 動態表單、執行中輪詢、取消；ZAP 網址變化、第三方元件上傳變化（雛形幕 3）。

驗收（可親手做、可親眼看）

幕 3 四變化實打；手打清冊外 IP 當場擋；ZAP 網址解析顯示；sbom 上傳到這台；執行中進度輪詢、取消

對照雛形：~/Projects/Billows/Audit-Manager/compliance-manager-be/docs/features/FR-166-2610-agent-standalone-console/prototype/index.html（上方「跟著走」）。

紀律

• 🔴 不重複造輪子：要寫任何新函式／元件／composable／service 方法之前，第一步不是寫，是查——按行為 grep 真實程式碼（grep 表名／領域詞，不是你想取的名字），再查 docs/claude/domain-capabilities.md 與 FE docs/claude/frontend-overview.md §4。三擇一、預設不新增：reuse → extend 加參數 → 兩邊都確認沒有才新增。既有的是 stub／壞掉 → 修它或回報，不另寫繞過。回寫列出本卡 reuse 了哪些、新增了哪些、為什麼不能 reuse。
• 🔴 不做義大利麵式程式：本卡「怎麼做」段已標 reuse／extend／new。標 extend 的改既有那支（加參數、抽共用），不另開一支；標 new 的用卡上寫的架構，不在既有函式裡塞第三個 if source == ... 分支。紅旗：複製一段既有函式改兩行、開 XxxV2／XxxForAgent、同一行為兩條路徑各自演化——出現就停下先抽共用。回寫列出哪些 extend 了既有的、哪些 new 及為什麼不能 extend。
• 🔴 遵守資安開發規範：BE 動到 api/／app/／infra/／scripts/sql/ 時 .claude/rules/security/ 八支自動載入（總覽 docs/claude/secure-coding-rules.md）；FE 規則在 FE repo .claude/rules/security/frontend.md；Agent 與套件 repo 沒有自動載入，動手前讀 BE 的八支。本案特別要守：四種登入失敗同一回應、body 上限、subprocess 不經 shell、CERT_NONE 禁用、新表 RLS、argon2id 不回雜湊、密碼欄進遮罩。design §5.7 與討論稿 §13.6 有逐條對照。回寫列出本卡對到哪幾條、怎麼滿足。
• 🔴 登記型檔只有 owner 卡能碰：core/console/routes.py（owner P1-4）、core/enroll.py（owner P1-3）、console/Shell.vue 與 i18n key（owner P1-7a）、core/plugins/remote_agent.py 的 _ADMIN_CAPABILITIES（owner P1-1）。本卡若不是 owner，只填自己的檔，不往登記檔加行；發現 owner 沒佔到位，回寫說明、不自己加。