File
Implements
Metadata
| selector |
app-global-clients |
| templateUrl |
./global-clients.component.html |
Methods
|
makeQueryParams
|
makeQueryParams(clientId)
|
|
|
Parameters :
| Name |
Optional |
| clientId |
No
|
Returns : { client: any; }
|
|
Async
updateClients
|
updateClients()
|
|
|
|
|
|
__
|
Default value : strings
|
|
|
|
loading
|
Default value : false
|
|
|
import { Component, OnInit } from '@angular/core';
import {Client} from '@app/pages/models/client';
import {ClientService} from '@app/pages/services/client.service';
import strings from '@i18n/strings.json';
@Component({
selector: 'app-global-clients',
templateUrl: './global-clients.component.html',
// styleUrls: ['./global-clients.component.scss']
})
export class GlobalClientsComponent implements OnInit {
__ = strings;
loading = false;
clients: [Client] | void;
constructor(private clientService: ClientService) {}
ngOnInit() {
this.updateClients();
}
async updateClients() {
this.loading = true;
this.clients = await this.clientService.getAllClients();
this.loading = false;
}
makeState() {
return {clients: this.clients};
}
makeQueryParams(clientId) {
return {client: clientId};
}
}
<div class="my-3 my-md-5">
<div class="row">
<div class="col-md-2">
<app-left-sidebar></app-left-sidebar>
<div class="btn-group-vertical w-100 mb-3 mb-md-0" role="group" aria-label="Button group">
<a class="btn btn-secondary btn-block tab-button active" [routerLink]="['/global-clients']">Global Configurations</a>
<a class="btn btn-secondary btn-block tab-button" [routerLink]="['/projects']">Projects</a>
</div>
</div>
<div class="col-md-8">
<h1>{{__.globalApplications}}</h1>
<h2>{{__.selectAnApplication}}</h2>
<div class="row my-5" *ngIf="loading"><h2>{{__.loading}}</h2></div>
<div *ngIf="!loading" class="row my-3">
<div *ngFor="let client of clients" class="col-lg-4 mb-3">
<div class="card">
<a [routerLink]="['/global-configs']" [queryParams]="makeQueryParams(client.clientId)" [state]="makeState()">
<div class="card-body">
<h5 class="card-title">{{client.clientId}}</h5>
</div>
</a>
</div>
</div>
</div>
</div>
<div class="col-md-2"></div>
</div>
</div>
Legend
Html element with directive