@syncfusion/ej2-schedule 19.3.55 → 19.4.42

package/src/schedule/actions/resize.js

@@ -81,9 +81,9 @@ var Resize = /** @class */ (function (_super) {
                 bottom: resizeTarget.classList.contains(cls.BOTTOM_RESIZE_HANDLER)
             };
             _this.actionObj.groupIndex = _this.parent.uiStateValues.isGroupAdaptive ? _this.parent.uiStateValues.groupIndex : 0;
-            var workCell = _this.parent.element.querySelector('.' + cls.WORK_CELLS_CLASS);
-            _this.actionObj.cellWidth = workCell.offsetWidth;
-            _this.actionObj.cellHeight = workCell.offsetHeight;
+            var workCell = _this.parent.element.querySelector('.' + cls.WORK_CELLS_CLASS).getBoundingClientRect();
+            _this.actionObj.cellWidth = workCell.width;
+            _this.actionObj.cellHeight = workCell.height;
             var hRows = _this.parent.activeViewOptions.headerRows.map(function (row) { return row.option; });
             if (_this.parent.activeView.isTimelineView() && hRows.length > 0 && ['Date', 'Hour'].indexOf(hRows.slice(-1)[0]) < 0) {
                 var tr = _this.parent.getContentTable().querySelector('tr');
@@ -93,8 +93,9 @@ var Resize = /** @class */ (function (_super) {
                     var td = tdCollections_1[_i];
                     noOfDays += parseInt(td.getAttribute('colspan'), 10);
                 }
-                _this.actionObj.cellWidth = tr.offsetWidth / noOfDays;
-                _this.actionObj.cellHeight = tr.offsetHeight;
+                var trRect = tr.getBoundingClientRect();
+                _this.actionObj.cellWidth = trRect.width / noOfDays;
+                _this.actionObj.cellHeight = trRect.height;
             }
             var pages = _this.getPageCoordinates(e);
             _this.actionObj.X = pages.pageX;
@@ -345,12 +346,12 @@ var Resize = /** @class */ (function (_super) {
         var eventEnd = new Date(this.actionObj.event[this.parent.eventFields.endTime].getTime());
         var resizeTime;
         var isDateHeader = false;
+        var headerName = this.parent.currentView;
         var isTimeViews = ['TimelineDay', 'TimelineWeek', 'TimelineWorkWeek'].indexOf(this.parent.currentView) > -1;
         var isTimelineMonth = this.parent.currentView === 'TimelineMonth';
         var isWithoutScale = isTimelineMonth || isTimeViews && !this.parent.activeViewOptions.timeScale.enable;
         if (this.parent.activeView.isTimelineView()) {
             var tr = this.parent.getContentTable().querySelector('tr');
-            var headerName = this.parent.currentView;
             if (this.parent.activeViewOptions.headerRows.length > 0) {
                 var rows = this.parent.activeViewOptions.headerRows.map(function (row) { return row.option; });
                 headerName = rows.slice(-1)[0];
@@ -362,6 +363,11 @@ var Resize = /** @class */ (function (_super) {
             var cellIndex = 0;
             var tdCollections = [].slice.call(tr.children);
             var isLastCell = false;
+            var pixelsPerMinute = this.actionObj.cellWidth / (this.parent.activeViewOptions.timeScale.interval /
+                this.parent.activeViewOptions.timeScale.slotCount);
+            var offset = parseFloat(this.parent.enableRtl ? this.actionObj.clone.style.right :
+                this.actionObj.clone.style.left);
+            offset = Math.round(offset / pixelsPerMinute) * pixelsPerMinute;
             if (['Year', 'Month', 'Week', 'Date'].indexOf(headerName) !== -1) {
                 var noOfDays = 0;
                 for (var _i = 0, tdCollections_2 = tdCollections; _i < tdCollections_2.length; _i++) {
@@ -370,28 +376,28 @@ var Resize = /** @class */ (function (_super) {
                 }
                 var offsetValue = this.parent.enableRtl ? parseInt(this.actionObj.clone.style.right, 10) :
                     parseInt(this.actionObj.clone.style.left, 10);
+                offsetValue = Math.round(offsetValue / this.actionObj.cellWidth) * this.actionObj.cellWidth;
                 if (!isLeft) {
-                    offsetValue += (this.actionObj.clone.offsetWidth - this.actionObj.cellWidth);
+                    offsetValue += (this.actionObj.clone.getBoundingClientRect().width - this.actionObj.cellWidth);
                 }
-                cellIndex = Math.floor(offsetValue / Math.floor(tr.offsetWidth / noOfDays));
+                cellIndex = Math.floor(offsetValue / Math.floor(tr.getBoundingClientRect().width / noOfDays));
                 isDateHeader = isTimeViews && headerName === 'Date';
-                cellIndex = isLeft ? cellIndex : (isTimelineMonth || isDateHeader) ? cellIndex + 1 : cellIndex;
+                cellIndex = isLeft ? cellIndex : isTimelineMonth ? cellIndex + 1 : cellIndex;
                 isLastCell = cellIndex === tdCollections.length;
                 cellIndex = (cellIndex < 0) ? 0 : (cellIndex >= noOfDays) ? noOfDays - 1 : cellIndex;
             }
             else {
                 var cellWidth = this.actionObj.cellWidth;
-                cellIndex = isLeft ? Math.floor(this.actionObj.clone.offsetLeft / this.actionObj.cellWidth) :
-                    Math.ceil((this.actionObj.clone.offsetLeft + (this.actionObj.clone.offsetWidth - cellWidth)) /
-                        this.actionObj.cellWidth);
+                cellIndex = isLeft ? Math.floor(offset / this.actionObj.cellWidth) :
+                    Math.ceil((offset + (this.actionObj.clone.getBoundingClientRect().width - cellWidth)) / this.actionObj.cellWidth);
                 if (this.parent.enableRtl) {
                     var cellOffsetWidth = 0;
                     if (headerName === 'TimelineMonth' || (!this.parent.activeViewOptions.timeScale.enable &&
                         !isTimelineMonth)) {
                         cellOffsetWidth = this.actionObj.cellWidth;
                     }
-                    var offsetWidth = (Math.floor(parseInt(this.actionObj.clone.style.right, 10) / this.actionObj.cellWidth) *
-                        this.actionObj.cellWidth) + (isLeft ? 0 : this.actionObj.clone.offsetWidth - cellOffsetWidth);
+                    var offsetWidth = (Math.floor(offset / this.actionObj.cellWidth) *
+                        this.actionObj.cellWidth) + (isLeft ? 0 : this.actionObj.clone.getBoundingClientRect().width - cellOffsetWidth);
                     cellIndex = Math.floor(offsetWidth / this.actionObj.cellWidth);
                 }
                 isLastCell = cellIndex === tdCollections.length;
@@ -409,13 +415,11 @@ var Resize = /** @class */ (function (_super) {
                 resizeTime = new Date(resizeDate.setHours(resizeTime.getHours(), resizeTime.getMinutes(), resizeTime.getSeconds()));
             }
             else {
-                var offsetValue = this.parent.enableRtl ? parseFloat(this.actionObj.clone.style.right) :
-                    parseFloat(this.actionObj.clone.style.left);
                 if (!isLeft) {
-                    offsetValue += this.actionObj.clone.offsetWidth;
+                    offset += this.actionObj.clone.getBoundingClientRect().width;
                 }
                 var spanMinutes = Math.ceil((this.actionObj.slotInterval / this.actionObj.cellWidth) *
-                    (offsetValue - Math.floor(offsetValue / this.actionObj.cellWidth) * this.actionObj.cellWidth));
+                    (offset - Math.floor(offset / this.actionObj.cellWidth) * this.actionObj.cellWidth));
                 spanMinutes = (isLastCell || (!isLeft && spanMinutes === 0)) ? this.actionObj.slotInterval : spanMinutes;
                 resizeTime = new Date(resizeDate.getTime());
                 resizeTime.setMinutes(resizeTime.getMinutes() + spanMinutes);
@@ -424,9 +428,10 @@ var Resize = /** @class */ (function (_super) {
         }
         else {
             var cloneIndex = closest(this.actionObj.clone, 'td').cellIndex;
-            var originalWidth = Math.ceil((isLeft ? this.actionObj.element.offsetWidth : 0) / this.actionObj.cellWidth) *
-                this.actionObj.cellWidth;
-            var noOfDays = Math.ceil((this.actionObj.clone.offsetWidth - originalWidth) / this.actionObj.cellWidth);
+            var originalWidth = Math.ceil((isLeft ? this.actionObj.element.getBoundingClientRect().width : 0) /
+                this.actionObj.cellWidth) * this.actionObj.cellWidth;
+            var noOfDays = Math.ceil((this.actionObj.clone.getBoundingClientRect().width - originalWidth) /
+                this.actionObj.cellWidth);
             var tr = closest(this.actionObj.clone, 'tr');
             var dayIndex = isLeft ? cloneIndex - noOfDays : cloneIndex + noOfDays - 1;
             dayIndex = this.getIndex(dayIndex);
@@ -446,8 +451,8 @@ var Resize = /** @class */ (function (_super) {
         }
         else {
             var isTimeScaleViews = isTimeViews && this.parent.activeViewOptions.timeScale.enable;
-            var resizeEnd = ((!isTimeScaleViews || isDateHeader) && resizeTime.getHours() === 0 && resizeTime.getMinutes() === 0) ?
-                util.addDays(resizeTime, 1) : resizeTime;
+            var resizeEnd = ((!isTimeScaleViews || isDateHeader || isTimeViews && ['Week', 'Month', 'Year'].indexOf(headerName) > -1)
+                && resizeTime.getHours() === 0 && resizeTime.getMinutes() === 0) ? util.addDays(resizeTime, 1) : resizeTime;
             if (isWithoutScale && (resizeEnd.getTime() - eventStart.getTime()) <= 0) {
                 resizeEnd = util.addDays(util.resetTime(eventStart), 1);
             }
@@ -484,29 +489,30 @@ var Resize = /** @class */ (function (_super) {
         var slotInterval = (this.actionObj.cellWidth / this.actionObj.slotInterval) * this.actionObj.interval;
         var pageWidth = isLeft ? (this.actionObj.X - this.actionObj.pageX) : (this.actionObj.pageX - this.actionObj.X);
         var targetWidth = isTimelineView ?
-            (this.actionObj.element.offsetWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth :
-            this.parent.currentView === 'Month' ? this.actionObj.element.offsetWidth :
-                Math.ceil(this.actionObj.element.offsetWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth;
+            (this.actionObj.element.getBoundingClientRect().width / this.actionObj.cellWidth) * this.actionObj.cellWidth :
+            this.parent.currentView === 'Month' ? this.actionObj.element.getBoundingClientRect().width :
+                Math.ceil(this.actionObj.element.getBoundingClientRect().width / this.actionObj.cellWidth) * this.actionObj.cellWidth;
         var offsetWidth = targetWidth + (Math.ceil(pageWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth);
+        var left = (this.parent.enableRtl) ? parseInt(this.actionObj.element.style.right, 10) : this.actionObj.clone.offsetLeft;
         if (isTimeViews) {
-            offsetWidth = targetWidth + (isLeft ? (Math.ceil(pageWidth / slotInterval) * slotInterval) :
-                (Math.floor(pageWidth / slotInterval) * slotInterval));
+            offsetWidth = targetWidth + (Math.ceil(pageWidth / slotInterval) * slotInterval);
+            offsetWidth = (Math.round((left + offsetWidth) / slotInterval) * slotInterval) - left;
             this.actionObj.event[this.parent.eventFields.isAllDay] = false;
         }
         var width = !isLeft && ((offsetWidth + this.actionObj.clone.offsetLeft > this.scrollArgs.width)) ?
-            this.actionObj.clone.offsetWidth : (offsetWidth < this.actionObj.cellWidth) ? offsetWidth : offsetWidth;
+            this.actionObj.clone.getBoundingClientRect().width : (offsetWidth < this.actionObj.cellWidth) ? offsetWidth : offsetWidth;
         if (this.parent.enableRtl) {
             var rightValue = isTimelineView ? parseInt(this.actionObj.element.style.right, 10) :
                 -(offsetWidth - this.actionObj.cellWidth);
             rightValue = isTimelineView ? rightValue : isLeft ? 0 : rightValue > 0 ? 0 : rightValue;
             if (isTimelineView && !isLeft) {
-                rightValue = Math.ceil((this.actionObj.element.offsetLeft + (this.actionObj.element.offsetWidth +
+                rightValue = Math.ceil((this.actionObj.element.offsetLeft + (this.actionObj.element.getBoundingClientRect().width +
                     (this.actionObj.pageX - this.actionObj.X))) / slotInterval) * slotInterval;
                 rightValue = rightValue < 0 ? Math.abs(rightValue) : -rightValue;
             }
             rightValue = rightValue >= this.scrollArgs.width ? this.scrollArgs.width - this.actionObj.cellWidth : rightValue;
             styles.right = formatUnit(rightValue);
-            width = width + rightValue > this.scrollArgs.width ? this.actionObj.clone.offsetWidth : width;
+            width = width + rightValue > this.scrollArgs.width ? this.actionObj.clone.getBoundingClientRect().width : width;
         }
         else {
             var offsetLeft = isLeft ? this.actionObj.element.offsetLeft - (this.actionObj.X - this.actionObj.pageX) :
@@ -514,12 +520,12 @@ var Resize = /** @class */ (function (_super) {
             if (isTimelineView) {
                 offsetLeft = isLeft ? offsetLeft : parseInt(this.actionObj.clone.style.left, 10);
                 if (this.parent.enableRtl) {
-                    offsetLeft = !isLeft ? (this.actionObj.pageX < this.actionObj.X - this.actionObj.clone.offsetWidth) ?
-                        parseInt(this.actionObj.clone.style.right, 10) : offsetLeft : offsetLeft;
+                    offsetLeft = !isLeft ? (this.actionObj.pageX < this.actionObj.X - this.actionObj.clone.getBoundingClientRect().width)
+                        ? parseInt(this.actionObj.clone.style.right, 10) : offsetLeft : offsetLeft;
                 }
                 else {
-                    offsetLeft = isLeft ? (this.actionObj.pageX > this.actionObj.X + this.actionObj.clone.offsetWidth &&
-                        this.actionObj.clone.offsetWidth === this.actionObj.cellWidth) ?
+                    offsetLeft = isLeft ? (this.actionObj.pageX > this.actionObj.X + this.actionObj.clone.getBoundingClientRect().width &&
+                        this.actionObj.clone.getBoundingClientRect().width === this.actionObj.cellWidth) ?
                         parseInt(this.actionObj.clone.style.left, 10) : offsetLeft : offsetLeft;
                 }
             }
@@ -529,9 +535,10 @@ var Resize = /** @class */ (function (_super) {
                 Math.ceil(Math.abs(offsetLeft) / this.actionObj.cellWidth) * this.actionObj.cellWidth;
             if (offsetLeft < 0) {
                 offsetLeft = 0;
-                width = this.actionObj.clone.offsetWidth;
+                width = this.actionObj.clone.getBoundingClientRect().width;
             }
-            var cloneWidth = Math.ceil(this.actionObj.clone.offsetWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth;
+            var cloneWidth = Math.ceil(this.actionObj.clone.getBoundingClientRect().width / this.actionObj.cellWidth) *
+                this.actionObj.cellWidth;
             if (isLeft) {
                 styles.left = formatUnit(isTimelineView ? offsetLeft : isLeft ? leftValue < 0 ? -offsetLeft :
                     (Math.ceil((targetWidth - cloneWidth) / this.actionObj.cellWidth) * this.actionObj.cellWidth) : offsetLeft);

package/src/schedule/base/css-constant.d.ts

@@ -44,6 +44,12 @@ export declare const DATE_HEADER_CONTAINER_CLASS: string;
 /** @private */
 export declare const HEADER_CELLS_CLASS: string;
 /** @private */
+export declare const HEADER_WEEK_CELLS_CLASS: string;
+/** @private */
+export declare const HEADER_MONTH_CELLS_CLASS: string;
+/** @private */
+export declare const HEADER_YEAR_CELLS_CLASS: string;
+/** @private */
 export declare const WORKDAY_CLASS: string;
 /** @private */
 export declare const OTHERMONTH_CLASS: string;

package/src/schedule/base/css-constant.js

@@ -44,6 +44,12 @@ export var DATE_HEADER_CONTAINER_CLASS = 'e-date-header-container';
 /** @private */
 export var HEADER_CELLS_CLASS = 'e-header-cells';
 /** @private */
+export var HEADER_WEEK_CELLS_CLASS = 'e-header-week-cell';
+/** @private */
+export var HEADER_MONTH_CELLS_CLASS = 'e-header-month-cell';
+/** @private */
+export var HEADER_YEAR_CELLS_CLASS = 'e-header-year-cell';
+/** @private */
 export var WORKDAY_CLASS = 'e-work-days';
 /** @private */
 export var OTHERMONTH_CLASS = 'e-other-month';

package/src/schedule/base/interface.d.ts

@@ -272,6 +272,8 @@ export interface ExportOptions {
     exportType?: ExcelFormat;
     /** The custom or specific field collection of event dataSource to be exported can be provided through fields option. */
     fields?: string[];
+    /** Specifies the collection of field name and its header text to export to excel. If this list is empty, the scheduler exports based on fields. If both fieldsInfo and fields are empty then the scheduler exported all the fields. */
+    fieldsInfo?: ExportFieldInfo[];
     /** The custom data collection can be exported by passing them through the customData option. */
     customData?: Record<string, any>[];
     /** There also exists option to export each individual instances of the recurring events to an Excel file,
@@ -280,6 +282,13 @@ export interface ExportOptions {
      */
     includeOccurrences?: boolean;
 }
+/** An interface that holds the field name and its header text to export to excel. */
+export interface ExportFieldInfo {
+    /** Defines the header display text. */
+    text: string;
+    /** Defines the field name to export. */
+    name: string;
+}
 /** An interface that holds the details of a resource. */
 export interface ResourceDetails {
     /** Returns the resource model data such as the field mapping options used within it. */
@@ -374,6 +383,8 @@ export interface IRenderer {
     isCurrentDate(date: Date): boolean;
     startDate(): Date;
     endDate(): Date;
+    getStartDate?(): Date;
+    getEndDate?(): Date;
     scrollToHour?(hour: string, scrollDate?: Date): void;
     scrollToDate?(scrollDate?: Date): void;
     highlightCurrentTime?(): void;
@@ -474,6 +485,7 @@ export interface UIStateArgs {
     groupIndex?: number;
     action?: boolean;
     isBlock?: boolean;
+    isCustomMonth?: boolean;
 }
 /**
  *  @private

package/src/schedule/base/resource.js

@@ -340,6 +340,7 @@ var ResourceBase = /** @class */ (function () {
             targetType: 'relative',
             actionOnScroll: 'none',
             content: this.treeViewObj.element,
+            relateTo: this.parent.element.querySelector('.' + cls.TABLE_CONTAINER_CLASS),
             enableRtl: this.parent.enableRtl,
             hideAnimation: { name: 'SlideLeftOut', duration: 500 },
             showAnimation: { name: 'SlideLeftIn', duration: 500 },