skt-vuetify-templates/src/components/GUIDE.md

Components Guide

components 放 Vue UI 元件，依 sections / items / layouts / base 分層。頁面不再有獨立的 page component 層 — 頁面 UI 直接寫在 views/* 中。

子目錄

• sections/：獨立畫面區塊（搜尋面板、資料表格、表單面板），決定佈局，不關心單筆內容。詳見 src/components/sections/GUIDE.md。
• items/：單一資料單位的純粹呈現，不管理狀態。詳見 src/components/items/GUIDE.md。
• layouts/：App Shell 層的 layout 元件。詳見 src/components/layouts/GUIDE.md。
• base/：真正跨頁共用的基礎元件。詳見 src/components/base/GUIDE.md。

MaintShell.vue 是 maintenance 頁面的通用外殼元件，放在 src/components/maint/。

規則

• 元件不直接 import store 或 service。
• 元件以 props 接收資料，以 emits 回報使用者意圖。
• 可複用元件不含 domain 名稱（如 student、course）。

驗證

• Vue / TypeScript 結構變更：pnpm -s type-check
• 需要確認產物：pnpm -s build
• route、layout 或主要畫面流程變更：啟動 dev server 並做瀏覽器檢查，除非使用者明確不需要。