# แดชบอร์ดและรายงาน (Dashboard & Reports)

> **ฟีเจอร์นี้ทำอะไร** — แสดงภาพรวมการดำเนินงานภาคสนามผ่านแดชบอร์ด (รายงาน) ที่ประกอบด้วยการ์ดตัวชี้วัด (KPI), กราฟสถานะใบงาน, ลำดับคะแนนประเมินช่าง, การวิเคราะห์เหตุผลยกเลิกงาน, แนวโน้มจำนวนงานเทียบกับช่าง, โมเดลที่ซ่อมบ่อย และการวิเคราะห์ปัญหา พร้อมการกรองตามช่วงวันที่/จังหวัด และการส่งออกรายงาน
>
> **ใครใช้งาน** — ผู้ดูแลระบบ (Admin), ผู้จัดการ (Manager) — ผู้จัดตารางงาน (Dispatcher) เห็นเฉพาะข้อมูลพื้นที่ที่รับผิดชอบ
>
> **เข้าถึงได้ที่ไหน** — เมนูด้านซ้าย (sidebar) → **รายงาน (Reports)** ซึ่งเป็นหน้าแรกของ Admin Portal หลังเข้าสู่ระบบ
>
> **ข้อกำหนดที่เกี่ยวข้อง** — FR-016 (Reports Dashboard), UF-016
>
> **โมดูลในโค้ดเบส** — `dashboard`, `reports`, `analytics`

---

## ก่อนเริ่มใช้งาน

ตรวจสอบให้แน่ใจว่า:

- [ ] คุณเข้าสู่ระบบ Admin Portal ด้วยบทบาท Admin หรือ Manager แล้ว
- [ ] มีการสร้างและดำเนินการใบงานในระบบแล้ว (แดชบอร์ดต้องมีข้อมูลจึงจะแสดงผล)
- [ ] ช่างได้ทำงานเสร็จและมีการให้คะแนนประเมินแล้ว ข้อมูลประสิทธิภาพช่างจึงจะปรากฏ
- [ ] คุณเข้าใจสถานะใบงาน 12 สถานะ และประเภทงาน 6 ประเภท (BM, PM, QC, IS, IN, UN — ดูบทจัดการงานประกอบ)
- [ ] สำหรับการกรองตามจังหวัด ข้อมูลสถานที่ลูกค้าต้องมีข้อมูลจังหวัดครบถ้วน
- [ ] มีการเชื่อมต่ออินเทอร์เน็ตที่เสถียร

---

## สถานการณ์: ดูภาพรวมแดชบอร์ด

### สิ่งที่คุณต้องการทำ

ดูภาพรวมประสิทธิภาพการดำเนินงานของตัวชี้วัดทั้งหมดในหน้าเดียว เพื่อเริ่มต้นการทำงานประจำวัน

### ขั้นตอน

1. เข้าสู่ระบบ Admin Portal ระบบจะโหลดหน้า **แดชบอร์ด (Dashboard)** เป็นหน้าแรกโดยอัตโนมัติ หรือคลิก **รายงาน (Reports)** ใน sidebar

   ![ภาพรวมแดชบอร์ดแสดงทุกส่วน](images/09-dashboard-overview.png)

   <!-- 📸 NEED SCREENSHOT: ภาพรวมแดชบอร์ดทั้งหน้าแสดงทุกส่วน (สถานะใบงาน, รออนุมัติ, คะแนนช่าง, ฯลฯ) -->

2. แดชบอร์ดแบ่งออกเป็นหลายส่วน แต่ละส่วนโหลดข้อมูลแยกอิสระ มีตัวกรองส่วนกลางอยู่ด้านบนควบคุมทุกส่วนพร้อมกัน

   | ตัวควบคุม | ใช้ทำอะไร | ค่าเริ่มต้น |
   |-----------|-----------|-------------|
   | ตัวเลือกช่วงวันที่ (Date Range Picker) | เลือกวันเริ่มต้นและสิ้นสุด (เดือน/ปี หรือ DD/MM/YY) | เดือนปัจจุบัน |
   | ตัวกรองจังหวัด (Province Filter) | กรองข้อมูลตามพื้นที่/จังหวัด | ทุกจังหวัด |

3. **เลื่อนหน้าลง** เพื่อดูทุกส่วนของแดชบอร์ด แต่ละส่วนจะแสดงกราฟหรือตารางของตนเอง

### ผลลัพธ์ที่จะเกิดขึ้น

ทุกส่วนโหลดข้อมูลตามช่วงวันที่และจังหวัดที่เลือก โดยมีเป้าหมายโหลดภายใน 3 วินาที (ใช้ระบบแคชเบื้องหลัง) หากส่วนใดไม่มีข้อมูลในช่วงที่เลือก จะแสดงข้อความ **"ไม่มีข้อมูล"** แทนพื้นที่ว่าง

> **เคล็ดลับ:** แดชบอร์ดคือจุดเริ่มต้นของทุกวัน ตรวจสอบเป็นสิ่งแรกในตอนเช้าเพื่อหารายการรออนุมัติ พื้นที่ที่ประสิทธิภาพต่ำ และจุดติดขัดของการดำเนินงาน

---

## สถานการณ์: วิเคราะห์การกระจายสถานะใบงาน

### สิ่งที่คุณต้องการทำ

เข้าใจการกระจายงานทั้ง 12 สถานะ เพื่อหาจุดติดขัดและรูปแบบภาระงาน

### ขั้นตอน

1. ที่แดชบอร์ด มองหากราฟโดนัท **สถานะใบงาน (Job Status)**

   ![กราฟโดนัทสถานะใบงานพร้อมตัวเลขรวมตรงกลาง](images/09-job-status-donut.png)

   <!-- 📸 NEED SCREENSHOT: กราฟโดนัทสถานะใบงานพร้อมส่วนสีต่าง ๆ และตัวเลขรวมตรงกลาง -->

2. กราฟโดนัทแสดงองค์ประกอบดังนี้:

   | องค์ประกอบ | ใช้ทำอะไร |
   |-----------|-----------|
   | ส่วนสีต่าง ๆ | หนึ่งส่วนต่อหนึ่งสถานะ ขนาดแปรผันตามจำนวนงาน |
   | ตัวเลขตรงกลาง | จำนวนงานทั้งหมดในช่วงที่เลือก |
   | คำอธิบาย (Legend) | รายการสถานะทั้ง 12 พร้อมสีและจำนวน |

3. สถานะใบงานทั้ง 12 สถานะ:

   | สถานะ (ไทย) | English | บ่งบอกถึง |
   |-------------|---------|-----------|
   | รออนุมัติ | Pending Approval | ใบงานรอผู้ดูแลอนุมัติ |
   | รอรับงาน | Waiting to Accept | รอช่างกดรับงาน |
   | รับงาน | Accepted | ช่างรับงานแล้ว ยังไม่เริ่ม |
   | กำลังเดินทาง | Traveling | ช่างกำลังเดินทางไปหน้างาน |
   | ถึงหน้างาน | On-Site | ช่างถึงสถานที่แล้ว |
   | กำลังทำงาน | In Progress | กำลังปฏิบัติงาน |
   | รอตรวจสอบ | Waiting Inspection | รอการตรวจสอบ/ยืนยัน |
   | รอรีวิว | Waiting Review | รอการรีวิว/QA |
   | เสร็จสมบูรณ์ | Completed | งานเสร็จสมบูรณ์ |
   | หยุดงาน | Stopped | งานถูกหยุดชั่วคราว |
   | ยกเลิก | Cancelled | งานถูกยกเลิก |
   | เปลี่ยนช่าง | Changed Technician | มอบหมายให้ช่างคนใหม่ |

4. **คลิกที่ส่วนสีใด ๆ** เพื่อไปยังรายการงานที่กรองเฉพาะงานในสถานะนั้น

### ผลลัพธ์ที่จะเกิดขึ้น

เมื่อคลิกส่วนของกราฟ ระบบจะพาคุณไปหน้า Job Management โดยกรองตามสถานะที่เลือกไว้ล่วงหน้า ทำให้เจาะลงไปยังจุดที่มีปัญหาได้รวดเร็ว เช่น คลิกส่วน "รอรีวิว" เพื่อดูงานที่รอคุณอนุมัติทั้งหมด

> **เคล็ดลับ:** การดำเนินงานที่ดีควรมีงานส่วนใหญ่อยู่ในสถานะ "เสร็จสมบูรณ์" หากส่วน "รอรับงาน" หรือ "หยุดงาน" ใหญ่ผิดปกติ แสดงถึงปัญหาการมอบหมายหรือการจัดตารางที่ต้องแก้ไข

---

## สถานการณ์: ตรวจสอบรายการรออนุมัติ

### สิ่งที่คุณต้องการทำ

ดูภาพรวมจำนวนรายการที่รอคุณอนุมัติทั่วทั้งระบบ และไปดำเนินการได้รวดเร็ว

### ขั้นตอน

1. ที่แดชบอร์ด มองหาส่วนการ์ด **รออนุมัติ (Pending Approvals)**

   ![การ์ดรายการรออนุมัติ 3 ใบพร้อมจำนวน](images/09-pending-approvals.png)

   <!-- 📸 NEED SCREENSHOT: การ์ดรออนุมัติ 3 ใบ (อะไหล่รอคืน, รออนุมัติเบิกอะไหล่, รออนุมัติเบิกเงิน) พร้อมจำนวน -->

2. การ์ด 3 ใบแสดงจำนวนรายการที่รอดำเนินการ:

   | การ์ด (ไทย) | English | คลิกแล้วไปที่ |
   |-------------|---------|--------------|
   | อะไหล่รอคืน | Parts Pending Return | รายการคืนอะไหล่ (Spare Part Return) |
   | รออนุมัติเบิกอะไหล่ | Parts Requisition Pending | รายการเบิกอะไหล่ (Spare Part Request) |
   | รออนุมัติเบิกเงิน | Cash Requisition Pending | รายการเบิกเงิน (Cash Request) |

3. **คลิกที่การ์ดใด ๆ** เพื่อไปยังคิวรายการรออนุมัติของหมวดนั้นโดยตรง

### ผลลัพธ์ที่จะเกิดขึ้น

ระบบพาคุณไปยังรายการที่กรองเฉพาะรายการรอดำเนินการของหมวดนั้น ดำเนินการอนุมัติหรือปฏิเสธแต่ละรายการ (ดูขั้นตอนละเอียดในบทที่เกี่ยวข้อง)

> **เคล็ดลับ:** ควรเคลียร์รายการรออนุมัติให้หมดทุกวัน ช่างในภาคสนามมักรอการอนุมัติเหล่านี้เพื่อทำงานต่อ การอนุมัติล่าช้าจะทำให้งานเสร็จช้าลง

---

## สถานการณ์: ดูลำดับคะแนนประเมินช่าง

### สิ่งที่คุณต้องการทำ

ประเมินประสิทธิภาพช่างผ่านตารางสรุปคะแนน และตารางจัดอันดับแบบละเอียดที่มีหลายตัวชี้วัด

### ขั้นตอน

1. ที่แดชบอร์ด มองหาส่วน **ลำดับคะแนนประเมินช่าง (Technician Rating)** แบบสรุป — เป็นตารางย่อแสดงช่างที่ได้คะแนนสูงสุด

   ![ตารางสรุปคะแนนประเมินช่างพร้อมดาว](images/09-technician-rating.png)

   <!-- 📸 NEED SCREENSHOT: ตารางสรุปคะแนนช่าง แสดงคอลัมน์ ลำดับ/ชื่อช่าง/คะแนนเฉลี่ย และดาว 4 ดวง -->

   | คอลัมน์ | ใช้ทำอะไร |
   |---------|-----------|
   | ลำดับ (Rank) | อันดับตามคะแนนเฉลี่ย |
   | ชื่อช่าง (Technician Name) | ชื่อช่าง |
   | คะแนนเฉลี่ย (Average Score) | คะแนนประเมินเฉลี่ย (มาตรวัด 4 ดาว) |

2. เลื่อนลงไปยังตาราง **ลำดับคะแนนประเมินช่าง (Technician Performance Ranking)** แบบละเอียด

   ![ตารางจัดอันดับประสิทธิภาพช่างแบบละเอียด 10 คอลัมน์](images/09-technician-ranking.png)

   <!-- 📸 NEED SCREENSHOT: ตารางจัดอันดับช่างแบบละเอียดแสดงครบ 10 คอลัมน์พร้อมแถบความคืบหน้า (progress bar) -->

3. ตารางละเอียดแสดง 10 คอลัมน์:

   | คอลัมน์ (ไทย) | English | หน่วย |
   |---------------|---------|-------|
   | ลำดับ | Rank | อันดับ |
   | รหัสช่าง | Technician Code | รหัส |
   | ชื่อช่าง | Technician Name | ข้อความ |
   | พื้นที่ทำงาน | Work Area | ชื่อจังหวัด/พื้นที่ |
   | จำนวนเครื่อง | Machine Count | จำนวน |
   | จำนวนงาน | Job Count | จำนวน |
   | ชม./เครื่อง | Hours/Machine | ชั่วโมง |
   | ชม./งาน | Hours/Job | ชั่วโมง |
   | ค่าเฉลี่ย | Average | คะแนน (แสดงเป็นแถบความคืบหน้า) |
   | ค่ากลาง | Median | คะแนน (แสดงเป็นแถบความคืบหน้า) |

4. ใช้ **ตัวกรองจังหวัด (ค้นหาจังหวัด)** เพื่อดูอันดับเฉพาะพื้นที่ที่ต้องการ และใช้ตัวเลือกช่วงวันที่เพื่อจำกัดรอบเวลา

### ผลลัพธ์ที่จะเกิดขึ้น

ตารางจัดอันดับอัปเดตตามช่วงวันที่และจังหวัดที่เลือก ใช้ข้อมูลนี้สำหรับการประเมินผล หาความต้องการฝึกอบรม และยกย่องช่างที่ทำผลงานดี

> **เคล็ดลับ:** เปรียบเทียบ "ค่าเฉลี่ย" กับ "ค่ากลาง" หากต่างกันมาก อาจบ่งบอกว่าช่างทำงานได้ดีไม่สม่ำเสมอ ค่ากลางทนต่อค่าผิดปกติได้ดีกว่า

<!-- VERIFY: ตารางละเอียดรองรับการคลิกหัวคอลัมน์เพื่อจัดเรียง (sort) หรือไม่ — FR-016 ระบุ "Sortable columns" แต่ component หลักไม่ยืนยันชัดเจน -->

---

## สถานการณ์: วิเคราะห์เหตุผลยกเลิกงาน

### สิ่งที่คุณต้องการทำ

เข้าใจว่าทำไมงานถูกยกเลิก เพื่อหาปัญหาเชิงระบบที่แก้ไขได้

### ขั้นตอน

1. ที่แดชบอร์ด มองหากราฟวงกลม **เหตุผลยกเลิกงาน (Job Cancellation Reasons)**

   ![กราฟวงกลมเหตุผลยกเลิกงานพร้อมเปอร์เซ็นต์](images/09-cancellation-pie.png)

   <!-- 📸 NEED SCREENSHOT: กราฟวงกลมเหตุผลยกเลิกงาน แสดงจำนวนรวม "ยกเลิก X ครั้ง" และเปอร์เซ็นต์ต่อเหตุผล -->

2. กราฟวงกลมแสดงองค์ประกอบดังนี้:

   | องค์ประกอบ | ใช้ทำอะไร |
   |-----------|-----------|
   | ส่วนสีต่าง ๆ | หนึ่งส่วนต่อหนึ่งเหตุผลยกเลิก |
   | ป้ายเปอร์เซ็นต์ | สัดส่วนของการยกเลิกแต่ละเหตุผลเทียบยอดรวม |
   | จำนวนรวม | ยอดยกเลิกทั้งหมด (ยกเลิก X ครั้ง) |
   | คำอธิบาย (Legend) | รายการเหตุผลยกเลิกพร้อมสีและเปอร์เซ็นต์ |

3. นำเมาส์ชี้ที่ส่วนใด ๆ เพื่อดูจำนวนและเปอร์เซ็นต์ที่แน่นอน

### ผลลัพธ์ที่จะเกิดขึ้น

ใช้ข้อมูลการยกเลิกหารูปแบบ หากเหตุผลใดเหตุผลหนึ่งครองสัดส่วนสูง (เช่น "ลูกค้าไม่อยู่") อาจบ่งบอกถึงปัญหาการนัดหมายหรือการสื่อสารที่ควรแก้ไขเชิงกระบวนการ ไม่ใช่แก้รายงานต่อรายงาน

> **หมายเหตุ:** เหตุผลยกเลิกถูกกำหนดที่ **Settings → Dropdowns** หากกราฟแสดงเหตุผล "อื่น ๆ" สัดส่วนสูง ควรพิจารณาเพิ่มหมวดเหตุผลที่เฉพาะเจาะจงมากขึ้น

---

## สถานการณ์: เปรียบเทียบจำนวนงานกับช่างตามช่วงเวลา

### สิ่งที่คุณต้องการทำ

ดูแนวโน้มจำนวนงานรายเดือนแยกตามประเภท เทียบกับจำนวนช่างที่ทำงาน เพื่อประเมินกำลังคนและสมดุลภาระงาน

### ขั้นตอน

1. ที่แดชบอร์ด มองหากราฟ **ข้อมูลเปรียบเทียบจำนวนงานและช่าง (Job & Technician Comparison)**

   ![กราฟผสมแท่งและเส้นเปรียบเทียบงานกับช่าง](images/09-jobs-technicians-chart.png)

   <!-- 📸 NEED SCREENSHOT: กราฟผสมรายเดือน แท่งสี (ประเภทงาน) + เส้น (จำนวนช่าง) แกน Y ซ้าย/ขวา -->

2. กราฟผสมแสดงองค์ประกอบดังนี้:

   | องค์ประกอบ | ประเภทกราฟ | ใช้ทำอะไร |
   |-----------|------------|-----------|
   | แท่งจำนวนงาน | กราฟแท่ง | จำนวนงานรายเดือนแยกตามประเภท (BM/PM/QC/IS/IN/UN) แต่ละประเภทคนละสี |
   | เส้นจำนวนช่าง | กราฟเส้นซ้อนทับ | จำนวนช่างที่ทำงานต่อเดือน |
   | แกน X | — | เดือน (ก.พ., มี.ค., เม.ย. ...) |
   | แกน Y ซ้าย | — | จำนวนงาน (0–200) |
   | แกน Y ขวา | — | จำนวนช่าง |

3. ใช้ **ช่องติ๊กประเภทงาน (Job Type Checkboxes)** เพื่อเปิด/ปิดประเภทงานในกราฟแท่ง:

   | ตัวควบคุม | ตัวเลือก |
   |-----------|----------|
   | ช่องติ๊กประเภทงาน | BM, PM, QC, IS, IN, UN (เปิด/ปิดได้อิสระแต่ละประเภท) |
   | ตัวเลือกช่วงเวลา (Time Period) | เช่น 1 ปีย้อนหลัง |

4. ปรับ **ตัวเลือกช่วงเวลา** เพื่อกำหนดรอบที่ต้องการ (สูงสุด 1 ปีย้อนหลัง)

### ผลลัพธ์ที่จะเกิดขึ้น

กราฟช่วยประเมินว่ามีช่างเพียงพอกับปริมาณงานหรือไม่ หากแท่งงานสูงขึ้นแต่เส้นช่างคงที่ อาจต้องเพิ่มช่าง หากเส้นช่างสูงแต่แท่งงานต่ำ อาจมีกำลังคนเกิน

> **เคล็ดลับ:** งาน PM คาดการณ์ได้ (มีกำหนดการ) หากแท่ง PM สูงสม่ำเสมอในบางเดือน ให้วางแผนความพร้อมของช่างให้สอดคล้อง ส่วน BM ที่พุ่งสูงอาจบ่งบอกปัญหาความน่าเชื่อถือของเครื่อง

---

## สถานการณ์: วิเคราะห์โมเดลที่ซ่อมบ่อย

### สิ่งที่คุณต้องการทำ

ระบุว่าเครื่องรุ่นใดต้องซ่อมบ่อยที่สุด เพื่อชี้ปัญหาความน่าเชื่อถือและประกอบการตัดสินใจจัดซื้อ

### ขั้นตอน

1. ที่แดชบอร์ด เลื่อนไปยังส่วน **ลำดับโมเดลที่ซ่อมบ่อย (Frequently Repaired Models)**

   ![ตารางจัดอันดับโมเดลที่ซ่อมบ่อยพร้อมแถบเลื่อน](images/09-frequently-repaired.png)

   <!-- 📸 NEED SCREENSHOT: ตารางจัดอันดับโมเดลที่ซ่อมบ่อย พร้อม carousel เลื่อนดูโมเดล -->

2. ส่วนนี้แสดงตารางจัดอันดับ:

   | คอลัมน์ (ไทย) | English | ใช้ทำอะไร |
   |---------------|---------|-----------|
   | ลำดับ | Rank | อันดับตามความถี่การซ่อม |
   | โมเดล | Model | ชื่อรุ่นของสินทรัพย์ |
   | จำนวนซ่อม | Repair Count | จำนวนครั้งที่ซ่อม |

3. ใช้ **แถบเลื่อนแนวนอน (Carousel)** เพื่อเลื่อนดูโมเดลในลำดับถัดไป หากรายการยาวเกินหนึ่งหน้าจอ

### ผลลัพธ์ที่จะเกิดขึ้น

โมเดลที่อยู่ลำดับต้น ๆ คือรุ่นที่เสียบ่อยที่สุด ข้อมูลนี้สนับสนุนการตัดสินใจเรื่องการเปลี่ยนเครื่อง การขยายการรับประกัน หรือการวางแผนบำรุงรักษาเชิงป้องกันสำหรับรุ่นที่ไม่น่าเชื่อถือ

> **เคล็ดลับ:** เทียบตารางนี้กับส่วน "วิเคราะห์ปัญหา" เพื่อเข้าใจว่านอกจากรุ่นใดเสียบ่อยแล้ว ยังพบปัญหาเฉพาะแบบใดบ้าง

---

## สถานการณ์: ดูการวิเคราะห์ปัญหา

### สิ่งที่คุณต้องการทำ

เปรียบเทียบปัญหาที่ลูกค้าแจ้งกับปัญหาที่ช่างพบจริงหน้างาน แยกตามรุ่นของเครื่อง

### ขั้นตอน

1. ที่แดชบอร์ด เลื่อนไปยังส่วน **ปัญหาที่เกิดขึ้น (Problem Analysis)**

   ![กราฟวงกลมคู่วิเคราะห์ปัญหาของโมเดลที่เลือก](images/09-problem-analysis.png)

   <!-- 📸 NEED SCREENSHOT: กราฟวงกลมคู่ ปัญหาแจ้งจากลูกค้า vs ปัญหาที่พบโดยช่าง สำหรับโมเดลที่เลือก -->

2. เลือก **โมเดลสินทรัพย์** จากแถบเลื่อนโมเดลเพื่อดูการวิเคราะห์ปัญหาของรุ่นนั้น

3. กราฟวงกลมสองวงแสดงคู่กัน:

   | กราฟ (ไทย) | English | แหล่งข้อมูล |
   |------------|---------|-------------|
   | ปัญหาแจ้งซ่อมจากลูกค้า | Customer Reported Issues | ข้อมูลตอนสร้างใบงาน |
   | ปัญหาที่พบโดยช่าง | Issues Found by Technician | ข้อมูลตอนปิดงาน |

4. เปรียบเทียบกราฟทั้งสองเพื่อหาช่องว่างของการรับรู้:

   | รูปแบบที่เห็น | ความหมาย |
   |---------------|----------|
   | กราฟทั้งสองคล้ายกัน | ลูกค้าระบุปัญหาได้แม่นยำ — การสื่อสารดี |
   | กราฟทั้งสองต่างกันมาก | ลูกค้าระบุปัญหาผิด — อาจต้องให้คำแนะนำการวินิจฉัยที่ดีขึ้น |
   | กราฟช่างมีหมวดที่ไม่ปรากฏในกราฟลูกค้า | ปัญหาแอบแฝงที่ลูกค้าไม่สังเกตจนกว่าช่างจะตรวจ |

### ผลลัพธ์ที่จะเกิดขึ้น

ใช้ข้อมูลนี้ปรับปรุงการสื่อสารกับลูกค้า ปรับขั้นตอนการวินิจฉัย และปรับเทมเพลตงาน หากลูกค้าระบุปัญหาผิดประเภทเดิมซ้ำ ๆ ควรเพิ่มคำถามวินิจฉัยในฟอร์มสร้างงาน

> **หมายเหตุ:** การวิเคราะห์นี้มีความหมายเมื่อมีข้อมูลจำนวนมาก โมเดลที่มีงานน้อยกว่า 10 รายการอาจแสดงสัดส่วนที่บิดเบือน หมวดปัญหาถูกกำหนดที่ **Settings → Dropdowns**

---

## สถานการณ์: กรองรายงานตามวันที่และจังหวัด

### สิ่งที่คุณต้องการทำ

จำกัดข้อมูลแดชบอร์ดทั้งหมดให้เหลือเฉพาะช่วงเวลาและพื้นที่ที่ต้องการ เพื่อการวิเคราะห์ที่เจาะจง

### ขั้นตอน

1. ด้านบนของแดชบอร์ด มองหา **ตัวเลือกช่วงวันที่ (Date Range Picker)** และ **ตัวกรองจังหวัด (Province Filter)**

   ![ตัวกรองช่วงวันที่และจังหวัดด้านบนแดชบอร์ด](images/09-filter-controls.png)

   <!-- 📸 NEED SCREENSHOT: แถบตัวกรองด้านบนแดชบอร์ด แสดงตัวเลือกช่วงวันที่และตัวกรองจังหวัด -->

2. ตั้งค่าตัวกรอง:

   | ช่อง | กรอกอะไร | เงื่อนไข |
   |------|----------|----------|
   | วันที่เริ่มต้น (Start Date)* | จุดเริ่มต้นของช่วงวิเคราะห์ | รูปแบบ DD/MM/YY หรือ เดือน/ปี |
   | วันที่สิ้นสุด (End Date)* | จุดสิ้นสุดของช่วงวิเคราะห์ | ต้องไม่ก่อนวันที่เริ่มต้น |
   | จังหวัด (Province) | เลือกจังหวัด หรือเว้นเป็น "ทุกจังหวัด" | ค้นหาจากรายการจังหวัดที่มีข้อมูล |

   > **หมายเหตุ:** ช่องที่มีเครื่องหมาย * เป็นช่องที่ต้องกรอก ค่าเริ่มต้นแสดงข้อมูลเดือนปัจจุบัน

3. เลือกผลของการตั้งค่าตัวกรองตามต้องการ:

   | การตั้งค่า | ผลที่ได้ |
   |------------|---------|
   | ทุกจังหวัด + ทั้งปี | ภาพรวมทั้งประเทศแบบเต็ม |
   | จังหวัดเฉพาะ + ทั้งปี | ผลงานรายปีของพื้นที่นั้น |
   | ทุกจังหวัด + เดือนเดียว | ภาพรวมรายเดือนทั้งประเทศ |
   | จังหวัดเฉพาะ + เดือนเดียว | เจาะลึกรายเดือนของพื้นที่นั้น |

4. ตัวกรองมีผล **กับทุกส่วนของแดชบอร์ดพร้อมกัน** ทุกกราฟ ตาราง และการ์ดจะอัปเดตตามข้อมูลที่กรอง

### ผลลัพธ์ที่จะเกิดขึ้น

ทุกส่วนของแดชบอร์ดเรนเดอร์ใหม่ตามเงื่อนไขตัวกรอง หากส่วนใดไม่มีข้อมูลตรงเงื่อนไข จะแสดงข้อความ "ไม่มีข้อมูล"

> **เคล็ดลับ:** สำหรับรายงานบริหารรายเดือน ให้ตั้งช่วงวันที่เป็นเดือนก่อนหน้า แล้วไล่ดูทีละจังหวัดเพื่อสร้างการเปรียบเทียบรายพื้นที่ บันทึกหรือถ่ายภาพหน้าจอแต่ละมุมมองไว้ทำรายงาน

---

## สถานการณ์: ส่งออกรายงาน

### สิ่งที่คุณต้องการทำ

ส่งออกข้อมูลรายงานเป็นไฟล์ Excel หรือ CSV เพื่อนำไปทำรายงานต่อหรือส่งต่อทีม

### ขั้นตอน

1. จากหน้ารายการที่รองรับ (เช่น รายการเบิกอะไหล่) คลิกปุ่ม **ส่งออก (Export)** เพื่อเปิดกล่องตัวช่วยส่งออกแบบ 4 ขั้นตอน

   ![กล่องตัวช่วยส่งออกรายงาน 4 ขั้นตอน](images/09-export-wizard.png)

   <!-- 📸 NEED SCREENSHOT: กล่องตัวช่วยส่งออก (Export Wizard) แสดง 4 ขั้นตอน: เทมเพลต → ฟิลด์ → ตัวกรอง → ส่งออก -->
   <!-- ⛔ DEMO BUILD GAP (2026-05-18): demo build ไม่มี wizard 4 ขั้น — ปุ่ม "ดาวน์โหลด" เป็นเมนู 3 ตัวเลือก (CSV / PDF ฉบับย่อ / PDF ฉบับเต็ม) ที่ดาวน์โหลดทันที (ดู 08-job-export-dropdown.png) — ตรวจสอบว่าเนื้อหา 4 ขั้นยังตรงกับ production หรือปรับเป็นเมนู 3 ตัวเลือก -->

2. **ขั้นที่ 1 — เทมเพลต (Template):** เลือกจากเทมเพลตที่บันทึกไว้ หรือสร้างใหม่

   > **หมายเหตุ:** เทมเพลตเป็นแบบรายผู้ใช้ (แต่ละคนจัดการเทมเพลตของตนเอง) และเก็บเฉพาะการเลือกฟิลด์ ไม่เก็บค่าตัวกรอง

3. **ขั้นที่ 2 — ฟิลด์ (Fields):** ติ๊กเลือก/ยกเลิกฟิลด์ที่ต้องการ จัดกลุ่มเป็นหมวด สามารถติ๊กทั้งหมดในหมวดได้ และระบบแสดงจำนวนฟิลด์ที่เลือก

   | หมวด | ฟิลด์ |
   |------|-------|
   | ข้อมูลใบเบิก (5) | เลขที่เอกสาร, วันที่เบิก, ผู้ยืนยัน, วันที่อนุมัติ, สถานะ |
   | ข้อมูลอะไหล่ (5) | รหัสอะไหล่, ชื่ออะไหล่, จำนวน, สภาพอะไหล่, หน่วยนับ |
   | ข้อมูลงาน (6) | เลขที่งาน, ชื่อลูกค้า/สาขา, รหัสสาขา, ชื่อช่าง, วัตถุประสงค์, หมายเหตุบริการ |
   | ข้อมูลเครื่อง (3) | รุ่นเครื่อง, หมายเลขซีเรียล, รหัสสินค้า |
   | อื่น ๆ (2) | วิธีจัดส่ง, หมายเหตุ |

4. **ขั้นที่ 3 — ตัวกรอง (Filters):** กรองตามเงื่อนไขที่ต้องการ:

   | ช่อง | กรอกอะไร | เงื่อนไข |
   |------|----------|----------|
   | ช่วงวันที่ (Date Range)* | ช่วงเวลาของข้อมูลที่ต้องการส่งออก | รูปแบบ DD/MM/YYYY (พ.ศ.) |
   | ลูกค้า (Customer) | เลือกลูกค้า | เลือกได้หลายรายการ |
   | สถานะ (Status) | เลือกสถานะ | เลือกได้หลายรายการ |
   | ช่าง (Technician) | เลือกช่าง | เลือกได้หลายรายการ |
   | สาขา/ร้าน (Store) | เลือกสาขา | เลือกได้หลายรายการ |

   > **หมายเหตุ:** ช่องที่มีเครื่องหมาย * เป็นช่องที่ต้องกรอก รายการที่ถูกยกเลิกจะไม่รวมโดยค่าเริ่มต้น (มีช่องติ๊กให้เปิด/ปิดได้) จำนวนระเบียนตัวอย่าง (preview) จะอัปเดตหลังเปลี่ยนตัวกรอง

5. **ขั้นที่ 4 — ส่งออก (Export):** เลือกรูปแบบไฟล์ **Excel (.xlsx)** หรือ **CSV** และเลือกบันทึกการตั้งค่าปัจจุบันเป็นเทมเพลตใหม่ได้

6. คลิก **ส่งออก (Export)** เพื่อสร้างไฟล์

### ผลลัพธ์ที่จะเกิดขึ้น

ระบบสร้างไฟล์ด้วยหัวคอลัมน์ภาษาไทยและวันที่แบบพุทธศักราช (DD/MM/YYYY) ตั้งชื่อไฟล์รูปแบบ `{ชื่อเทมเพลต}_{YYYYMMDD}.xlsx` ไฟล์รองรับสูงสุด 10,000 แถวต่อไฟล์ หากเกินจะแสดงคำเตือน

> **หมายเหตุ:** ในใบเบิกที่มีหลายรายการ แต่ละรายการย่อยจะถูกแยกเป็นคนละแถวในไฟล์ที่ส่งออก

<!-- VERIFY: ฟีเจอร์ส่งออกรายงานแบบกำหนดเอง (Custom Report Export, FR-SUP-003) อยู่ในสถานะ Prototype Approved สำหรับลูกค้า Superior — ตรวจสอบว่าเปิดใช้งานในผลิตภัณฑ์หลักแล้วหรือยังก่อนเผยแพร่บทนี้ -->

---

## เมื่อเกิดปัญหา

| สิ่งที่คุณเห็น | ทำอย่างไร |
|---------------|-----------|
| ส่วนต่าง ๆ หมุนโหลดนานเกิน 3 วินาที | คำขอข้อมูลอาจ timeout ลองจำกัดช่วงวันที่ให้แคบลง หรือเลือกจังหวัดเฉพาะ เพื่อลดปริมาณข้อมูล รีเฟรชหน้าหากยังหมุนค้าง |
| กราฟแสดง "ไม่มีข้อมูล" | ตรวจว่าช่วงวันที่ครอบคลุมช่วงที่มีงานจริง ตรวจตัวกรองจังหวัด รีเซ็ตตัวกรองเป็น "ทุกจังหวัด" เพื่อยืนยันว่ามีข้อมูลในระบบ |
| ตัวกรองไม่มีผลกับทุกส่วน | รีเฟรชหน้า หากยังไม่หาย ล้าง cache เบราว์เซอร์แล้วโหลดใหม่ ตัวกรองควรมีผลกับทุกส่วน |
| ส่งออกไฟล์ไม่ได้ (Excel/CSV) | ตรวจการตั้งค่าบล็อกป๊อปอัป/ดาวน์โหลดของเบราว์เซอร์ หากช่วงวันที่กว้าง ไฟล์อาจใช้เวลา 10–15 วินาที รอให้เริ่มดาวน์โหลดก่อนคลิกซ้ำ |
| ตารางจัดอันดับช่างว่าง | ไม่มีงานที่เสร็จพร้อมคะแนนในช่วงที่เลือก ตรวจว่าช่างปิดงานและลูกค้าให้คะแนนแล้ว |
| คลิกกราฟโดนัทแล้วไม่ไปหน้าใหม่ | JavaScript อาจโหลดไม่ครบ รีเฟรชหน้าแล้วลองใหม่ ตรวจว่าคลิกที่ส่วนสี ไม่ใช่ตรงกลาง |
| การวิเคราะห์ปัญหาแสดงข้อมูลบิดเบือน | โมเดลที่เลือกมีงานน้อยเกินไป เลือกโมเดลที่มีงานเสร็จอย่างน้อย 10 รายการในช่วงที่เลือก |
| ตัวเลขประสิทธิภาพดูผิด | ตรวจช่วงวันที่ ตัวชี้วัดคำนวณเฉพาะงานที่เสร็จในช่วงที่เลือก งานที่ยังทำอยู่จะไม่ถูกนับ |
| ตัวกรองจังหวัดไม่มีตัวเลือก | ข้อมูลจังหวัดของสถานที่ลูกค้าอาจยังไม่ครบ ตรวจที่ Customer Management ว่าที่อยู่สถานที่มีข้อมูลจังหวัด |
| ส่งออกแล้วข้อมูลเกิน 10,000 แถว | ระบบจะเตือนเมื่อเกิน ให้จำกัดช่วงวันที่หรือเพิ่มตัวกรองให้แคบลง แล้วส่งออกใหม่ |

---

## อ้างอิงด่วน (Quick Reference)

| ต้องการ... | ไปที่ | คลิก |
|------------|-------|------|
| ดูแดชบอร์ดทั้งหมด | sidebar → **รายงาน (Reports)** | (โหลดอัตโนมัติเป็นหน้าแรก) |
| ดูงานตามสถานะ | แดชบอร์ด → กราฟโดนัทสถานะใบงาน | คลิกส่วนสีของสถานะ |
| ตรวจรายการรออนุมัติ | แดชบอร์ด → การ์ดรออนุมัติ | คลิกการ์ดที่เกี่ยวข้อง |
| ดูอันดับประสิทธิภาพช่าง | แดชบอร์ด → ลำดับคะแนนประเมินช่าง | เลื่อนดู / ใช้ตัวกรองจังหวัด |
| กรองตามจังหวัด | แดชบอร์ด → ตัวกรองด้านบน | เลือกจาก **ตัวกรองจังหวัด** |
| กรองตามช่วงวันที่ | แดชบอร์ด → ตัวกรองด้านบน | ตั้งค่าใน **ตัวเลือกช่วงวันที่** |
| ดูเหตุผลยกเลิกงาน | แดชบอร์ด → กราฟวงกลมยกเลิกงาน | นำเมาส์ชี้เพื่อดูรายละเอียด |
| เทียบจำนวนงานกับช่าง | แดชบอร์ด → กราฟผสม | ติ๊กช่องประเภทงาน |
| หาเครื่องที่เสียบ่อย | แดชบอร์ด → ลำดับโมเดลที่ซ่อมบ่อย | เลื่อนดูใน carousel |
| วิเคราะห์ปัญหาตามรุ่น | แดชบอร์ด → ปัญหาที่เกิดขึ้น | เลือกโมเดลจากแถบเลื่อน |
| ส่งออกรายงาน | หน้ารายการที่รองรับ | **ส่งออก (Export)** → ทำตาม 4 ขั้นตอน |

---

## ภาพหน้าจอที่ต้องเพิ่ม

| # | สิ่งที่ต้องถ่าย | เส้นทางหน้า |
|---|----------------|-------------|
| 1 | ภาพรวมแดชบอร์ดทั้งหน้าแสดงทุกส่วน | `/dashboard` |
| 2 | กราฟโดนัทสถานะใบงานพร้อมตัวเลขรวมตรงกลาง | `/dashboard` (ส่วนสถานะใบงาน) |
| 3 | การ์ดรออนุมัติ 3 ใบพร้อมจำนวน | `/dashboard` (ส่วนรออนุมัติ) |
| 4 | ตารางสรุปคะแนนประเมินช่างพร้อมดาว | `/dashboard` (ส่วนคะแนนช่าง) |
| 5 | ตารางจัดอันดับประสิทธิภาพช่างครบ 10 คอลัมน์ | `/dashboard` (ส่วนจัดอันดับช่าง) |
| 6 | กราฟวงกลมเหตุผลยกเลิกงานพร้อมเปอร์เซ็นต์ | `/dashboard` (ส่วนยกเลิกงาน) |
| 7 | กราฟผสมรายเดือน แท่ง (ประเภทงาน) + เส้น (จำนวนช่าง) | `/dashboard` (ส่วนเปรียบเทียบ) |
| 8 | ตารางจัดอันดับโมเดลที่ซ่อมบ่อยพร้อม carousel | `/dashboard` (ส่วนโมเดลที่ซ่อมบ่อย) |
| 9 | กราฟวงกลมคู่วิเคราะห์ปัญหาของโมเดลที่เลือก | `/dashboard` (ส่วนวิเคราะห์ปัญหา) |
| 10 | ตัวกรองช่วงวันที่และจังหวัดด้านบนแดชบอร์ด | `/dashboard` (แถบตัวกรองด้านบน) |
| 11 | กล่องตัวช่วยส่งออกรายงาน 4 ขั้นตอน | หน้ารายการที่รองรับ (Export Wizard) |

---

*อ้างอิง: FR-016, UF-016 · ยึดมาตรฐาน `06-support/user-manual-writing-standard.md`*