5.4 KiB
You are a Senior Frontend Engineer and Full Stack Engineer.
Project: Training Management System (TMS)
Current task: Update Master Data sidebar by keeping the existing "พนักงาน" menu and adding a new menu "รายชื่อพนักงานทั้งหมด".
Requirement: Under the sidebar parent menu "ข้อมูลหลัก", keep the existing "พนักงาน" menu and add a new submenu named "รายชื่อพนักงานทั้งหมด".
Important constraints:
- Do NOT remove the existing "พนักงาน" menu.
- Do NOT change the existing "พนักงาน" route.
- Do NOT delete existing routes or APIs.
- Do NOT change database schema unless required for the new detail page.
- Keep Thai UI.
- Keep responsive/mobile sidebar behavior.
- Minimal-impact changes only.
Navigation structure:
ข้อมูลหลัก ├─ พนักงาน ├─ รายชื่อพนักงานทั้งหมด ├─ หลักสูตร ├─ นโยบาย └─ ประกาศ
Existing menu:
- พนักงาน Keep current route as-is. Example: /dashboard/users or whatever route currently exists.
New menu:
- รายชื่อพนักงานทั้งหมด
Recommended route:
- /dashboard/employee-directory
Alternative route if project convention prefers:
- /dashboard/employees-directory
- /dashboard/employees/all
Page title:
- รายชื่อพนักงานทั้งหมด
Description:
- เรียกดูข้อมูลพนักงาน ข้อมูลชั่วโมงอบรม และรายการอบรมรายบุคคล
New page requirements:
- Employee Directory Table
Columns:
- รหัสพนักงาน
- ชื่อพนักงาน
- ฝ่าย
- ตำแหน่ง
- Action
Action:
- Compact action menu or button
- Label: ดูข้อมูลพนักงาน
- Search
Search by:
- รหัสพนักงาน
- ชื่อพนักงาน
- ฝ่าย
- ตำแหน่ง
- อีเมล
Placeholder:
- ค้นหาด้วยรหัสพนักงาน ชื่อ ฝ่าย หรือตำแหน่ง...
- Detail Page
When clicking "ดูข้อมูลพนักงาน", open:
- /dashboard/employee-directory/[id]
Detail page sections:
Section 1: ข้อมูลทั่วไปพนักงาน
- รหัสพนักงาน
- ชื่อพนักงาน
- อีเมล
- บริษัท
- ฝ่าย
- แผนก
- ตำแหน่ง
- สถานะ
Section 2: ข้อมูลชั่วโมงอบรม
- ชั่วโมงอนุมัติแล้ว
- ชั่วโมงรอตรวจสอบ
- ชั่วโมงไม่อนุมัติ
- เป้าหมายชั่วโมงรวม
- ความคืบหน้า
Section 3: K/S/A Summary
- K approved / K target
- S approved / S target
- A approved / A target
Section 4: รายการอบรม
- วันที่อบรม
- ชื่อหลักสูตร
- ประเภทการอบรม
- ชั่วโมงที่ส่ง
- ชั่วโมงที่อนุมัติ
- สถานะ
- ไฟล์เกียรติบัตร
- Permission
HRD/Admin:
- Can access employee directory.
- Can view all employee details.
Employee:
- Must not see this menu.
- Must not access route by direct URL.
- Responsive
- Table must not break page width.
- Use horizontal scroll inside table container.
- Detail cards stack on mobile.
- Thai text wraps correctly.
Files likely involved:
Navigation:
- src/config/nav-config.ts
Routes:
- src/app/dashboard/employee-directory/page.tsx
- src/app/dashboard/employee-directory/[id]/page.tsx
Feature:
- src/features/employee-directory/*
Can reuse:
- src/features/users/*
- src/features/employees/*
- src/features/training-records/*
- src/features/overview/server/overview-data.ts
- src/features/reports/server/report-data.ts
Output Review File:
Create: docs/management-change-add-employee-directory-menu-review.md
Include:
- Summary
- Files Changed
- Sidebar Changes
- New Routes
- Existing Employee Menu Kept
- Employee Directory Page
- Employee Detail Page
- Permission Rules
- Responsive Notes
- Manual Test Checklist
- Known Limitations
Manual Test Checklist:
- Existing "พนักงาน" menu remains.
- New "รายชื่อพนักงานทั้งหมด" menu appears under "ข้อมูลหลัก".
- HRD/Admin can open employee directory.
- Employee cannot see employee directory menu.
- Employee cannot access employee directory by URL.
- Employee directory table shows employee code.
- Employee directory table shows employee name.
- Employee directory table shows department/faction.
- Employee directory table shows position.
- Action opens employee detail.
- Detail page shows general employee data.
- Detail page shows training hour summary.
- Detail page shows K/S/A summary.
- Detail page shows training records.
- Mobile layout works.
- Existing "พนักงาน" page still works.
Return:
- Complete code changes with file paths.
- Content of docs/management-change-add-employee-directory-menu-review.md.
- Migration commands if required.