Skip to content

DiaryCoding:behindMyCode

Published: at 01:15 PM

ผมได้เขียน feature นึงขึ้นมาซึ่งเป็นตัว handle ในการ allow สิทธิต่างๆ(ในที่นี้มีแค่สิทธิการส่ง email)ของพนักงานในองค์กร

handlePolicyCheckBox ทำหน้าที่เป็นเสมือน “ผู้คุมกฎ” ตรวจสอบสถานะ และแบ่งพนักงานออกเป็นสองกลุ่ม

unCheckToCheck: กลุ่มผู้ได้รับอนุญาต สามารถส่งอีเมล ติดต่อสื่อสาร

checkToUncheck: กลุ่มผู้ถูกจำกัดสิทธิ์ ไม่สามารถส่งอีเมลได้

ที่ต้องแยกเพราะต้องการส่งไปคนละ service

interface EmailPolicy {
  EmployeeID: number
  allowSendEmail: boolean
}
// true = checked, false = uncheck
const employees: EmailPolicy[] = [
  { EmployeeID: 1, allowSendEmail: true },
  { EmployeeID: 2, allowSendEmail: true },
  { EmployeeID: 3, allowSendEmail: false },
  { EmployeeID: 4, allowSendEmail: false },
]

let unCheckToCheck: EmailPolicy[] = []
let checkToUncheck: EmailPolicy[] = []

const handlePolicyCheckBox = (isChecked: boolean, employees: EmailPolicy) => {
 // case 1 unchecked to check
 if (isChecked && employees.allowSendEmail) {
    unCheckToCheck.push(employees)
    return 
 }  
 // case 2 checked to uncheck (when you change back)
 if (isChecked && !employees.allowSendEmail) {
    unCheckToCheck = unCheckToCheck.filter((employee) => employee.EmployeeID !== employees.EmployeeID)
 }
 
 // case 3 check to uncheck
 if (!isChecked && employees.allowSendEmail) {
    checkToUncheck.push(employees)
    return 
 }
 // case 4 uncheck to check (when you change back)
 if (!isChecked && !employees.allowSendEmail) {
    checkToUncheck = checkToUncheck.filter((employee) => employee.EmployeeID !== employees.EmployeeID)
    return 
 }
}

EmployeeID: หมายเลขประจำตัวพนักงาน

allowSendEmail: สถานะการอนุญาตส่งอีเมล (true = อนุญาต, false = ไม่อนุญาต)

สร้างอาร์เรย์ employees: เก็บข้อมูลพนักงานในรูปแบบ EmailPolicy

สร้างอาร์เรย์ unCheckToCheck: เก็บข้อมูลพนักงานที่เปลี่ยนสถานะจากไม่อนุญาตเป็นอนุญาต

สร้างอาร์เรย์ checkToUncheck: เก็บข้อมูลพนักงานที่เปลี่ยนสถานะจากอนุญาตเป็นไม่อนุญาต

handlePolicyCheckBox รับค่า isChecked (สถานะ checkbox) และ employees (ข้อมูลพนักงาน)

ตรวจสอบสถานะ checkbox และสถานะ allowSendEmail ผมได้แบ่งเป็น 4 กรณีและเขียนตรงนี้ โดยใช้ If-statements design guard clauses เพื่อจะ update ค่า และ return ออกทันทีที่ทำเสร็จ

กรณีที่ 1: เปลี่ยนจากไม่อนุญาตเป็นอนุญาต -> เพิ่มข้อมูลพนักงานใน unCheckToCheck

กรณีที่ 2: เปลี่ยนจากอนุญาตเป็นไม่อนุญาต (เปลี่ยนกลับ) -> ลบข้อมูลพนักงานออกจาก unCheckToCheck

กรณีที่ 3: เปลี่ยนจากอนุญาตเป็นไม่อนุญาต -> เพิ่มข้อมูลพนักงานใน checkToUncheck

กรณีที่ 4: เปลี่ยนจากไม่อนุญาตเป็นอนุญาต (เปลี่ยนกลับ) -> ลบข้อมูลพนักงานออกจาก checkToUncheck


Next Post
DiaryCoding:CreateToolTesting