FR-165.2 前端殼頁與弱點資料卡片化：兩分頁入口、ReferenceDbCard、Agent 同步收進卡、更新紀錄對話框、舊路由轉向、i18n（FE）

本卡屬 FR-165（母卡見「母卡」欄），批 1。只改 FE repo。畫面以雛形為準：~/Projects/Billows/Audit-Manager/compliance-manager-be/docs/features/FR-165-2610-scan-tool-resource-hub/prototype/index.html。設定檔分頁零改動掛進來；弱點資料頁縮成一張卡，邏輯不動、功能一個不少。

這一棒在做什麼（白話）

做一個新頁「掃描工具資源管理」，上面兩個分頁。第一個分頁把今天的掃描設定檔管理頁原封不動放進來。第二個分頁是「參考資料庫」，一個資料庫一張卡，今天只有弱點資料一張：卡上有資料日期（30 天黃、90 天紅）、連不到站提醒、來源與站台、自動更新開關、檢查頻率下拉、下次檢查、四個來源的日期筆數表（常駐）、Agent 同步摘要（點明細展開每台）、上傳進度、底下三個鈕（檢查更新／上傳更新包／更新紀錄）。更新紀錄點開是對話框、裡面有翻頁。舊網址打進來自動跳到新頁對應分頁。沒權限的分頁整個不出現。

在哪裡

~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/views/plugin/ScanToolResourcesView.vue                新增：殼頁
~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/components/vulndb/ReferenceDbCard.vue                 新增：卡片外觀（slot：header／alert／info／detail／footer）
~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/views/vulndb/VulndbManage.vue                         改：254 行，拔頁首與整頁 card 外殼，內容塞進 ReferenceDbCard；邏輯（load／upload／check／toggle／interval）全部不動
~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/views/vulndb/VulndbUpdateHistory.vue                  改：35 行，改成對話框內容＋Paginator
~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/components/remote-agent/AgentVulndbSyncPanel.vue      改：57 行，加 compact 模式（摘要一行＋明細展開）
~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/views/detection-profile/DetectionProfileManageView.vue 不改（947 行已超標，只被殼頁 import 當子元件）
~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/config/router/index.js:459-470   vulndb 路由；:1021-1045 detection-profile-manage 與 controls 路由；:127 redirect 寫法範例
~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/config/api/api.js:526-533        VULNDB_* 常數（加 VULNDB_UPDATES）
~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/service/VulndbService.js         加 listUpdates(page,size)
~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/config/locales/i18n/{zh-tw,en}/menu.json:63,103,239,264   既有兩頁的標題與描述鍵（加 scan-tool-resources）
~/Projects/Billows/Audit-Manager/compliance-manager-fe/src/config/locales/i18n/{zh-tw,en}/vulndb.json              補卡片與對話框用鍵

怎麼做

殼頁：<TabView> 兩個 <TabPanel>，v-if 各看 hasCap(CAP.DETECTION_PROFILE_READ)／hasCap(CAP.SYSTEM_VULNDB_READ)（CAP 常數名以 src/config/capabilities.js 實際為準，先 grep）。只剩一個分頁仍顯示分頁列。activeIndex 與 route.query.tab（profiles｜dbs）雙向同步。頁首 h2 用 lang.menu.scan-tool-resources。PrimeVue 3.53 TabView 雷區見 docs/claude/frontend-overview.md §3.6。
分頁一：import DetectionProfileManageView 直接 <DetectionProfileManageView />。它內部若有自己的頁首 h2（page_title），殼頁分頁一不再重複標題——殼頁標題只出現一次；若該元件頁首無法隱藏就靠 prop 或 css 類遮，不改它的檔。控制項子頁路由換到新入口底下（見路由段），該頁 router.push／breadcrumb parent 若寫死 detection-profile-manage 要改成 scan-tool-resources（grep DetectionProfileControlsView.vue 與 DetectionProfileManageView.vue 內的 name: 跳轉；這兩支只准改路由名字串，不准改其他邏輯）。
ReferenceDbCard.vue：純外觀。props title／subtitle／statusLabel／statusSeverity；slots alert（提醒列）、info（資訊列，用 dl 兩欄）、detail（常駐明細表）、progress、footer（底列按鈕）。外層 dark-card，底列上方 1px 分隔線。
VulndbManage.vue 卡片化：template 改成 <ReferenceDbCard>，各 slot 塞原本的區塊——alert＝last_check_skipped 的 Message warn；info＝資料日期 Tag＋幾天前、來源＋站台、自動更新 InputSwitch、檢查頻率 Dropdown（既有 intervalOptions）、下次檢查、Agent 同步（AgentVulndbSyncPanel compact）；detail＝既有 sourceRows DataTable；progress＝既有上傳進度；footer＝檢查更新／上傳更新包／「更新紀錄」文字鈕（開 Dialog）；唯讀者 footer 換 readonly_hint。<script setup> 的 load／onPickFile／onCheckUpdate／onToggleAuto／onChangeInterval／uploader 一行不改。
更新紀錄對話框：Dialog 先開再載（ProgressSpinner），內容 VulndbUpdateHistory＋Paginator。資料來源：本卡先用 status.recent（固定 20 筆）做前端分頁（每頁 10）讓 UI 成形；VulndbService.listUpdates(page,size) 與 API.VULNDB_UPDATES = getUrl('/system/vulndb/updates') 先寫好但不呼叫（端點由 FR-165.4 做，接上由首腦驗收時切）。按鈕文字「更新紀錄」不帶筆數。
Agent 同步 compact 模式：prop compact，true 時只渲染摘要一行（N 台已同步・M 台落後・K 台離線，用既有資料）＋「明細」Button link，點了展開原本的清單。false 維持現狀（其他地方若有用到不受影響，先 grep 使用處）。
路由：新增 { path: '/plugin/scan-tool-resources', name: 'scan-tool-resources', component: ScanToolResourcesView, meta: { breadcrumb: [{label:'scan-tool-resources'}] } } 放在 tool-plugin-manage 旁（同一個 children 陣列、同樣的 meta 結構）；detection-profile-controls 的 path 改 /plugin/scan-tool-resources/profiles/versions/:versionUid/controls、breadcrumb parent 改 scan-tool-resources。舊三條改 redirect：/plugin/detection-profile-manage → { name:'scan-tool-resources', query:{tab:'profiles'} }；/plugin/detection-profile-manage/versions/:versionUid/controls → 新 controls 路徑帶同 param；/system/vulndb → { name:'scan-tool-resources', query:{tab:'dbs'} }。寫法照 index.js:127。
i18n：menu.json 兩語系加 scan-tool-resources 標題（zh「掃描工具資源管理」／en「Scan Tool Resources」）與描述段（zh「管理掃描工具要用的設定檔／基準與參考資料庫」）；vulndb.json 補 tab_profiles／tab_dbs／card_subtitle／agent_sync_summary／history_dialog_title 等實際用到的鍵，zh 與 en 都補。

手測（對照雛形逐項）

登入租戶管理員（兩組權限都有）：側選單「掃描工具資源管理」→ 兩個分頁都在。切分頁網址 ?tab= 跟著變，重整停在同一分頁。
分頁一：新增、三個篩選下拉、搜尋、顯示停用、點列展開版本、進控制項頁再返回——全部與改前一樣。控制項頁網址是新路徑、麵包屑父層是新入口。
分頁二弱點資料卡：資料日期與顏色、來源、自動更新開關可切、檢查頻率下拉可改且存得住、下次檢查、四個來源表常駐、Agent 同步摘要與明細展開、檢查更新鈕、上傳更新包（選檔→進度→套用）、更新紀錄對話框翻頁。對照 VulndbManage.vue 改前 template 逐個控制項打勾。
舊網址三條各打一次，都轉到新頁正確分頁。
用只有 system.vulndb.read 的帳號（或臨時角色）登入：只看到「參考資料庫」分頁，分頁列仍在；只有 detection.profile.read 的反之。兩個都沒有：選單不出現。