C6 — Implementation Plan

對應 design：design-C6.md 級別：小（FE-only）預估工時：FE 1 天

§1

Pre-flight 驗證

cd ~/Projects/Billows/Audit-Manager/compliance-manager-fe

# 1. 找專案建立 / 編輯表單檔
find src/views/project -name "*.vue" | xargs grep -l "audit_systems\|devices\|資訊系統\|受評範圍" | head

# 2. 找專案詳情 / 規劃頁
find src/views -name "*.vue" -path "*project*" | head -10

# 3. 找列表頁
find src/views -name "*ProjectList*" -o -name "*ProjectsView*" | head

# 4. 確認 ProjectService API call payload
grep -rn "audit_systems\|devices" src/service/ src/stores/ | head -10

# 5. 確認 C4 + C5 已準備好
# C4 BE schema 已 ship
# C5 SSP tab deep link `?tab=ssp&section=scope` 已實作

§2

任務清單

T1 — 專案建立表單拿掉受評範圍 section（FE）

檔案（pre-flight 確認）：src/views/project/CreateProject*.vue 或對應 dialog

動作：

拿掉 <DevicesPicker> / <InfoSystemsPicker> section（含 imports）
拿掉對應 form state（selectedDevices, selectedAuditSystems）
form submit payload 內拿掉 devices / audit_systems 兩個 fields
表單最下方加 hint 文字：$t('lang.project_create.hint_scope_in_ssp')

Commit message：fix(project-create): C6 拿掉受評範圍 section + 加引導文案

T2 — 專案編輯表單拿掉受評範圍 section（FE）

檔案：src/views/project/EditProject*.vue

動作：同 T1

Commit message：fix(project-edit): C6 拿掉受評範圍 section

T3 — 專案詳情頁範圍 card 改 readonly + 引導 link（FE）

檔案：src/views/project/ProjectDetail*.vue 或 Planning*.vue

動作：

找原本「受評範圍」card / accordion
拿掉編輯按鈕 + inline 編輯邏輯
改成顯示「設備 X / 資訊系統 Y / 外部利用 Z」摘要
加「前往 SSP 編輯」button → tab 切換到 SSP（emit event 或 router push with query）

Deep link 整合：

function navigateToSspScope() {
  router.push({
    name: 'project-planning',
    params: { project_uid },
    query: { tab: 'ssp', section: 'scope' }
  })
}

Commit message：fix(project-detail): C6 受評範圍 card 改 readonly + 引導 link 跳 SSP tab

T4 — 列表頁設備數 / 系統數 column 確認（FE）

檔案：src/views/project/ProjectList*.vue

動作：

確認 column 仍顯示 device / system count
資料源由 Response 內 devices.length / audit_systems.length 推算（C3 已改 derived）
若 columns 用的是其他欄位（如 dto.device_count 之類），確認該欄位仍正常

Commit message（若需改）：tweak(project-list): C6 設備數 / 系統數 column 確認資料源

T5 — i18n 文案

檔案：

src/config/locales/i18n/zh-tw/project.json
src/config/locales/i18n/en/project.json

新增 key（對齊 design-C6.md §4.2）：

{
  "project_create": {
    "hint_scope_in_ssp": "建立專案後，請至「專案規劃 → SSP」頁籤設定受評範圍（設備 / 資訊系統 / 外部利用服務）"
  },
  "project_detail": {
    "scope_card_title": "受評範圍",
    "scope_card_summary": "設備 {deviceCount} 項 / 資訊系統 {systemCount} 項 / 外部利用 {leveragedCount} 項",
    "scope_card_action": "前往 SSP 編輯",
    "scope_card_empty": "尚未設定範圍"
  }
}

英文版對應翻譯。

Commit message：feat(i18n): C6 新增專案受評範圍引導文案

T6 — store / service cleanup（FE）

檔案：

src/stores/projectStore.js（或對應）
src/service/ProjectService.js

動作：

拿掉 selectedDevices / selectedAuditSystems state（如果是 store 的話）
API call signature 簡化（不送 devices / audit_systems）
測試（如果有 Vitest unit test）同步更新

Commit message：refactor(project-store): C6 移除 device / audit_system 建立流程 state

T7 — Changelog (FE)

檔案：FE repo docs/changelog/YYYY-MM-DD-feat-project-scope-moved-to-ssp.md

---
type: feat
breaking: false
modules: [project-ui]
---

## 需求說明
C6：拿掉專案設定 UI 內的「受評範圍」section（設備 / 資訊系統 picker），改在 SSP tab 維護。
配合 BE C4 schema 改動 + C5 SSP tab 上線。

## 變更範圍
### FE
- 專案建立 / 編輯表單拿掉 DevicesPicker + InfoSystemsPicker
- 專案詳情頁範圍 card 改 readonly + 「前往 SSP 編輯」link
- store / service 拿掉相關 state
- i18n 新增引導文案

## UX 差異
- 建立專案表單：少一個 section（受評範圍）+ 表單底部加 hint
- 詳情頁範圍 card：不能 inline 編輯，點按鈕跳 SSP tab
- 列表頁：顯示 derived 後的設備數 / 系統數

§3

測試規格

測試	內容
Manual smoke	建專案 → 不選範圍 → 建立成功 → 看到底部 hint
Manual smoke	進詳情頁 → 看到「受評範圍 0/0/0」+ 引導 link
Manual smoke	點引導 link → 跳到 SSP tab + 自動展開 scope section
Manual smoke	編輯專案 → 看不到「受評範圍」section
Vitest (if exists)	ProjectCreate 表單 API payload 內無 devices / audit_systems

§4

完成標準（DoD）

§5

風險 / Rollback

風險	緩解
user 抱怨「找不到設備設定」	i18n hint + 詳情頁範圍 card 引導 link 雙重提示
深 link `?tab=ssp&section=scope` 沒被 C5 接住	C6 開工前先 verify C5 SSP tab 已支援該 query 參數
既有專案 detail 頁 card 渲染 break	empty fallback：scope_card_empty 文案

Rollback：FE-only，git revert 即可。不影響後端資料。