Skip to content

Commit 531e01e

Browse files
sjburweb-flowaleksei-semikozov
authored
Scheduler: refactor workspaces module (TS): part 2 (DevExpress#33864)
Co-authored-by: Sergio Bur <noreply@github.com> Co-authored-by: Aleksei Semikozov <alwexy@gmail.com>
1 parent d5070f2 commit 531e01e

16 files changed

Lines changed: 290 additions & 138 deletions

File tree

‎packages/devextreme/js/__internal/scheduler/appointments/resizing/types.ts‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { TimeZoneCalculator } from '../../r1/timezone_calculator';
2-
import type { ViewDataProviderType } from '../../types';
2+
import type { DOMMetaData, ViewDataProviderType } from '../../types';
33
import type { AppointmentDataAccessor } from '../../utils/data_accessor/appointment_data_accessor';
44
import type { AppointmentItemViewModel } from '../../view_model/types';
55

@@ -21,10 +21,7 @@ export interface GetAppointmentDateRangeOptions {
2121
timeZoneCalculator: TimeZoneCalculator;
2222
dataAccessors: AppointmentDataAccessor;
2323
rtlEnabled?: boolean;
24-
DOMMetaData: {
25-
allDayPanelCellsMeta: Rect[];
26-
dateTableCellsMeta: Rect[][];
27-
};
24+
DOMMetaData: DOMMetaData;
2825
viewOffset: number;
2926
}
3027

‎packages/devextreme/js/__internal/scheduler/types.ts‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -178,6 +178,23 @@ export interface ViewDataMap {
178178
allDayPanelMap: CellInfo[];
179179
}
180180

181+
export interface GroupedDataMap {
182+
dateTableGroupedMap: CellInfo[][][];
183+
allDayPanelGroupedMap: CellInfo[][];
184+
}
185+
186+
export interface CellRect {
187+
top: number;
188+
left: number;
189+
width: number;
190+
height: number;
191+
}
192+
193+
export interface DOMMetaData {
194+
dateTableCellsMeta: CellRect[][];
195+
allDayPanelCellsMeta: CellRect[];
196+
}
197+
181198
export interface DateHeaderCellData extends ViewCellData {
182199
colSpan: number;
183200
}

‎packages/devextreme/js/__internal/scheduler/view_model/generate_view_model/options/get_panel_collector_options.ts‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import type { Orientation } from '@js/common';
22
import type Scheduler from '@ts/scheduler/m_scheduler';
3+
import type { DOMMetaData } from '@ts/scheduler/types';
34

45
import type { PanelName } from '../../types';
56
import type { CollectorCSS, RealSize } from '../steps/add_geometry/types';
@@ -22,10 +23,7 @@ export const getPanelCollectorOptions = (schedulerStore: Scheduler, {
2223
DOMMetaData,
2324
panelName,
2425
}: {
25-
DOMMetaData: {
26-
dateTableCellsMeta: RealSize[][];
27-
allDayPanelCellsMeta: RealSize[];
28-
};
26+
DOMMetaData: DOMMetaData;
2927
alwaysReserveSpaceForCollector: boolean;
3028
isTimelineView: boolean;
3129
viewOrientation: Orientation;

packages/devextreme/js/__internal/scheduler/workspaces/m_cells_selection_controller.ts renamed to packages/devextreme/js/__internal/scheduler/workspaces/cells_selection_controller.ts

Lines changed: 86 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,73 @@
11
import { isDateAndTimeView } from '@ts/scheduler/r1/utils/index';
2+
import type { ViewCellData, ViewType } from '@ts/scheduler/types';
3+
4+
interface GridPosition {
5+
rowIndex: number;
6+
columnIndex: number;
7+
}
8+
9+
interface EdgeIndices {
10+
firstColumnIndex: number;
11+
lastColumnIndex: number;
12+
firstRowIndex: number;
13+
lastRowIndex: number;
14+
}
15+
16+
interface ArrowClickOptions {
17+
key: 'up' | 'down' | 'left' | 'right';
18+
focusedCellPosition?: GridPosition;
19+
focusedCellData: ViewCellData;
20+
edgeIndices: EdgeIndices;
21+
getCellDataByPosition: (rowIndex: number, columnIndex: number, isAllDay: boolean) => ViewCellData;
22+
isAllDayPanelCell: boolean;
23+
isRTL: boolean;
24+
isGroupedByDate: boolean;
25+
groupCount: number;
26+
isMultiSelection: boolean;
27+
isMultiSelectionAllowed: boolean;
28+
viewType: ViewType;
29+
}
30+
31+
interface NextColumnPositionOptions extends ArrowClickOptions {
32+
direction: 'next' | 'prev';
33+
focusedCellPosition: GridPosition;
34+
}
35+
36+
interface ProcessEdgeCellOptions {
37+
nextColumnIndex: number;
38+
rowIndex: number;
39+
columnIndex: number;
40+
firstColumnIndex: number;
41+
lastColumnIndex: number;
42+
firstRowIndex: number;
43+
lastRowIndex: number;
44+
step: number;
45+
}
46+
47+
interface MoveToCellOptions {
48+
isMultiSelection: boolean;
49+
isMultiSelectionAllowed: boolean;
50+
focusedCellData: ViewCellData;
51+
currentCellData: ViewCellData;
52+
isVirtualCell?: boolean;
53+
}
254

355
export class CellsSelectionController {
4-
handleArrowClick(options) {
56+
handleArrowClick(options: ArrowClickOptions): ViewCellData {
557
const {
658
key,
759
focusedCellPosition,
860
edgeIndices,
961
getCellDataByPosition,
1062
isAllDayPanelCell,
63+
focusedCellData,
1164
} = options;
1265

13-
let nextCellIndices;
66+
if (!focusedCellPosition) {
67+
return focusedCellData;
68+
}
69+
70+
let nextCellIndices: GridPosition = focusedCellPosition;
1471

1572
switch (key) {
1673
case 'down':
@@ -22,12 +79,14 @@ export class CellsSelectionController {
2279
case 'left':
2380
nextCellIndices = this.getCellFromNextColumnPosition({
2481
...options,
82+
focusedCellPosition,
2583
direction: 'prev',
2684
});
2785
break;
2886
case 'right':
2987
nextCellIndices = this.getCellFromNextColumnPosition({
3088
...options,
89+
focusedCellPosition,
3190
direction: 'next',
3291
});
3392
break;
@@ -47,7 +106,11 @@ export class CellsSelectionController {
47106
});
48107
}
49108

50-
getCellFromNextRowPosition(focusedCellPosition, direction, edgeIndices) {
109+
getCellFromNextRowPosition(
110+
focusedCellPosition: GridPosition,
111+
direction: 'next' | 'prev',
112+
edgeIndices: EdgeIndices,
113+
): GridPosition {
51114
const {
52115
columnIndex,
53116
rowIndex,
@@ -66,7 +129,7 @@ export class CellsSelectionController {
66129
};
67130
}
68131

69-
getCellFromNextColumnPosition(options) {
132+
getCellFromNextColumnPosition(options: NextColumnPositionOptions): GridPosition {
70133
const {
71134
focusedCellPosition,
72135
direction,
@@ -115,7 +178,7 @@ export class CellsSelectionController {
115178
});
116179
}
117180

118-
private processEdgeCell(options) {
181+
private processEdgeCell(options: ProcessEdgeCellOptions): GridPosition {
119182
const {
120183
nextColumnIndex,
121184
rowIndex,
@@ -133,7 +196,7 @@ export class CellsSelectionController {
133196
const isRightEdgeCell = nextColumnIndex > lastColumnIndex;
134197

135198
if (isLeftEdgeCell) {
136-
const columnIndexInNextRow = lastColumnIndex - (step - columnIndex % step - 1);
199+
const columnIndexInNextRow = lastColumnIndex - (step - (columnIndex % step) - 1);
137200
const nextRowIndex = rowIndex - 1;
138201
const isValidRowIndex = nextRowIndex >= firstRowIndex;
139202

@@ -142,7 +205,7 @@ export class CellsSelectionController {
142205
}
143206

144207
if (isRightEdgeCell) {
145-
const columnIndexInNextRow = firstColumnIndex + columnIndex % step;
208+
const columnIndexInNextRow = firstColumnIndex + (columnIndex % step);
146209
const nextRowIndex = rowIndex + 1;
147210
const isValidRowIndex = nextRowIndex <= lastRowIndex;
148211

@@ -156,34 +219,45 @@ export class CellsSelectionController {
156219
};
157220
}
158221

159-
moveToCell(options) {
222+
moveToCell(options: MoveToCellOptions): ViewCellData {
160223
const {
161224
isMultiSelection,
162225
isMultiSelectionAllowed,
163226
focusedCellData,
164227
currentCellData,
228+
isVirtualCell,
165229
} = options;
166230

167231
const isValidMultiSelection = isMultiSelection && isMultiSelectionAllowed;
168232

169233
const nextFocusedCellData = isValidMultiSelection
170-
? this.getNextCellData(currentCellData, focusedCellData)
234+
? this.getNextCellData(currentCellData, focusedCellData, isVirtualCell)
171235
: currentCellData;
172236

173237
return nextFocusedCellData;
174238
}
175239

176-
private getNextCellData(nextFocusedCellData, focusedCellData, isVirtualCell?: any) {
240+
private getNextCellData(
241+
nextFocusedCellData: ViewCellData,
242+
focusedCellData: ViewCellData,
243+
isVirtualCell?: boolean,
244+
): ViewCellData {
177245
if (isVirtualCell) {
178246
return focusedCellData;
179247
}
180248

181-
const isValidNextFocusedCell = this.isValidNextFocusedCell(nextFocusedCellData, focusedCellData);
249+
const isValidNextFocusedCell = this.isValidNextFocusedCell(
250+
nextFocusedCellData,
251+
focusedCellData,
252+
);
182253

183254
return isValidNextFocusedCell ? nextFocusedCellData : focusedCellData;
184255
}
185256

186-
private isValidNextFocusedCell(nextFocusedCellData, focusedCellData) {
257+
private isValidNextFocusedCell(
258+
nextFocusedCellData: ViewCellData,
259+
focusedCellData: ViewCellData | null | undefined,
260+
): boolean {
187261
if (!focusedCellData) {
188262
return true;
189263
}

packages/devextreme/js/__internal/scheduler/workspaces/m_cells_selection_state.ts renamed to packages/devextreme/js/__internal/scheduler/workspaces/cells_selection_state.ts

Lines changed: 40 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,27 @@
1+
import type { CellPositionData, ViewCellData } from '@ts/scheduler/types';
2+
3+
import type { CellPosition } from './view_model/m_types';
14
import type ViewDataProvider from './view_model/m_view_data_provider';
25

36
export default class CellsSelectionState {
4-
private focusedCell: any = null;
7+
private focusedCell: ViewCellData | null = null;
58

6-
private selectedCells: any = null;
9+
private selectedCells: ViewCellData[] | null = null;
710

8-
private firstSelectedCell: any = null;
11+
private firstSelectedCell: ViewCellData | null = null;
912

10-
private prevFocusedCell: any = null;
13+
private prevFocusedCell: ViewCellData | null = null;
1114

12-
private prevFirstSelectedCell: any;
15+
private prevFirstSelectedCell: ViewCellData | null | undefined;
1316

14-
private prevSelectedCells: any = null;
17+
private prevSelectedCells: ViewCellData[] | null = null;
1518

1619
constructor(public viewDataProvider: ViewDataProvider) {}
1720

18-
getFocusedCell() {
21+
getFocusedCell(): {
22+
coordinates: CellPositionData | undefined,
23+
cellData: ViewCellData,
24+
} | undefined {
1925
const { focusedCell } = this;
2026

2127
if (!focusedCell) {
@@ -31,14 +37,16 @@ export default class CellsSelectionState {
3137
return { coordinates: cellPosition, cellData: focusedCell };
3238
}
3339

34-
setFocusedCell(rowIndex, columnIndex, isAllDay) {
40+
setFocusedCell(rowIndex: number, columnIndex: number, isAllDay: boolean): void {
3541
if (rowIndex >= 0) {
36-
const cell = this.viewDataProvider.getCellData(rowIndex, columnIndex, isAllDay);
37-
this.focusedCell = cell;
42+
this.focusedCell = this.viewDataProvider.getCellData(rowIndex, columnIndex, isAllDay);
3843
}
3944
}
4045

41-
setSelectedCells(lastCellCoordinates, firstCellCoordinates: any = undefined) {
46+
setSelectedCells(
47+
lastCellCoordinates: CellPosition,
48+
firstCellCoordinates?: CellPosition,
49+
): void {
4250
const { viewDataProvider } = this;
4351
const {
4452
rowIndex: lastRowIndex, columnIndex: lastColumnIndex, allDay: isLastCellAllDay,
@@ -48,57 +56,65 @@ export default class CellsSelectionState {
4856
return;
4957
}
5058

59+
const lastCell = viewDataProvider.getCellData(
60+
lastRowIndex,
61+
lastColumnIndex,
62+
isLastCellAllDay,
63+
);
64+
5165
const firstCell = firstCellCoordinates
5266
? viewDataProvider.getCellData(
5367
firstCellCoordinates.rowIndex,
5468
firstCellCoordinates.columnIndex,
5569
firstCellCoordinates.allDay,
5670
)
57-
: this.firstSelectedCell;
58-
const lastCell = viewDataProvider.getCellData(lastRowIndex, lastColumnIndex, isLastCellAllDay);
71+
: (this.firstSelectedCell ?? lastCell);
5972

6073
this.firstSelectedCell = firstCell;
6174

62-
this.selectedCells = this.viewDataProvider.getCellsBetween(firstCell, lastCell);
75+
this.selectedCells = this.viewDataProvider.getCellsBetween(
76+
firstCell,
77+
lastCell,
78+
);
6379
}
6480

65-
setSelectedCellsByData(selectedCellsData) {
81+
setSelectedCellsByData(selectedCellsData: ViewCellData[]): void {
6682
this.selectedCells = selectedCellsData;
6783
}
6884

69-
getSelectedCells() {
85+
getSelectedCells(): ViewCellData[] | null {
7086
return this.selectedCells;
7187
}
7288

73-
releaseSelectedAndFocusedCells() {
89+
releaseSelectedAndFocusedCells(): void {
7490
this.releaseSelectedCells();
7591
this.releaseFocusedCell();
7692
}
7793

78-
releaseSelectedCells() {
94+
releaseSelectedCells(): void {
7995
this.prevSelectedCells = this.selectedCells;
8096
this.prevFirstSelectedCell = this.firstSelectedCell;
8197

8298
this.selectedCells = null;
8399
this.firstSelectedCell = null;
84100
}
85101

86-
releaseFocusedCell() {
102+
releaseFocusedCell(): void {
87103
this.prevFocusedCell = this.focusedCell;
88104
this.focusedCell = null;
89105
}
90106

91-
restoreSelectedAndFocusedCells() {
92-
this.selectedCells = this.selectedCells || this.prevSelectedCells;
93-
this.focusedCell = this.focusedCell || this.prevFocusedCell;
94-
this.firstSelectedCell = this.firstSelectedCell || this.prevFirstSelectedCell;
107+
restoreSelectedAndFocusedCells(): void {
108+
this.selectedCells = this.selectedCells ?? this.prevSelectedCells;
109+
this.focusedCell = this.focusedCell ?? this.prevFocusedCell;
110+
this.firstSelectedCell = this.firstSelectedCell ?? this.prevFirstSelectedCell ?? null;
95111

96112
this.prevSelectedCells = null;
97113
this.prevFirstSelectedCell = null;
98114
this.prevFocusedCell = null;
99115
}
100116

101-
clearSelectedAndFocusedCells() {
117+
clearSelectedAndFocusedCells(): void {
102118
this.prevSelectedCells = null;
103119
this.selectedCells = null;
104120

0 commit comments

Comments
 (0)