feat

.kilo/agent/rules-architect.md

@@ -0,0 +1,68 @@
+# Architect Mode Rules (Non-Obvious Only)
+
+## Architecture Overview
+
+- Vue 3 SPA with dynamic route loading from server
+- Pinia stores: `app`, `user`, `tab-bar` (see [`src/store/`](src/store/))
+- Two-layer route guard: user login check + permission check
+
+## Dynamic Route System
+
+- Server menu fetched in [`app store`](src/store/modules/app/index.ts) via `fetchServerMenuConfig()`
+- Routes registered dynamically in [`permission.ts`](src/router/guard/permission.ts)
+- Uses `isMenuLoading`/`isMenuLoaded` flags to prevent duplicate loads
+
+## API Architecture
+
+- Two axios instances for different auth patterns:
+  - [`request.ts`](src/api/request.ts): Workspace header + custom token format
+  - [`interceptor.ts`](src/api/interceptor.ts): Bearer token + code 20000 validation
+- Choose based on backend API requirements
+
+## API Response Format
+
+- Standard response structure: `{code: 0, details: {data: [...], total: number}}`
+- Success code is `0`, NOT `200` or `20000`
+- `request.ts` returns `response.data` directly
+- Access list data via `response.details.data`
+- Access total count via `response.details.total`
+
+## State Management
+
+- [`SafeStorage`](src/utils/safeStorage.ts) required for all localStorage access
+- Supports TTL expiry and type-safe keys via enum
+
+## Component Patterns
+
+- Global components registered in [`components/index.ts`](src/components/index.ts)
+- ECharts modules manually imported for bundle size optimization
+- Use `SearchTable` composite component for list pages
+
+## Directory Structure
+
+```
+src/
+  api/           # API layer (ops/ for business, module/ for auth)
+  components/    # Global reusable components
+  hooks/         # Composition functions
+  router/        # Route config and guards
+  store/         # Pinia stores
+  utils/         # Utility functions
+  views/ops/     # Main business modules
+    pages/
+      dc/        # Data center management
+      monitor/   # Monitoring modules
+      netarch/   # Network architecture
+      report/    # Reports
+      system-settings/ # System config
+```
+
+## Module Creation Checklist
+
+1. Create API file in `src/api/ops/`
+2. Create page directory in `src/views/ops/pages/`
+3. Create `config/columns.ts` for table config
+4. Create `config/search-form.ts` for search config
+5. Create main `index.vue` with SearchTable
+6. Create `components/FormDialog.vue` for CRUD
+7. Create `components/Detail.vue` for detail view