Skip to content

Commit f0c19f5

Browse files
Fix issues
1 parent b1751fe commit f0c19f5

28 files changed

+29688
-26963
lines changed

Angular/package-lock.json

Lines changed: 13267 additions & 10648 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Angular/package.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,8 @@
1010
"lint-html": "prettier --check .",
1111
"lint-ts": "eslint --ext .ts .",
1212
"lint-css": "stylelint src/**/*.{css,scss} --allow-empty-input",
13-
"lint": "npm-run-all -p -c lint-ts lint-css lint-html"
13+
"lint": "npm-run-all -p -c lint-ts lint-css lint-html",
14+
"lint-fix": "eslint --fix --ext .ts ."
1415
},
1516
"private": true,
1617
"dependencies": {
@@ -21,6 +22,7 @@
2122
"@angular/forms": "^18.0.3",
2223
"@angular/platform-browser": "^18.0.3",
2324
"@angular/platform-browser-dynamic": "^18.0.3",
25+
"devextreme-aspnet-data-nojquery": "^4.0.0",
2426
"@angular/router": "^18.0.3",
2527
"devextreme": "24.2.3",
2628
"devextreme-angular": "24.2.3",

Angular/src/app/GroupRowSelection/GroupRowSelectionHelper.ts

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,7 @@ export default class GroupSelectionHelper {
5656
const store = this.grid.getDataSource().store();
5757
store.load(loadOptions).then((data) => {
5858
if (isItemsArray(data)) {
59+
// eslint-disable-next-line @typescript-eslint/no-unsafe-return
5960
this.groupChildKeys[checkBoxId] = data.map((d) => this.grid.keyOf(d));
6061
this.getSelectedKeys(this.grid).then((selectedKeys) => {
6162
const checkedState: boolean | undefined = this.areKeysSelected(this.groupChildKeys[checkBoxId], selectedKeys);
@@ -95,7 +96,7 @@ export default class GroupSelectionHelper {
9596
}
9697
return this.getSelectedKeysPromise;
9798
}
98-
return new Promise((resolve) => resolve(grid.getSelectedRowKeys()));
99+
return Promise.resolve(grid.getSelectedRowKeys());
99100
}
100101

101102
repaintGroupRowTree(grid: dxDataGrid, groupRows: DxDataGridTypes.Row[]): void {
@@ -115,7 +116,8 @@ export default class GroupSelectionHelper {
115116
}
116117

117118
getChildRowKeys(grid: dxDataGrid, groupRowKey: string[]): any[] {
118-
return this.groupChildKeys[this.calcCheckBoxId(grid, groupRowKey)];
119+
// eslint-disable-next-line @typescript-eslint/no-unsafe-return
120+
return this.groupChildKeys[this.calcCheckBoxId(grid, groupRowKey) as any];
119121
}
120122

121123
calcCheckBoxId(grid: dxDataGrid, groupRowKey: string[]): string {
Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
.group-selection-front {
22
margin-right: 10px;
33
}
4+
45
.group-selection-front .dx-loadindicator {
56
display: block;
67
}
8+
79
.group-row-flex {
810
display: flex;
911
flex-direction: row;
1012
align-items: center;
11-
}
13+
}
Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,16 @@
11
<div class="group-row-flex">
22
<div class="group-selection-front">
3-
<dx-load-indicator [height]="iconSize" [width]="iconSize" [visible]="isLoading"></dx-load-indicator>
4-
<dx-check-box *ngIf="!isLoading" [iconSize]="iconSize" [value]="checked" (onValueChanged)="checkBoxValueChanged($event)"></dx-check-box>
3+
<dx-load-indicator
4+
[height]="iconSize"
5+
[width]="iconSize"
6+
[visible]="isLoading"
7+
></dx-load-indicator>
8+
<dx-check-box
9+
*ngIf="!isLoading"
10+
[iconSize]="iconSize"
11+
[value]="checked"
12+
(onValueChanged)="checkBoxValueChanged($event)"
13+
></dx-check-box>
514
</div>
615
<span>{{ groupCellData | groupText }}</span>
7-
</div>
16+
</div>
Lines changed: 25 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1-
import { Component, Input, Output, EventEmitter, AfterViewInit } from '@angular/core';
1+
import {
2+
Component, Input, Output, EventEmitter, AfterViewInit,
3+
} from '@angular/core';
24
import { DxCheckBoxTypes } from 'devextreme-angular/ui/check-box';
3-
import { DxDataGridTypes } from "devextreme-angular/ui/data-grid";
5+
import { DxDataGridTypes } from 'devextreme-angular/ui/data-grid';
46

57
@Component({
68
selector: 'group-row-selectable',
@@ -9,31 +11,42 @@ import { DxDataGridTypes } from "devextreme-angular/ui/data-grid";
911
})
1012
export class GroupRowComponent implements AfterViewInit {
1113
@Input() groupCellData!: DxDataGridTypes.ColumnGroupCellTemplateData;
14+
1215
@Input() childRowKeys: any[] | undefined = [];
16+
1317
@Output() onInitialized = new EventEmitter<IGroupRowReadyParameter>();
14-
isLoading: boolean = true;
18+
19+
isLoading = true;
20+
1521
checked: boolean | undefined = false;
22+
1623
childKeys!: any[];
17-
iconSize: number = 18;
24+
25+
iconSize = 18;
26+
1827
constructor() {
1928
this.checkBoxValueChanged = this.checkBoxValueChanged.bind(this);
2029
}
21-
ngAfterViewInit() {
30+
31+
ngAfterViewInit(): void {
2232
this.onInitialized.emit({ key: this.groupCellData.row.key, component: this });
2333
}
24-
checkBoxValueChanged(e: DxCheckBoxTypes.ValueChangedEvent) {
34+
35+
checkBoxValueChanged(e: DxCheckBoxTypes.ValueChangedEvent): void {
2536
this.checked = e.value;
26-
if (e.value)
27-
this.groupCellData.component.selectRows(this.childRowKeys ?? [], true);
28-
else
29-
this.groupCellData.component.deselectRows(this.childRowKeys ?? []);
37+
if (e.value) {
38+
this.groupCellData.component.selectRows(this.childRowKeys ?? [], true).catch(() => {});
39+
} else {
40+
this.groupCellData.component.deselectRows(this.childRowKeys ?? []).catch(() => {});
41+
}
3042
}
31-
public setCheckedState(value: boolean | undefined) {
43+
44+
public setCheckedState(value: boolean | undefined): void {
3245
this.checked = value;
3346
this.isLoading = false;
3447
}
3548
}
3649
export interface IGroupRowReadyParameter {
3750
key: string[];
3851
component: GroupRowComponent;
39-
}
52+
}
Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import { Pipe, PipeTransform } from '@angular/core';
22
import { DxDataGridTypes } from 'devextreme-angular/ui/data-grid';
3-
3+
44
@Pipe({
5-
name: 'groupText'
5+
name: 'groupText',
66
})
77
export class GroupTextPipe implements PipeTransform {
88
transform(value: DxDataGridTypes.ColumnGroupCellTemplateData): string {
@@ -11,4 +11,4 @@ export class GroupTextPipe implements PipeTransform {
1111
if (value.groupContinuesMessage) text += ` (${value.groupContinuesMessage})`;
1212
return text;
1313
}
14-
}
14+
}

Angular/src/app/app.component.html

Lines changed: 18 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,16 @@
1111
<group-row-selectable
1212
[groupCellData]="group"
1313
[childRowKeys]="helper?.getChildRowKeys(group.component, group.key)"
14-
(onInitialized)="groupRowInit($event)">
14+
(onInitialized)="groupRowInit($event)"
15+
>
1516
</group-row-selectable>
1617
</div>
17-
<dxo-selection [deferred]="false" mode="multiple" [allowSelectAll]="true" showCheckBoxesMode="always"></dxo-selection>
18+
<dxo-selection
19+
[deferred]="false"
20+
mode="multiple"
21+
[allowSelectAll]="true"
22+
showCheckBoxesMode="always"
23+
></dxo-selection>
1824
<dxo-paging [pageSize]="12"></dxo-paging>
1925
<dxo-group-panel [visible]="true"></dxo-group-panel>
2026
<dxo-grouping [autoExpandAll]="false"></dxo-grouping>
@@ -25,15 +31,16 @@
2531
displayExpr="Text"
2632
></dxo-lookup>
2733
</dxi-column>
28-
<dxi-column dataField="OrderDate" dataType="date">
29-
</dxi-column>
30-
<dxi-column dataField="Freight">
31-
</dxi-column>
32-
<dxi-column dataField="ShipCountry" [groupIndex]="0">
33-
</dxi-column>
34-
<dxi-column dataField="ShipCity" [groupIndex]="2">
35-
</dxi-column>
36-
<dxi-column dataField="ShipVia" caption="Shipping Company" dataType="number" [groupIndex]="1">
34+
<dxi-column dataField="OrderDate" dataType="date"> </dxi-column>
35+
<dxi-column dataField="Freight"> </dxi-column>
36+
<dxi-column dataField="ShipCountry" [groupIndex]="0"> </dxi-column>
37+
<dxi-column dataField="ShipCity" [groupIndex]="2"> </dxi-column>
38+
<dxi-column
39+
dataField="ShipVia"
40+
caption="Shipping Company"
41+
dataType="number"
42+
[groupIndex]="1"
43+
>
3744
<dxo-lookup
3845
[dataSource]="shippersData"
3946
valueExpr="Value"

Angular/src/app/app.component.ts

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import * as AspNetData from 'devextreme-aspnet-data-nojquery';
33
import { DxDataGridComponent } from 'devextreme-angular/ui/data-grid';
44
import { IGroupRowReadyParameter } from './GroupRowSelection/group-row-component/group-row.component';
55
import GroupSelectionHelper from './GroupRowSelection/GroupRowSelectionHelper';
6-
import { localData } from "./localdata";
6+
import { localData } from './localdata';
77

88
@Component({
99
selector: 'app-root',
@@ -12,17 +12,23 @@ import { localData } from "./localdata";
1212
})
1313
export class AppComponent {
1414
dataSource: AspNetData.CustomStore;
15+
1516
customersData: AspNetData.CustomStore;
17+
1618
shippersData: AspNetData.CustomStore;
1719

1820
@ViewChild(DxDataGridComponent) grid!: DxDataGridComponent;
21+
1922
selectedRowKeys: any[] = [10521];
20-
selectionFilter: any[] = ["OrderID", "=", 10521];
23+
24+
selectionFilter: any[] = ['OrderID', '=', 10521];
25+
2126
helper: GroupSelectionHelper | undefined;
27+
2228
localData: any[];
2329

2430
constructor() {
25-
const url: string = 'https://js.devexpress.com/Demos/Mvc/api/DataGridWebApi';
31+
const url = 'https://js.devexpress.com/Demos/Mvc/api/DataGridWebApi';
2632
this.localData = localData;
2733
this.dataSource = AspNetData.createStore({
2834
key: 'OrderID',
@@ -46,10 +52,12 @@ export class AppComponent {
4652
},
4753
});
4854
}
49-
ngAfterViewInit() {
55+
56+
ngAfterViewInit(): void {
5057
this.helper = new GroupSelectionHelper(this.grid.instance);
5158
}
52-
groupRowInit(arg: IGroupRowReadyParameter) {
59+
60+
groupRowInit(arg: IGroupRowReadyParameter): void {
5361
this.helper?.groupRowInit(arg);
5462
}
5563
}

Angular/src/app/app.module.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { GroupRowComponent } from './GroupRowSelection/group-row-component/group
1212
declarations: [
1313
AppComponent,
1414
GroupTextPipe,
15-
GroupRowComponent
15+
GroupRowComponent,
1616
],
1717
imports: [
1818
BrowserModule,

0 commit comments

Comments
 (0)