使用 Vuetify 可视化 DaySpan 日历和时间表的组件集合.zip

# Documentation Greetings! You've stumbled upon the documentation. These docs are in need of dire help, so if you're looking to contribute to this library this would be a wonderful start. The components documented are linked below and the undocumented components are plain text. Documenting components is as easy as looking at the code found [here](../src/components). ### Glossary - [Components](#components) - [Events](#events) - [Slots](#slots) ## Components - ds-gestures - ds-day - ds-day-row - ds-days-view - ds-day-times - ds-day-picker - ds-agenda - ds-agenda-day - ds-agenda-event - ds-calendar - ds-calendar-app - ds-calendar-event - ds-calendar-event-time - ds-calendar-event-chip - ds-calendar-event-popover - ds-calendar-event-placeholder - ds-calendar-event-create-popover - ds-calendar-event-time-placeholder - ds-event - ds-event-dialog - ds-schedule - ds-schedule-span - ds-schedule-type - ds-schedule-time - ds-schedule-times - [ds-schedule-actions](ds-schedule-actions.md) - ds-schedule-forecast - ds-schedule-modifier - ds-schedule-type-custom - ds-schedule-type-custom-dialog - ds-schedule-frequency - ds-schedule-frequency-day - ds-schedule-frequency-week - ds-schedule-frequency-year - ds-schedule-frequency-month - ds-schedule-frequency-day-of-week - ds-weeks-view - ds-week-header - ds-week-day-header - ds-identifier-chip ## Events This library has many layers of components, so you can use them at any level. Events at the lowest level components generated are passed to the parents so you can listen to nearly every event no matter what component you use. This list states the event name, when it is triggered, what event data there is, and which components generate it. For more details on the events, there will be documentation on the components which generate the events. - *event-create*: When the user creates a new event on the calendar - $event: [Event](dayspan.md#event) - components: ds-calendar-app, ds-event, ds-event-dialog, ds-calendar-event-create-popover - *event-update*: When the user updates an existing event on the calendar - $event: [Event](dayspan.md#event) - components: ds-calendar-app, ds-event, ds-event-dialog, ds-schedule-actions - *event-remove*: When the user removes event from the calendar - $event: [Event](dayspan.md#event) - components: ds-calendar-app, ds-event, ds-event-dialog, ds-schedule-actions - *change*: When the calendar type, span, or one of it's events changes. - $event: [Calendar](dayspan.md#calendar) - components: ds-calendar-app - *add*: When the user clicks somewhere indicated they want to add an event on a given day. - $event: [CalendarDay](dayspan.md#calendarday) - components: ds-calendar-app, ds-agenda, ds-agenda-day, ds-day, ds-day-row, ds-weeks-view, ds-week-day-header, ds-days-view - *edit*: When the user wants to edit an event (clicks on the pencil if a popover is available, or just plain clicking on an event when there is no popover). - $event: [CalendarEvent](dayspan.md#calendarevent) - components: ds-calendar-app, ds-agenda, ds-agenda-day, ds-agenda-event, ds-calendar-event, ds-calendar-event-time, ds-day, ds-day-row, ds-weeks-view, ds-day-times, ds-week-day-header, ds-days-view - *create-edit*: When the user edits an un-saved event being added with the create popover. - $event: { type, calendarEvent, calendar, close, details, handled, added, refresh, close, $vm, $element } - components: ds-calendar-event-create-popover - *save*: When the user is editing an event in ds-event and is trying to save. - $event: { type, day, schedule, target, details, targetDetails, calendar, calendarEvent, handled, refresh, create, added, $vm, $element } - components: ds-calendar-app, ds-event, ds-event-dialog - *saved*: When the user has saved an event in ds-event. - $event: { type, day, schedule, target, details, targetDetails, calendar, calendarEvent, handled, refresh, create, added, $vm, $element } - components: ds-calendar-app, ds-event - *update*: When the user updates an existing event in ds-event. - $event: { type, day, schedule, target, details, targetDetails, calendar, calendarEvent, handled, refresh, create, added, $vm, $element } - components: ds-calendar-app, ds-event - *create*: When the user creates a new event in ds-event. - $event: { type, day, schedule, target, details, targetDetails, calendar, calendarEvent, handled, refresh, create, added, $vm, $element } - components: ds-calendar-app, ds-event - *actioned*: When an action has been performed in a calendar event instance or schedule - $event: - components: ds-calendar-app, ds-event, ds-event-dialog - *cancel*: When the user cancels editing or creating an event in ds-event. - $event: { type, day, schedule, target, details, targetDetails, calendar, calendarEvent, handled, refresh, create, added, $vm, $element } - components: ds-calendar-app, ds-event, ds-event-dialog - *open*: When the user requests to open the ds-event-dialog. - $event: { type, day, schedule, calendar, calendarEvent, handled, open, $vm, $element} - components: ds-calendar-app, ds-event-dialog - *close*: When the user requests to close the ds-event-dialog. - $event: { type, day, schedule, calendar, calendarEvent, handled, open, $vm, $element} - components: ds-calendar-app, ds-event-dialog - *view-day*: When the user wants to view the events for a day (clicks on day of month link) - $event [CalendarDay](dayspan.md#calendarday) - components: ds-calendar-app, ds-agenda, ds-agenda-day, ds-agenda-event, ds-day, ds-week-day-header, ds-days-view - *creating*: When the user hit save to create a new event. This can be intercepted and stopped from being created, added to the calendar, or resulting the create popover being closed. - $event: { type, calendarEvent, calendar, close, details, handled, added, refresh, close, $vm, $element } - components: ds-calendar-event-create-popover - *created*: When the user hit save to create a new event and it's been added to the calendar. - $event: { type, calendarEvent, calendar, close, details, handled, added, refresh, close, $vm, $element } - components: ds-calendar-event-create-popover - *adding*: - $event: { placeholder, mouseEvent, } - components: ds-calendar, ds-calendar-app - *added*: - $event: { span, placeholder, mouseEvent, } - components: ds-calendar, ds-calendar-app - *moving*: - $event: { placeholder, calendarEvent, mouseEvent, } - components: ds-calendar, ds-calendar-app - *moved*: - $event: { calendarEvent, target, mouseEvent, movingEvent, } - components: ds-calendar, ds-calendar-app - *remove*: When the "Remove this event" action is executed. - $event: - components: ds-schedule-actions - *exclude*: When the "Remove this occurrence" action is executed. - $event: - components: ds-schedule-actions - *cancel*: When the "Cancel this occurrence" action is executed. - $event: - components: ds-schedule-actions - *uncancel*: When the "Undo cancellation" action is executed. - $event: - components: ds-schedule-actions - *move*: When the "Move this occurrence" action is executed. - $event: - components: ds-schedule-actions - *include*: When the "Add new occurrence" action is executed. - $event: - components: ds-schedule-actions - *finish*: When an action is done being executed. - $event: - components: ds-schedule-actions - *mouse-move-day*: - $event: { type, day, calendar, left, right, handled, $event, $vm, $element } - components: ds-calendar, ds-calendar-app, ds-day, ds-day-row, ds-weeks-view, ds-week-day-header, ds-days-view - *mouse-down-day*: - $event: { type, day, calendar, left, right, handled, $event, $vm, $element } - components: ds-calendar, ds-calendar-app, ds-day, ds-day-row, ds-weeks-view, ds-week-day-header, ds-days-view - *mouse-up-day*: - $event: { type, day, calendar, left, right, handled, $event, $vm, $element } - components: ds-calendar, ds-calendar-app, ds-day, ds-day-row, ds-weeks-view, ds-week-day-header