Overview

Scheduler

Calendar view for activity planning and timeline with metadata-driven binding.

Use Cases

Shift scheduling.
Intervention agenda.
Business event timeline.

Dependencies

Correct date/time fields in metadata.
Scheduler archetype configurations.

md_props_bag: archetypes.scheduler

Snippet 1JSON

{
  "archetypes": {
    "scheduler": {
      "advancedFilter": false,
      "fromField": "start_at",
      "toField": "end_at",
      "titleField": "title",

advancedFilter: when true, shows the wuic-filter-bar for the scheduler archetype (at data-repeater level).
fromField: event start date/time field.
toField: event end date/time field.
titleField: event title text field.
itemTemplateString: custom event block template.
titleFunction: JS callback to compose a dynamic title.

Template Context (`itemTemplateString`)

The following inputs are available in the custom template:

record: alias of the current event record.
rowData: alias of the current event record.
metaInfo: datasource table/column metadata.
datasource: reference to the associated datasource component.

Runtime context used by the framework:

Snippet 2ts

inputs: { record: item, rowData: item, metaInfo: metaInfo, datasource: datasource }

Events and Subscriptions (Host)

Events available on wuic-scheduler-list:

onSchedulerDateClick: full-calendar dateClick relay.
onSchedulerEventClick: full-calendar eventClick relay.
onSchedulerEventDrop: full-calendar eventDrop relay.
onSchedulerEventResize: full-calendar eventResize relay.
onSchedulerDatesSet: full-calendar datesSet relay.
onSchedulerDataBound: emitted when the wrapper completes event binding from the datasource.
onSchedulerEventSync: emitted after successful sync on event drag/drop/resize.

Template example:

Snippet 3HTML

<wuic-scheduler-list
  [hardcodedDatasource]="citiesDs"
  (onSchedulerDateClick)="handleDateClick($event)"
  (onSchedulerEventClick)="handleEventClick($event)"
  (onSchedulerEventDrop)="handleEventDrop($event)"
  (onSchedulerEventResize)="handleEventResize($event)"
  (onSchedulerDatesSet)="handleDatesSet($event)"

Subscribe example (ViewChild):

Snippet 4ts

@ViewChild(SchedulerListComponent) scheduler?: SchedulerListComponent;
private readonly subs = new Subscription();

ngAfterViewInit(): void {
  if (!this.scheduler) return;
  this.subs.add(this.scheduler.onSchedulerDateClick.subscribe((e) => console.log(e)));
  this.subs.add(this.scheduler.onSchedulerEventClick.subscribe((e) => console.log(e)));

Import and mount (Angular component)

Import LazySchedulerListComponent from 'wuic-framework-lib' and mount it with the framework DataSource:

Snippet 5ts

import { DataSourceComponent, LazySchedulerListComponent } from 'wuic-framework-lib';

@Component({
  selector: 'app-esempio',
  imports: [DataSourceComponent, LazySchedulerListComponent],
  template: `
    <wuic-data-source #ds [hardcodedRoute]="'<route>'" [autoload]="true"></wuic-data-source>

EXACT names (wuic-framework-lib barrel): class LazySchedulerListComponent, selector <wuic-scheduler-list-lazy>. Import that class, not invented variants (e.g. a Lazy prefix where there is none, or vice versa) → otherwise the build fails with has no exported member.

Metadata-driven config: the tag accepts ONLY the standard inputs [hardcodedRoute], [hardcodedDatasource], [autoload], [hideToolbar]. Widget-specific configuration (here: the event start/end date fields) is NOT an HTML input ([groupField], [type], … give NG8002 not a known property) → it goes in the metadata (md_props_bag/archetype) or in-code via metaInfo.