@progress/kendo-vue-scheduler 3.8.3 → 3.8.4-dev.202302151437

package/dist/es/views/day/DayViewAllDaySlots.js

@@ -4,6 +4,7 @@ var allVue = Vue;
 var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 var inject = allVue.inject;
+import { COLLECTION_ACTION } from '../../utils/main';
 import { SchedulerEditSlot } from '../../slots/SchedulerEditSlot';
 /** @hidden */
 var DayViewAllDaySlotsVue2 = {
@@ -27,8 +28,50 @@ var DayViewAllDaySlotsVue2 = {
     },
     ks: {
       default: null
+    },
+    setSlots: {
+      default: null
+    }
+  },
+  provide: function provide() {
+    return {
+      ksSlots: this.ksSlots
+    };
+  },
+  data: function data() {
+    var daySlots = this.daySlots;
+    var groupIndex = this.groupIndex !== undefined ? this.groupIndex : this.ri.groupIndex;
+    return {
+      ksSlots: {
+        cSlots: this.calculateRanges(daySlots, groupIndex, this.dayRanges)
+      }
+    };
+  },
+  watch: {
+    currentCellSlots: function currentCellSlots(newValue) {
+      this.ksSlots.cSlots = newValue;
+    }
+  },
+  computed: {
+    currentCellSlots: function currentCellSlots() {
+      var daySlots = this.daySlots;
+      var groupIndex = this.groupIndex !== undefined ? this.groupIndex : this.ri.groupIndex;
+      return this.calculateRanges(daySlots, groupIndex, this.dayRanges);
     }
   },
+  destroyed: !!isV3 ? undefined : function () {
+    this.setSlots({
+      type: COLLECTION_ACTION.remove,
+      item: this
+    });
+  },
+  // @ts-ignore
+  unmounted: function unmounted() {
+    this.setSlots({
+      type: COLLECTION_ACTION.remove,
+      item: this
+    });
+  },
   // @ts-ignore
   setup: !isV3 ? undefined : function () {
     var v3 = !!isV3;
@@ -47,59 +90,47 @@ var DayViewAllDaySlotsVue2 = {
     return h("div", {
       key: groupIndex,
       "class": "k-scheduler-row"
-    }, [this.dayRanges.map(function (_, rangeIndex) {
-      return this.daySlots.filter(function (s) {
-        return s.group.index === groupIndex && s.range.index === rangeIndex;
-      }).map(function (slot, slotIndex, filtered) {
-        return h(SchedulerEditSlot, {
-          index: slot.index,
-          attrs: this.v3 ? undefined : {
-            index: slot.index,
-            start: slot.start,
-            end: slot.end,
-            zonedStart: slot.zonedStart,
-            zonedEnd: slot.zonedEnd,
-            items: slot.items,
-            group: slot.group,
-            range: slot.range,
-            isAllDay: slot.isAllDay,
-            form: this.$props.form,
-            slotRender: this.$props.slotRender,
-            viewSlot: this.$props.viewSlot,
-            row: 0,
-            col: this.ks.orientation === 'horizontal' ? filtered.length * (groupIndex || 0) + slotIndex : slotIndex,
-            isWorkDay: 0 <= slot.zonedStart.getDay() + (numberOfDays - workWeekStart) && (slot.zonedStart.getDay() + (numberOfDays - workWeekStart)) % numberOfDays <= workWeekEnd + (numberOfDays - workWeekStart),
-            expandable: true,
-            editable: this.$props.editable
-          },
-          start: slot.start,
-          end: slot.end,
-          zonedStart: slot.zonedStart,
-          zonedEnd: slot.zonedEnd,
-          items: slot.items,
-          group: slot.group,
-          range: slot.range,
-          isAllDay: slot.isAllDay,
-          onDataaction: this.handleDataAction,
-          on: this.v3 ? undefined : {
-            "dataaction": this.handleDataAction
-          },
+    }, [this.currentCellSlots.map(function (slot, slotIndex, filtered) {
+      return h(SchedulerEditSlot, {
+        index: slotIndex,
+        attrs: this.v3 ? undefined : {
+          index: slotIndex,
           form: this.$props.form,
           slotRender: this.$props.slotRender,
-          viewSlot: this.$props.viewSlot,
-          key: "".concat(slot.start.getTime(), ":").concat(slot.group.index),
+          viewSlot: this.$props.viewSlot
+          //      key={`${slot.start.getTime()}:${slot.group.index}`}
+          ,
           row: 0,
           col: this.ks.orientation === 'horizontal' ? filtered.length * (groupIndex || 0) + slotIndex : slotIndex,
           isWorkDay: 0 <= slot.zonedStart.getDay() + (numberOfDays - workWeekStart) && (slot.zonedStart.getDay() + (numberOfDays - workWeekStart)) % numberOfDays <= workWeekEnd + (numberOfDays - workWeekStart),
           expandable: true,
           editable: this.$props.editable
-        });
-      }, this);
+        },
+        onDataaction: this.handleDataAction,
+        on: this.v3 ? undefined : {
+          "dataaction": this.handleDataAction
+        },
+        form: this.$props.form,
+        slotRender: this.$props.slotRender,
+        viewSlot: this.$props.viewSlot,
+        row: 0,
+        col: this.ks.orientation === 'horizontal' ? filtered.length * (groupIndex || 0) + slotIndex : slotIndex,
+        isWorkDay: 0 <= slot.zonedStart.getDay() + (numberOfDays - workWeekStart) && (slot.zonedStart.getDay() + (numberOfDays - workWeekStart)) % numberOfDays <= workWeekEnd + (numberOfDays - workWeekStart),
+        expandable: true,
+        editable: this.$props.editable
+      });
     }, this)]);
   },
   methods: {
     handleDataAction: function handleDataAction(action) {
       this.$emit('dataaction', action);
+    },
+    calculateRanges: function calculateRanges(daySlots, groupIndex, dayRanges) {
+      return dayRanges.map(function (_, rangeIndex) {
+        return daySlots.filter(function (s) {
+          return s.group.index === groupIndex && s.range.index === rangeIndex;
+        });
+      }).flat();
     }
   }
 };

package/dist/es/views/day/DayViewMiddleRow.js

@@ -4,6 +4,7 @@ var allVue = Vue;
 var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 var inject = allVue.inject;
+import { COLLECTION_ACTION } from '../../utils/main';
 import { classNames } from '@progress/kendo-vue-common';
 import { GRID_OFFSET } from './MultiDayView';
 import { SchedulerEditSlot } from '../../slots/SchedulerEditSlot';
@@ -34,8 +35,52 @@ var DayViewMiddleRowVue2 = {
   inject: {
     ri: {
       default: null
+    },
+    setSlots: {
+      default: null
+    }
+  },
+  provide: function provide() {
+    return {
+      ksSlots: this.ksSlots
+    };
+  },
+  data: function data() {
+    var timeSlots = this.timeSlots;
+    var groupIndex = this.ri.groupIndex;
+    var root = this.root;
+    return {
+      ksSlots: {
+        cSlots: this.calculateRanges(timeSlots, groupIndex, this.timeRanges, root)
+      }
+    };
+  },
+  watch: {
+    currentCellSlots: function currentCellSlots(newValue) {
+      this.ksSlots.cSlots = newValue;
+    }
+  },
+  computed: {
+    currentCellSlots: function currentCellSlots() {
+      var timeSlots = this.timeSlots;
+      var groupIndex = this.ri.groupIndex;
+      var root = this.root;
+      return this.calculateRanges(timeSlots, groupIndex, this.timeRanges, root);
     }
   },
+  destroyed: !!isV3 ? undefined : function () {
+    this.setSlots({
+      type: COLLECTION_ACTION.remove,
+      item: this
+    });
+  },
+  // @ts-ignore
+  unmounted: function unmounted() {
+    this.setSlots({
+      type: COLLECTION_ACTION.remove,
+      item: this
+    });
+  },
   // @ts-ignore
   setup: !isV3 ? undefined : function () {
     var v3 = !!isV3;
@@ -53,60 +98,45 @@ var DayViewMiddleRowVue2 = {
       "class": classNames('k-scheduler-row', {
         'k-middle-row': !((this.rootIndex + 1) % this.slotDivisions === 0)
       })
-    }, [this.timeRanges.map(function (_range, rangeIndex) {
-      var _this = this;
-      return this.timeSlots.filter(function (s) {
-        return s.index === _this.root.index && s.range.index === rangeIndex && s.group.index === _this.ri.groupIndex;
-      }).map(function (slot) {
-        return h(EditSlot, {
-          key: "".concat(slot.start.getTime(), ":").concat(slot.group.index),
-          index: slot.index,
-          attrs: this.v3 ? undefined : {
-            index: slot.index,
-            start: slot.start,
-            end: slot.end,
-            zonedStart: slot.zonedStart,
-            zonedEnd: slot.zonedEnd,
-            items: slot.items,
-            group: slot.group,
-            range: slot.range,
-            isAllDay: slot.isAllDay,
-            slotRender: this.$props.slotRender,
-            viewSlot: this.$props.viewSlot,
-            form: this.$props.form,
-            row: this.rootIndex + GRID_OFFSET,
-            col: this.timeRanges.length * (this.ri.groupIndex || 0) + rangeIndex,
-            isWorkHour: isInTimeRange(slot.zonedStart, that.workDayStart, that.workDayEnd),
-            isWorkDay: 0 <= slot.zonedStart.getDay() + (that.numberOfDays - workWeekStart) && (slot.zonedStart.getDay() + (that.numberOfDays - workWeekStart)) % that.numberOfDays <= that.workWeekEnd + (that.numberOfDays - workWeekStart),
-            editable: that.$props.editable
-          },
-          start: slot.start,
-          end: slot.end,
-          zonedStart: slot.zonedStart,
-          zonedEnd: slot.zonedEnd,
-          items: slot.items,
-          group: slot.group,
-          range: slot.range,
-          isAllDay: slot.isAllDay,
-          onDataaction: this.handleDataAction,
-          on: this.v3 ? undefined : {
-            "dataaction": this.handleDataAction
-          },
+    }, [this.currentCellSlots.map(function (slot, slotIndex) {
+      return h(EditSlot, {
+        index: slotIndex,
+        attrs: this.v3 ? undefined : {
+          index: slotIndex,
           slotRender: this.$props.slotRender,
           viewSlot: this.$props.viewSlot,
           form: this.$props.form,
           row: this.rootIndex + GRID_OFFSET,
-          col: this.timeRanges.length * (this.ri.groupIndex || 0) + rangeIndex,
+          col: this.timeRanges.length * (this.ri.groupIndex || 0) + slot.range.index,
           isWorkHour: isInTimeRange(slot.zonedStart, that.workDayStart, that.workDayEnd),
           isWorkDay: 0 <= slot.zonedStart.getDay() + (that.numberOfDays - workWeekStart) && (slot.zonedStart.getDay() + (that.numberOfDays - workWeekStart)) % that.numberOfDays <= that.workWeekEnd + (that.numberOfDays - workWeekStart),
           editable: that.$props.editable
-        });
-      }, that);
-    }, this)]);
+        },
+        onDataaction: this.handleDataAction,
+        on: this.v3 ? undefined : {
+          "dataaction": this.handleDataAction
+        },
+        slotRender: this.$props.slotRender,
+        viewSlot: this.$props.viewSlot,
+        form: this.$props.form,
+        row: this.rootIndex + GRID_OFFSET,
+        col: this.timeRanges.length * (this.ri.groupIndex || 0) + slot.range.index,
+        isWorkHour: isInTimeRange(slot.zonedStart, that.workDayStart, that.workDayEnd),
+        isWorkDay: 0 <= slot.zonedStart.getDay() + (that.numberOfDays - workWeekStart) && (slot.zonedStart.getDay() + (that.numberOfDays - workWeekStart)) % that.numberOfDays <= that.workWeekEnd + (that.numberOfDays - workWeekStart),
+        editable: that.$props.editable
+      });
+    }, that)]);
   },
   methods: {
     handleDataAction: function handleDataAction(action) {
       this.$emit('dataaction', action);
+    },
+    calculateRanges: function calculateRanges(timeSlots, groupIndex, timeRanges, root) {
+      return timeRanges.map(function (_range, rangeIndex) {
+        return timeSlots.filter(function (s) {
+          return s.index === root.index && s.range.index === rangeIndex && s.group.index === groupIndex;
+        });
+      }).flat();
     }
   }
 };

package/dist/es/views/day/DayViewVerticalRow.js

@@ -3,6 +3,7 @@ import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
+import { COLLECTION_ACTION } from '../../utils/main';
 import { GRID_OFFSET } from './MultiDayView';
 import { SchedulerEditSlot } from '../../slots/SchedulerEditSlot';
 import { DayViewAllDayRowContent } from './DayViewAllDayRowContent';
@@ -19,8 +20,50 @@ var DayViewVerticalRowVue2 = {
   inject: {
     ri: {
       default: null
+    },
+    setSlots: {
+      default: null
+    }
+  },
+  provide: function provide() {
+    return {
+      ksSlots: this.ksSlots
+    };
+  },
+  data: function data() {
+    var daySlots = this.daySlots;
+    var groupIndex = this.ri.groupIndex;
+    return {
+      ksSlots: {
+        cSlots: this.calculateRanges(daySlots, groupIndex, this.dayRanges)
+      }
+    };
+  },
+  watch: {
+    currentCellSlots: function currentCellSlots(newValue) {
+      this.ksSlots.cSlots = newValue;
     }
   },
+  computed: {
+    currentCellSlots: function currentCellSlots() {
+      var daySlots = this.daySlots;
+      var groupIndex = this.ri.groupIndex;
+      return this.calculateRanges(daySlots, groupIndex, this.dayRanges);
+    }
+  },
+  destroyed: !!isV3 ? undefined : function () {
+    this.setSlots({
+      type: COLLECTION_ACTION.remove,
+      item: this
+    });
+  },
+  // @ts-ignore
+  unmounted: function unmounted() {
+    this.setSlots({
+      type: COLLECTION_ACTION.remove,
+      item: this
+    });
+  },
   // @ts-ignore
   setup: !isV3 ? undefined : function () {
     var v3 = !!isV3;
@@ -33,9 +76,7 @@ var DayViewVerticalRowVue2 = {
     var h = gh || createElement;
     var EditSlot = this.$props.editSlot || SchedulerEditSlot;
     var groupIndex = this.ri.groupIndex;
-    var _a = this.$props,
-      timeSlots = _a.timeSlots,
-      daySlots = _a.daySlots;
+    var timeSlots = this.$props.timeSlots;
     return h("div", {
       "class": "k-scheduler-row"
     }, [h(DayViewAllDayRowContent, {
@@ -43,61 +84,47 @@ var DayViewVerticalRowVue2 = {
       attrs: this.v3 ? undefined : {
         groupIndex: groupIndex
       }
-    }), this.dayRanges.map(function (_, rangeIndex) {
+    }), this.currentCellSlots.map(function (_slot, slotIndex) {
       var groupOffset = timeSlots.filter(function (s) {
         return s.group.index === groupIndex && s.range.index === FIRST_INDEX;
       }).length;
-      return daySlots.filter(function (s) {
-        return s.group.index === groupIndex && s.range.index === rangeIndex;
-      }).map(function (slot, slotIndex) {
-        return h(EditSlot, {
+      return h(EditSlot, {
+        slotRender: this.$props.slotRender,
+        attrs: this.v3 ? undefined : {
           slotRender: this.$props.slotRender,
-          attrs: this.v3 ? undefined : {
-            slotRender: this.$props.slotRender,
-            viewSlot: this.$props.viewSlot,
-            form: this.$props.form,
-            index: slot.index,
-            start: slot.start,
-            end: slot.end,
-            zonedStart: slot.zonedStart,
-            zonedEnd: slot.zonedEnd,
-            items: slot.items,
-            group: slot.group,
-            range: slot.range,
-            isAllDay: slot.isAllDay,
-            row: groupOffset * (groupIndex || 0) + (groupIndex || 0) * GRID_OFFSET,
-            col: slotIndex,
-            expandable: true,
-            editable: this.$props.editable
-          },
           viewSlot: this.$props.viewSlot,
           form: this.$props.form,
-          index: slot.index,
-          start: slot.start,
-          end: slot.end,
-          zonedStart: slot.zonedStart,
-          zonedEnd: slot.zonedEnd,
-          items: slot.items,
-          group: slot.group,
-          range: slot.range,
-          isAllDay: slot.isAllDay,
-          onDataaction: this.handleDataAction,
-          on: this.v3 ? undefined : {
-            "dataaction": this.handleDataAction
-          },
-          key: "".concat(slot.start.getTime(), ":").concat(slot.group.index),
-          "class": 'k-scheduler-alldays-slot',
+          index: slotIndex,
           row: groupOffset * (groupIndex || 0) + (groupIndex || 0) * GRID_OFFSET,
           col: slotIndex,
           expandable: true,
           editable: this.$props.editable
-        });
-      }, this);
+        },
+        viewSlot: this.$props.viewSlot,
+        form: this.$props.form,
+        index: slotIndex,
+        onDataaction: this.handleDataAction,
+        on: this.v3 ? undefined : {
+          "dataaction": this.handleDataAction
+        },
+        "class": 'k-scheduler-alldays-slot',
+        row: groupOffset * (groupIndex || 0) + (groupIndex || 0) * GRID_OFFSET,
+        col: slotIndex,
+        expandable: true,
+        editable: this.$props.editable
+      });
     }, this)]);
   },
   methods: {
     handleDataAction: function handleDataAction(action) {
       this.$emit('dataaction', action);
+    },
+    calculateRanges: function calculateRanges(daySlots, groupIndex, dayRanges) {
+      return dayRanges.map(function (_, rangeIndex) {
+        return daySlots.filter(function (s) {
+          return s.group.index === groupIndex && s.range.index === rangeIndex;
+        });
+      }).flat();
     }
   }
 };

package/dist/es/views/day/DayViewVerticalSlotsRow.js

@@ -3,13 +3,13 @@ import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
+import { COLLECTION_ACTION } from '../../utils/main';
 import { GRID_OFFSET } from './MultiDayView';
 import { isInTimeRange, intersects, first, last } from '../../utils/main';
 import { SchedulerEditSlot } from '../../slots/SchedulerEditSlot';
 import { DayViewRowContent } from './DayViewRowContent';
 import { CurrentTimeMarker } from '../../components/CurrentTimeMarker';
 import { CurrentTimeMarkerArrow } from '../../components/CurrentTimeMarkerArrow';
-var FIRST_INDEX = 0;
 /** @hidden */
 var DayViewVerticalSlotsRowVue2 = {
   name: 'KendoDayViewVerticalSlotsRow',
@@ -40,8 +40,53 @@ var DayViewVerticalSlotsRowVue2 = {
   inject: {
     ri: {
       default: null
+    },
+    setSlots: {
+      default: null
+    }
+  },
+  provide: function provide() {
+    return {
+      ksSlots: this.ksSlots
+    };
+  },
+  data: function data() {
+    var timeSlots = this.timeSlots;
+    var root = this.root;
+    var groupIndex = this.groupIndex;
+    var cSlots = this.calculateRanges(timeSlots, groupIndex, this.timeRanges, root);
+    return {
+      ksSlots: {
+        cSlots: cSlots
+      }
+    };
+  },
+  watch: {
+    currentCellSlots: function currentCellSlots(newValue) {
+      this.ksSlots.cSlots = newValue;
     }
   },
+  computed: {
+    currentCellSlots: function currentCellSlots() {
+      var timeSlots = this.timeSlots;
+      var root = this.root;
+      var groupIndex = this.groupIndex;
+      return this.calculateRanges(timeSlots, groupIndex, this.timeRanges, root);
+    }
+  },
+  destroyed: !!isV3 ? undefined : function () {
+    this.setSlots({
+      type: COLLECTION_ACTION.remove,
+      item: this
+    });
+  },
+  // @ts-ignore
+  unmounted: function unmounted() {
+    this.setSlots({
+      type: COLLECTION_ACTION.remove,
+      item: this
+    });
+  },
   // @ts-ignore
   setup: !isV3 ? undefined : function () {
     var v3 = !!isV3;
@@ -56,7 +101,6 @@ var DayViewVerticalSlotsRowVue2 = {
     var groupIndex = this.groupIndex;
     var that = this;
     var _a = this.$props,
-      timeSlots = _a.timeSlots,
       root = _a.root,
       rootIndex = _a.rootIndex,
       slotDivisions = _a.slotDivisions,
@@ -84,55 +128,34 @@ var DayViewVerticalSlotsRowVue2 = {
       isMaster: rootIndex % slotDivisions === 0,
       isLast: (rootIndex + 1) % slotDivisions === 0,
       timeHeaderCell: this.$props.timeHeaderCell
-    }), this.timeRanges.map(function (_, rangeIndex) {
-      return timeSlots.filter(function (s) {
-        return s.index === root.index && s.group.index === groupIndex && s.range.index === rangeIndex;
-      }).map(function (slot) {
-        return h(EditSlot, {
+    }), this.currentCellSlots.map(function (slot, slotIndex) {
+      return h(EditSlot, {
+        slotRender: renderSlot,
+        attrs: this.v3 ? undefined : {
           slotRender: renderSlot,
-          attrs: this.v3 ? undefined : {
-            slotRender: renderSlot,
-            viewSlot: viewSlot,
-            form: form,
-            index: slot.index,
-            start: slot.start,
-            end: slot.end,
-            zonedStart: slot.zonedStart,
-            zonedEnd: slot.zonedEnd,
-            items: slot.items,
-            group: slot.group,
-            range: slot.range,
-            isAllDay: slot.isAllDay,
-            row: filtered.length * (groupIndex || 0) + rootIndex + (groupIndex || 0) * GRID_OFFSET + GRID_OFFSET,
-            col: rangeIndex,
-            editable: editable,
-            isWorkHour: isInTimeRange(slot.zonedStart, workDayStart, workDayEnd),
-            isWorkDay: 0 <= slot.zonedStart.getDay() + (numberOfDays - workWeekStart) && (slot.zonedStart.getDay() + (numberOfDays - workWeekStart)) % numberOfDays <= workWeekEnd + (numberOfDays - workWeekStart)
-          },
           viewSlot: viewSlot,
           form: form,
-          onDataaction: that.handleDataAction,
-          on: this.v3 ? undefined : {
-            "dataaction": that.handleDataAction
-          },
-          index: slot.index,
-          start: slot.start,
-          end: slot.end,
-          zonedStart: slot.zonedStart,
-          zonedEnd: slot.zonedEnd,
-          items: slot.items,
-          group: slot.group,
-          range: slot.range,
-          isAllDay: slot.isAllDay,
-          key: "".concat(slot.start.getTime(), ":").concat(slot.group.index),
+          index: slotIndex,
           row: filtered.length * (groupIndex || 0) + rootIndex + (groupIndex || 0) * GRID_OFFSET + GRID_OFFSET,
-          col: rangeIndex,
+          col: slot.range.index,
           editable: editable,
           isWorkHour: isInTimeRange(slot.zonedStart, workDayStart, workDayEnd),
           isWorkDay: 0 <= slot.zonedStart.getDay() + (numberOfDays - workWeekStart) && (slot.zonedStart.getDay() + (numberOfDays - workWeekStart)) % numberOfDays <= workWeekEnd + (numberOfDays - workWeekStart)
-        });
-      }, true);
-    }, this), this.$props.currentTimeMarker && intersects(first(this.timeRanges).start, last(this.timeRanges).end, new Date(), new Date(), true) && [h(CurrentTimeMarkerArrow, {
+        },
+        viewSlot: viewSlot,
+        form: form,
+        onDataaction: that.handleDataAction,
+        on: this.v3 ? undefined : {
+          "dataaction": that.handleDataAction
+        },
+        index: slotIndex,
+        row: filtered.length * (groupIndex || 0) + rootIndex + (groupIndex || 0) * GRID_OFFSET + GRID_OFFSET,
+        col: slot.range.index,
+        editable: editable,
+        isWorkHour: isInTimeRange(slot.zonedStart, workDayStart, workDayEnd),
+        isWorkDay: 0 <= slot.zonedStart.getDay() + (numberOfDays - workWeekStart) && (slot.zonedStart.getDay() + (numberOfDays - workWeekStart)) % numberOfDays <= workWeekEnd + (numberOfDays - workWeekStart)
+      });
+    }, true), this.$props.currentTimeMarker && intersects(first(this.timeRanges).start, last(this.timeRanges).end, new Date(), new Date(), true) && [h(CurrentTimeMarkerArrow, {
       groupIndex: groupIndex,
       attrs: this.v3 ? undefined : {
         groupIndex: groupIndex
@@ -147,6 +170,13 @@ var DayViewVerticalSlotsRowVue2 = {
   methods: {
     handleDataAction: function handleDataAction(action) {
       this.$emit('dataaction', action);
+    },
+    calculateRanges: function calculateRanges(timeSlots, groupIndex, timeRanges, root) {
+      return timeRanges.map(function (_, rangeIndex) {
+        return timeSlots.filter(function (s) {
+          return s.index === root.index && s.group.index === groupIndex && s.range.index === rangeIndex;
+        });
+      }).flat();
     }
   }
 };