diff --git a/src/app/appmarket/domains/domain-group-view/domain-group-view.component.html b/src/app/appmarket/domains/domain-group-view/domain-group-view.component.html index 5e6f3036f86c027ec6a71edae129514f864e2c97..76fd8fe9cbeff71558057d1ed150280c1c8fb5cf 100644 --- a/src/app/appmarket/domains/domain-group-view/domain-group-view.component.html +++ b/src/app/appmarket/domains/domain-group-view/domain-group-view.component.html @@ -30,26 +30,40 @@ </div> </div> - <div *ngIf="!this.addingMode" style="margin-top: 3rem"> - <button type="button" class="btn btn-success" (click)="showModal()">{{'DOMAINS.LIST.ADD' | translate}}</button> - <table class="table table-hover table-condensed" aria-describedby="Domains in Group table" style="margin-top: 3rem"> - <thead> - <tr> - <th scope="col">{{'DOMAINS.LIST.DOMAIN_NAME' | translate}}</th> - <th scope="col">{{'DOMAINS.LIST.DOMAIN_CODE_NAME' | translate}}</th> - <th scope="col"></th> - </tr> - <ng-template ngFor let-domain [ngForOf]="domainGroup.domains" let-i="index"> - <tr class="table-row"> - <td>{{domain.name}}</td> - <td>{{domain.codename}}</td> - <td style="width: 20%"> - <button type="button" class="btn btn-danger" (click)="deleteDomainFromGroup(domain)">{{'DOMAINS.LIST.DELETE' | translate}}</button> - </td> + + <div *ngIf="!this.addingMode" class="panel panel-default" style="margin-top: 3rem"> + <div class="panel-heading"> + + <div style="display: flex; justify-content: start; align-items: center"> + <div> + {{ 'DOMAINS.LIST.LIST' | translate }} + </div> + </div> + </div> + <div class="panel-body"> + <div style="display: flex; justify-content: end"> + <button type="button" class="btn btn-success" (click)="showModal()">{{'DOMAINS.LIST.ADD' | translate}}</button> + </div> + <table class="table table-hover table-condensed" aria-describedby="Domains in Group table" style="margin-top: 2rem"> + <thead> + <tr> + <th scope="col">{{'DOMAINS.LIST.DOMAIN_NAME' | translate}}</th> + <th scope="col">{{'DOMAINS.LIST.DOMAIN_CODE_NAME' | translate}}</th> + <th scope="col"></th> </tr> - </ng-template> - </thead> - </table> + <ng-template ngFor let-domain [ngForOf]="domainGroup.domains" let-i="index"> + <tr class="table-row"> + <td>{{domain.name}}</td> + <td>{{domain.codename}}</td> + <td style="width: 20%"> + <button type="button" class="btn btn-danger" (click)="deleteDomainFromGroup(domain)">{{'DOMAINS.LIST.DELETE' | translate}}</button> + </td> + </tr> + </ng-template> + </thead> + </table> + + </div> </div> <div *ngIf="!this.addingMode" class="panel panel-default" style="margin-top: 3rem"> @@ -66,8 +80,9 @@ <table class="table table-hover table-condensed" aria-describedby="Domain details table"> <thead> <tr> - <th scope="col"> - {{ 'DOMAIN_DETAILS.APP_NAME' | translate }} + <th scope="col" style="display:flex; justify-content: space-between"> + <span>{{ 'DOMAIN_DETAILS.APP_NAME' | translate }}</span> + <span style="margin-right: 5rem">{{ 'DOMAINS.LIST.ACTIVE' | translate}}</span> </th> </tr> </thead> diff --git a/src/app/appmarket/domains/domain-group-view/domain-group-view.component.ts b/src/app/appmarket/domains/domain-group-view/domain-group-view.component.ts index dc2edd4079fb58382df57f9c446238097353d7b9..62231d1b71defe069c0bbb6e528d636d07889efe 100644 --- a/src/app/appmarket/domains/domain-group-view/domain-group-view.component.ts +++ b/src/app/appmarket/domains/domain-group-view/domain-group-view.component.ts @@ -42,6 +42,7 @@ export class DomainGroupViewComponent extends BaseComponent implements OnInit { this.domainService.getDomainGroup(this.domainGroupId).subscribe( (domainGroup) => { this.domainGroup = domainGroup; + this.sortApplication(); }, err => { console.error(err); @@ -133,7 +134,12 @@ export class DomainGroupViewComponent extends BaseComponent implements OnInit { } } } + } + public sortApplication(): void { + if(this.domainGroup.applicationStatePerDomain !== undefined && this.domainGroup.applicationStatePerDomain !== null) { + this.domainGroup.applicationStatePerDomain.sort((a, b) => a.applicationBaseName.localeCompare(b.applicationBaseName)) + } } }