admin
52 lines
1.5 KiB
Markdown
52 lines
1.5 KiB
Markdown
# P3-1: Frontend Admin Panel Implementation Plan
|
|
|
|
## Goal
|
|
|
|
Implement a functional Admin Panel for User and Master Data Management, connected to existing Backend APIs.
|
|
|
|
## Scope
|
|
|
|
1. **Admin Layout**: Sidebar navigation and layout structure at `/app/(admin)`.
|
|
2. **User Management**:
|
|
- List Users (`GET /users`) with pagination/filtering.
|
|
- Create/Edit User (`POST /users`, `PATCH /users/:id`).
|
|
- Assign Roles (`POST /users/assign-role`).
|
|
3. **Organization Management**:
|
|
- List Organizations (`GET /organizations`).
|
|
- Create/Edit Organization (`POST`, `PATCH`).
|
|
|
|
## Implementation Steps
|
|
|
|
### 1. Admin Layout & Navigation
|
|
|
|
- **File**: `app/(admin)/layout.tsx`
|
|
- **File**: `components/admin/admin-sidebar.tsx`
|
|
- **Logic**: Ensure only users with `ADMIN` role can access.
|
|
|
|
### 2. User Management
|
|
|
|
- **Page**: `app/(admin)/admin/users/page.tsx`
|
|
- **Components**:
|
|
- `components/admin/users/user-table.tsx` (using `tanstack/react-table`)
|
|
- `components/admin/users/user-dialog.tsx` (Create/Edit Form with Zod validation)
|
|
|
|
### 3. Organization Management
|
|
|
|
- **Page**: `app/(admin)/admin/organizations/page.tsx`
|
|
- **Components**:
|
|
- `components/admin/orgs/org-table.tsx`
|
|
- `components/admin/orgs/org-dialog.tsx`
|
|
|
|
## Dependencies
|
|
|
|
- Backend Endpoints: verified (`UserController`, `OrganizationController`).
|
|
- UI Components: `Table`, `Dialog`, `Form` (Shadcn/UI - already installed).
|
|
|
|
## Verification
|
|
|
|
- [ ] Login as Admin.
|
|
- [ ] Navigate to `/admin/users`.
|
|
- [ ] Create a new user and verify in DB/List.
|
|
- [ ] Edit user details.
|
|
- [ ] Create a new Organization.
|