Skip to content

Commit 0445054

Browse files
fcv-iteratorItfcv-iteratorIt
authored
Feature/iot 1364 direct url to tabs (#130)
* Updated most dropdowns to sort by name * Reworked gateway tabs to use navigation for full url path * Refactored application details to use routing * Change sort of datatargets to frontend sorts, added sort for creating lora device * Added absolute routes to admin/users and iot device details
1 parent 337fca4 commit 0445054

File tree

71 files changed

+1854
-1445
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

71 files changed

+1854
-1445
lines changed

‎src/app/admin/admin-routing.module.ts‎

Lines changed: 86 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -1,73 +1,86 @@
1-
import { NgModule } from '@angular/core';
2-
import { Routes, RouterModule } from '@angular/router';
3-
import { OrganisationDetailComponent } from './organisation/organisation-detail/organisation-detail.component';
4-
import { OrganisationEditComponent } from './organisation/organisation-edit/organisation-edit.component';
5-
import { OrganisationListComponent } from './organisation/organisation-list/organisation-list.component';
6-
import { OrganisationComponent } from './organisation/organisation.component';
7-
import { PermissionDetailComponent } from './permission/permission-detail/permission-detail.component';
8-
import { PermissionEditComponent } from './permission/permission-edit/permission-edit.component';
9-
import { PermissionListComponent } from './permission/permission-list/permission-list.component';
10-
import { PermissionComponent } from './permission/permission.component';
11-
import { UserDetailComponent } from './users/user-detail/user-detail.component';
12-
import { UserEditComponent } from './users/user-edit/user-edit.component';
13-
import { UserListComponent } from './users/user-list/user-list.component';
14-
import { UsersComponent } from './users/users.component';
15-
import { ApiKeyComponent } from './api-key/api-key.component';
16-
import { ApiKeyListComponent } from './api-key/api-key-list/api-key-list.component';
17-
import { ApiKeyEditComponent } from './api-key/api-key-edit/api-key-edit.component';
18-
import { AcceptUserComponent } from './users/accept-user/accept-user.component';
19-
20-
21-
const adminRoutes: Routes = [
22-
{
23-
path: 'organisations', component: OrganisationComponent, children: [
24-
{ path: '', component: OrganisationListComponent },
25-
{ path: 'new-organisation', component: OrganisationEditComponent },
26-
{ path: ':org-id', component: OrganisationDetailComponent },
27-
{ path: ':org-id/edit-organisation', component: OrganisationEditComponent },
28-
]
29-
},
30-
{
31-
path: 'users', component: UsersComponent, children: [
32-
{ path: '', component: UserListComponent },
33-
{ path: 'organization/:organization-id', component: UserListComponent },
34-
{ path: 'new-user', component: UserEditComponent },
35-
{ path: ':user-id', component: UserDetailComponent },
36-
{ path: ':user-id/edit-user', component: UserEditComponent },
37-
{ path: 'accept-user/:user-id/:org-id', component: AcceptUserComponent }
38-
]
39-
},
40-
{
41-
path: 'permissions',
42-
component: PermissionComponent,
43-
children: [
44-
{ path: '', component: PermissionListComponent },
45-
{ path: 'new-permission', component: PermissionEditComponent },
46-
{ path: ':permission-id', component: PermissionDetailComponent },
47-
{
48-
path: ':permission-id/edit-permission',
49-
component: PermissionEditComponent,
50-
},
51-
],
52-
},
53-
{
54-
path: 'api-key',
55-
component: ApiKeyComponent,
56-
children: [
57-
{ path: '', component: ApiKeyListComponent },
58-
{ path: 'new-api-key', component: ApiKeyEditComponent },
59-
{
60-
path: ':api-key-id/edit-api-key',
61-
component: ApiKeyEditComponent,
62-
},
63-
],
64-
},
65-
66-
67-
];
68-
69-
@NgModule({
70-
imports: [RouterModule.forChild(adminRoutes)],
71-
exports: [RouterModule]
72-
})
73-
export class AdminRoutingModule { }
1+
import { NgModule } from '@angular/core';
2+
import { Routes, RouterModule } from '@angular/router';
3+
import { OrganisationDetailComponent } from './organisation/organisation-detail/organisation-detail.component';
4+
import { OrganisationEditComponent } from './organisation/organisation-edit/organisation-edit.component';
5+
import { OrganisationListComponent } from './organisation/organisation-list/organisation-list.component';
6+
import { OrganisationComponent } from './organisation/organisation.component';
7+
import { PermissionDetailComponent } from './permission/permission-detail/permission-detail.component';
8+
import { PermissionEditComponent } from './permission/permission-edit/permission-edit.component';
9+
import { PermissionListComponent } from './permission/permission-list/permission-list.component';
10+
import { PermissionComponent } from './permission/permission.component';
11+
import { UserDetailComponent } from './users/user-detail/user-detail.component';
12+
import { UserEditComponent } from './users/user-edit/user-edit.component';
13+
import { UserListComponent } from './users/user-list/user-list.component';
14+
import { UsersComponent } from './users/users.component';
15+
import { ApiKeyComponent } from './api-key/api-key.component';
16+
import { ApiKeyListComponent } from './api-key/api-key-list/api-key-list.component';
17+
import { ApiKeyEditComponent } from './api-key/api-key-edit/api-key-edit.component';
18+
import { AcceptUserComponent } from './users/accept-user/accept-user.component';
19+
import { UserTableTabComponent } from '@app/admin/users/user-list/user-table-tab/user-table-tab.component';
20+
import { AwaitingUsersTableTabComponent } from '@app/admin/users/user-list/awaiting-user-tab/awaiting-users-table-tab.component';
21+
22+
const adminRoutes: Routes = [
23+
{
24+
path: 'organisations',
25+
component: OrganisationComponent,
26+
children: [
27+
{ path: '', component: OrganisationListComponent },
28+
{ path: 'new-organisation', component: OrganisationEditComponent },
29+
{ path: ':org-id', component: OrganisationDetailComponent },
30+
{
31+
path: ':org-id/edit-organisation',
32+
component: OrganisationEditComponent,
33+
},
34+
],
35+
},
36+
{
37+
path: 'users',
38+
component: UsersComponent,
39+
children: [
40+
{
41+
path: '',
42+
component: UserListComponent,
43+
children: [
44+
{ path: 'existing', component: UserTableTabComponent },
45+
{ path: 'awaiting', component: AwaitingUsersTableTabComponent },
46+
],
47+
},
48+
{ path: 'organization/:organization-id', component: UserListComponent },
49+
{ path: 'new-user', component: UserEditComponent },
50+
{ path: ':user-id', component: UserDetailComponent },
51+
{ path: ':user-id/edit-user', component: UserEditComponent },
52+
{ path: 'accept-user/:user-id/:org-id', component: AcceptUserComponent },
53+
],
54+
},
55+
{
56+
path: 'permissions',
57+
component: PermissionComponent,
58+
children: [
59+
{ path: '', component: PermissionListComponent },
60+
{ path: 'new-permission', component: PermissionEditComponent },
61+
{ path: ':permission-id', component: PermissionDetailComponent },
62+
{
63+
path: ':permission-id/edit-permission',
64+
component: PermissionEditComponent,
65+
},
66+
],
67+
},
68+
{
69+
path: 'api-key',
70+
component: ApiKeyComponent,
71+
children: [
72+
{ path: '', component: ApiKeyListComponent },
73+
{ path: 'new-api-key', component: ApiKeyEditComponent },
74+
{
75+
path: ':api-key-id/edit-api-key',
76+
component: ApiKeyEditComponent,
77+
},
78+
],
79+
},
80+
];
81+
82+
@NgModule({
83+
imports: [RouterModule.forChild(adminRoutes)],
84+
exports: [RouterModule],
85+
})
86+
export class AdminRoutingModule {}

‎src/app/admin/admin.module.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,8 @@ import { ApiKeyTableComponent } from './api-key/api-key-list/api-key-table/api-k
3434
import { ApiKeyEditComponent } from './api-key/api-key-edit/api-key-edit.component';
3535
import { AwaitingUsersTableComponent } from './users/user-list/awaiting-users-table/awaiting-users-table.component';
3636
import { AcceptUserComponent } from './users/accept-user/accept-user.component';
37+
import { UserTableTabComponent } from './users/user-list/user-table-tab/user-table-tab.component';
38+
import { AwaitingUsersTableTabComponent } from './users/user-list/awaiting-user-tab/awaiting-users-table-tab.component';
3739

3840
@NgModule({
3941
declarations: [
@@ -58,6 +60,8 @@ import { AcceptUserComponent } from './users/accept-user/accept-user.component';
5860
ApiKeyEditComponent,
5961
AwaitingUsersTableComponent,
6062
AcceptUserComponent,
63+
UserTableTabComponent,
64+
AwaitingUsersTableTabComponent,
6165
],
6266
imports: [
6367
AdminRoutingModule,

‎src/app/admin/users/user-detail/user-detail.component.ts‎

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import { OrganizationAccessScope } from '@shared/enums/access-scopes';
1616
@Component({
1717
selector: 'app-user-detail',
1818
templateUrl: './user-detail.component.html',
19-
styleUrls: ['./user-detail.component.scss']
19+
styleUrls: ['./user-detail.component.scss'],
2020
})
2121
export class UserDetailComponent implements OnInit, OnDestroy {
2222
isLoadingResults = true;
@@ -30,7 +30,7 @@ export class UserDetailComponent implements OnInit, OnDestroy {
3030
user: UserResponse;
3131
public backButton: BackButton = {
3232
label: '',
33-
routerLink: '/admin/users',
33+
routerLink: undefined,
3434
};
3535
public buttons: QuickActionButton[] = [
3636
{
@@ -53,7 +53,7 @@ export class UserDetailComponent implements OnInit, OnDestroy {
5353
private userService: UserService,
5454
private router: Router,
5555
private meService: MeService
56-
) { }
56+
) {}
5757

5858
ngOnInit(): void {
5959
this.translate.use('da');
@@ -66,12 +66,15 @@ export class UserDetailComponent implements OnInit, OnDestroy {
6666
isErasable: false,
6767
};
6868
}
69-
this.translate.get(['NAV.USERS', 'USERS.DETAIL.DROPDOWN'])
70-
.subscribe(translations => {
69+
this.translate
70+
.get(['NAV.USERS', 'USERS.DETAIL.DROPDOWN'])
71+
.subscribe((translations) => {
7172
this.backButton.label = translations['NAV.USERS'];
7273
this.dropdownButton.label = translations['USERS.DETAIL.DROPDOWN'];
7374
});
74-
this.canEdit = this.meService.hasAccessToTargetOrganization(OrganizationAccessScope.UserAdministrationWrite);
75+
this.canEdit = this.meService.hasAccessToTargetOrganization(
76+
OrganizationAccessScope.UserAdministrationWrite
77+
);
7578
}
7679

7780
private getUser(id: number) {

‎src/app/admin/users/user-list/awaiting-user-tab/awaiting-users-table-tab.component.html‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<div class="jumbotron--table">
2+
<app-top-bar-table
3+
[component]="true"
4+
[title]="'USERS.AWAITING-USERS' | translate"
5+
></app-top-bar-table>
6+
<app-awaiting-users-table></app-awaiting-users-table>
7+
</div>

‎src/app/admin/users/user-list/awaiting-user-tab/awaiting-users-table-tab.component.scss‎

Whitespace-only changes.

‎src/app/admin/users/user-list/awaiting-user-tab/awaiting-users-table-tab.component.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { Component, OnInit } from '@angular/core';
2+
import { SharedVariableService } from '@shared/shared-variable/shared-variable.service';
3+
4+
@Component({
5+
selector: 'app-awaiting-user-tab',
6+
templateUrl: './awaiting-users-table-tab.component.html',
7+
styleUrls: ['./awaiting-users-table-tab.component.scss'],
8+
})
9+
export class AwaitingUsersTableTabComponent implements OnInit {
10+
organizationId: number;
11+
constructor(private globalService: SharedVariableService) {
12+
this.organizationId = this.globalService.getSelectedOrganisationId();
13+
}
14+
15+
ngOnInit(): void {}
16+
}

‎src/app/admin/users/user-list/user-list.component.html‎

Lines changed: 9 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -7,26 +7,15 @@
77
<div class="container-fluid">
88
<div class="row">
99
<div class="col-12">
10-
<mat-tab-group animationDuration="200ms">
11-
<mat-tab label="{{ 'USERS.EXISTING-USERS' | translate }}">
12-
<div class="jumbotron--table">
13-
<app-top-bar-table
14-
[component]="true"
15-
[title]="'USERS.EXISTING-USERS' | translate"
16-
></app-top-bar-table>
17-
<app-user-table [organizationId]="organizationId" *ngIf="organizationId"></app-user-table>
18-
</div>
19-
</mat-tab>
20-
<mat-tab label="{{ 'USERS.AWAITING-USERS' | translate }}">
21-
<div class="jumbotron--table">
22-
<app-top-bar-table
23-
[component]="true"
24-
[title]="'USERS.AWAITING-USERS' | translate"
25-
></app-top-bar-table>
26-
<app-awaiting-users-table></app-awaiting-users-table>
27-
</div>
28-
</mat-tab>
29-
</mat-tab-group>
10+
<nav mat-tab-nav-bar>
11+
<a mat-tab-link
12+
*ngFor="let link of navTabs"
13+
[routerLink]="link.link"
14+
routerLinkActive #rla="routerLinkActive"
15+
[active]="rla.isActive"
16+
>{{ link.label | translate }}</a>
17+
</nav>
18+
<router-outlet></router-outlet>
3019
</div>
3120
</div>
3221
</div>

‎src/app/admin/users/user-list/user-list.component.ts‎

Lines changed: 46 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,46 @@
1-
import { Component, OnInit } from '@angular/core';
2-
import { Title } from '@angular/platform-browser';
3-
import { TranslateService } from '@ngx-translate/core';
4-
import { OrganizationAccessScope } from '@shared/enums/access-scopes';
5-
import { MeService } from '@shared/services/me.service';
6-
import { SharedVariableService } from '@shared/shared-variable/shared-variable.service';
7-
8-
@Component({
9-
selector: 'app-user-list',
10-
templateUrl: './user-list.component.html',
11-
styleUrls: ['./user-list.component.scss'],
12-
})
13-
export class UserListComponent implements OnInit {
14-
canEdit: boolean;
15-
organizationId: number;
16-
17-
constructor(
18-
private titleService: Title,
19-
private translate: TranslateService,
20-
private meService: MeService,
21-
private globalService: SharedVariableService
22-
) {
23-
this.organizationId = this.globalService.getSelectedOrganisationId();
24-
}
25-
26-
ngOnInit(): void {
27-
this.translate.get(['TITLE.USER'])
28-
.subscribe(translations => {
29-
this.titleService.setTitle(translations['TITLE.USER']);
30-
});
31-
this.canEdit = this.meService.hasAccessToTargetOrganization(OrganizationAccessScope.UserAdministrationWrite);
32-
}
33-
}
1+
import { Component, OnInit } from '@angular/core';
2+
import { Title } from '@angular/platform-browser';
3+
import { TranslateService } from '@ngx-translate/core';
4+
import { OrganizationAccessScope } from '@shared/enums/access-scopes';
5+
import { MeService } from '@shared/services/me.service';
6+
import { SharedVariableService } from '@shared/shared-variable/shared-variable.service';
7+
import { Router } from '@angular/router';
8+
9+
@Component({
10+
selector: 'app-user-list',
11+
templateUrl: './user-list.component.html',
12+
styleUrls: ['./user-list.component.scss'],
13+
})
14+
export class UserListComponent implements OnInit {
15+
public navTabs: any[] = [
16+
{
17+
label: 'USERS.EXISTING-USERS',
18+
link: './existing',
19+
index: 0,
20+
},
21+
{
22+
label: 'USERS.AWAITING-USERS',
23+
link: './awaiting',
24+
index: 1,
25+
},
26+
];
27+
canEdit: boolean;
28+
constructor(
29+
private titleService: Title,
30+
private translate: TranslateService,
31+
private meService: MeService,
32+
public router: Router
33+
) {}
34+
35+
ngOnInit(): void {
36+
this.translate.get(['TITLE.USER']).subscribe((translations) => {
37+
this.titleService.setTitle(translations['TITLE.USER']);
38+
});
39+
this.canEdit = this.meService.hasAccessToTargetOrganization(
40+
OrganizationAccessScope.UserAdministrationWrite
41+
);
42+
if (this.router.url.split('/').length <= 3) {
43+
this.router.navigateByUrl('admin/users/existing', { replaceUrl: true });
44+
}
45+
}
46+
}

‎src/app/admin/users/user-list/user-table-tab/user-table-tab.component.html‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<div class="jumbotron--table">
2+
<app-top-bar-table
3+
[component]="true"
4+
[title]="'USERS.EXISTING-USERS' | translate"
5+
></app-top-bar-table>
6+
<app-user-table [organizationId]="organizationId" *ngIf="organizationId"></app-user-table>
7+
</div>

‎src/app/admin/users/user-list/user-table-tab/user-table-tab.component.scss‎

Whitespace-only changes.

0 commit comments

Comments
 (0)