🚚 Field Service Dispatch

Assign jobs to technicians with drag & drop, enforce SLA windows, and prevent conflicts. Plan by week or month, then drill into day view for precise timing.

Initialize

    let schedulerApi: FullSchedulerApi

const options: FullSchedulerOptions = {
  theme: 'light',
  height: 640,
  startDate: new Date(),
  endDate: new Date(new Date().setDate(new Date().getDate() + 6)),
  startHour: 6,
  endHour: 20,
  draggableEvents: true,
  resizableEvents: true,
  showCursorTime: true,
  onFullSchedulerApiReady(api) {
    schedulerApi = api
    api.setEvents(seedJobsForThisWeek())
  },
}

  

Guardrails on drop

    function validateDispatchRules(e: FullSchedulerEvent, start: Date, end: Date) {
  return withinTechHours(e, start, end) && noOverlap(e, start, end) && respectsSLA(e, start, end)
}

options.onEventDropped = (d: FullSchedulerDrop) => {
  validateDispatchRules(d.event, d.newStartDateTime, d.newEndDateTime)
    ? d.accept()
    : d.decline()
}

  

Conflict badges (renderer)

Show quick state in your renderer/template using event.data flags (e.g., conflict, sla).

Useful API

• api.configureEventsByParam(‘id’, id, { start, end }) after backend confirms

• api.setDateRange(start, end) to jump week/month

• api.setTimeRange(6, 20) focus on work hours