@progress/kendo-vue-scheduler 3.3.0 → 3.3.2-dev.202205231324
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cdn/js/kendo-vue-scheduler.js +2 -2
- package/dist/es/Scheduler.d.ts +2 -0
- package/dist/es/Scheduler.js +3 -0
- package/dist/es/items/SchedulerItem.js +281 -260
- package/dist/es/items/SchedulerViewItem.js +0 -4
- package/dist/es/models/SchedulerView.d.ts +8 -0
- package/dist/es/package-metadata.js +1 -1
- package/dist/es/slots/SchedulerSlot.js +0 -1
- package/dist/es/slots/SchedulerViewSlot.js +0 -3
- package/dist/es/views/day/DayView.js +5 -2
- package/dist/es/views/day/MultiDayView.d.ts +4 -0
- package/dist/es/views/day/MultiDayView.js +1 -0
- package/dist/es/views/month/MonthView.d.ts +4 -0
- package/dist/es/views/month/MonthView.js +113 -10
- package/dist/es/views/time/MultiDayTimelineView.d.ts +4 -0
- package/dist/es/views/time/MultiDayTimelineView.js +116 -7
- package/dist/es/views/time/TimelineView.js +19 -0
- package/dist/es/views/week/WeekView.js +3 -0
- package/dist/es/views/week/WorkWeekView.js +3 -0
- package/dist/npm/Scheduler.d.ts +2 -0
- package/dist/npm/Scheduler.js +3 -0
- package/dist/npm/items/SchedulerItem.js +279 -258
- package/dist/npm/items/SchedulerViewItem.js +0 -4
- package/dist/npm/models/SchedulerView.d.ts +8 -0
- package/dist/npm/package-metadata.js +1 -1
- package/dist/npm/slots/SchedulerSlot.js +0 -1
- package/dist/npm/slots/SchedulerViewSlot.js +0 -3
- package/dist/npm/views/day/DayView.js +5 -2
- package/dist/npm/views/day/MultiDayView.d.ts +4 -0
- package/dist/npm/views/day/MultiDayView.js +1 -0
- package/dist/npm/views/month/MonthView.d.ts +4 -0
- package/dist/npm/views/month/MonthView.js +115 -10
- package/dist/npm/views/time/MultiDayTimelineView.d.ts +4 -0
- package/dist/npm/views/time/MultiDayTimelineView.js +118 -7
- package/dist/npm/views/time/TimelineView.js +19 -0
- package/dist/npm/views/week/WeekView.js +3 -0
- package/dist/npm/views/week/WorkWeekView.js +3 -0
- package/package.json +12 -12
|
@@ -139,10 +139,6 @@ var SchedulerViewItemVue2 = {
|
|
|
139
139
|
this.$nextTick(function () {
|
|
140
140
|
that.align();
|
|
141
141
|
that.position();
|
|
142
|
-
that.$nextTick(function () {
|
|
143
|
-
that.align();
|
|
144
|
-
that.position();
|
|
145
|
-
});
|
|
146
142
|
});
|
|
147
143
|
|
|
148
144
|
if (!this.ks.scheduler || !this.ks.scheduler.$el || this.observer) {
|
|
@@ -69,6 +69,14 @@ export interface SchedulerViewProps {
|
|
|
69
69
|
workWeekEnd?: Day;
|
|
70
70
|
/** @hidden */
|
|
71
71
|
format?: string;
|
|
72
|
+
/**
|
|
73
|
+
* Overrides the `dragItem` prop of the Scheduler for the specified view only.
|
|
74
|
+
*/
|
|
75
|
+
dragItem?: any;
|
|
76
|
+
/**
|
|
77
|
+
* Overrides the `resizeItem` prop of the Scheduler for the specified view only.
|
|
78
|
+
*/
|
|
79
|
+
resizeItem?: any;
|
|
72
80
|
}
|
|
73
81
|
/**
|
|
74
82
|
* Represents a single Scheduler view.
|
|
@@ -8,7 +8,7 @@ exports.packageMetadata = {
|
|
|
8
8
|
name: '@progress/kendo-vue-scheduler',
|
|
9
9
|
productName: 'Kendo UI for Vue',
|
|
10
10
|
productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
|
|
11
|
-
publishDate:
|
|
11
|
+
publishDate: 1653312029,
|
|
12
12
|
version: '',
|
|
13
13
|
licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
|
|
14
14
|
};
|
|
@@ -82,9 +82,6 @@ var SchedulerViewSlotVue2 = {
|
|
|
82
82
|
var that = this;
|
|
83
83
|
this.$nextTick(function () {
|
|
84
84
|
hooks_1.useSlotExpand(that, that.ks.scheduler.$el, that.$props.expandable);
|
|
85
|
-
that.$nextTick(function () {
|
|
86
|
-
hooks_1.useSlotExpand(that, that.ks.scheduler.$el, that.$props.expandable);
|
|
87
|
-
});
|
|
88
85
|
});
|
|
89
86
|
},
|
|
90
87
|
mounted: function mounted() {
|
|
@@ -102,6 +102,7 @@ var DayViewVue2 = {
|
|
|
102
102
|
timeHeaderCell: [String, Function, Object],
|
|
103
103
|
slotRender: [String, Function, Object],
|
|
104
104
|
viewSlot: [String, Function, Object],
|
|
105
|
+
resizeHint: [String, Function, Object],
|
|
105
106
|
item: [String, Function, Object],
|
|
106
107
|
viewItem: [String, Function, Object],
|
|
107
108
|
editable: {
|
|
@@ -139,7 +140,7 @@ var DayViewVue2 = {
|
|
|
139
140
|
selectedDateFormat: this.$props.selectedDateFormat,
|
|
140
141
|
selectedShortDateFormat: this.$props.selectedShortDateFormat,
|
|
141
142
|
showWorkHours: this.$props.showWorkHours,
|
|
142
|
-
title:
|
|
143
|
+
title: title,
|
|
143
144
|
currentTimeMarker: this.$props.currentTimeMarker,
|
|
144
145
|
startTime: this.$props.startTime,
|
|
145
146
|
endTime: this.$props.endTime,
|
|
@@ -152,6 +153,7 @@ var DayViewVue2 = {
|
|
|
152
153
|
dateHeaderCell: this.$props.dateHeaderCell,
|
|
153
154
|
slotRender: this.$props.slotRender,
|
|
154
155
|
viewSlot: this.$props.viewSlot,
|
|
156
|
+
resizeHint: this.$props.resizeHint,
|
|
155
157
|
item: this.$props.item,
|
|
156
158
|
viewItem: this.$props.viewItem,
|
|
157
159
|
slotItem: this.$props.slotItem,
|
|
@@ -165,7 +167,7 @@ var DayViewVue2 = {
|
|
|
165
167
|
selectedDateFormat: this.$props.selectedDateFormat,
|
|
166
168
|
selectedShortDateFormat: this.$props.selectedShortDateFormat,
|
|
167
169
|
showWorkHours: this.$props.showWorkHours,
|
|
168
|
-
title:
|
|
170
|
+
title: title,
|
|
169
171
|
currentTimeMarker: this.$props.currentTimeMarker,
|
|
170
172
|
startTime: this.$props.startTime,
|
|
171
173
|
endTime: this.$props.endTime,
|
|
@@ -178,6 +180,7 @@ var DayViewVue2 = {
|
|
|
178
180
|
dateHeaderCell: this.$props.dateHeaderCell,
|
|
179
181
|
slotRender: this.$props.slotRender,
|
|
180
182
|
viewSlot: this.$props.viewSlot,
|
|
183
|
+
resizeHint: this.$props.resizeHint,
|
|
181
184
|
item: this.$props.item,
|
|
182
185
|
viewItem: this.$props.viewItem,
|
|
183
186
|
slotItem: this.$props.slotItem,
|
|
@@ -130,6 +130,10 @@ export interface MultiDayViewProps extends SchedulerViewProps {
|
|
|
130
130
|
* Overrides the `editSlot` prop of the Scheduler for the specified view only.
|
|
131
131
|
*/
|
|
132
132
|
editSlot?: any;
|
|
133
|
+
/**
|
|
134
|
+
* Overrides the `resizeHint` of the event.
|
|
135
|
+
*/
|
|
136
|
+
resizeHint?: any;
|
|
133
137
|
form?: any;
|
|
134
138
|
/**
|
|
135
139
|
* If set to `false` the "current time" marker of the scheduler would not be displayed.
|
|
@@ -182,6 +182,7 @@ var MultiDayViewVue2 = {
|
|
|
182
182
|
timeHeaderCell: [String, Function, Object],
|
|
183
183
|
slotRender: [String, Function, Object],
|
|
184
184
|
viewSlot: [String, Function, Object],
|
|
185
|
+
resizeHint: [String, Function, Object],
|
|
185
186
|
item: [String, Function, Object],
|
|
186
187
|
viewItem: [String, Function, Object],
|
|
187
188
|
editable: {
|
|
@@ -58,6 +58,10 @@ export interface MonthViewProps extends SchedulerViewProps {
|
|
|
58
58
|
* Overrides the `viewSlot` prop of the Scheduler for the specified view only.
|
|
59
59
|
*/
|
|
60
60
|
viewSlot?: any;
|
|
61
|
+
/**
|
|
62
|
+
* Overrides the `resizeHint` of the event.
|
|
63
|
+
*/
|
|
64
|
+
resizeHint?: any;
|
|
61
65
|
/**
|
|
62
66
|
* Overrides the `editSlot` prop of the Scheduler for the specified view only.
|
|
63
67
|
*/
|
|
@@ -59,6 +59,10 @@ var MonthViewBody_1 = require("./MonthViewBody");
|
|
|
59
59
|
|
|
60
60
|
var SchedulerEditItem_1 = require("../../items/SchedulerEditItem");
|
|
61
61
|
|
|
62
|
+
var SchedulerResize_1 = require("../common/SchedulerResize");
|
|
63
|
+
|
|
64
|
+
var SchedulerDrag_1 = require("../../views/common/SchedulerDrag");
|
|
65
|
+
|
|
62
66
|
var DAY_FORMAT = {
|
|
63
67
|
skeleton: 'dd'
|
|
64
68
|
}; // tslint:enable:max-line-length
|
|
@@ -92,6 +96,18 @@ var MonthViewVue2 = {
|
|
|
92
96
|
type: Number,
|
|
93
97
|
default: 31
|
|
94
98
|
},
|
|
99
|
+
dragItem: {
|
|
100
|
+
type: Object,
|
|
101
|
+
default: function _default() {
|
|
102
|
+
return undefined;
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
resizeItem: {
|
|
106
|
+
type: Object,
|
|
107
|
+
default: function _default() {
|
|
108
|
+
return undefined;
|
|
109
|
+
}
|
|
110
|
+
},
|
|
95
111
|
title: String,
|
|
96
112
|
selectedDateFormat: {
|
|
97
113
|
type: String,
|
|
@@ -104,6 +120,7 @@ var MonthViewVue2 = {
|
|
|
104
120
|
dateHeaderCell: [String, Function, Object],
|
|
105
121
|
slotRender: [String, Function, Object],
|
|
106
122
|
viewSlot: [String, Function, Object],
|
|
123
|
+
resizeHint: [String, Function, Object],
|
|
107
124
|
item: [String, Function, Object],
|
|
108
125
|
viewItem: [String, Function, Object],
|
|
109
126
|
editable: {
|
|
@@ -125,6 +142,12 @@ var MonthViewVue2 = {
|
|
|
125
142
|
created: function created() {
|
|
126
143
|
this.intl = kendo_vue_intl_1.provideIntlService(this);
|
|
127
144
|
},
|
|
145
|
+
data: function data() {
|
|
146
|
+
return {
|
|
147
|
+
currentDragItem: undefined,
|
|
148
|
+
currentResizeItem: undefined
|
|
149
|
+
};
|
|
150
|
+
},
|
|
128
151
|
computed: {
|
|
129
152
|
ranges: function ranges() {
|
|
130
153
|
return rangeService_1.toRanges(this.ks.dateRange, {
|
|
@@ -157,6 +180,12 @@ var MonthViewVue2 = {
|
|
|
157
180
|
utils_1.mapItemsToSlots(items, this.monthSlots, true);
|
|
158
181
|
utils_1.mapSlotsToItems(items, this.monthSlots, true);
|
|
159
182
|
return items;
|
|
183
|
+
},
|
|
184
|
+
compDragItem: function compDragItem() {
|
|
185
|
+
return this.dragItem !== undefined ? this.dragItem : this.currentDragItem;
|
|
186
|
+
},
|
|
187
|
+
compResizeItem: function compResizeItem() {
|
|
188
|
+
return this.resizeItem !== undefined ? this.resizeItem : this.currentResizeItem;
|
|
160
189
|
}
|
|
161
190
|
},
|
|
162
191
|
// @ts-ignore
|
|
@@ -170,18 +199,80 @@ var MonthViewVue2 = {
|
|
|
170
199
|
render: function render(createElement) {
|
|
171
200
|
var _this2 = this;
|
|
172
201
|
|
|
173
|
-
var h = gh || createElement;
|
|
174
|
-
// group,
|
|
175
|
-
// timezone,
|
|
176
|
-
// resources: propResources
|
|
177
|
-
// } = useSchedulerPropsContext();
|
|
178
|
-
|
|
202
|
+
var h = gh || createElement;
|
|
179
203
|
this.localization = kendo_vue_intl_1.provideLocalizationService(this);
|
|
180
204
|
var title = this.localization.toLanguageString(messages_1.monthViewTitle, messages_1.messages[messages_1.monthViewTitle]);
|
|
181
205
|
var EditItem = this.$props.editItem || SchedulerEditItem_1.SchedulerEditItem;
|
|
182
206
|
var EditSlot = this.$props.editSlot || SchedulerEditSlot_1.SchedulerEditSlot;
|
|
183
207
|
var items = this.items;
|
|
184
208
|
var monthSlots = this.monthSlots;
|
|
209
|
+
|
|
210
|
+
var dragItemClue = function dragItemClue(vertical) {
|
|
211
|
+
return this.compDragItem && this.$props.editable.drag && (Array.isArray(this.compDragItem) ? this.compDragItem.map(function (di, idx) {
|
|
212
|
+
return h(SchedulerDrag_1.SchedulerDrag, {
|
|
213
|
+
key: idx,
|
|
214
|
+
ignoreIsAllDay: true,
|
|
215
|
+
attrs: this.v3 ? undefined : {
|
|
216
|
+
ignoreIsAllDay: true,
|
|
217
|
+
dataItem: di,
|
|
218
|
+
vertical: vertical,
|
|
219
|
+
item: this.$props.dataItem
|
|
220
|
+
},
|
|
221
|
+
dataItem: di,
|
|
222
|
+
vertical: vertical,
|
|
223
|
+
item: this.$props.dataItem
|
|
224
|
+
});
|
|
225
|
+
}, this) : h(SchedulerDrag_1.SchedulerDrag, {
|
|
226
|
+
ignoreIsAllDay: true,
|
|
227
|
+
attrs: this.v3 ? undefined : {
|
|
228
|
+
ignoreIsAllDay: true,
|
|
229
|
+
dataItem: this.compDragItem,
|
|
230
|
+
vertical: vertical,
|
|
231
|
+
item: this.$props.dataItem
|
|
232
|
+
},
|
|
233
|
+
dataItem: this.compDragItem,
|
|
234
|
+
vertical: vertical,
|
|
235
|
+
item: this.$props.dataItem
|
|
236
|
+
}));
|
|
237
|
+
};
|
|
238
|
+
|
|
239
|
+
var resizeItemClue = function resizeItemClue(vertical) {
|
|
240
|
+
return this.compResizeItem && this.editable.resize && (Array.isArray(this.compResizeItem) ? this.compResizeItem.map(function (ri, idx) {
|
|
241
|
+
return h(SchedulerResize_1.SchedulerResize, {
|
|
242
|
+
key: idx,
|
|
243
|
+
format: this.$props.format,
|
|
244
|
+
attrs: this.v3 ? undefined : {
|
|
245
|
+
format: this.$props.format,
|
|
246
|
+
ignoreIsAllDay: true,
|
|
247
|
+
dataItem: ri,
|
|
248
|
+
viewItem: this.$props.viewItem,
|
|
249
|
+
item: this.$props.item,
|
|
250
|
+
vertical: vertical
|
|
251
|
+
},
|
|
252
|
+
ignoreIsAllDay: true,
|
|
253
|
+
dataItem: ri,
|
|
254
|
+
viewItem: this.$props.viewItem,
|
|
255
|
+
item: this.$props.item,
|
|
256
|
+
vertical: vertical
|
|
257
|
+
});
|
|
258
|
+
}, this) : h(SchedulerResize_1.SchedulerResize, {
|
|
259
|
+
format: this.$props.format,
|
|
260
|
+
attrs: this.v3 ? undefined : {
|
|
261
|
+
format: this.$props.format,
|
|
262
|
+
ignoreIsAllDay: true,
|
|
263
|
+
dataItem: this.compResizeItem,
|
|
264
|
+
viewItem: this.$props.viewItem,
|
|
265
|
+
item: this.$props.item,
|
|
266
|
+
vertical: vertical
|
|
267
|
+
},
|
|
268
|
+
ignoreIsAllDay: true,
|
|
269
|
+
dataItem: this.compResizeItem,
|
|
270
|
+
viewItem: this.$props.viewItem,
|
|
271
|
+
item: this.$props.item,
|
|
272
|
+
vertical: vertical
|
|
273
|
+
}));
|
|
274
|
+
};
|
|
275
|
+
|
|
185
276
|
this.intl = kendo_vue_intl_1.provideIntlService(this);
|
|
186
277
|
var itemsPerSlot = this.$props.itemsPerSlot;
|
|
187
278
|
var body = this.ks.orientation === 'horizontal' ? this.ranges.map(function (_, rangeIndex) {
|
|
@@ -400,10 +491,14 @@ var MonthViewVue2 = {
|
|
|
400
491
|
range: item.range,
|
|
401
492
|
isException: item.isException,
|
|
402
493
|
isRecurring: item.isRecurring,
|
|
403
|
-
|
|
494
|
+
onDragitemchange: this.handleDragItemChange,
|
|
404
495
|
on: this.v3 ? undefined : {
|
|
496
|
+
"dragitemchange": this.handleDragItemChange,
|
|
497
|
+
"resizeitemchange": this.handleResizeItemChange,
|
|
405
498
|
"dataaction": this.handleDataAction
|
|
406
499
|
},
|
|
500
|
+
onResizeitemchange: this.handleResizeItemChange,
|
|
501
|
+
onDataaction: this.handleDataAction,
|
|
407
502
|
style: {
|
|
408
503
|
transform: 'translateY(30px)'
|
|
409
504
|
},
|
|
@@ -411,7 +506,7 @@ var MonthViewVue2 = {
|
|
|
411
506
|
editable: this.$props.editable,
|
|
412
507
|
ignoreIsAllDay: true
|
|
413
508
|
});
|
|
414
|
-
}, _this2)])];
|
|
509
|
+
}, _this2), _this2.compDragItem && dragItemClue.call(_this2, false), _this2.compResizeItem && resizeItemClue.call(_this2, false)])];
|
|
415
510
|
} : [h("div", {
|
|
416
511
|
"class": "k-scheduler-head"
|
|
417
512
|
}, [_this2.ks.orientation === 'horizontal' ? h(HorizontalResourceIterator_1.HorizontalResourceIterator, {
|
|
@@ -530,10 +625,14 @@ var MonthViewVue2 = {
|
|
|
530
625
|
range: item.range,
|
|
531
626
|
isException: item.isException,
|
|
532
627
|
isRecurring: item.isRecurring,
|
|
533
|
-
|
|
628
|
+
onDragitemchange: this.handleDragItemChange,
|
|
534
629
|
on: this.v3 ? undefined : {
|
|
630
|
+
"dragitemchange": this.handleDragItemChange,
|
|
631
|
+
"resizeitemchange": this.handleResizeItemChange,
|
|
535
632
|
"dataaction": this.handleDataAction
|
|
536
633
|
},
|
|
634
|
+
onResizeitemchange: this.handleResizeItemChange,
|
|
635
|
+
onDataaction: this.handleDataAction,
|
|
537
636
|
style: {
|
|
538
637
|
transform: 'translateY(30px)'
|
|
539
638
|
},
|
|
@@ -541,12 +640,18 @@ var MonthViewVue2 = {
|
|
|
541
640
|
editable: this.$props.editable,
|
|
542
641
|
ignoreIsAllDay: true
|
|
543
642
|
});
|
|
544
|
-
}, _this2)])])
|
|
643
|
+
}, _this2), _this2.compDragItem && dragItemClue.call(_this2, false), _this2.compResizeItem && resizeItemClue.call(_this2, false)])])
|
|
545
644
|
);
|
|
546
645
|
},
|
|
547
646
|
methods: {
|
|
548
647
|
handleDataAction: function handleDataAction(action) {
|
|
549
648
|
this.$emit('dataaction', action);
|
|
649
|
+
},
|
|
650
|
+
handleDragItemChange: function handleDragItemChange(item) {
|
|
651
|
+
this.currentDragItem = item;
|
|
652
|
+
},
|
|
653
|
+
handleResizeItemChange: function handleResizeItemChange(item) {
|
|
654
|
+
this.currentResizeItem = item;
|
|
550
655
|
}
|
|
551
656
|
}
|
|
552
657
|
};
|
|
@@ -121,6 +121,10 @@ export interface MultiDayTimelineViewProps extends SchedulerViewProps {
|
|
|
121
121
|
* Overrides the `viewSlot` prop of the Scheduler for the specified view only.
|
|
122
122
|
*/
|
|
123
123
|
viewSlot?: any;
|
|
124
|
+
/**
|
|
125
|
+
* Overrides the `resizeHint` of the event.
|
|
126
|
+
*/
|
|
127
|
+
resizeHint?: any;
|
|
124
128
|
/**
|
|
125
129
|
* Overrides the `editSlot` prop of the Scheduler for the specified view only.
|
|
126
130
|
*/
|
|
@@ -57,6 +57,10 @@ var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
|
|
|
57
57
|
|
|
58
58
|
var SchedulerEditItem_1 = require("../../items/SchedulerEditItem");
|
|
59
59
|
|
|
60
|
+
var SchedulerResize_1 = require("../common/SchedulerResize");
|
|
61
|
+
|
|
62
|
+
var SchedulerDrag_1 = require("../../views/common/SchedulerDrag");
|
|
63
|
+
|
|
60
64
|
var DateHeaderCell_1 = require("../../components/DateHeaderCell");
|
|
61
65
|
|
|
62
66
|
var TimeHeaderCell_1 = require("../../components/TimeHeaderCell");
|
|
@@ -79,6 +83,18 @@ var MultiDayTimelineViewVue2 = {
|
|
|
79
83
|
type: Boolean,
|
|
80
84
|
default: true
|
|
81
85
|
},
|
|
86
|
+
dragItem: {
|
|
87
|
+
type: Object,
|
|
88
|
+
default: function _default() {
|
|
89
|
+
return undefined;
|
|
90
|
+
}
|
|
91
|
+
},
|
|
92
|
+
resizeItem: {
|
|
93
|
+
type: Object,
|
|
94
|
+
default: function _default() {
|
|
95
|
+
return undefined;
|
|
96
|
+
}
|
|
97
|
+
},
|
|
82
98
|
showWorkHours: {
|
|
83
99
|
type: Boolean,
|
|
84
100
|
default: true
|
|
@@ -149,6 +165,7 @@ var MultiDayTimelineViewVue2 = {
|
|
|
149
165
|
timeHeaderCell: [String, Function, Object],
|
|
150
166
|
slotRender: [String, Function, Object],
|
|
151
167
|
viewSlot: [String, Function, Object],
|
|
168
|
+
resizeHint: [String, Function, Object],
|
|
152
169
|
item: [String, Function, Object],
|
|
153
170
|
viewItem: [String, Function, Object],
|
|
154
171
|
editable: {
|
|
@@ -156,6 +173,12 @@ var MultiDayTimelineViewVue2 = {
|
|
|
156
173
|
default: false
|
|
157
174
|
}
|
|
158
175
|
},
|
|
176
|
+
data: function data() {
|
|
177
|
+
return {
|
|
178
|
+
currentDragItem: undefined,
|
|
179
|
+
currentResizeItem: undefined
|
|
180
|
+
};
|
|
181
|
+
},
|
|
159
182
|
inject: {
|
|
160
183
|
ks: {
|
|
161
184
|
default: null
|
|
@@ -217,6 +240,12 @@ var MultiDayTimelineViewVue2 = {
|
|
|
217
240
|
utils_1.mapItemsToSlots(items, this.timelineSlots, true);
|
|
218
241
|
utils_1.mapSlotsToItems(items, this.timelineSlots, true);
|
|
219
242
|
return items;
|
|
243
|
+
},
|
|
244
|
+
compDragItem: function compDragItem() {
|
|
245
|
+
return this.dragItem !== undefined ? this.dragItem : this.currentDragItem;
|
|
246
|
+
},
|
|
247
|
+
compResizeItem: function compResizeItem() {
|
|
248
|
+
return this.resizeItem !== undefined ? this.resizeItem : this.currentResizeItem;
|
|
220
249
|
}
|
|
221
250
|
},
|
|
222
251
|
mounted: function mounted() {
|
|
@@ -275,6 +304,73 @@ var MultiDayTimelineViewVue2 = {
|
|
|
275
304
|
var timelineSlots = __spreadArrays(this.timelineSlots);
|
|
276
305
|
|
|
277
306
|
var width = (this.ks.orientation === 'horizontal' ? timelineSlots.length : timelineSlots.length / this.ks.groups.length) * (this.$props.columnWidth + constants_1.BORDER_WIDTH);
|
|
307
|
+
|
|
308
|
+
var dragItemClue = function dragItemClue(vertical) {
|
|
309
|
+
return this.compDragItem && this.$props.editable.drag && (Array.isArray(this.compDragItem) ? this.compDragItem.map(function (di, idx) {
|
|
310
|
+
return h(SchedulerDrag_1.SchedulerDrag, {
|
|
311
|
+
key: idx,
|
|
312
|
+
ignoreIsAllDay: true,
|
|
313
|
+
attrs: this.v3 ? undefined : {
|
|
314
|
+
ignoreIsAllDay: true,
|
|
315
|
+
dataItem: di,
|
|
316
|
+
vertical: vertical,
|
|
317
|
+
item: this.$props.dataItem
|
|
318
|
+
},
|
|
319
|
+
dataItem: di,
|
|
320
|
+
vertical: vertical,
|
|
321
|
+
item: this.$props.dataItem
|
|
322
|
+
});
|
|
323
|
+
}, this) : h(SchedulerDrag_1.SchedulerDrag, {
|
|
324
|
+
ignoreIsAllDay: true,
|
|
325
|
+
attrs: this.v3 ? undefined : {
|
|
326
|
+
ignoreIsAllDay: true,
|
|
327
|
+
dataItem: this.compDragItem,
|
|
328
|
+
vertical: vertical,
|
|
329
|
+
item: this.$props.dataItem
|
|
330
|
+
},
|
|
331
|
+
dataItem: this.compDragItem,
|
|
332
|
+
vertical: vertical,
|
|
333
|
+
item: this.$props.dataItem
|
|
334
|
+
}));
|
|
335
|
+
};
|
|
336
|
+
|
|
337
|
+
var resizeItemClue = function resizeItemClue(vertical) {
|
|
338
|
+
return this.compResizeItem && this.editable.resize && (Array.isArray(this.compResizeItem) ? this.compResizeItem.map(function (ri, idx) {
|
|
339
|
+
return h(SchedulerResize_1.SchedulerResize, {
|
|
340
|
+
key: idx,
|
|
341
|
+
format: this.$props.format,
|
|
342
|
+
attrs: this.v3 ? undefined : {
|
|
343
|
+
format: this.$props.format,
|
|
344
|
+
ignoreIsAllDay: true,
|
|
345
|
+
dataItem: ri,
|
|
346
|
+
viewItem: this.$props.viewItem,
|
|
347
|
+
item: this.$props.item,
|
|
348
|
+
vertical: vertical
|
|
349
|
+
},
|
|
350
|
+
ignoreIsAllDay: true,
|
|
351
|
+
dataItem: ri,
|
|
352
|
+
viewItem: this.$props.viewItem,
|
|
353
|
+
item: this.$props.item,
|
|
354
|
+
vertical: vertical
|
|
355
|
+
});
|
|
356
|
+
}, this) : h(SchedulerResize_1.SchedulerResize, {
|
|
357
|
+
format: this.$props.format,
|
|
358
|
+
attrs: this.v3 ? undefined : {
|
|
359
|
+
format: this.$props.format,
|
|
360
|
+
ignoreIsAllDay: true,
|
|
361
|
+
dataItem: this.compResizeItem,
|
|
362
|
+
viewItem: this.$props.viewItem,
|
|
363
|
+
item: this.$props.item,
|
|
364
|
+
vertical: vertical
|
|
365
|
+
},
|
|
366
|
+
ignoreIsAllDay: true,
|
|
367
|
+
dataItem: this.compResizeItem,
|
|
368
|
+
viewItem: this.$props.viewItem,
|
|
369
|
+
item: this.$props.item,
|
|
370
|
+
vertical: vertical
|
|
371
|
+
}));
|
|
372
|
+
};
|
|
373
|
+
|
|
278
374
|
var head = [h("div", {
|
|
279
375
|
"class": "k-scheduler-row"
|
|
280
376
|
}, [this.ranges.map(function (range, rangeIndex) {
|
|
@@ -301,15 +397,16 @@ var MultiDayTimelineViewVue2 = {
|
|
|
301
397
|
return s.group.index === FIRST_INDEX && s.range.index === rangeIndex;
|
|
302
398
|
}).map(function (slot) {
|
|
303
399
|
return slot.zonedStart.getMinutes() % slotDuration === 0 ? h(TimeHeaderCell_1.TimeHeaderCell, {
|
|
304
|
-
key: slot.index
|
|
305
|
-
,
|
|
306
|
-
format: TIME_FORMAT,
|
|
400
|
+
key: slot.index,
|
|
401
|
+
as: this.$props.timeHeaderCell,
|
|
307
402
|
attrs: this.v3 ? undefined : {
|
|
403
|
+
as: this.$props.timeHeaderCell,
|
|
308
404
|
format: TIME_FORMAT,
|
|
309
405
|
date: slot.zonedStart,
|
|
310
406
|
start: slot.zonedStart,
|
|
311
407
|
end: slot.zonedEnd
|
|
312
408
|
},
|
|
409
|
+
format: TIME_FORMAT,
|
|
313
410
|
date: slot.zonedStart,
|
|
314
411
|
start: slot.zonedStart,
|
|
315
412
|
end: slot.zonedEnd
|
|
@@ -520,17 +617,21 @@ var MultiDayTimelineViewVue2 = {
|
|
|
520
617
|
isRecurring: item.isRecurring,
|
|
521
618
|
format: 't',
|
|
522
619
|
form: this.$props.form,
|
|
523
|
-
|
|
620
|
+
onDragitemchange: this.handleDragItemChange,
|
|
524
621
|
on: this.v3 ? undefined : {
|
|
622
|
+
"dragitemchange": this.handleDragItemChange,
|
|
623
|
+
"resizeitemchange": this.handleResizeItemChange,
|
|
525
624
|
"dataaction": this.handleDataAction
|
|
526
625
|
},
|
|
626
|
+
onResizeitemchange: this.handleResizeItemChange,
|
|
627
|
+
onDataaction: this.handleDataAction,
|
|
527
628
|
item: this.$props.item,
|
|
528
629
|
viewItem: this.$props.viewItem,
|
|
529
630
|
editable: this.$props.editable,
|
|
530
631
|
ignoreIsAllDay: true,
|
|
531
632
|
vertical: false
|
|
532
633
|
});
|
|
533
|
-
}, _this2)])];
|
|
634
|
+
}, _this2), _this2.compDragItem && dragItemClue.call(_this2, false), _this2.compResizeItem && resizeItemClue.call(_this2, false)])];
|
|
534
635
|
} : [h("div", {
|
|
535
636
|
"class": 'k-scheduler-head',
|
|
536
637
|
style: {
|
|
@@ -716,22 +817,32 @@ var MultiDayTimelineViewVue2 = {
|
|
|
716
817
|
isRecurring: item.isRecurring,
|
|
717
818
|
format: 't',
|
|
718
819
|
form: this.$props.form,
|
|
719
|
-
|
|
820
|
+
onDragitemchange: this.handleDragItemChange,
|
|
720
821
|
on: this.v3 ? undefined : {
|
|
822
|
+
"dragitemchange": this.handleDragItemChange,
|
|
823
|
+
"resizeitemchange": this.handleResizeItemChange,
|
|
721
824
|
"dataaction": this.handleDataAction
|
|
722
825
|
},
|
|
826
|
+
onResizeitemchange: this.handleResizeItemChange,
|
|
827
|
+
onDataaction: this.handleDataAction,
|
|
723
828
|
item: this.$props.item,
|
|
724
829
|
viewItem: this.$props.viewItem,
|
|
725
830
|
editable: this.$props.editable,
|
|
726
831
|
ignoreIsAllDay: true,
|
|
727
832
|
vertical: false
|
|
728
833
|
});
|
|
729
|
-
}, _this2)])])
|
|
834
|
+
}, _this2), _this2.compDragItem && dragItemClue.call(_this2, false), _this2.compResizeItem && resizeItemClue.call(_this2, false)])])
|
|
730
835
|
);
|
|
731
836
|
},
|
|
732
837
|
methods: {
|
|
733
838
|
handleDataAction: function handleDataAction(action) {
|
|
734
839
|
this.$emit('dataaction', action);
|
|
840
|
+
},
|
|
841
|
+
handleDragItemChange: function handleDragItemChange(item) {
|
|
842
|
+
this.currentDragItem = item;
|
|
843
|
+
},
|
|
844
|
+
handleResizeItemChange: function handleResizeItemChange(item) {
|
|
845
|
+
this.currentResizeItem = item;
|
|
735
846
|
}
|
|
736
847
|
}
|
|
737
848
|
};
|
|
@@ -101,10 +101,23 @@ var TimelineViewVue2 = {
|
|
|
101
101
|
type: Number,
|
|
102
102
|
default: 100
|
|
103
103
|
},
|
|
104
|
+
dragItem: {
|
|
105
|
+
type: Object,
|
|
106
|
+
default: function _default() {
|
|
107
|
+
return undefined;
|
|
108
|
+
}
|
|
109
|
+
},
|
|
110
|
+
resizeItem: {
|
|
111
|
+
type: Object,
|
|
112
|
+
default: function _default() {
|
|
113
|
+
return undefined;
|
|
114
|
+
}
|
|
115
|
+
},
|
|
104
116
|
dateHeaderCell: [String, Function, Object],
|
|
105
117
|
timeHeaderCell: [String, Function, Object],
|
|
106
118
|
slotRender: [String, Function, Object],
|
|
107
119
|
viewSlot: [String, Function, Object],
|
|
120
|
+
resizeHint: [String, Function, Object],
|
|
108
121
|
item: [String, Function, Object],
|
|
109
122
|
viewItem: [String, Function, Object],
|
|
110
123
|
editable: [Object, Boolean]
|
|
@@ -123,6 +136,8 @@ var TimelineViewVue2 = {
|
|
|
123
136
|
name: this.$props.name,
|
|
124
137
|
attrs: this.v3 ? undefined : {
|
|
125
138
|
name: this.$props.name,
|
|
139
|
+
dragItem: this.$props.dragItem,
|
|
140
|
+
resizeItem: this.$props.resizeItem,
|
|
126
141
|
dateRange: this.$props.dateRange,
|
|
127
142
|
step: this.$props.step,
|
|
128
143
|
numberOfDays: this.$props.numberOfDays,
|
|
@@ -144,10 +159,13 @@ var TimelineViewVue2 = {
|
|
|
144
159
|
dateHeaderCell: this.$props.dateHeaderCell,
|
|
145
160
|
slotRender: this.$props.slotRender,
|
|
146
161
|
viewSlot: this.$props.viewSlot,
|
|
162
|
+
resizeHint: this.$props.resizeHint,
|
|
147
163
|
item: this.$props.item,
|
|
148
164
|
viewItem: this.$props.viewItem,
|
|
149
165
|
editable: this.$props.editable
|
|
150
166
|
},
|
|
167
|
+
dragItem: this.$props.dragItem,
|
|
168
|
+
resizeItem: this.$props.resizeItem,
|
|
151
169
|
dateRange: this.$props.dateRange,
|
|
152
170
|
step: this.$props.step,
|
|
153
171
|
numberOfDays: this.$props.numberOfDays,
|
|
@@ -169,6 +187,7 @@ var TimelineViewVue2 = {
|
|
|
169
187
|
dateHeaderCell: this.$props.dateHeaderCell,
|
|
170
188
|
slotRender: this.$props.slotRender,
|
|
171
189
|
viewSlot: this.$props.viewSlot,
|
|
190
|
+
resizeHint: this.$props.resizeHint,
|
|
172
191
|
item: this.$props.item,
|
|
173
192
|
viewItem: this.$props.viewItem,
|
|
174
193
|
editable: this.$props.editable,
|
|
@@ -102,6 +102,7 @@ var WeekViewVue2 = {
|
|
|
102
102
|
timeHeaderCell: [String, Function, Object],
|
|
103
103
|
slotRender: [String, Function, Object],
|
|
104
104
|
viewSlot: [String, Function, Object],
|
|
105
|
+
resizeHint: [String, Function, Object],
|
|
105
106
|
item: [String, Function, Object],
|
|
106
107
|
viewItem: [String, Function, Object],
|
|
107
108
|
editable: {
|
|
@@ -152,6 +153,7 @@ var WeekViewVue2 = {
|
|
|
152
153
|
timeHeaderCell: this.$props.timeHeaderCell,
|
|
153
154
|
slotRender: this.$props.slotRender,
|
|
154
155
|
viewSlot: this.$props.viewSlot,
|
|
156
|
+
resizeHint: this.$props.resizeHint,
|
|
155
157
|
item: this.$props.item,
|
|
156
158
|
slotItem: this.$props.slotItem,
|
|
157
159
|
viewItem: this.$props.viewItem,
|
|
@@ -178,6 +180,7 @@ var WeekViewVue2 = {
|
|
|
178
180
|
timeHeaderCell: this.$props.timeHeaderCell,
|
|
179
181
|
slotRender: this.$props.slotRender,
|
|
180
182
|
viewSlot: this.$props.viewSlot,
|
|
183
|
+
resizeHint: this.$props.resizeHint,
|
|
181
184
|
item: this.$props.item,
|
|
182
185
|
slotItem: this.$props.slotItem,
|
|
183
186
|
viewItem: this.$props.viewItem,
|
|
@@ -92,6 +92,7 @@ var WorkWeekViewVue2 = {
|
|
|
92
92
|
timeHeaderCell: [String, Function, Object],
|
|
93
93
|
slotRender: [String, Function, Object],
|
|
94
94
|
viewSlot: [String, Function, Object],
|
|
95
|
+
resizeHint: [String, Function, Object],
|
|
95
96
|
item: [String, Function, Object],
|
|
96
97
|
viewItem: [String, Function, Object],
|
|
97
98
|
editable: {
|
|
@@ -136,6 +137,7 @@ var WorkWeekViewVue2 = {
|
|
|
136
137
|
step: constants_1.DAYS_IN_WEEK_COUNT,
|
|
137
138
|
slotRender: this.$props.slotRender,
|
|
138
139
|
viewSlot: this.$props.viewSlot,
|
|
140
|
+
resizeHint: this.$props.resizeHint,
|
|
139
141
|
slotItem: this.$props.slotItem,
|
|
140
142
|
item: this.$props.item,
|
|
141
143
|
viewItem: this.$props.viewItem,
|
|
@@ -154,6 +156,7 @@ var WorkWeekViewVue2 = {
|
|
|
154
156
|
step: constants_1.DAYS_IN_WEEK_COUNT,
|
|
155
157
|
slotRender: this.$props.slotRender,
|
|
156
158
|
viewSlot: this.$props.viewSlot,
|
|
159
|
+
resizeHint: this.$props.resizeHint,
|
|
157
160
|
slotItem: this.$props.slotItem,
|
|
158
161
|
item: this.$props.item,
|
|
159
162
|
viewItem: this.$props.viewItem,
|