FullCalendar से मुफ़्त Angular शेड्यूलर पर स्विच करें

FullCalendar की रिसोर्स टाइमलाइन और रिसोर्स कॉलम Premium सुविधाएँ हैं: कमर्शियल ऐप के लिए पेड लाइसेंस कुंजी ज़रूरी है। उसके लाइसेंस पेज पर मुफ़्त विकल्प दिए गए हैं: पूरी तरह AGPL के तहत आने वाले ऐप के लिए, और रजिस्टर्ड गैर-लाभकारी संस्थाओं के लिए। Needless UI शेड्यूलर में ये दोनों MIT लाइसेंस के तहत मिलते हैं, बार-बार होने वाले इवेंट और iCalendar फ़ाइलों के साथ। इस गाइड में बताया गया है कि Angular ऐप को एक से दूसरे पर कैसे ले जाएँ: क्या साथ आता है, क्या नहीं, और कौन-सा डेटा बदलना होगा।

यहाँ FullCalendar 7 के नाम इस्तेमाल किए गए हैं, और जहाँ वर्शन 6 के नाम अलग हैं, वहाँ वे ब्रैकेट में दिए गए हैं। FullCalendar का Angular कनेक्टर Angular 16 से 22 तक सपोर्ट करता है; Needless UI को Angular 22 चाहिए।

आपको क्या मिलता है

FullCalendar और Needless UI शेड्यूलर
सुविधा	FullCalendar	Needless UI
रिसोर्स टाइमलाइन: हर कमरे या व्यक्ति की एक पंक्ति	Premium	हाँ: एक दिन, एक सप्ताह या एक महीना
दिन और सप्ताह व्यू में रिसोर्स कॉलम के रूप में	Premium	हाँ
महीना, सप्ताह और दिन व्यू	मुफ़्त	हाँ
ड्रैग करके खिसकाना और रीसाइज़ करना	मुफ़्त; दूसरे रिसोर्स पर ले जाने के लिए Premium	हाँ, दूसरे रिसोर्स पर भी। रीसाइज़ अंत से होता है, शुरुआत से नहीं।
इवेंट बनाने के लिए समय चुनना	मुफ़्त	हाँ, पॉइंटर से, देर तक दबाकर या कीबोर्ड से
ओवरलैप रोकने जैसे नियम	मुफ़्त: overlap और constraint विकल्प	हाँ: एक ही `allow` फ़ंक्शन, जिससे हर बदलाव से पहले पूछा जाता है
कीबोर्ड से इवेंट खिसकाना और रीसाइज़ करना	उसके सुलभता दस्तावेज़ों में नहीं, जो ARIA लेबल और Tab फ़ोकस की बात करते हैं	हाँ, और स्क्रीन रीडर पर इसकी घोषणा होती है
बार-बार होने वाले इवेंट	मुफ़्त, rrule प्लगइन और लाइब्रेरी के साथ	बिल्ट-इन: RFC 5545 के नियम, पर EXRULE, RDATE या घंटे के हिसाब से दोहराने वाले नियम नहीं
iCalendar (.ics)	मुफ़्त: फ़ीड पढ़ता है	.ics फ़ाइलें पढ़ता और लिखता है
लिस्ट और साल व्यू	मुफ़्त	आने वाले दिनों का एजेंडा; साल व्यू नहीं
टाइम ज़ोन	मुफ़्त: लोकल, UTC या नाम वाले	नहीं: जो समय मिलता है, उसे वैसे ही दिखाता है
ग्रुप किए गए, नेस्टेड या कई कॉलम वाले रिसोर्स	Premium	नहीं: एक कॉलम, जिसे आपका टेम्पलेट बनाता है
बाहर से ड्रैग और ड्रॉप, बैकग्राउंड इवेंट	मुफ़्त	नहीं
प्रिंटिंग, वर्चुअल रेंडरिंग	Premium	नहीं
फ़्रेमवर्क	Angular 16 से 22, React, Vue, सादा JavaScript और कई अन्य	Angular 22 और React 19

किसकी जगह क्या

FullCalendar के विकल्प और Needless UI में उनके समकक्ष
FullCalendar	Needless UI शेड्यूलर
`<full-calendar [options]>`, `plugins`, `schedulerLicenseKey`	`<nui-scheduler>`, हर विकल्प के लिए एक इनपुट के साथ; न प्लगइन, न लाइसेंस कुंजी
`initialView: 'resourceTimelineDay'`	`view="timeline"`, और सप्ताह या महीने के लिए `timelineSpan`
`initialView: 'timeGridWeek'`	`view="week"`; `[(view)]` दो-तरफ़ा है
`resources`, `events`	`[resources]`, `[events]`
`resourceId`, `extendedProps`	`resource`, `data`
`editable`, `selectable`	`editable`, `selectable`
`select`	`(slotSelect)`: `{ start, end, allDay, resource }`
`eventDrop`, `eventResize`	`(eventChange)`: जब तक आप `events` अपडेट नहीं करते, कुछ नहीं खिसकता
`eventClick`	`(eventClick)`
`eventOverlap`, `selectOverlap`, `eventAllow`	`[allow]`: खिसकाने, रीसाइज़ करने और चुनने के लिए एक ही फ़ंक्शन
`slotDuration`, `snapDuration`	`slotMinutes`, `snapMinutes`, मिनटों में
`slotMinTime`, `slotMaxTime`, `scrollTime`	`dayStart`, `dayEnd`, `scrollHour`, घंटों में
`businessHours`	`[businessHours]`, सप्ताह के दिन 1 (सोमवार) से 7 तक
`datesSet`	`(rangeChange)`
`eventContent`, `resourceCellContent` [`resourceLabelContent`]	`nuiSchedulerEvent` और `nuiSchedulerResource` टेम्पलेट
`locale`, `firstDay`	`locale` (कोई भी BCP 47 टैग), 1 से 7 तक `firstDay`, और उसके शब्दों के लिए `labels`

कमरों की बुकिंग की टाइमलाइन, दोनों तरह से

कमरे रिसोर्स हैं और बुकिंग इवेंट। लोग किसी कमरे को बुक करने के लिए उसकी पंक्ति में ड्रैग करते हैं और किसी बुकिंग को खिसकाने के लिए उसे ड्रैग करते हैं, और एक कमरे में एक समय पर एक ही बुकिंग हो सकती है। FullCalendar 7 और उसकी Premium रिसोर्स टाइमलाइन के साथ:

fullcalendar-bookings.ts

Needless UI शेड्यूलर के साथ:

booking.ts

booking.html

दो चीज़ें अलग तरह से काम करती हैं। FullCalendar बुकिंग को ख़ुद खिसकाता है, और ऐप उस बदलाव को अपने डेटा में दोहराता है; Needless UI शेड्यूलर सिर्फ़ बदलाव बताता है, और events अपडेट करने पर ही वह टिकता है, इसलिए आपका डेटा ही अकेला स्रोत रहता है। और allow सादा कोड है, जिससे पॉइंटर या कीबोर्ड से होने वाले हर बदलाव से पहले पूछा जाता है, इसलिए यह नियम आप ख़ुद टेस्ट कर सकते हैं। कमरों की बुकिंग पर गाइड में यही ऐप क़दम-ब-क़दम बनाया गया है।

डेटा को बदलना

FullCalendar का डेटा और शेड्यूलर को क्या चाहिए
FullCalendar	Needless UI
पूरे दिन के इवेंट का `end` इवेंट के बाद वाला दिन होता है	पूरे दिन के इवेंट का `end` उसका आख़िरी दिन होता है: एक दिन घटाएँ
समय के अंत में `Z` या `+02:00` जैसा ऑफ़सेट हो सकता है	बिना ऑफ़सेट वाला घड़ी का समय, जैसे `2026-11-02T09:30`
`businessHours` और `firstDay` में सप्ताह के दिन 0 (रविवार) से 6 तक	सप्ताह के दिन 1 (सोमवार) से 7 (रविवार) तक
अवधि स्ट्रिंग के रूप में, जैसे `'00:30'`	संख्याएँ: मिनट या घंटे
रिसोर्स id से, फिर टाइटल से सॉर्ट होते हैं	रिसोर्स ऐरे के क्रम में ही रहते हैं
`rrule` ऑब्जेक्ट के रूप में, और `exrule`	RFC 5545 स्ट्रिंग, जैसे `FREQ=WEEKLY;BYDAY=MO,FR`, और `exdate`
`America/New_York` जैसा टाइम ज़ोन	पहले समय बदलें। `nuiSchedulerFromIcs(text, { timeZone })` .ics फ़ाइलों को पढ़ते समय ही उनका समय बदल देता है।

अगर आपको वह चाहिए जो अभी नहीं है

अगर आपका ऐप टाइम ज़ोन, ग्रुप किए गए रिसोर्स, बाहर से ड्रैग और ड्रॉप या प्रिंटिंग पर निर्भर है, तो शेड्यूलर अभी FullCalendar की जगह नहीं ले सकता। आपको जो चाहिए, उसके लिए एक issue खोलें। बाक़ी सब के लिए, शेड्यूलर के पेज पर हर इनपुट, आउटपुट और उदाहरण मौजूद है।