@syncfusion/ej2-schedule 31.1.17 → 31.1.21

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.
Files changed (168) hide show
  1. package/dist/ej2-schedule.min.js +2 -2
  2. package/dist/ej2-schedule.umd.min.js +2 -2
  3. package/dist/ej2-schedule.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-schedule.es2015.js +7 -3
  5. package/dist/es6/ej2-schedule.es2015.js.map +1 -1
  6. package/dist/es6/ej2-schedule.es5.js +6 -2
  7. package/dist/es6/ej2-schedule.es5.js.map +1 -1
  8. package/dist/global/ej2-schedule.min.js +2 -2
  9. package/dist/global/ej2-schedule.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +18 -53
  12. package/src/schedule/actions/virtual-scroll.js +5 -1
  13. package/src/schedule/event-renderer/event-base.js +1 -1
  14. package/styles/bootstrap4-lite.css +8 -0
  15. package/styles/bootstrap4.css +8 -0
  16. package/styles/recurrence-editor/bootstrap4.css +8 -0
  17. package/styles/schedule/bootstrap4.css +8 -0
  18. package/dist/ts/common/calendar-util.d.ts +0 -92
  19. package/dist/ts/common/calendar-util.ts +0 -261
  20. package/dist/ts/common/index.d.ts +0 -4
  21. package/dist/ts/common/index.ts +0 -4
  22. package/dist/ts/components.d.ts +0 -5
  23. package/dist/ts/components.ts +0 -5
  24. package/dist/ts/index.d.ts +0 -6
  25. package/dist/ts/index.ts +0 -7
  26. package/dist/ts/recurrence-editor/date-generator.d.ts +0 -76
  27. package/dist/ts/recurrence-editor/date-generator.ts +0 -1699
  28. package/dist/ts/recurrence-editor/index.d.ts +0 -6
  29. package/dist/ts/recurrence-editor/index.ts +0 -6
  30. package/dist/ts/recurrence-editor/recurrence-editor-model.d.ts +0 -112
  31. package/dist/ts/recurrence-editor/recurrence-editor.d.ts +0 -245
  32. package/dist/ts/recurrence-editor/recurrence-editor.ts +0 -1257
  33. package/dist/ts/schedule/actions/action-base.d.ts +0 -44
  34. package/dist/ts/schedule/actions/action-base.ts +0 -493
  35. package/dist/ts/schedule/actions/crud.d.ts +0 -41
  36. package/dist/ts/schedule/actions/crud.ts +0 -784
  37. package/dist/ts/schedule/actions/data.d.ts +0 -63
  38. package/dist/ts/schedule/actions/data.ts +0 -128
  39. package/dist/ts/schedule/actions/drag.d.ts +0 -75
  40. package/dist/ts/schedule/actions/drag.ts +0 -1401
  41. package/dist/ts/schedule/actions/keyboard.d.ts +0 -100
  42. package/dist/ts/schedule/actions/keyboard.ts +0 -1435
  43. package/dist/ts/schedule/actions/resize.d.ts +0 -27
  44. package/dist/ts/schedule/actions/resize.ts +0 -602
  45. package/dist/ts/schedule/actions/scroll.d.ts +0 -69
  46. package/dist/ts/schedule/actions/scroll.ts +0 -105
  47. package/dist/ts/schedule/actions/touch.d.ts +0 -32
  48. package/dist/ts/schedule/actions/touch.ts +0 -314
  49. package/dist/ts/schedule/actions/virtual-scroll.d.ts +0 -55
  50. package/dist/ts/schedule/actions/virtual-scroll.ts +0 -596
  51. package/dist/ts/schedule/actions/work-cells.d.ts +0 -14
  52. package/dist/ts/schedule/actions/work-cells.ts +0 -151
  53. package/dist/ts/schedule/base/constant.d.ts +0 -102
  54. package/dist/ts/schedule/base/constant.ts +0 -103
  55. package/dist/ts/schedule/base/css-constant.d.ts +0 -475
  56. package/dist/ts/schedule/base/css-constant.ts +0 -475
  57. package/dist/ts/schedule/base/interface.d.ts +0 -673
  58. package/dist/ts/schedule/base/interface.ts +0 -738
  59. package/dist/ts/schedule/base/resource.d.ts +0 -59
  60. package/dist/ts/schedule/base/resource.ts +0 -1091
  61. package/dist/ts/schedule/base/schedule-model.d.ts +0 -930
  62. package/dist/ts/schedule/base/schedule.d.ts +0 -1967
  63. package/dist/ts/schedule/base/schedule.ts +0 -4221
  64. package/dist/ts/schedule/base/type.d.ts +0 -134
  65. package/dist/ts/schedule/base/type.ts +0 -142
  66. package/dist/ts/schedule/base/util.d.ts +0 -266
  67. package/dist/ts/schedule/base/util.ts +0 -492
  68. package/dist/ts/schedule/event-renderer/agenda-base.d.ts +0 -15
  69. package/dist/ts/schedule/event-renderer/agenda-base.ts +0 -423
  70. package/dist/ts/schedule/event-renderer/event-base.d.ts +0 -101
  71. package/dist/ts/schedule/event-renderer/event-base.ts +0 -1501
  72. package/dist/ts/schedule/event-renderer/inline-edit.d.ts +0 -23
  73. package/dist/ts/schedule/event-renderer/inline-edit.ts +0 -287
  74. package/dist/ts/schedule/event-renderer/month.d.ts +0 -60
  75. package/dist/ts/schedule/event-renderer/month.ts +0 -760
  76. package/dist/ts/schedule/event-renderer/timeline-view.d.ts +0 -51
  77. package/dist/ts/schedule/event-renderer/timeline-view.ts +0 -606
  78. package/dist/ts/schedule/event-renderer/vertical-view.d.ts +0 -57
  79. package/dist/ts/schedule/event-renderer/vertical-view.ts +0 -898
  80. package/dist/ts/schedule/event-renderer/year.d.ts +0 -27
  81. package/dist/ts/schedule/event-renderer/year.ts +0 -623
  82. package/dist/ts/schedule/exports/calendar-export.d.ts +0 -16
  83. package/dist/ts/schedule/exports/calendar-export.ts +0 -160
  84. package/dist/ts/schedule/exports/calendar-import.d.ts +0 -18
  85. package/dist/ts/schedule/exports/calendar-import.ts +0 -277
  86. package/dist/ts/schedule/exports/excel-export.d.ts +0 -14
  87. package/dist/ts/schedule/exports/excel-export.ts +0 -89
  88. package/dist/ts/schedule/exports/index.d.ts +0 -7
  89. package/dist/ts/schedule/exports/index.ts +0 -7
  90. package/dist/ts/schedule/exports/print.d.ts +0 -20
  91. package/dist/ts/schedule/exports/print.ts +0 -233
  92. package/dist/ts/schedule/index.d.ts +0 -26
  93. package/dist/ts/schedule/index.ts +0 -26
  94. package/dist/ts/schedule/models/event-settings-model.d.ts +0 -165
  95. package/dist/ts/schedule/models/event-settings.d.ts +0 -149
  96. package/dist/ts/schedule/models/event-settings.ts +0 -187
  97. package/dist/ts/schedule/models/field-options-model.d.ts +0 -37
  98. package/dist/ts/schedule/models/field-options.d.ts +0 -31
  99. package/dist/ts/schedule/models/field-options.ts +0 -41
  100. package/dist/ts/schedule/models/fields-model.d.ts +0 -129
  101. package/dist/ts/schedule/models/fields.d.ts +0 -117
  102. package/dist/ts/schedule/models/fields.ts +0 -149
  103. package/dist/ts/schedule/models/group-model.d.ts +0 -69
  104. package/dist/ts/schedule/models/group.d.ts +0 -60
  105. package/dist/ts/schedule/models/group.ts +0 -75
  106. package/dist/ts/schedule/models/header-rows-model.d.ts +0 -33
  107. package/dist/ts/schedule/models/header-rows.d.ts +0 -30
  108. package/dist/ts/schedule/models/header-rows.ts +0 -35
  109. package/dist/ts/schedule/models/models.d.ts +0 -14
  110. package/dist/ts/schedule/models/models.ts +0 -15
  111. package/dist/ts/schedule/models/quick-info-templates-model.d.ts +0 -52
  112. package/dist/ts/schedule/models/quick-info-templates.d.ts +0 -47
  113. package/dist/ts/schedule/models/quick-info-templates.ts +0 -56
  114. package/dist/ts/schedule/models/resources-model.d.ts +0 -122
  115. package/dist/ts/schedule/models/resources.d.ts +0 -106
  116. package/dist/ts/schedule/models/resources.ts +0 -138
  117. package/dist/ts/schedule/models/time-scale-model.d.ts +0 -57
  118. package/dist/ts/schedule/models/time-scale.d.ts +0 -50
  119. package/dist/ts/schedule/models/time-scale.ts +0 -61
  120. package/dist/ts/schedule/models/toolbar-model.d.ts +0 -196
  121. package/dist/ts/schedule/models/toolbar.d.ts +0 -176
  122. package/dist/ts/schedule/models/toolbar.ts +0 -196
  123. package/dist/ts/schedule/models/views-model.d.ts +0 -370
  124. package/dist/ts/schedule/models/views.d.ts +0 -335
  125. package/dist/ts/schedule/models/views.ts +0 -408
  126. package/dist/ts/schedule/models/work-hours-model.d.ts +0 -29
  127. package/dist/ts/schedule/models/work-hours.d.ts +0 -24
  128. package/dist/ts/schedule/models/work-hours.ts +0 -31
  129. package/dist/ts/schedule/popups/event-tooltip.d.ts +0 -16
  130. package/dist/ts/schedule/popups/event-tooltip.ts +0 -203
  131. package/dist/ts/schedule/popups/event-window.d.ts +0 -118
  132. package/dist/ts/schedule/popups/event-window.ts +0 -2055
  133. package/dist/ts/schedule/popups/form-validator.d.ts +0 -16
  134. package/dist/ts/schedule/popups/form-validator.ts +0 -110
  135. package/dist/ts/schedule/popups/quick-popups.d.ts +0 -78
  136. package/dist/ts/schedule/popups/quick-popups.ts +0 -1470
  137. package/dist/ts/schedule/renderer/agenda.d.ts +0 -45
  138. package/dist/ts/schedule/renderer/agenda.ts +0 -497
  139. package/dist/ts/schedule/renderer/day.d.ts +0 -20
  140. package/dist/ts/schedule/renderer/day.ts +0 -28
  141. package/dist/ts/schedule/renderer/header-renderer.d.ts +0 -48
  142. package/dist/ts/schedule/renderer/header-renderer.ts +0 -736
  143. package/dist/ts/schedule/renderer/month-agenda.d.ts +0 -29
  144. package/dist/ts/schedule/renderer/month-agenda.ts +0 -184
  145. package/dist/ts/schedule/renderer/month.d.ts +0 -61
  146. package/dist/ts/schedule/renderer/month.ts +0 -766
  147. package/dist/ts/schedule/renderer/renderer.d.ts +0 -13
  148. package/dist/ts/schedule/renderer/renderer.ts +0 -165
  149. package/dist/ts/schedule/renderer/timeline-header-row.d.ts +0 -15
  150. package/dist/ts/schedule/renderer/timeline-header-row.ts +0 -132
  151. package/dist/ts/schedule/renderer/timeline-month.d.ts +0 -29
  152. package/dist/ts/schedule/renderer/timeline-month.ts +0 -184
  153. package/dist/ts/schedule/renderer/timeline-view.d.ts +0 -31
  154. package/dist/ts/schedule/renderer/timeline-view.ts +0 -308
  155. package/dist/ts/schedule/renderer/timeline-year.d.ts +0 -22
  156. package/dist/ts/schedule/renderer/timeline-year.ts +0 -450
  157. package/dist/ts/schedule/renderer/vertical-view.d.ts +0 -63
  158. package/dist/ts/schedule/renderer/vertical-view.ts +0 -911
  159. package/dist/ts/schedule/renderer/view-base.d.ts +0 -83
  160. package/dist/ts/schedule/renderer/view-base.ts +0 -709
  161. package/dist/ts/schedule/renderer/week.d.ts +0 -22
  162. package/dist/ts/schedule/renderer/week.ts +0 -35
  163. package/dist/ts/schedule/renderer/work-week.d.ts +0 -22
  164. package/dist/ts/schedule/renderer/work-week.ts +0 -36
  165. package/dist/ts/schedule/renderer/year.d.ts +0 -46
  166. package/dist/ts/schedule/renderer/year.ts +0 -470
  167. package/dist/ts/schedule/timezone/timezone.d.ts +0 -16
  168. package/dist/ts/schedule/timezone/timezone.ts +0 -313
@@ -1,450 +0,0 @@
1
- /* eslint-disable @typescript-eslint/no-explicit-any */
2
- import { append, addClass, createElement, EventHandler } from '@syncfusion/ej2-base';
3
- import { Schedule } from '../base/schedule';
4
- import { Year } from './year';
5
- import { TdData, RenderCellEventArgs, CellTemplateArgs } from '../base/interface';
6
- import * as event from '../base/constant';
7
- import * as cls from '../base/css-constant';
8
- import * as util from '../base/util';
9
-
10
- /**
11
- * timeline year view
12
- */
13
- export class TimelineYear extends Year {
14
- public viewClass: string = 'e-timeline-year-view';
15
- public isInverseTableSelect: boolean = true;
16
-
17
- constructor(parent: Schedule) {
18
- super(parent);
19
- }
20
-
21
- protected getModuleName(): string {
22
- return 'timelineYear';
23
- }
24
-
25
- public renderHeader(headerWrapper: HTMLElement): void {
26
- const tr: HTMLElement = createElement('tr');
27
- headerWrapper.appendChild(tr);
28
- if (this.parent.activeViewOptions.orientation === 'Vertical' && this.parent.activeViewOptions.group.resources.length > 0 &&
29
- !this.parent.uiStateValues.isGroupAdaptive) {
30
- this.parent.resourceBase.renderResourceHeaderIndent(tr);
31
- } else {
32
- const leftHeaderCells: HTMLElement = createElement('td', { className: cls.LEFT_INDENT_CLASS });
33
- tr.appendChild(leftHeaderCells);
34
- leftHeaderCells.appendChild(this.renderResourceHeader(cls.LEFT_INDENT_WRAP_CLASS));
35
- }
36
- const isHorizontal: boolean = this.parent.activeViewOptions.orientation === 'Horizontal';
37
- const isGroup: boolean = this.parent.activeViewOptions.group.resources.length > 0;
38
- this.isInverseTableSelect = isHorizontal && !isGroup ? false : true;
39
- const td: HTMLElement = createElement('td');
40
- tr.appendChild(td);
41
- const container: HTMLElement = createElement('div', { className: cls.DATE_HEADER_CONTAINER_CLASS });
42
- td.appendChild(container);
43
- if (this.parent.activeViewOptions.orientation === 'Horizontal' && this.parent.activeViewOptions.group.resources.length > 0 &&
44
- !this.parent.uiStateValues.isGroupAdaptive) {
45
- container.appendChild(this.renderResourceHeader(cls.DATE_HEADER_WRAP_CLASS));
46
- this.columnCount = this.colLevels.slice(-1)[0].length;
47
- } else {
48
- const wrapper: HTMLElement = createElement('div', { className: cls.DATE_HEADER_WRAP_CLASS });
49
- container.appendChild(wrapper);
50
- const table: HTMLElement = this.createTableLayout() as HTMLElement;
51
- wrapper.appendChild(table);
52
- table.appendChild(this.createTableColGroup(this.columnCount));
53
- const innerTr: HTMLElement = createElement('tr');
54
- table.querySelector('tbody').appendChild(innerTr);
55
- const months: number[] = this.getMonths();
56
- const dayHeaderDates: Date[] = this.getMonthDates(new Date(this.parent.selectedDate.getFullYear(), months[0], 1));
57
- for (let column: number = 0; column < this.columnCount; column++) {
58
- const date: Date = new Date(this.parent.selectedDate.getFullYear(), months[parseInt(column.toString(), 10)], 1);
59
- const innerTd: HTMLElement = createElement('td', { className: cls.HEADER_CELLS_CLASS });
60
- if (this.parent.activeViewOptions.orientation === 'Horizontal') {
61
- if (this.parent.dayHeaderTemplate) {
62
- append(this.renderDayMonthHeaderTemplate(dayHeaderDates[parseInt(column.toString(), 10)], column, 'dayHeaderTemplate'), innerTd);
63
- } else {
64
- innerTd.innerHTML = `<span>${this.parent.getDayNames('abbreviated')[column % 7]}</span>`;
65
- }
66
- } else {
67
- if (this.parent.monthHeaderTemplate) {
68
- append(this.renderDayMonthHeaderTemplate(date, months[parseInt(column.toString(), 10)], 'monthHeaderTemplate'), innerTd);
69
- } else {
70
- innerTd.innerHTML = `<span>${this.getMonthName(date)}</span>`;
71
- }
72
- innerTd.setAttribute('data-date', date.getTime().toString());
73
- }
74
- innerTr.appendChild(innerTd);
75
- this.parent.trigger(event.renderCell, { elementType: 'headerCells', element: innerTd });
76
- }
77
- }
78
- }
79
-
80
- private renderResourceHeader(className: string): HTMLElement {
81
- const wrap: HTMLElement = createElement('div', { className: className });
82
- const tbl: Element = this.createTableLayout();
83
- wrap.appendChild(tbl);
84
- const trEle: Element = createElement('tr');
85
- if (this.parent.activeViewOptions.group.resources.length > 0) {
86
- this.colLevels = this.generateColumnLevels();
87
- } else {
88
- const colData: TdData[] = [{ className: [cls.HEADER_CELLS_CLASS], type: 'headerCell' }];
89
- this.colLevels = [colData];
90
- }
91
- for (const col of this.colLevels) {
92
- const ntr: Element = trEle.cloneNode() as Element;
93
- const count: TdData[] = className === cls.DATE_HEADER_WRAP_CLASS ? col : [col[0]];
94
- for (const c of count) {
95
- const tdEle: Element = createElement('td');
96
- if (c.className) { addClass([tdEle], c.className); }
97
- if (className === cls.DATE_HEADER_WRAP_CLASS) {
98
- if (c.template) { append(c.template, tdEle); }
99
- if (c.colSpan) { tdEle.setAttribute('colspan', c.colSpan.toString()); }
100
- if (c.groupIndex > -1) { tdEle.setAttribute('data-group-index', c.groupIndex.toString()); }
101
- this.setResourceHeaderContent(tdEle, c);
102
- }
103
- if (className === cls.LEFT_INDENT_WRAP_CLASS) {
104
- this.parent.renderHeaderIndentTemplate(c, tdEle);
105
- }
106
- const args: RenderCellEventArgs = { elementType: c.type, element: tdEle, date: c.date, groupIndex: c.groupIndex };
107
- this.parent.trigger(event.renderCell, args);
108
- ntr.appendChild(tdEle);
109
- }
110
- tbl.querySelector('tbody').appendChild(ntr);
111
- }
112
- if (className === cls.DATE_HEADER_WRAP_CLASS) {
113
- tbl.appendChild(this.createTableColGroup(this.colLevels.slice(-1)[0].length));
114
- }
115
- return wrap;
116
- }
117
-
118
- public renderContent(contentWrapper: HTMLElement): void {
119
- const tr: HTMLElement = createElement('tr');
120
- contentWrapper.appendChild(tr);
121
- const firstTd: HTMLElement = createElement('td');
122
- const lastTd: HTMLElement = createElement('td');
123
- const tdCollection: HTMLElement[] = [];
124
- let monthTBody: HTMLTableSectionElement;
125
- if (this.parent.activeViewOptions.orientation === 'Vertical' && this.parent.activeViewOptions.group.resources.length > 0 &&
126
- !this.parent.uiStateValues.isGroupAdaptive) {
127
- tdCollection.push(firstTd);
128
- firstTd.appendChild(this.parent.resourceBase.createResourceColumn());
129
- this.rowCount = this.parent.resourceBase.renderedResources.length;
130
- } else {
131
- tdCollection.push(firstTd);
132
- const monthWrapper: HTMLElement = createElement('div', { className: cls.MONTH_HEADER_WRAPPER });
133
- firstTd.appendChild(monthWrapper);
134
- monthWrapper.appendChild(this.createTableLayout() as HTMLElement);
135
- monthTBody = monthWrapper.querySelector('tbody');
136
- }
137
- tdCollection.push(lastTd);
138
- append(tdCollection, tr);
139
- const content: HTMLElement = createElement('div', { className: cls.CONTENT_WRAP_CLASS });
140
- lastTd.appendChild(content);
141
- const contentTable: HTMLElement = this.createTableLayout(cls.CONTENT_TABLE_CLASS) as HTMLElement;
142
- this.setAriaAttributes(contentTable);
143
- content.appendChild(contentTable);
144
- const eventWrapper: HTMLElement = createElement('div', { className: cls.EVENT_TABLE_CLASS });
145
- content.appendChild(eventWrapper);
146
- if (this.parent.virtualScrollModule) {
147
- this.parent.virtualScrollModule.renderVirtualTrack(content);
148
- }
149
- const contentTBody: HTMLTableSectionElement = contentTable.querySelector('tbody');
150
- if (this.parent.rowAutoHeight) {
151
- const addClassTable: HTMLElement[] = [contentTable];
152
- const monthHeader: HTMLElement =
153
- this.parent.element.querySelector('.' + cls.MONTH_HEADER_WRAPPER + ' .' + cls.SCHEDULE_TABLE_CLASS);
154
- if (monthHeader) {
155
- addClassTable.push(monthHeader);
156
- }
157
- addClass(addClassTable, cls.AUTO_HEIGHT);
158
- }
159
- if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
160
- const colCount: number = this.parent.activeViewOptions.orientation === 'Horizontal' ? this.colLevels.slice(-1)[0].length : this.columnCount;
161
- contentTable.appendChild(this.createTableColGroup(colCount));
162
- this.renderResourceContent(eventWrapper, monthTBody, contentTBody);
163
- } else {
164
- contentTable.appendChild(this.createTableColGroup(this.columnCount));
165
- this.renderDefaultContent(eventWrapper, monthTBody, contentTBody);
166
- }
167
- }
168
-
169
- private renderDefaultContent(wrapper: HTMLElement, monthBody: HTMLTableSectionElement, contentBody: HTMLTableSectionElement): void {
170
- const months: number[] = this.getMonths();
171
- const dayHeaderDates: Date[] = this.getMonthDates(new Date(this.parent.selectedDate.getFullYear(), months[0], 1));
172
- for (let month: number = 0; month < this.rowCount; month++) {
173
- wrapper.appendChild(createElement('div', { className: cls.APPOINTMENT_CONTAINER_CLASS }));
174
- let monthDate: Date = new Date(this.parent.selectedDate.getFullYear(), months[parseInt(month.toString(), 10)], 1);
175
- let monthStart: Date = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
176
- let monthEnd: Date = this.parent.calendarUtil.getMonthEndDate(new Date(monthDate.getTime()));
177
- const tr: HTMLElement = createElement('tr');
178
- const monthTr: HTMLElement = tr.cloneNode() as HTMLElement;
179
- monthBody.appendChild(monthTr);
180
- const contentTr: HTMLElement = tr.cloneNode() as HTMLElement;
181
- contentBody.appendChild(contentTr);
182
- const monthTd: HTMLElement = createElement('td', { className: cls.MONTH_HEADER_CLASS });
183
- if (this.parent.activeViewOptions.orientation === 'Horizontal') {
184
- if (this.parent.monthHeaderTemplate) {
185
- append(this.renderDayMonthHeaderTemplate(monthStart, month, 'monthHeaderTemplate'), monthTd);
186
- } else {
187
- monthTd.innerHTML = `<span>${this.getMonthName(monthDate)}</span>`;
188
- }
189
- monthTd.setAttribute('data-date', monthDate.getTime().toString());
190
- } else {
191
- if (this.parent.dayHeaderTemplate) {
192
- append(this.renderDayMonthHeaderTemplate(dayHeaderDates[parseInt(month.toString(), 10)], month, 'dayHeaderTemplate'), monthTd);
193
- } else {
194
- monthTd.innerHTML = `<span>${this.parent.getDayNames('abbreviated')[month % 7]}</span>`;
195
- }
196
- }
197
- monthTr.appendChild(monthTd);
198
- this.parent.trigger(event.renderCell, { elementType: 'leftHeaderCells', element: monthTd });
199
- let date: Date = new Date(monthStart.getTime());
200
- for (let column: number = 0; column < this.columnCount; column++) {
201
- let isDateAvail: boolean;
202
- if (this.parent.activeViewOptions.orientation === 'Vertical') {
203
- monthDate = new Date(this.parent.selectedDate.getFullYear(), months[parseInt(column.toString(), 10)], 1);
204
- monthStart = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
205
- monthEnd = this.parent.calendarUtil.getMonthEndDate(new Date(monthDate.getTime()));
206
- const dayDate: number = (month - monthStart.getDay()) + 1;
207
- date = new Date(this.parent.selectedDate.getFullYear(), months[parseInt(column.toString(), 10)], dayDate);
208
- isDateAvail = dayDate > 0 && date.getTime() < monthEnd.getTime();
209
- } else {
210
- isDateAvail = column >= monthStart.getDay() && date.getTime() < monthEnd.getTime();
211
- }
212
- const announcementText: string = this.parent.globalize.formatDate(date, {
213
- skeleton: 'full', calendar: this.parent.getCalendarMode()
214
- });
215
- const td: HTMLElement = createElement('td', {
216
- className: cls.WORK_CELLS_CLASS, attrs: { 'aria-label': announcementText }
217
- });
218
- contentTr.appendChild(td);
219
- const dateHeader: HTMLElement = createElement('div', {
220
- className: cls.DATE_HEADER_CLASS + ' ' + cls.NAVIGATE_CLASS,
221
- innerHTML: (isDateAvail) ?
222
- this.parent.globalize.formatDate(date, { skeleton: 'd', calendar: this.parent.getCalendarMode() }) : ''
223
- });
224
- if (isDateAvail) {
225
- const tds: HTMLElement[] = [td];
226
- const classList: string[] = [];
227
- if (this.parent.activeViewOptions.workDays.indexOf(date.getDay()) > -1) {
228
- classList.push(cls.WORKDAY_CLASS);
229
- }
230
- if (!this.parent.isMinMaxDate(date)) {
231
- addClass([td], cls.DISABLE_DATES);
232
- }
233
- if (this.isCurrentDate(date)) {
234
- classList.push(cls.CURRENT_DAY_CLASS);
235
- if (this.parent.activeViewOptions.orientation === 'Horizontal') {
236
- tds.push(this.element.querySelector('.' + cls.HEADER_CELLS_CLASS + `:nth-child(${column + 1})`));
237
- } else {
238
- tds.push(this.element.querySelectorAll('.' + cls.MONTH_HEADER_CLASS).item(month) as HTMLElement);
239
- }
240
- }
241
- if (classList.length > 0) {
242
- addClass(tds, classList);
243
- }
244
- } else {
245
- addClass([td], cls.OTHERMONTH_CLASS);
246
- if (!this.parent.isMinMaxDate(date)) {
247
- addClass([td], cls.DISABLE_DATES);
248
- }
249
- }
250
- if (td.classList.contains(cls.OTHERMONTH_CLASS)) {
251
- continue;
252
- } else {
253
- this.renderDates.push(new Date(date));
254
- }
255
- td.appendChild(dateHeader);
256
- if (isDateAvail) {
257
- td.setAttribute('data-date', date.getTime().toString());
258
- this.wireEvents(td);
259
- }
260
- this.renderCellTemplate({ date: date, type: 'workCells' }, td);
261
- this.parent.trigger(event.renderCell, { elementType: 'workCells', element: td, date: date });
262
- if (isDateAvail) {
263
- if (this.parent.activeViewOptions.orientation === 'Horizontal') {
264
- date = util.addDays(new Date(date.getTime()), 1);
265
- }
266
- }
267
- }
268
- }
269
- this.renderDates.splice(0, 1);
270
- }
271
-
272
- public getContentRows(): Element[] {
273
- const tRow: Element[] = [];
274
- const monthCells: number[] = this.getMonths();
275
- const existingGroupIndices: number[] = this.getGroupIndices();
276
- for (let row: number = 0; row < this.parent.resourceBase.renderedResources.length; row++) {
277
- let resData: TdData;
278
- if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
279
- resData = this.parent.resourceBase.renderedResources[parseInt(row.toString(), 10)];
280
- if (existingGroupIndices.length > 0 && existingGroupIndices.indexOf(resData.groupIndex) > -1) {
281
- continue;
282
- }
283
- }
284
- const tr: HTMLElement = createElement('tr');
285
- tRow.push(tr);
286
- let monthDate: Date = new Date(this.parent.selectedDate.getFullYear(), monthCells[parseInt(row.toString(), 10)], 1);
287
- let date: Date = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
288
- for (let month: number = 0; month < this.columnCount; month++) {
289
- let classList: string[] = [];
290
- const groupIndex: number = resData.groupIndex;
291
- classList = classList.concat(resData.className);
292
- if (classList.indexOf(cls.RESOURCE_PARENT_CLASS) > -1) {
293
- classList.push(cls.RESOURCE_GROUP_CELLS_CLASS);
294
- } else {
295
- classList.push(cls.WORKDAY_CLASS);
296
- }
297
- monthDate = new Date(this.parent.selectedDate.getFullYear(), monthCells[parseInt(month.toString(), 10)], 1);
298
- date = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
299
- const tdELe: HTMLElement = createElement('td', {
300
- className: cls.WORK_CELLS_CLASS,
301
- attrs: {
302
- 'aria-selected': 'false',
303
- 'data-date': date.getTime().toString()
304
- }
305
- });
306
- addClass([tdELe], classList);
307
- tdELe.setAttribute('data-group-index', groupIndex.toString());
308
- this.renderCellTemplate({ date: date, type: 'resourceGroupCells', groupIndex: groupIndex }, tdELe);
309
- this.wireEvents(tdELe);
310
- this.parent.trigger(event.renderCell, { elementType: 'resourceGroupCells', element: tdELe, date: date });
311
- tr.appendChild(tdELe);
312
- }
313
- }
314
- return tRow;
315
- }
316
-
317
- public renderResourceContent(wrapper: HTMLElement, monthBody: HTMLTableSectionElement, contentBody: HTMLTableSectionElement): void {
318
- const months: number[] = this.getMonths();
319
- for (let row: number = 0; row < this.rowCount; row++) {
320
- wrapper.appendChild(createElement('div', { className: cls.APPOINTMENT_CONTAINER_CLASS }));
321
- const tr: HTMLElement = createElement('tr');
322
- contentBody.appendChild(tr);
323
- let resData: TdData;
324
- if (this.parent.activeViewOptions.orientation === 'Vertical' && this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
325
- resData = this.parent.resourceBase.renderedResources[parseInt(row.toString(), 10)];
326
- }
327
- let monthDate: Date = new Date(this.parent.selectedDate.getFullYear(), months[parseInt(row.toString(), 10)], 1);
328
- let date: Date = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
329
- if (this.parent.activeViewOptions.orientation === 'Horizontal') {
330
- const monthTr: HTMLElement = tr.cloneNode() as HTMLElement;
331
- monthBody.appendChild(monthTr);
332
- const monthTd: HTMLElement = createElement('td', {
333
- className: cls.MONTH_HEADER_CLASS,
334
- attrs: { 'data-date': date.getTime().toString() }
335
- });
336
- if (this.parent.monthHeaderTemplate) {
337
- append(this.renderDayMonthHeaderTemplate(monthDate, row, 'monthHeaderTemplate'), monthTd);
338
- } else {
339
- monthTd.innerHTML = `<span>${this.getMonthName(monthDate)}</span>`;
340
- }
341
- monthTr.appendChild(monthTd);
342
- }
343
- for (let month: number = 0; month < this.columnCount; month++) {
344
- let classList: string[] = [];
345
- let groupIndex: number;
346
- if (this.parent.activeViewOptions.orientation === 'Vertical') {
347
- groupIndex = resData.groupIndex;
348
- classList = classList.concat(resData.className);
349
- if (classList.indexOf(cls.RESOURCE_PARENT_CLASS) > -1) {
350
- classList.push(cls.RESOURCE_GROUP_CELLS_CLASS);
351
- } else {
352
- classList.push(cls.WORKDAY_CLASS);
353
- }
354
- monthDate = new Date(this.parent.selectedDate.getFullYear(), months[parseInt(month.toString(), 10)], 1);
355
- date = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
356
- } else {
357
- groupIndex = this.colLevels.slice(-1)[0][parseInt(month.toString(), 10)].groupIndex;
358
- classList.push(cls.WORKDAY_CLASS);
359
- }
360
- const startDateText: string = this.parent.globalize.formatDate(date, { type: 'dateTime', skeleton: 'full', calendar: this.parent.getCalendarMode() });
361
- const endDateText: string = this.parent.globalize.formatDate(this.parent.calendarUtil.getMonthEndDate(new Date(monthDate.getTime())), { type: 'dateTime', skeleton: 'full', calendar: this.parent.getCalendarMode() });
362
- const td: HTMLElement = createElement('td', {
363
- className: cls.WORK_CELLS_CLASS,
364
- attrs: {
365
- 'aria-selected': 'false',
366
- 'data-date': date.getTime().toString(),
367
- 'aria-label': startDateText + ' ' + this.parent.localeObj.getConstant('endAt') + ' ' + endDateText
368
- }
369
- });
370
- addClass([td], classList);
371
- td.setAttribute('data-group-index', groupIndex.toString());
372
- this.renderCellTemplate({ date: date, type: 'resourceGroupCells', groupIndex: groupIndex }, td);
373
- this.wireEvents(td);
374
- tr.appendChild(td);
375
- this.parent.trigger(event.renderCell, { elementType: 'resourceGroupCells', element: td, date: date });
376
- }
377
- }
378
- if (this.parent.activeViewOptions.orientation === 'Vertical') {
379
- this.collapseRows(this.parent.element.querySelector('.' + cls.CONTENT_WRAP_CLASS));
380
- }
381
- }
382
-
383
- private renderDayMonthHeaderTemplate(date: Date, column: number, type: string): Element[] {
384
- const args: CellTemplateArgs = { date: date, type: type === 'dayHeaderTemplate' ? 'dayHeader' : 'monthHeader' };
385
- const dayId: string = `schedule_${this.parent.activeViewOptions.dayHeaderTemplateName}dayHeaderTemplate`;
386
- const monthId: string = `schedule_${this.parent.activeViewOptions.dayHeaderTemplateName}monthHeaderTemplate`;
387
- if (type === 'dayHeaderTemplate') {
388
- args.day = this.parent.getDayNames('wide')[column % 7];
389
- return [].slice.call(this.parent.getDayHeaderTemplate()(args, this.parent, 'dayHeaderTemplate', dayId,
390
- false, undefined, undefined, this.parent.root));
391
- } else {
392
- return [].slice.call(this.parent.getMonthHeaderTemplate()(args, this.parent, 'monthHeaderTemplate', monthId,
393
- false, undefined, undefined, this.parent.root));
394
- }
395
- }
396
-
397
- private renderCellTemplate(data: Record<string, any>, td: HTMLElement): void {
398
- if (!this.parent.activeViewOptions.cellTemplate || td.classList.contains(cls.OTHERMONTH_CLASS)) {
399
- return;
400
- }
401
- const args: CellTemplateArgs = { date: data.date as Date, type: data.type as string };
402
- if (data.groupIndex) {
403
- args.groupIndex = data.groupIndex as number;
404
- }
405
- const scheduleId: string = this.parent.element.id + '_';
406
- const viewName: string = this.parent.activeViewOptions.cellTemplateName;
407
- const templateId: string = scheduleId + viewName + 'cellTemplate';
408
- const cellTemplate: HTMLElement[] = [].slice.call(this.parent.getCellTemplate()(args, this.parent, 'cellTemplate', templateId,
409
- false, undefined, undefined, this.parent.root));
410
- append(cellTemplate, td);
411
- }
412
-
413
- public scrollToDate(scrollDate: Date): void {
414
- let date: number;
415
- if (this.parent.activeViewOptions.group.resources !== null && this.parent.activeViewOptions.group.resources.length > 0 &&
416
- !this.parent.uiStateValues.isGroupAdaptive) {
417
- date = +new Date(util.resetTime(util.firstDateOfMonth(scrollDate)));
418
- } else {
419
- date = +new Date(util.resetTime(scrollDate));
420
- }
421
- const element: HTMLElement = this.element.querySelector('[data-date="' + date + '"]');
422
- if (element) {
423
- const wrap: Element = this.getScrollableElement();
424
- if (this.parent.enableRtl) {
425
- const conTable: HTMLElement = this.element.querySelector('.' + cls.CONTENT_TABLE_CLASS) as HTMLElement;
426
- wrap.scrollLeft = -(conTable.offsetWidth - element.offsetLeft - element.offsetWidth);
427
- } else {
428
- wrap.scrollLeft = element.offsetLeft;
429
- }
430
- wrap.scrollTop = element.offsetTop;
431
- }
432
- }
433
-
434
- public getScrollableElement(): Element {
435
- if (this.parent.isAdaptive && !this.isTimelineView()) {
436
- return this.element.querySelector('.' + cls.SCROLL_CONTAINER_CLASS);
437
- } else {
438
- return this.getContentAreaElement();
439
- }
440
- }
441
-
442
- private wireEvents(element: HTMLElement): void {
443
- EventHandler.add(element, 'mousedown', this.parent.workCellAction.cellMouseDown, this.parent.workCellAction);
444
- EventHandler.add(element, 'click', this.parent.workCellAction.cellClick, this.parent.workCellAction);
445
- if (!this.parent.isAdaptive) {
446
- EventHandler.add(element, 'dblclick', this.parent.workCellAction.cellDblClick, this.parent.workCellAction);
447
- }
448
- }
449
-
450
- }
@@ -1,63 +0,0 @@
1
- import { Schedule } from '../base/schedule';
2
- import { ViewBase } from './view-base';
3
- import { TdData, IRenderer, TimeSlotData, CallbackFunction } from '../base/interface';
4
- /**
5
- * vertical view
6
- */
7
- export declare class VerticalView extends ViewBase implements IRenderer {
8
- currentTimeIndicatorTimer: number;
9
- viewClass: string;
10
- isInverseTableSelect: boolean;
11
- baseCssClass: string;
12
- private appointment;
13
- constructor(parent: Schedule);
14
- protected getModuleName(): string;
15
- addEventListener(): void;
16
- removeEventListener(): void;
17
- renderEvents(): void;
18
- private onContentScroll;
19
- private onAdaptiveMove;
20
- private onAdaptiveScroll;
21
- scrollLeftPanel(target: HTMLElement): void;
22
- private scrollUiUpdate;
23
- setContentHeight(element: HTMLElement, leftPanelElement: HTMLElement, height: number): void;
24
- scrollToWorkHour(): void;
25
- scrollToHour(hour: string, scrollDate?: Date): void;
26
- scrollToDate(scrollDate: Date): void;
27
- generateColumnLevels(): TdData[][];
28
- getDateSlots(renderDates: Date[], workDays: number[], workStartHour?: string, workEndHour?: string): TdData[];
29
- private isWorkHourRange;
30
- highlightCurrentTime(): void;
31
- getCurrentTimeIndicatorIndex(): number[];
32
- private clearCurrentTimeIndicatorTimer;
33
- private updateCurrentTimeIndicatorTimer;
34
- removeCurrentTimeIndicatorElements(): void;
35
- changeCurrentTimePosition(): void;
36
- getTopFromDateTime(date: Date): number;
37
- private getWorkCellHeight;
38
- private getTdContent;
39
- refreshHeader(): void;
40
- renderLayout(type: string): void;
41
- renderHeader(): void;
42
- renderContent(): void;
43
- private renderLeftIndent;
44
- renderDatesHeader(): Element;
45
- createAllDayRow(table: Element, tdData: TdData[]): void;
46
- createTd(td: TdData): Element;
47
- private wireCellEvents;
48
- private wireMouseEvents;
49
- private renderTimeCells;
50
- renderContentArea(): Element;
51
- renderContentTable(table: Element): void;
52
- getContentRows(): Element[];
53
- createContentTd(tdData: TdData, r: TimeSlotData, td: Element): Element;
54
- getContentTdClass(r: TimeSlotData): string[];
55
- private renderContentTableHeader;
56
- getScrollableElement(): Element;
57
- getLeftPanelElement(): HTMLElement;
58
- getEndDateFromStartDate(start: Date): Date;
59
- private getStartEndHours;
60
- getTimeSlotRows(handler?: CallbackFunction): TimeSlotData[];
61
- getAdjustedDate(startTime: Date): Date;
62
- destroy(): void;
63
- }