Import
import { NuiScheduler, type NuiSchedulerEvent } from '@needless-ui/angular/scheduler';NuiScheduler
กิจกรรมในมุมมองเดือน สัปดาห์ วัน หรือกำหนดการ
| ชื่อ | ชนิด | ค่าเริ่มต้น | คำอธิบาย |
|---|---|---|---|
eventsInput | NuiSchedulerEvent<T>[] | [] | กิจกรรมที่จะแสดง |
viewสองทาง | 'month' | 'week' | 'day' | 'agenda' | 'week' | มุมมองที่แสดงอยู่ |
viewsInput | NuiSchedulerView[] | all four | มุมมองที่ผู้ใช้สลับไปมาได้ |
dateสองทาง | NuiDate | today | วันที่แสดงอยู่ และตำแหน่งของโฟกัสคีย์บอร์ด |
slotMinutesInput | number | 30 | จำนวนนาทีต่อแถวในตารางเวลา และระยะที่กิจกรรมเลื่อนในแต่ละครั้ง |
scrollHourInput | number | 8 | ชั่วโมงที่ตารางเวลาแสดงเมื่อเปิดขึ้นมา |
agendaDaysInput | number | 30 | จำนวนวันข้างหน้าที่กำหนดการแสดง |
editableInput | boolean | false | ย้ายและปรับขนาดกิจกรรมได้ ทั้งด้วยตัวชี้และคีย์บอร์ด |
selectableInput | boolean | false | เลือกเวลาบนตารางได้ เพื่อสร้างกิจกรรม |
firstDayInput | 1 … 7 | วันแรกของสัปดาห์ โดย 1 คือวันจันทร์ ค่าเริ่มต้นเป็นไปตาม locale | |
headingLevelInput | number | 2 | ระดับหัวข้อของหัวเรื่อง ส่วนวันในกำหนดการจะลึกลงไปอีกหนึ่งระดับ |
localeInput | string | LOCALE_ID | ใช้จัดรูปแบบวันและเวลา |
labelsInput | Partial<NuiSchedulerLabels> | ข้อความทุกส่วนที่ Scheduler แสดงหรือประกาศ สำหรับการแปล | |
cornersInput | NuiCorners | รูปทรงของมุม: round squircle bevel scoop notch หรือ square | |
radiusInput | NuiRadius | ขนาดของมุม: none small medium large หรือ full | |
densityInput | NuiDensity | พื้นที่ที่ใช้: compact regular หรือ roomy | |
eventClickOutput | NuiSchedulerEvent<T> | ส่งกิจกรรมที่ถูกคลิกหรือถูกเปิดด้วย Enter ออกมา | |
eventChangeOutput | { event, start, end } | ส่งเวลาใหม่ของกิจกรรมออกมาหลังการย้ายหรือปรับขนาด | |
slotSelectOutput | { start, end, allDay } | ส่งเวลาที่เลือกบนตารางออกมา | |
rangeChangeOutput | { start, end } | ส่งวันแรกและวันสุดท้ายที่แสดงออกมาเมื่อมีการเปลี่ยนแปลง |
Input สำหรับการปรับแต่งที่ไม่ได้กำหนดค่าไว้ จะใช้ค่าตาม attribute data-nui-* ที่อยู่ใกล้ที่สุด ดูคู่มือการปรับแต่ง
NuiSchedulerEvent
กิจกรรมหนึ่งรายการ กิจกรรมที่ระบุเวลาจะไม่นับเวลาสิ้นสุดรวมไว้ ส่วนวันสิ้นสุดของกิจกรรมทั้งวันคือวันสุดท้ายของกิจกรรม
| ชื่อ | ชนิด | ค่าเริ่มต้น | คำอธิบาย |
|---|---|---|---|
id, titleพร็อพเพอร์ตี | string | คีย์ของกิจกรรม และสิ่งที่แสดง | |
start, endพร็อพเพอร์ตี | NuiDateTime | NuiDate | วันที่และเวลา หรือเฉพาะวันที่สำหรับกิจกรรมทั้งวัน | |
allDayพร็อพเพอร์ตี | boolean | ค่าเริ่มต้นขึ้นอยู่กับว่า start ไม่มีเวลาหรือไม่ | |
toneพร็อพเพอร์ตี | 'accent' | 'neutral' | 'success' | 'warning' | 'danger' | 'accent' | สีของกิจกรรม |
editableพร็อพเพอร์ตี | boolean | ย้ายกิจกรรมนี้ได้หรือไม่ ไม่ว่า Scheduler จะตั้งค่าไว้อย่างไร | |
dataพร็อพเพอร์ตี | T | ข้อมูลอื่นที่ต้องการเก็บไว้กับกิจกรรม |
NuiSchedulerEventTemplate
วาดกิจกรรม context จะมีกิจกรรมและเวลาของกิจกรรมในรูปแบบข้อความ