0

アプリケーションでfullcalendarスケジューラを使用していangular2ます。

「ディレクティブ」として、ここからスケジューラをラップするためにprimengアプローチを使用します。

日ビューでは、リソースを縦に、時間を横に表示できます。これで問題ありません。 デイビュー

weekViewに切り替えると、リソースを同じ方法 (垂直方向) および曜日(水平方向) で表示する必要があります。実際には、時間(垂直方向) と曜日(水平方向) があります。

ここに画像の説明を入力 誰かがそれを実現する方法を教えてくれませんか。(WeekView の場合、リソースを垂直方向に表示し、weekDays を水平方向に表示します)。

ありがとう。

コード スニペット:

成分:

export class SchedulerComponent implements OnInit {

    events: any;
    resources: any;
    header: any;

    resourceText: string;
    eventBgColor: string;

    height: number;
    contentHeight: number;
    resourceAreaWidth: number; 
    eventStartEditable: boolean;
    eventDurationEditable: boolean;
    dragRevertDuration: boolean;
    defaultView: string;

    ngOnInit() {
        this.initResources();
        this.initEvents();
        this.initOptions();
    }

    initOptions() {
        this.header = {
            left: 'today prev,next',
            center: 'title',
            right: 'timelineDay,agendaWeek,month'                
        };

        this.resourceText = 'Rooms';
        this.resourceAreaWidth = 250;

        this.eventBgColor = 'DeepSkyBlue';

        this.height = 25 * this.resources.length;
        this.contentHeight = 25 * this.resources.length + 290;
        this.eventStartEditable = true;
        this.eventDurationEditable = true;
        this.dragRevertDuration = false;
        this.defaultView = "timelineDay";
    }
}

HTML テンプレート:

<schedule [header]="header"
           [resources]="resources"
           [events]="events"
           [resourceLabelText]="resourceText"
           [eventBackgroundColor]="eventBgColor"

           [contentHeight]="contentHeight"
           [resourceAreaWidth]="resourceAreaWidth"
           [eventStartEditable]="eventStartEditable"
           [eventDurationEditable]="eventDurationEditable"
           [dragRevertDuration]="dragRevertDuration"
           [defaultView]="defaultView"

          >
4

2 に答える 2