Skip to content

Commit 6b6e6a2

Browse files
MadsApolloMadsApollo
committed
Added change organization dialog component. This can be opened from details page, and the table. Dialog is still in progress.
1 parent 9b4636a commit 6b6e6a2

File tree

10 files changed

+166
-3
lines changed

10 files changed

+166
-3
lines changed

‎src/app/applications/application-detail/application-detail.component.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
[dropDownButton]="dropdownButton"
88
(deleteSelectedInDropdown)="onDeleteApplication()"
99
[canEdit]="canEdit"
10+
(extraDropdownOptions)="onExtraDropdownOptionClicked($event)"
1011
>
1112
</app-top-bar>
1213
<div class="container-fluid">

‎src/app/applications/application-detail/application-detail.component.ts‎

Lines changed: 31 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,9 @@ import { map } from "rxjs/operators";
1717
import { SharedVariableService } from "@shared/shared-variable/shared-variable.service";
1818
import { ChirpstackGatewayService } from "@shared/services/chirpstack-gateway.service";
1919
import { Gateway, GatewayResponseMany } from "@app/gateway/gateway.model";
20+
import { MatDialog } from "@angular/material/dialog";
21+
import { ChangeOrganizationDialogComponent } from "./change-organization-dialog/change-organization-dialog.component";
22+
import { ApplicationDialogModel } from "@shared/models/dialog.model";
2023

2124
@Component({
2225
selector: "app-application",
@@ -57,6 +60,7 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI
5760
public redMarker = "/assets/images/red-marker.png";
5861
public greenMarker = "/assets/images/green-marker.png";
5962
public greyMarker = "/assets/images/grey-marker.png";
63+
private dropdownButtonExtraOptionsHandlers: Map<number, () => void> = new Map();
6064

6165
constructor(
6266
private applicationService: ApplicationService,
@@ -68,7 +72,8 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI
6872
private deleteDialogService: DeleteDialogService,
6973
private restService: RestService,
7074
private sharedVariableService: SharedVariableService,
71-
private chirpstackGatewayService: ChirpstackGatewayService
75+
private chirpstackGatewayService: ChirpstackGatewayService,
76+
private changeOrganizationDialog: MatDialog
7277
) {}
7378

7479
ngOnInit(): void {
@@ -79,7 +84,18 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI
7984
label: "",
8085
editRouterLink: "../edit-application/" + this.id,
8186
isErasable: true,
87+
extraOptions: [],
8288
};
89+
90+
this.translate.get("APPLICATION.CHANGE_ORGANIZATION").subscribe(translation => {
91+
const changeOrganizationButton = {
92+
id: this.id,
93+
label: translation,
94+
onClick: () => this.onOpenChangeOrganizationDialog(),
95+
};
96+
this.dropdownButton.extraOptions.push(changeOrganizationButton);
97+
this.dropdownButtonExtraOptionsHandlers.set(changeOrganizationButton.id, changeOrganizationButton.onClick);
98+
});
8399
}
84100

85101
this.translate
@@ -193,6 +209,20 @@ export class ApplicationDetailComponent implements OnInit, OnDestroy, AfterViewI
193209
});
194210
}
195211

212+
onOpenChangeOrganizationDialog() {
213+
this.changeOrganizationDialog.open(ChangeOrganizationDialogComponent, {
214+
data: {
215+
id: this.id,
216+
} as ApplicationDialogModel,
217+
});
218+
}
219+
220+
onExtraDropdownOptionClicked(id: string) {
221+
const handler = this.dropdownButtonExtraOptionsHandlers.get(Number(id));
222+
223+
handler && handler();
224+
}
225+
196226
bindApplication(id: number): void {
197227
this.applicationsSubscription = this.applicationService.getApplication(id).subscribe(application => {
198228
this.application = application;

‎src/app/applications/application-detail/change-organization-dialog/change-organization-dialog.component.html‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<h2>{{ "APPLICATION.CHANGE_ORGANIZATION" | translate }}</h2>
2+
<div class="form-group mt-3 col-12">
3+
<label class="form-label" for="userGroup">{{ "QUESTION.APPLICATION.ADD-PERMISSION" | translate }}</label>
4+
<mat-select
5+
id="userGroup"
6+
class="form-control"
7+
[formControl]="permissionMultiCtrl"
8+
[multiple]="true"
9+
panelClass="overflow-x-hidden"
10+
[(value)]="application.permissionIds"
11+
[compareWith]="compare"
12+
>
13+
<app-mat-select-search [formControl]="permissionMultiFilterCtrl"></app-mat-select-search>
14+
<mat-option *ngFor="let permission of filteredPermissionsMulti | async" [value]="permission.id">
15+
{{ permission.name }}
16+
</mat-option>
17+
</mat-select>
18+
<mat-hint>{{ "QUESTION.APPLICATION.PERMISSION-HINT" | translate }}</mat-hint>
19+
</div>

‎src/app/applications/application-detail/change-organization-dialog/change-organization-dialog.component.scss‎

Whitespace-only changes.

‎src/app/applications/application-detail/change-organization-dialog/change-organization-dialog.component.ts‎

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
import { Component, Inject, OnInit } from "@angular/core";
2+
import { UntypedFormControl } from "@angular/forms";
3+
import { MAT_DIALOG_DATA } from "@angular/material/dialog";
4+
import { ActivatedRoute } from "@angular/router";
5+
import { PermissionResponse } from "@app/admin/permission/permission.model";
6+
import { PermissionService } from "@app/admin/permission/permission.service";
7+
import { Application, ApplicationRequest } from "@applications/application.model";
8+
import { TranslateService } from "@ngx-translate/core";
9+
import { ApplicationDialogModel } from "@shared/models/dialog.model";
10+
import { RestService } from "@shared/services/rest.service";
11+
import { SharedVariableService } from "@shared/shared-variable/shared-variable.service";
12+
import { ReplaySubject, Subscription } from "rxjs";
13+
14+
@Component({
15+
selector: "app-change-organization-dialog",
16+
templateUrl: "./change-organization-dialog.component.html",
17+
styleUrls: ["./change-organization-dialog.component.scss"],
18+
})
19+
export class ChangeOrganizationDialogComponent implements OnInit {
20+
public applicationsSubscription: Subscription;
21+
public permissionsSubscription: Subscription;
22+
public permissionMultiCtrl: UntypedFormControl = new UntypedFormControl();
23+
public permissionMultiFilterCtrl: UntypedFormControl = new UntypedFormControl();
24+
application = new ApplicationRequest();
25+
public permissions: PermissionResponse[];
26+
public filteredPermissionsMulti: ReplaySubject<PermissionResponse[]> = new ReplaySubject<PermissionResponse[]>(1);
27+
28+
constructor(
29+
private restService: RestService,
30+
private route: ActivatedRoute,
31+
public translate: TranslateService,
32+
private permissionService: PermissionService,
33+
private sharedVariableService: SharedVariableService,
34+
@Inject(MAT_DIALOG_DATA) public dialogModel: ApplicationDialogModel
35+
) {
36+
this.permissionMultiCtrl.setValue(this.application.permissionIds);
37+
}
38+
39+
ngOnInit(): void {
40+
this.translate.use("da");
41+
if (this.dialogModel.id) {
42+
this.getApplication(this.dialogModel.id);
43+
}
44+
this.getPermissions(this.sharedVariableService.getUserInfo().user.id);
45+
}
46+
47+
public compare(o1: any, o2: any): boolean {
48+
return o1 === o2;
49+
}
50+
51+
getApplication(id: number): void {
52+
this.applicationsSubscription = this.restService
53+
.get("application", {}, id)
54+
.subscribe((application: Application) => {
55+
this.application = new ApplicationRequest();
56+
this.application.name = application.name;
57+
this.application.description = application.description;
58+
this.application.organizationId = application.belongsTo.id;
59+
this.application.status = application.status;
60+
this.application.startDate = application.startDate;
61+
this.application.endDate = application.endDate;
62+
63+
this.application.category = application.category;
64+
this.application.owner = application.owner;
65+
this.application.contactPerson = application.contactPerson;
66+
this.application.contactEmail = application.contactEmail;
67+
this.application.contactPhone = application.contactPhone;
68+
this.application.personalData = application.personalData;
69+
this.application.hardware = application.hardware;
70+
this.application.controlledProperties = application.controlledProperties.map(ctrlProperty => ctrlProperty.type);
71+
this.application.deviceTypes = application.deviceTypes.map(deviceType => deviceType.type);
72+
this.application.permissionIds = application.permissionIds;
73+
this.permissionMultiCtrl.setValue(this.application.permissionIds);
74+
});
75+
}
76+
77+
getPermissions(userId: number) {
78+
this.permissionsSubscription = this.permissionService
79+
.getPermissions(1000, 0, undefined, undefined, userId, this.sharedVariableService.getSelectedOrganisationId())
80+
.subscribe(res => {
81+
this.permissions = res.data.sort((a, b) => a.name.localeCompare(b.name, "da-DK", { numeric: true }));
82+
this.filteredPermissionsMulti.next(this.permissions.slice());
83+
if (!this.dialogModel.id) {
84+
this.application.permissionIds = [this.permissions[0].id];
85+
this.permissionMultiCtrl.setValue(this.application.permissionIds);
86+
}
87+
});
88+
}
89+
}

‎src/app/applications/applications-list/applications-table/applications-table.component.html‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -161,6 +161,11 @@
161161
"APPLICATION-TABLE-ROW.EDIT" | translate
162162
}}</a>
163163
</li>
164+
<li class="dropdown-item">
165+
<a (click)="onOpenChangeOrganizationDialog(element.id)" routerLinkActive="active">{{
166+
"APPLICATION.CHANGE_ORGANIZATION" | translate
167+
}}</a>
168+
</li>
164169
<li class="dropdown-item">
165170
<a (click)="deleteApplication(element.id)" [routerLink]="[]">{{
166171
"APPLICATION-TABLE-ROW.DELETE" | translate

‎src/app/applications/applications-list/applications-table/applications-table.component.ts‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,9 @@ import { ApplicationDeviceType } from "@applications/models/application-device-t
2424
import { Datatarget } from "@applications/datatarget/datatarget.model";
2525
import { faFlag } from "@fortawesome/free-solid-svg-icons";
2626
import { TableColumn } from "@shared/types/table.type";
27+
import { MatDialog } from "@angular/material/dialog";
28+
import { ApplicationDialogModel } from "@shared/models/dialog.model";
29+
import { ChangeOrganizationDialogComponent } from "@applications/application-detail/change-organization-dialog/change-organization-dialog.component";
2730

2831
const columnDefinitions: TableColumn[] = [
2932
{
@@ -144,7 +147,8 @@ export class ApplicationsTableComponent implements AfterViewInit, OnInit {
144147
private applicationService: ApplicationService,
145148
private router: Router,
146149
private deleteDialogService: DeleteDialogService,
147-
private cdRef: ChangeDetectorRef
150+
private cdRef: ChangeDetectorRef,
151+
private changeOrganizationDialog: MatDialog
148152
) {}
149153

150154
ngOnInit() {
@@ -268,5 +272,13 @@ export class ApplicationsTableComponent implements AfterViewInit, OnInit {
268272
return !!result;
269273
}
270274

275+
onOpenChangeOrganizationDialog(id: number) {
276+
this.changeOrganizationDialog.open(ChangeOrganizationDialogComponent, {
277+
data: {
278+
id: id,
279+
} as ApplicationDialogModel,
280+
});
281+
}
282+
271283
protected readonly columnDefinitions = columnDefinitions;
272284
}

‎src/app/applications/applications.module.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ import { PipesModule } from "@shared/pipes/pipes.module";
1919
import { ApplicationsTableComponent } from "./applications-list/applications-table/applications-table.component";
2020
import { MulticastModule } from "./multicast/multicast.module";
2121
import { ReactiveFormsModule } from "@angular/forms";
22+
import { ChangeOrganizationDialogComponent } from "./application-detail/change-organization-dialog/change-organization-dialog.component";
2223

2324
@NgModule({
2425
declarations: [
@@ -28,6 +29,7 @@ import { ReactiveFormsModule } from "@angular/forms";
2829
ApplicationsListComponent,
2930
ApplicationsTableComponent,
3031
BulkImportComponent,
32+
ChangeOrganizationDialogComponent,
3133
],
3234
exports: [ApplicaitonsRoutingModule, ApplicationsComponent, ApplicationsTableComponent],
3335
imports: [

‎src/app/shared/models/dialog.model.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,3 +12,7 @@ export class DialogModel {
1212
export class WelcomeDialogModel {
1313
hasSomePermission: boolean;
1414
}
15+
16+
export class ApplicationDialogModel {
17+
id: number;
18+
}

‎src/assets/i18n/da.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,8 @@
150150
"HARDWARE": "Hardware",
151151
"CONTROLLED-PROPERTY": "Data",
152152
"DEVICE-TYPE": "Forbindelsesteknologi"
153-
}
153+
},
154+
"CHANGE_ORGANIZATION": "Skift organisation"
154155
},
155156
"GATEWAY": {
156157
"DETAILS": "Detaljer",

0 commit comments

Comments
 (0)