Skip to main content

การจัดการ Trip Record

หน้ารายการ Trip Record

ภาพ: หน้ารายการ Trip Record

เมนู Trip Record คือหน้าวางแผนเที่ยวรถของฝั่งสำนักงาน โดยจัดข้อมูลในระดับ ลูกค้า -> สัญญา -> สายรถ -> รอบวิ่ง -> วันที่

ข้อมูลที่สร้างจากหน้านี้จะไหลต่อไปยัง:

  • หน้า Trip History สำหรับตรวจสอบและอนุมัติ
  • หน้า Driver Income สำหรับคำนวณรายได้พนักงานขับรถ
  • หน้า Customer Invoice / Partner Invoice สำหรับทำเอกสารการเงิน

หน้านี้มีไว้ทำอะไร​

  • เลือกสายรถที่ต้องการจัดการในแต่ละวัน
  • ดูภาพรวมเที่ยวรถทั้งเดือนในรูปแบบตาราง
  • เพิ่มรายการเที่ยวรถแบบ manual
  • import รายการจำนวนมากจาก Excel
  • export template ที่ผูกกับสายรถปัจจุบัน

โครงสร้างหน้าจอจากโค้ดจริง​

1. แถบค้นหาด้านซ้าย​

ระบบแบ่งเป็น 2 กลุ่มข้อมูล

  • ข้อมูลหลัก
    • ลูกค้า เป็นข้อมูลบังคับ
    • สัญญา เป็นข้อมูลบังคับ และจะเลือกได้ก็ต่อเมื่อเลือกลูกค้าแล้ว
    • สายรถ เป็นข้อมูลบังคับ และจะเลือกได้ก็ต่อเมื่อเลือกสัญญาแล้ว
  • ข้อมูลเพิ่มเติม
    • รหัสรถ เป็น optional
    • พนักงานขับรถ เป็น optional

เมื่อกดปุ่ม ตกลง หน้า index จะ query ข้อมูลด้วย contractRouteId, vehicleId, และ driverId ไปยัง GET /route-rounds

2. ตาราง Trip Record ด้านขวา​

ตารางฝั่งขวาไม่ได้ดึงข้อมูลเป็นรายวันโดยตรง แต่ใช้ข้อมูล routeRounds เป็นคอลัมน์ แล้วสร้างแถววันที่ของเดือนใน frontend

  • คอลัมน์บนสุด = รอบวิ่งของสายรถ
  • แถวแนวตั้ง = ทุกวันของเดือนที่เลือก
  • ค่าใน cell = ข้อมูลจาก tripRecordVehicles ที่ตรงกับวันนั้น
  • ถ้าคลิก cell ระบบจะเปิด modal ของวันและรอบนั้น

ตัวเลือกเดือนด้านบนใช้เปลี่ยนช่วงวันที่ที่แสดงบนหน้าจอ โดยฝั่ง frontend จะเอา tripRecordVehicles.date มาเทียบกับวันที่ในเดือนที่เลือกอีกชั้นหนึ่ง

3. ปุ่มหลักของหน้า​

  • เพิ่ม Trip Record
    • ใช้เปิดหน้า /trip-record/add
    • ระบบจะส่งค่าที่เลือกไว้ เช่น customer, contract, contract route, driver, vehicle ผ่าน query string
  • Import Excel
    • ใช้เปิด modal นำเข้าข้อมูล
  • Export Template
    • ใช้ดาวน์โหลด template ที่ผูกกับ contractRouteId ปัจจุบัน

ทั้ง 3 ปุ่มจะถูก disabled ถ้ายังไม่มีข้อมูลในตาราง

วิธีใช้งานที่แนะนำ​

  1. เลือก ลูกค้า
  2. เลือก สัญญา
  3. เลือก สายรถ
  4. ถ้าต้องการดูเฉพาะรถหรือคนขับ ให้เลือก รหัสรถ หรือ พนักงานขับรถ เพิ่ม
  5. กด ตกลง
  6. ตรวจสอบตารางของเดือนที่ต้องการ
  7. เลือกวิธีทำงานต่อ
    • เพิ่มรายการแบบ manual
    • import จาก Excel
    • export template ไปกรอกภายนอก

สิ่งที่ระบบจำค่าไว้ให้​

หน้า Trip Record มีการเก็บ state ลง sessionStorage ด้วย key trip-record:index-cache เพื่อให้เมื่อกลับจากหน้าเพิ่มข้อมูลหรือกลับเข้าหน้าเดิม ระบบสามารถ restore filter ที่ใช้ล่าสุดได้

ผลที่ผู้ใช้งานจะเห็นคือ:

  • ไม่ต้องเลือก customer / contract / route ใหม่ทุกครั้ง
  • ถ้ากลับมาจากหน้าเพิ่มรายการ ระบบยังจำ context เดิมไว้

การสร้างรายการแบบ manual​

เมื่อกด เพิ่ม Trip Record ระบบจะพาไปหน้า /trip-record/add

ข้อมูลที่บังคับใน flow นี้จาก schema จริงคือ:

  • startDate
  • endDate
  • อย่างน้อย 1 ชุด tripRecords
  • ในแต่ละชุดต้องมีอย่างน้อย 1 tripRoundId
  • ในแต่ละแถวของ tripRecordVehicles ต้องมีทั้ง driver และ vehicle

พฤติกรรมสำคัญที่ควรรู้:

  • ถ้าเลือก รหัสรถ ระบบจะพยายามเติม พนักงานขับรถ ที่ผูกกับรถคันนั้นให้อัตโนมัติ
  • ถ้าเลือก พนักงานขับรถ ระบบจะพยายามเติม รหัสรถ ที่ผูกกับคนขับคนนั้นให้อัตโนมัติ
  • การค้นหารถและคนขับในหน้าเพิ่มรายการจะผูกกับ workAreaId ของสัญญา

การนำเข้าข้อมูลผ่าน Excel​

ถ้าต้องการ import จำนวนมาก ให้ใช้ปุ่ม Import Excel

สิ่งที่หน้า modal ตรวจจากโค้ดจริงมีดังนี้

  • รองรับเฉพาะ .xls และ .xlsx
  • ขนาดไฟล์ต้องไม่เกิน 5 MB
  • ระบบอ่านเฉพาะ sheet แรกของไฟล์
  • ระบบตรวจ header แบบตรงตัวทุกคอลัมน์
  • ถ้า header ไม่ตรง ระบบจะบอกให้ใช้ template ที่ระบบเตรียมไว้

ถ้าต้องการอ่าน flow import แบบละเอียดแยกตามภาพหน้าจอ ดู Trip Record

การ Export Template​

ปุ่ม Export Template จะเรียก GET /trip-records/export-template โดยส่ง contractRouteId ของสายรถที่ผู้ใช้เลือกอยู่

ผลคือ template ที่ได้จะผูกกับสายรถปัจจุบัน เหมาะกับการกรอกข้อมูลแล้ว import กลับเข้าระบบอีกครั้ง

จุดที่ต้องระวัง​

warning
  • ถ้ายังไม่เลือก ลูกค้า, สัญญา, และ สายรถ ระบบจะยังไม่ query ตาราง
  • ถ้าไม่มีข้อมูล routeRounds ปุ่ม เพิ่ม Trip Record, Import Excel, และ Export Template จะกดไม่ได้
  • ตัวเลือกเดือนบนตารางเป็น logic ฝั่งหน้าจอ ไม่ใช่ query parameter ของหน้า index
  • Trip Record ที่สร้างจากหน้านี้ยังต้องผ่านการตรวจสอบและอนุมัติในหน้า Trip History ก่อนนำไปใช้คำนวณต่อ

หน้านี้เชื่อมกับอะไรบ้าง​

อ้างอิงโค้ด​

  • atp30-tos-frontend/src/views/pages/trip-record/index.tsx
  • atp30-tos-frontend/src/views/pages/trip-record/TableSession.tsx
  • atp30-tos-frontend/src/views/pages/trip-record/TripTable.tsx
  • atp30-tos-frontend/src/views/pages/trip-record/CreateTripRecord.tsx
  • atp30-tos-frontend/src/views/pages/trip-record/ImportTripRecordModal.tsx
  • atp30-tos-frontend/src/api/trip-record.ts
  • atp30-tos-frontend/src/types/tripRound.ts