Scheduler चा React API

इम्पोर्ट

import-scheduler.tsx

import { NuiScheduler, type NuiSchedulerHandle } from '@needless-ui/react/scheduler';

NuiScheduler

महिना, आठवडा, दिवस, अजेंडा किंवा टाइमलाइनमधील इव्हेंट.

NuiScheduler: प्रॉपर्टीज
नाव	प्रकार	डीफॉल्ट	वर्णन
`events`प्रॉप	`NuiSchedulerEvent<T>[]`	`[]`	दाखवायचे इव्हेंट.
`resources`प्रॉप	`NuiSchedulerResource[]`	`[]`	रूम्स, लोक किंवा मशीन: टाइमलाइनच्या ओळी, आणि दिवस व आठवड्याचे कॉलम.
`view` `defaultView` `onViewChange`स्थिती	`'month' \| 'week' \| 'day' \| 'agenda' \| 'timeline'`	`'week'`	दाखवलेला व्ह्यू.
`views`प्रॉप	`NuiSchedulerView[]`	`all`	लोक ज्यांमध्ये बदलू शकतात असे व्ह्यू. डीफॉल्टनुसार सर्व, आणि टाइमलाइन फक्त रिसोर्स असल्यास.
`timelineSpan`प्रॉप	`'day' \| 'week' \| 'month'`	`'day'`	टाइमलाइन काय दाखवते: एक दिवस त्याच्या स्लॉटनुसार, किंवा आठवडा किंवा महिना त्याच्या दिवसांनुसार.
`date` `defaultDate` `onDateChange`स्थिती	`NuiDate`	`today`	दाखवलेला दिवस, आणि कीबोर्ड फोकस जिथे आहे तो. सर्व्हर शेड्यूलर रेंडर करत असल्यास `defaultDate` द्या: सर्व्हरचा आज वापरकर्त्याचा आज असेलच असे नाही.
`slotMinutes`प्रॉप	`number`	`30`	वेळ ग्रिडच्या प्रत्येक ओळीतील मिनिटे, किंवा एका दिवसाच्या टाइमलाइनच्या प्रत्येक कॉलममधील.
`snapMinutes`प्रॉप	`number`	`slotMinutes`	इव्हेंट ज्या स्टेपने हलतात आणि त्यांचा आकार बदलतो ती स्टेप.
`dayStart, dayEnd`प्रॉप	`number`	`0, 24`	वेळ ग्रिड कोणत्या तासापासून कोणत्या तासापर्यंत दाखवते.
`scrollHour`प्रॉप	`number`	`8`	वेळ ग्रिड ज्या तासावर उघडते तो तास.
`agendaDays`प्रॉप	`number`	`30`	अजेंडा किती दिवस पुढचे दाखवतो.
`businessHours`प्रॉप	`NuiSchedulerHours[]`		कामाचे तास, जसे `{ days: [1, 2, 3, 4, 5], start: '09:00', end: '17:00' }`. बाकीची वेळ छायांकित असते.
`weekends`प्रॉप	`boolean`	`true`	वीकेंड दाखवते. याशिवाय प्रत्येक व्ह्यू लोकेलचा वीकेंड वगळतो.
`weekNumbers`प्रॉप	`boolean`	`false`	महिन्यात, आणि वेळांच्या वर, ISO आठवडा क्रमांक दाखवते.
`editable`प्रॉप	`boolean`	`false`	इव्हेंट पॉइंटर आणि कीबोर्डने हलवता येतात व त्यांचा आकार बदलता येतो.
`selectable`प्रॉप	`boolean`	`false`	इव्हेंट तयार करण्यासाठी ग्रिडवर वेळ निवडता येते.
`allow`प्रॉप	`(time) => boolean`		हलवणे, आकार बदलणे किंवा वेळेची निवड होऊ शकते का, ते ठरवते.
`toolbar`प्रॉप	`boolean \| ((toolbar: NuiSchedulerToolbar) => ReactNode)`	`true`	टूलबार दाखवते, किंवा मिळालेल्या माहितीतून आपला स्वतःचा टूलबार काढते.
`firstDay`प्रॉप	`1 … 7`		आठवड्याचा पहिला दिवस, सोमवारसाठी 1. डीफॉल्टनुसार लोकेलचा.
`headingLevel`प्रॉप	`number`	`2`	शीर्षकाची हेडिंग लेव्हल; अजेंडामधील दिवस एक लेव्हल खाली.
`locale`प्रॉप	`string`	`'en-US'`	दिवस आणि वेळा फॉरमॅट करते.
`labels`प्रॉप	`Partial<NuiSchedulerLabels>`		शेड्यूलर दाखवत किंवा जाहीर करत असलेला प्रत्येक मजकूर, भाषांतरासाठी.
`corners`प्रॉप	`NuiCorners`		कोपऱ्यांची आकृती: `round`, `squircle`, `bevel`, `scoop`, `notch` किंवा `square`.
`radius`प्रॉप	`NuiRadius`		कोपरे किती मोठे असावेत: `none`, `small`, `medium`, `large` किंवा `full`.
`density`प्रॉप	`NuiDensity`		किती जागा व्यापावी: `compact`, `regular` किंवा `roomy`.
`renderEvent`रेंडर प्रॉप	`(event, { time }) => ReactNode`		इव्हेंट स्वतः काढा, इव्हेंट आणि मजकूर स्वरूपातील त्याच्या वेळेवरून.
`renderResource`रेंडर प्रॉप	`(resource) => ReactNode`		रिसोर्सचे हेडर स्वतः काढा.
`onEventClick`कॉलबॅक	`(event: NuiSchedulerEvent<T>) => void`		क्लिक केलेला, किंवा Enter ने उघडलेला इव्हेंट घेऊन कॉल होते.
`onEventChange`कॉलबॅक	`({ event, start, end, resource? }) => void`		हलवल्यावर किंवा आकार बदलल्यावर इव्हेंटच्या नव्या वेळा घेऊन कॉल होते, आणि रिसोर्स बदलले असल्यास तेही. बदल टिकवण्यासाठी `events` अपडेट करा.
`onSlotSelect`कॉलबॅक	`({ start, end, allDay, resource? }) => void`		ग्रिडवर निवडलेली वेळ आणि तिचा रिसोर्स घेऊन कॉल होते.
`onRangeChange`कॉलबॅक	`({ start, end }) => void`		दाखवलेले पहिले आणि शेवटचे दिवस बदलल्यावर ते घेऊन कॉल होते, त्यांचे इव्हेंट लोड करण्यासाठी.
`ref`प्रॉप	`Ref<NuiSchedulerHandle>`		शेड्यूलरच्या `ref` मधून काय मिळते: पेजिंग, आपल्या स्वतःच्या टूलबारसाठी.
`previous, next, goToday`मेथड	`() => void`		मागचे किंवा पुढचे पेज, किंवा आजचा दिवस दाखवतात, आपल्या स्वतःच्या टूलबारसाठी.
`title`प्रॉपर्टी	`string`		जे दाखवले आहे ते, टूलबारचे शीर्षक सांगते तसे.

स्थिती React च्या स्वतःच्या इनपुट्सप्रमाणे काम करते: व्हॅल्यू द्या आणि तिच्या on…Change कॉलबॅकमधून ती अपडेट करा, किंवा default… व्हॅल्यू द्या आणि ती कंपोनंटला ठेवू द्या.

आपण सेट न केलेले कस्टमायझेशन प्रॉप्स सर्वात जवळच्या data-nui-* ॲट्रिब्यूटमधून व्हॅल्यू घेतात. कस्टमायझेशन मार्गदर्शक पाहा.

NuiSchedulerToolbar

toolbar फंक्शनला काय मिळते, आपला स्वतःचा टूलबार काढण्यासाठी.

NuiSchedulerToolbar: प्रॉपर्टीज
नाव	प्रकार	वर्णन
`title`प्रॉपर्टी	`string`	जे दाखवले आहे ते, टूलबारचे शीर्षक सांगते तसे.
`view, views`प्रॉपर्टी	`NuiSchedulerView, NuiSchedulerView[]`	दाखवलेला व्ह्यू, आणि उपलब्ध व्ह्यू.
`setView, previous, next, goToday`मेथड	`(view?) => void`	व्ह्यू बदलतात, मागचे किंवा पुढचे पेज दाखवतात, किंवा आजचा दिवस दाखवतात.

NuiSchedulerEvent

एक इव्हेंट. वेळ असलेल्या इव्हेंटचा शेवट समाविष्ट नसतो; दिवसभराच्या इव्हेंटचा शेवट म्हणजे त्याचा शेवटचा दिवस.

NuiSchedulerEvent: प्रॉपर्टीज
नाव	प्रकार	डीफॉल्ट	वर्णन
`id, title`प्रॉपर्टी	`string`		त्याची की, आणि तो काय दाखवतो.
`start, end`प्रॉपर्टी	`NuiDateTime \| NuiDate`		तारीख व वेळ, किंवा दिवसभराच्या इव्हेंटसाठी फक्त तारीख.
`allDay`प्रॉपर्टी	`boolean`		डीफॉल्टनुसार, `start` मध्ये वेळ नसल्यास.
`tone`प्रॉपर्टी	`'accent' \| 'neutral' \| 'success' \| 'warning' \| 'danger'`	`'accent'`	त्याचे पॅलेट.
`color, class`प्रॉपर्टी	`string`		कोणताही CSS रंग, जो त्याच्या टोनपेक्षा वरचढ ठरतो, आणि त्याला स्टाइल देण्यासाठी क्लासेस.
`resource`प्रॉपर्टी	`string \| string[]`		तो ज्या रिसोर्सचा आहे ते रिसोर्स.
`rrule`प्रॉपर्टी	`string`		RFC 5545 मधील पुनरावृत्तीचा नियम, जसे `FREQ=WEEKLY;BYDAY=MO`.
`exdate`प्रॉपर्टी	`string[]`		न होणाऱ्या पुनरावृत्तींच्या सुरुवातीच्या वेळा.
`recurrenceId`प्रॉपर्टी	`NuiDateTime \| NuiDate`		शेड्यूलर कळवत असलेल्या पुनरावृत्तीवर: तिच्या नियमाने तिला दिलेली सुरुवात.
`editable`प्रॉपर्टी	`boolean`		तो हलवता येतो का, शेड्यूलर काहीही म्हणो.
`data`प्रॉपर्टी	`T`		त्यासोबत ठेवायचे इतर काहीही.

NuiSchedulerResource

एखादी रूम, व्यक्ती किंवा मशीन, जिच्याशी इव्हेंट जोडलेले असतात.

NuiSchedulerResource: प्रॉपर्टीज
नाव	प्रकार	वर्णन
`id, title`प्रॉपर्टी	`string`	त्याची की, आणि तो दाखवत असलेले नाव.
`tone, color`प्रॉपर्टी	`NuiSchedulerTone, string`	त्याच्या इव्हेंटचे रंग, जोपर्यंत त्यांचे स्वतःचे रंग नसतात.
`businessHours`प्रॉपर्टी	`NuiSchedulerHours[]`	तो कधी उपलब्ध असतो, शेड्यूलरच्या कामाच्या तासांऐवजी.
`data`प्रॉपर्टी	`R`	त्यासोबत ठेवायचे इतर काहीही.

Helpers

पुन्हा होणाऱ्या इव्हेंटसाठी आणि iCalendar फाइल्ससाठी फंक्शन्स.

Helpers: प्रॉपर्टीज
नाव	प्रकार	वर्णन
`nuiSchedulerOccurrences`मेथड	`(event, first, last) => NuiSchedulerEvent[]`	दिलेल्या दिवसांत इव्हेंट जसा दिसतो तसा: पुन्हा होणाऱ्या इव्हेंटची प्रत्येक पुनरावृत्ती.
`nuiSchedulerRule`मेथड	`(text: string) => NuiSchedulerRule \| null`	पुनरावृत्तीचा नियम वाचते, किंवा null परत करते.
`nuiSchedulerToIcs`मेथड	`(events, options?) => string`	इव्हेंट iCalendar फाइल म्हणून लिहिते.
`nuiSchedulerFromIcs`मेथड	`(text, { timeZone? }) => NuiSchedulerEvent[]`	iCalendar फाइलमधील इव्हेंट वाचते, त्यांच्या वेळा एकाच टाइम झोनमध्ये.