# EasyCode Profile Center Implementation Plan

> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.

**Goal:** Build the lightweight `/profile` personal center for EasyCode front users.

**Architecture:** Reuse existing front project, source purchase, and AI quota APIs. Add only the missing front-account profile update and password update APIs, then compose a single Vue 3 + Element Plus profile page.

**Tech Stack:** Spring Boot, MyBatis, JUnit 4, Mockito, Vue 3, Vue Router 4, Element Plus, Node `node:test`.

---

### Task 1: Backend Account Update APIs

**Files:**
- Modify: `ruoyi-admin/src/test/java/com/ruoyi/web/service/front/FrontAuthServiceTest.java`
- Modify: `ruoyi-admin/src/main/java/com/ruoyi/web/controller/front/FrontAuthController.java`
- Modify: `ruoyi-admin/src/main/java/com/ruoyi/web/service/front/FrontAuthService.java`
- Modify: `ruoyi-generator/src/main/java/com/ruoyi/generator/service/front/IFrontUserService.java`
- Modify: `ruoyi-generator/src/main/java/com/ruoyi/generator/service/front/FrontUserServiceImpl.java`
- Create: `ruoyi-generator/src/main/java/com/ruoyi/generator/domain/front/dto/FrontProfileUpdateBody.java`
- Create: `ruoyi-generator/src/main/java/com/ruoyi/generator/domain/front/dto/FrontPasswordUpdateBody.java`

- [ ] **Step 1: Write failing backend tests**

Add tests proving profile update returns a password-free profile and password update rejects the wrong old password.

- [ ] **Step 2: Run backend tests and verify RED**

Run: `mvn -pl ruoyi-admin -Dtest=FrontAuthServiceTest test`

Expected: compilation/test failure because new DTOs and service methods do not exist yet.

- [ ] **Step 3: Add DTOs and service methods**

Add request DTOs and implement `updateProfile` / `updatePassword` using current front user id, existing password matching, and `FrontUserMapper.updateFrontUser`.

- [ ] **Step 4: Run backend tests and verify GREEN**

Run: `mvn -pl ruoyi-admin -Dtest=FrontAuthServiceTest test`

Expected: tests pass.

### Task 2: Frontend Route, API, Header, and Page

**Files:**
- Create: `easycode-web/src/views/profileView.test.mjs`
- Create: `easycode-web/src/views/ProfileView.vue`
- Modify: `easycode-web/src/api/auth.js`
- Modify: `easycode-web/src/router/index.js`
- Modify: `easycode-web/src/components/AppHeader.vue`

- [ ] **Step 1: Write failing frontend tests**

Add a source-level `node:test` file that asserts `/profile` is protected, the header links to it, and `ProfileView.vue` imports and uses the required APIs.

- [ ] **Step 2: Run frontend tests and verify RED**

Run: `node src/views/profileView.test.mjs` from `easycode-web`.

Expected: failure because `ProfileView.vue` does not exist and route/header/API entries are missing.

- [ ] **Step 3: Implement route, API helpers, header entry, and page**

Add the protected route, auth API helpers, clickable profile entry in the header, and a tabbed profile center page with independent loading states.

- [ ] **Step 4: Run frontend tests and verify GREEN**

Run: `node src/views/profileView.test.mjs` from `easycode-web`.

Expected: tests pass.

### Task 3: Verification

**Files:**
- Verify all changed backend, frontend, and doc files.

- [ ] **Step 1: Run focused backend test**

Run: `mvn -pl ruoyi-admin -Dtest=FrontAuthServiceTest test`

Expected: build success with `FrontAuthServiceTest` passing.

- [ ] **Step 2: Run focused frontend source test**

Run: `node src/views/profileView.test.mjs` from `easycode-web`.

Expected: all assertions pass.

- [ ] **Step 3: Run frontend production build**

Run: `npm run build` from `easycode-web`.

Expected: Vite build completes successfully.