Hi,
I am currently searching for some new UI components for my new aurelia project and found the nice looking one's here. I was trying around a bit with the schedule control and it worked very nice until I tried to add resources. Unfortunately the resources are not displayed. Find the code of my template and viewmodel below. Am I missing something or doing something wrong?
Thank you for some advice.
schedule.html
<template>
<div>
<ej-schedule id="Schedule1" e-width="100%" e-height="575px" e-show-appointment-navigator="false" e-orientation="horizontal"
e-show-all-day-row="false" e-show-current-time-indicator="false" e-resources.bind="ResourceList" e-views.bind="AvailableViews"
e-time-scale.bind="TimeScale" e-show-next-prev-month="false" e-current-view.bind="CurrentView" e-render-dates.bind="RenderDates"
e-appointment-settings.bind="AppointmentList" e-current-date.bind="CurrentDate">
</ej-schedule>
</div>
</template>
schedule.js
export class DefaultSchedule {
constructor() {
this.Orientation = "horizontal";
this.AvailableViews = ["Month", "CustomView", "Agenda"];
this.CurrentView = "CustomView";
this.RenderDates = {
start: new Date(2017, 1, 7),
end: new Date(2017, 2, 14)
};
this.TimeScale = {
enable: false
};
this.CurrentDate = new Date(2017, 1, 14);
var appointmentData = [
{
Id: 100,
Subject: "Mr. & Mrs. Schmidt",
StartTime: "2017/2/15 14:00:00",
EndTime: "2017/2/18 10:00:00",
roomId: 5
}, {
Id: 101,
Subject: "Mr. & Mrs. Smiso",
StartTime: "2017/2/16 14:00:00",
EndTime: "2017/2/19 10:00:00",
roomId: 3
}, {
Id: 102,
Subject: "Mr. & Mrs. Smith",
StartTime: "2017/2/11 14:00:00",
EndTime: "2017/2/18 10:00:00",
roomId: 1
}];
this.AppointmentList = {
// Schedule appointment dataSource
dataSource: appointmentData,
// Schedule dataSource field mapping
id: "Id",
subject: "Subject",
startTime: "StartTime",
endTime: "EndTime",
resourceFields: "roomId"
};
var resourceData = [
{
roomName: "R100",
id: 1,
etage: 1
}, {
roomName: "R101",
id: 2,
etage: 1
}, {
roomName: "R102",
id: 3,
etage: 1
}, {
roomName: "R200",
id: 4,
etage: 2
}, {
roomName: "R201",
id: 5,
etage: 2
}, {
roomName: "R202",
id: 6,
etage: 2
}, {
roomName: "R203",
id: 7,
etage: 2
}];
this.ResourceList = [{
resourceSettings: {
text: "roomName",
id: "id",
dataSource: resourceData
},
field: "roomId",
title: "Room(s)",
name: "rooms",
allowMultiple: false
}];
}
}
