feat(shell): add app shell and maintenance page driver

Introduce reusable shell components for layout, tabs, and global overlays.
Add maintenance page model, wrapper component, and composable driver to
standardize maintenance page state, search, and pagination handling.feat(shell): add app shell and maintenance page driver

Introduce reusable shell components for layout, tabs, and global overlays.
Add maintenance page model, wrapper component, and composable driver to
standardize maintenance page state, search, and pagination handling.

src/composables/page-drivers/useMaintenancePage.ts

@@ -0,0 +1,46 @@
+import { computed, ref } from 'vue'
+import type { MaintenancePageModel } from '@/models/page'
+
+export interface UseMaintenancePageOptions {
+  title: string
+  records: unknown[]
+  itemsPerPage?: number
+}
+
+export function useMaintenancePage(options: UseMaintenancePageOptions) {
+  const search = ref<Record<string, unknown>>({})
+  const searchPanelOpen = ref(false)
+  const currentPage = ref(1)
+  const itemsPerPage = options.itemsPerPage ?? 10
+
+  const pageCount = computed(() =>
+    Math.max(1, Math.ceil(options.records.length / itemsPerPage))
+  )
+
+  const pageModel = computed<MaintenancePageModel>(() => ({
+    type: 'maintenance',
+    title: options.title,
+    records: options.records,
+    loading: false,
+    error: null,
+  }))
+
+  function load() {
+    // 由呼叫方在 load 中觸發資料載入；未來可擴充為非同步
+  }
+
+  function resetSearch() {
+    search.value = {}
+  }
+
+  return {
+    pageModel,
+    search,
+    searchPanelOpen,
+    currentPage,
+    itemsPerPage,
+    pageCount,
+    load,
+    resetSearch,
+  }
+}