Создайте часовой календарь бронирования с событиями и скрыть недоступные часы

Question

Для нового проекта мне нужно построить календарь бронирования часов для врачей. Я ищу плагин (js / vanilla / jquery / vuetify / реагировать), который может отвечать следующим потребностям:

• иметь еженедельное представление текущей недели (с разбивкой на страницы: w+1 / w + 2 и т. Д.)
• отображать только доступные часы доктора (скрыть принятые / почасовые)
• вызвать событие из выбора часа

Вот пример того, чего я хотел бы достичь

Какой лучший плагин может помочь мне в этом? Также у врачей уже есть свои календари. Мне придется синхронизировать их календарь с моим, каков наилучший способ добиться этого? Как я могу хранить всю эту информацию?

Не стесняйтесь задавать мне вопросы

Заранее спасибо

Answer 1

Я добился успеха с пакетом npm-подборщика встреч (https://www.npmjs.com/package/appointment-picker), это очень легкий вес.

Answer 2

Пример, который вы связали, использует React. Если вы хотите пойти по пути React, не создавая и не создавая индивидуальное решение, тогда вы можете попробовать React Big Scheduler .

Вот демоверсия .

Это вдохновлено FullCalendar. Имейте в виду, что FullCalendar оплачивается в зависимости от вашего использования .