Skip to content

Commit 5b32aa7

Browse files
TucchhaaTucchhaa
authored
Scheduler - Appointments Refactoring - Rendering (#33079)
1 parent ba3d73e commit 5b32aa7

34 files changed

Lines changed: 2934 additions & 52 deletions

‎e2e/testcafe-devextreme/tests/scheduler/common/layout/adaptive/etalons/view=day-crossScrolling=false-horizontal-rtl (fluent.blue.light).png‎

-1 Bytes
Loading

‎e2e/testcafe-devextreme/tests/scheduler/common/layout/adaptive/etalons/view=day-crossScrolling=false-rtl (fluent.blue.light).png‎

-2 Bytes
Loading

‎e2e/testcafe-devextreme/tests/scheduler/common/layout/adaptive/etalons/view=day-crossScrolling=false-vertical-rtl (fluent.blue.light).png‎

0 Bytes
Loading

‎e2e/testcafe-devextreme/tests/scheduler/common/layout/adaptive/etalons/view=day-crossScrolling=true-horizontal-rtl (fluent.blue.light).png‎

0 Bytes
Loading

‎e2e/testcafe-devextreme/tests/scheduler/common/layout/adaptive/etalons/view=day-crossScrolling=true-rtl (fluent.blue.light).png‎

-2 Bytes
Loading

‎e2e/testcafe-devextreme/tests/scheduler/common/layout/adaptive/etalons/view=day-crossScrolling=true-vertical-rtl (fluent.blue.light).png‎

1 Byte
Loading

‎packages/devextreme-scss/scss/widgets/fluent/scheduler/_index.scss‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -206,25 +206,25 @@ $fluent-scheduler-agenda-time-panel-cell-padding: 8px;
206206

207207
&.dx-scheduler-appointment-recurrence {
208208
@container (max-height: #{$fluent-scheduler-appointment-15min-height}) {
209-
.dx-item-content.dx-scheduler-appointment-content {
209+
.dx-scheduler-appointment-content {
210210
padding-right: $fluent-scheduler-appointment-10min-recurrence-padding-right;
211211
}
212212
}
213213

214214
@container (min-height: #{$fluent-scheduler-appointment-15min-height}) and (max-height: #{$fluent-scheduler-appointment-20min-height}) {
215-
.dx-item-content.dx-scheduler-appointment-content {
215+
.dx-scheduler-appointment-content {
216216
padding-right: $fluent-scheduler-appointment-15min-recurrence-padding-right;
217217
}
218218
}
219219

220220
@container (min-height: #{$fluent-scheduler-appointment-20min-height}) and (max-height: #{$fluent-scheduler-appointment-25min-height}) {
221-
.dx-item-content.dx-scheduler-appointment-content {
221+
.dx-scheduler-appointment-content {
222222
padding-right: $fluent-scheduler-appointment-20min-recurrence-padding-right;
223223
}
224224
}
225225
}
226226

227-
.dx-item-content.dx-scheduler-appointment-content {
227+
.dx-scheduler-appointment-content {
228228
@container (max-height: #{$fluent-scheduler-appointment-25min-height}) {
229229
display: flex;
230230
align-items: center;
@@ -242,7 +242,7 @@ $fluent-scheduler-agenda-time-panel-cell-padding: 8px;
242242
}
243243

244244
@container (max-height: #{$fluent-scheduler-appointment-15min-height}) {
245-
.dx-item-content.dx-scheduler-appointment-content {
245+
.dx-scheduler-appointment-content {
246246
.dx-scheduler-appointment-title {
247247
font-size: $fluent-scheduler-appointment-10min-title-font-size;
248248
line-height: $fluent-scheduler-appointment-10min-title-line-height;
@@ -256,7 +256,7 @@ $fluent-scheduler-agenda-time-panel-cell-padding: 8px;
256256
}
257257

258258
@container (min-height: #{$fluent-scheduler-appointment-15min-height}) and (max-height: #{$fluent-scheduler-appointment-20min-height}) {
259-
.dx-item-content.dx-scheduler-appointment-content {
259+
.dx-scheduler-appointment-content {
260260
.dx-scheduler-appointment-title {
261261
font-size: $fluent-scheduler-appointment-15min-title-font-size;
262262
line-height: $fluent-scheduler-appointment-15min-title-line-height;
@@ -270,7 +270,7 @@ $fluent-scheduler-agenda-time-panel-cell-padding: 8px;
270270
}
271271

272272
@container (min-height: #{$fluent-scheduler-appointment-20min-height}) and (max-height: #{$fluent-scheduler-appointment-25min-height}) {
273-
.dx-item-content.dx-scheduler-appointment-content {
273+
.dx-scheduler-appointment-content {
274274
.dx-scheduler-appointment-recurrence-icon {
275275
right: $fluent-scheduler-appointment-20min-icon-right;
276276
}

‎packages/devextreme-scss/scss/widgets/generic/scheduler/_index.scss‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -570,25 +570,25 @@ $generic-scheduler-agenda-group-header-padding: $generic-scheduler-agenda-time-c
570570

571571
&.dx-scheduler-appointment-recurrence {
572572
@container (max-height: #{$generic-scheduler-appointment-15min-height}) {
573-
.dx-item-content.dx-scheduler-appointment-content {
573+
.dx-scheduler-appointment-content {
574574
padding-right: $generic-scheduler-appointment-10min-recurrence-padding-right;
575575
}
576576
}
577577

578578
@container (min-height: #{$generic-scheduler-appointment-15min-height}) and (max-height: #{$generic-scheduler-appointment-20min-height}) {
579-
.dx-item-content.dx-scheduler-appointment-content {
579+
.dx-scheduler-appointment-content {
580580
padding-right: $generic-scheduler-appointment-15min-recurrence-padding-right;
581581
}
582582
}
583583

584584
@container (min-height: #{$generic-scheduler-appointment-20min-height}) and (max-height: #{$generic-scheduler-appointment-25min-height}) {
585-
.dx-item-content.dx-scheduler-appointment-content {
585+
.dx-scheduler-appointment-content {
586586
padding-right: $generic-scheduler-appointment-20min-recurrence-padding-right;
587587
}
588588
}
589589
}
590590

591-
.dx-item-content.dx-scheduler-appointment-content {
591+
.dx-scheduler-appointment-content {
592592
@container (max-height: #{$generic-scheduler-appointment-25min-height}) {
593593
display: flex;
594594
align-items: center;
@@ -606,7 +606,7 @@ $generic-scheduler-agenda-group-header-padding: $generic-scheduler-agenda-time-c
606606
}
607607

608608
@container (max-height: #{$generic-scheduler-appointment-15min-height}) {
609-
.dx-item-content.dx-scheduler-appointment-content {
609+
.dx-scheduler-appointment-content {
610610
.dx-scheduler-appointment-title {
611611
font-size: $generic-scheduler-appointment-10min-title-font-size;
612612
line-height: $generic-scheduler-appointment-10min-title-line-height;
@@ -620,7 +620,7 @@ $generic-scheduler-agenda-group-header-padding: $generic-scheduler-agenda-time-c
620620
}
621621

622622
@container (min-height: #{$generic-scheduler-appointment-15min-height}) and (max-height: #{$generic-scheduler-appointment-20min-height}) {
623-
.dx-item-content.dx-scheduler-appointment-content {
623+
.dx-scheduler-appointment-content {
624624
.dx-scheduler-appointment-title {
625625
font-size: $generic-scheduler-appointment-15min-title-font-size;
626626
line-height: $generic-scheduler-appointment-15min-title-line-height;
@@ -635,7 +635,7 @@ $generic-scheduler-agenda-group-header-padding: $generic-scheduler-agenda-time-c
635635

636636
@if $size == "compact" {
637637
@container (max-height: #{$generic-scheduler-appointment-10min-height}) {
638-
.dx-item-content.dx-scheduler-appointment-content {
638+
.dx-scheduler-appointment-content {
639639
display: none;
640640
}
641641
}

‎packages/devextreme-scss/scss/widgets/material/scheduler/_index.scss‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -179,25 +179,25 @@ $material-scheduler-agenda-time-panel-cell-padding: 8px;
179179

180180
&.dx-scheduler-appointment-recurrence {
181181
@container (max-height: #{$material-scheduler-appointment-15min-height}) {
182-
.dx-item-content.dx-scheduler-appointment-content {
182+
.dx-scheduler-appointment-content {
183183
padding-right: $material-scheduler-appointment-10min-recurrence-padding-right;
184184
}
185185
}
186186

187187
@container (min-height: #{$material-scheduler-appointment-15min-height}) and (max-height: #{$material-scheduler-appointment-20min-height}) {
188-
.dx-item-content.dx-scheduler-appointment-content {
188+
.dx-scheduler-appointment-content {
189189
padding-right: $material-scheduler-appointment-15min-recurrence-padding-right;
190190
}
191191
}
192192

193193
@container (min-height: #{$material-scheduler-appointment-20min-height}) and (max-height: #{$material-scheduler-appointment-25min-height}) {
194-
.dx-item-content.dx-scheduler-appointment-content {
194+
.dx-scheduler-appointment-content {
195195
padding-right: $material-scheduler-appointment-20min-recurrence-padding-right;
196196
}
197197
}
198198
}
199199

200-
.dx-item-content.dx-scheduler-appointment-content {
200+
.dx-scheduler-appointment-content {
201201
@container (max-height: #{$material-scheduler-appointment-25min-height}) {
202202
display: flex;
203203
align-items: center;
@@ -215,7 +215,7 @@ $material-scheduler-agenda-time-panel-cell-padding: 8px;
215215
}
216216

217217
@container (max-height: #{$material-scheduler-appointment-15min-height}) {
218-
.dx-item-content.dx-scheduler-appointment-content {
218+
.dx-scheduler-appointment-content {
219219
.dx-scheduler-appointment-title {
220220
font-size: $material-scheduler-appointment-10min-title-font-size;
221221
line-height: $material-scheduler-appointment-10min-title-line-height;
@@ -229,7 +229,7 @@ $material-scheduler-agenda-time-panel-cell-padding: 8px;
229229
}
230230

231231
@container (min-height: #{$material-scheduler-appointment-15min-height}) and (max-height: #{$material-scheduler-appointment-20min-height}) {
232-
.dx-item-content.dx-scheduler-appointment-content {
232+
.dx-scheduler-appointment-content {
233233
.dx-scheduler-appointment-title {
234234
font-size: $material-scheduler-appointment-15min-title-font-size;
235235
line-height: $material-scheduler-appointment-15min-title-line-height;
@@ -243,7 +243,7 @@ $material-scheduler-agenda-time-panel-cell-padding: 8px;
243243
}
244244

245245
@container (min-height: #{$material-scheduler-appointment-20min-height}) and (max-height: #{$material-scheduler-appointment-25min-height}) {
246-
.dx-item-content.dx-scheduler-appointment-content {
246+
.dx-scheduler-appointment-content {
247247
.dx-scheduler-appointment-recurrence-icon {
248248
right: $material-scheduler-appointment-20min-icon-right;
249249
}

‎packages/devextreme/js/__internal/scheduler/appointments_new/__mock__/appointment_properties.ts‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import { EmptyTemplate } from '@ts/core/templates/m_empty_template';
2+
import { mockAppointmentDataAccessor } from '@ts/scheduler/__mock__/appointment_data_accessor.mock';
3+
import type { SafeAppointment, TargetedAppointment } from '@ts/scheduler/types';
4+
import type { AppointmentDataAccessor } from '@ts/scheduler/utils/data_accessor/appointment_data_accessor';
5+
6+
import type { BaseAppointmentViewProperties } from '../appointment/base_appointment';
7+
8+
export const getBaseAppointmentProperties = (
9+
appointmentData: SafeAppointment,
10+
targetedAppointmentData?: TargetedAppointment,
11+
): BaseAppointmentViewProperties => {
12+
const normalizedTargetedAppointmentData = targetedAppointmentData ?? {
13+
...appointmentData,
14+
displayStartDate: appointmentData.startDate as Date,
15+
displayEndDate: appointmentData.endDate as Date,
16+
};
17+
18+
const config: BaseAppointmentViewProperties = {
19+
appointmentData,
20+
targetedAppointmentData: normalizedTargetedAppointmentData,
21+
appointmentTemplate: new EmptyTemplate(),
22+
onAppointmentRendered: () => {},
23+
getDataAccessor: (): AppointmentDataAccessor => mockAppointmentDataAccessor,
24+
getResourceColor: (): Promise<string | undefined> => Promise.resolve(undefined),
25+
};
26+
27+
return config;
28+
};

0 commit comments

Comments
 (0)