# Project Tasks

- [x] [Task 1] Global Message Component, API Encapsulation, and Login/Logout Integration <!-- id: 0 -->
    - [x] Check/Implement Global Message Component <!-- id: 1 -->
    - [x] Install axios <!-- id: 2 -->
    - [x] Create `src/service/request/index.ts` <!-- id: 3 -->
    - [x] Create `src/service/api/auth.ts` <!-- id: 4 -->
    - [x] Update `src/stores/user.ts` (Pinia + Persistence) <!-- id: 5 -->
    - [x] Integrate Login/Logout in `TheNavigation.vue` <!-- id: 6 -->
    - [x] Install crypto-js and types <!-- id: 7 -->
    - [x] Configure API secret in environment variables <!-- id: 8 -->
    - [x] Update Axios request interceptor with signature logic <!-- id: 9 -->
    - [x] Fix CORS by updating VITE_API_BASE_URL <!-- id: 10 -->
    - [x] Refactor vite.config.ts to use loadEnv for dynamic proxy configuration <!-- id: 11 -->
    - [x] Update .env.development with VITE_API_PROXY_TARGET <!-- id: 12 -->
    - [x] Prioritize backend error message in Axios response interceptor <!-- id: 13 -->
    - [x] Check TheNavigation.vue for reactive user state usage <!-- id: 14 -->
    - [x] Update TheNavigation.vue template to toggle Login/User info based on store state <!-- id: 15 -->

- [x] [Task 2] Score API Encapsulation and Business Integration <!-- id: 16 -->
    - [x] Create `src/service/api/score.ts` with types <!-- id: 17 -->
    - [x] Create `src/stores/score.ts` <!-- id: 18 -->
    - [x] Integrate Get Score in `TheNavigation.vue` <!-- id: 19 -->
    - [x] Integrate Save Score in `ScoreForm.vue` <!-- id: 20 -->

- [x] [Task 3] Enhance WMessage Component <!-- id: 21 -->
    - [x] Add position support to `src/utils/message.ts` (top/bottom/left/right/center) <!-- id: 22 -->

- [x] [Task 4] Implement Fullscreen Loading <!-- id: 23 -->
    - [x] Create `src/components/ui/WLoading.vue` <!-- id: 24 -->
    - [x] Create `src/utils/loading.ts` logic <!-- id: 25 -->
    - [x] Update `src/service/request/index.ts` to handle `showLoading` parameter <!-- id: 26 -->

- [x] [Task 5] Improve Sidebar and Add Legal Pages <!-- id: 27 -->
    - [x] Improve empty sidebar layout in `src/pages/index.vue` <!-- id: 28 -->
    - [x] Create `src/pages/agreement.vue` with content <!-- id: 29 -->
    - [x] Create `src/pages/privacy-policy.vue` with content <!-- id: 30 -->
    - [x] Update legal pages with company info from `Task3.md` <!-- id: 31 -->