@progress/kendo-angular-scheduler
Version:
Kendo UI Scheduler Angular - Outlook or Google-style angular scheduler calendar. Full-featured and customizable embedded scheduling from the creator developers trust for professional UI components.
120 lines (119 loc) • 5.52 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { Directive, Input } from "@angular/core";
import { SchedulerComponent } from '../scheduler.component';
import { EditingDirectiveBase } from './editing-directive-base';
import { LocalDataChangesService } from '../editing/local-data-changes.service';
import { markAllAsTouched } from './utils';
import { DialogsService } from '../editing/dialogs.service';
import { CrudOperation } from '../types';
import { EditMode } from '../types/edit-mode.enum';
import { EditEvent } from '../events';
import { filter } from 'rxjs/operators';
import { FocusService } from "../navigation";
import * as i0 from "@angular/core";
import * as i1 from "../scheduler.component";
import * as i2 from "../editing/local-data-changes.service";
import * as i3 from "../editing/dialogs.service";
import * as i4 from "../navigation";
/**
* A directive which encapsulates the editing operations when the Scheduler
* uses the [Reactive Angular Forms](link:site.data.urls.angular['reactiveforms']) ([see example](slug:editing_directives_scheduler)).
*/
export class ReactiveEditingDirective extends EditingDirectiveBase {
scheduler;
localDataChangesService;
dialogsService;
/**
* The function that creates the `FormGroup` for the edited model.
*/
createFormGroup;
constructor(scheduler, localDataChangesService, dialogsService, focusService) {
super(scheduler, localDataChangesService, dialogsService, focusService);
this.scheduler = scheduler;
this.localDataChangesService = localDataChangesService;
this.dialogsService = dialogsService;
}
ngOnInit() {
super.ngOnInit();
this.subscriptions.add(this.scheduler.eventDblClick.subscribe(this.editHandler.bind(this)));
this.subscriptions.add(this.scheduler.save.subscribe(this.saveHandler.bind(this)));
}
editHandler(args) {
if (!this.isEnabled('edit')) {
return;
}
const editArgs = new EditEvent(this.scheduler, { dataItem: args.event.dataItem, event: args.event });
this.edit.emit(editArgs);
if (editArgs.isDefaultPrevented()) {
return;
}
let dataItem = args.event.dataItem;
if (this.editService.isRecurring(dataItem)) {
this.dialogsService.openRecurringConfirmationDialog(CrudOperation.Edit)
.pipe(filter(mode => mode !== undefined))
.subscribe((mode) => {
if (mode === EditMode.Series) {
dataItem = this.editService.findRecurrenceMaster(dataItem);
}
const group = this.createModel({
action: 'edit',
isNew: false,
mode,
dataItem,
sender: this.scheduler,
});
this.scheduler.editEvent(dataItem, { group, mode });
});
}
else {
const group = this.createModel({
action: 'edit',
isNew: false,
mode: EditMode.Event,
dataItem,
sender: this.scheduler,
});
this.scheduler.editEvent(dataItem, { group });
}
}
saveHandler(args) {
if (this.isFormValid(args)) {
const formValue = args.formGroup.getRawValue();
if (args.isNew) {
this.editService.create(formValue);
}
else {
this.handleUpdate(args.dataItem, formValue, args.mode);
}
}
this.closeEditor();
}
createModel(args) {
return this.createFormGroup(args);
}
isFormValid({ formGroup, isNew }) {
if (formGroup.valid) {
return true;
}
if (!formGroup.dirty && !isNew) {
return false;
}
markAllAsTouched(formGroup);
return false;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ReactiveEditingDirective, deps: [{ token: i1.SchedulerComponent }, { token: i2.LocalDataChangesService }, { token: i3.DialogsService }, { token: i4.FocusService }], target: i0.ɵɵFactoryTarget.Directive });
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: ReactiveEditingDirective, isStandalone: true, selector: "[kendoSchedulerReactiveEditing]", inputs: { createFormGroup: ["kendoSchedulerReactiveEditing", "createFormGroup"] }, usesInheritance: true, ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ReactiveEditingDirective, decorators: [{
type: Directive,
args: [{
selector: '[kendoSchedulerReactiveEditing]',
standalone: true
}]
}], ctorParameters: function () { return [{ type: i1.SchedulerComponent }, { type: i2.LocalDataChangesService }, { type: i3.DialogsService }, { type: i4.FocusService }]; }, propDecorators: { createFormGroup: [{
type: Input,
args: ['kendoSchedulerReactiveEditing']
}] } });