-import { Component, Input, OnInit, ViewChild } from '@angular/core';
+import { Component, Input, OnInit, AfterViewInit, QueryList, ViewChildren, ViewChild } from '@angular/core';
import { NgbTimeStruct } from '@ng-bootstrap/ng-bootstrap';
import {ComboboxEntry} from '@eg/share/combobox/combobox.component';
import {DateSelectComponent} from '@eg/share/date-select/date-select.component';
+import {DateRangeSelectComponent} from '@eg/share/daterange-select/daterange-select.component';
import {FmRecordEditorComponent} from '@eg/share/fm-editor/fm-editor.component';
import {GridComponent} from '@eg/share/grid/grid.component';
import {GridDataSource, GridRowFlairEntry} from '@eg/share/grid/grid';
import {IdlObject} from '@eg/core/idl.service';
import {PcrudService} from '@eg/core/pcrud.service';
+import {ServerStoreService} from '@eg/core/server-store.service';
import {ToastService} from '@eg/share/toast/toast.service';
import * as Moment from 'moment-timezone';
templateUrl: './create-reservation.component.html'
})
-export class CreateReservationComponent implements OnInit {
+export class CreateReservationComponent implements OnInit, AfterViewInit {
advancedCollapsed = true;
attributes: IdlObject[] = [];
startTime: Moment;
endTime: Moment;
- granularity: 15 | 30 | 60 = 30;
+ granularity: 15 | 30 | 60 | 1440 = 30; // 1440 minutes = 24 hours
scheduleSource: GridDataSource = new GridDataSource();
resources: IdlObject[] = [];
limitByAttr: (attributeId: number, $event: ComboboxEntry) => void;
- @ViewChild('dateLimiter') dateLimiter: DateSelectComponent;
+ setGranularity: () => void;
+ handleMultiDayReservation: () => void;
+ handleSingleDayReservation: () => void;
+ changeGranularity: ($event: ComboboxEntry) => void;
+
+ @ViewChildren('dateLimiter') dateLimiters: QueryList<DateSelectComponent>;
+ @ViewChildren('dateRangeLimiter') dateRangeLimiters: QueryList<DateRangeSelectComponent>;
+ @ViewChildren('scheduleGrid') scheduleGrids: QueryList<GridComponent>;
@ViewChild('newDialog') newDialog: FmRecordEditorComponent;
- @ViewChild('scheduleGrid') scheduleGrid: GridComponent;
constructor(
private pcrud: PcrudService,
+ private store: ServerStoreService,
private toast: ToastService,
) {
this.resourceAvailabilityIcon = (row: any) => {
ngOnInit() {
- this.dateLimiter.initialDate = new Date();
-
this.isBooked = (row: any, col: any) => {
if ((col.name !== 'time') && (row[col.name])) {
console.log('event: ' + JSON.stringify($event));
};
+ this.setGranularity = () => {
+ if (this.multiday) { // multiday reservations always use day granularity
+ this.granularity = 1440;
+ } else {
+ this.store.getItem('eg.booking.create.granularity').then(granularity => {
+ if (granularity != null) { this.granularity = granularity; }
+ });
+ }
+ this.scheduleGrids.forEach((g) => g.reload());
+ };
+
+ this.handleMultiDayReservation = () => {
+ this.multiday = true;
+ this.setGranularity();
+ };
+
+ this.handleSingleDayReservation = () => {
+ this.multiday = false;
+ this.setGranularity();
+ };
+
+ this.changeGranularity = ($event) => {
+ this.granularity = $event.id;
+ this.store.setItem('eg.booking.create.granularity', $event.id);
+ };
+
}
+
+ ngAfterViewInit() {
+ this.dateLimiters.forEach((dl) => dl.initialDate = new Date());
+ this.setGranularity();
+ }
+
showNewDialog(idlThing: IdlObject) {
return this.newDialog.open({size: 'lg'}).then(
ok => {
this.toast.success('Reservation successfully created'); // TODO: needs i18n, pluralization
- this.scheduleGrid.reload();
+ this.scheduleGrids.forEach((g) => g.reload());
},
err => {}
);
r => {
this.resources.push(r);
- this.startTime = Moment(new Date(
- this.dateLimiter.current.year,
- this.dateLimiter.current.month - 1,
- this.dateLimiter.current.day,
- 13, 0, 0), 'Asia/Tokyo');
- this.endTime = Moment(new Date(
- this.dateLimiter.current.year,
- this.dateLimiter.current.month - 1,
- this.dateLimiter.current.day,
- 17, 0, 0), 'Asia/Tokyo');
+ this.dateLimiters.forEach((dl) => {
+ this.startTime = Moment.tz([
+ dl.current.year,
+ dl.current.month - 1,
+ dl.current.day, 9],
+ 'Asia/Tokyo');
+ this.endTime = Moment.tz([
+ dl.current.year,
+ dl.current.month - 1,
+ dl.current.day, 17],
+ 'Asia/Tokyo');
+ });
let currentTime = this.startTime;
while (currentTime < this.endTime) {
const existingRow = this.scheduleSource.data.findIndex((row) => row['time'] === currentTime.format('LT')) ;