JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 4
  • Score
    100M100P100Q51576F
  • License MIT

A vue component to allow work day scheduling and appointment booking

Package Exports

  • eos_vue_workday
  • eos_vue_workday/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (eos_vue_workday) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

eos_vue_workday

A Vue component to display an event scheduling diary

Based on a working day, each working day object will contain its own list of events

  • Allows creation of a schedule for multiple users on each calendar day
  • Allows for for appointments/events to be created only on days with a schedule
  • Allows for custom behaviour in reacting to component events, simply update the workday events array

Main component is the WorkdayContainer This takes 2 props

  1. An workday array
  2. A workday options object

Workday Object

Property Type (description)
id String (schedule/workday id)
start_time String (the start time of the work day)
finish_time String (the end time of the work day)
breaks Array (and array of break start and end times, cellEvents will not be fired during these times, cursor will show not allowed. NB start and end times must match a cell time)
user Object (a user object see below)
events Array (an array of event objects for this day)
other Array (optional, an array of other objects/data which you can add and which will be included in the cellData payload)

User Object

Property Type (description)
id String (user id)
name String

Event Object

Property Type (description)
id String (event id)
user_id String
title String (event title)
description String (a description for the event)
color String (a hex color for the event)
start_time String (a start time and date for the event in the format YYY-MM-DD HH:mm:ss)
end_time String (an end time and date for the event in the same format as start time)

Workday Options Object

Property Type (description)
mode String (either of 'week' or 'day')
five_minute_height Number (the number of pixels to represent 5 minutes on the calendar)
focus_date String (date the calendar will set as the current date)
primary_color String (hex color for the current day)

Events

Event Description
cellClick emitted when an empty cell is clicked, use to book an event
eventClick emitted when an event is clicked, use to update or delete an event
Event Payload
cellClick cellData { index (Number), value ( String 'YYYY-MM-DD HH:mm:ss')}
evnetClick event (an event object)