|
|
@ -1,90 +1,98 @@ |
|
|
<div class="container"> |
|
|
<div class="container"> |
|
|
<div class="row"> |
|
|
<div class="row"> |
|
|
<div class="col"> |
|
|
<div class="col"> |
|
|
<div class="platforms"> |
|
|
<table |
|
|
<table |
|
|
class="gf-table w-100" |
|
|
class="gf-table w-100" |
|
|
mat-table |
|
|
mat-table |
|
|
matSort |
|
|
matSort |
|
|
matSortActive="id" |
|
|
matSortActive="id" |
|
|
matSortDirection="asc" |
|
|
matSortDirection="asc" |
|
|
[dataSource]="dataSource" |
|
|
[dataSource]="dataSource" |
|
|
> |
|
|
|
|
|
<ng-container matColumnDef="id"> |
|
|
|
|
|
<th |
|
|
|
|
|
*matHeaderCellDef |
|
|
|
|
|
class="px-1 mat-mdc-header-cell" |
|
|
|
|
|
mat-header-cell |
|
|
|
|
|
mat-sort-header="id" |
|
|
|
|
|
> |
|
|
|
|
|
<ng-container i18n>Id</ng-container> |
|
|
|
|
|
</th> |
|
|
|
|
|
<td *matCellDef="let element" class="px-1" mat-cell> |
|
|
|
|
|
<span class="d-none d-sm-inline-block">{{ element.id }}</span> |
|
|
|
|
|
<span class="d-inline-block d-sm-none">{{ |
|
|
|
|
|
(element.id | slice : 0 : 5) + '...' |
|
|
|
|
|
}}</span> |
|
|
|
|
|
</td> |
|
|
|
|
|
</ng-container> |
|
|
|
|
|
|
|
|
|
|
|
<ng-container matColumnDef="name"> |
|
|
|
|
|
<th |
|
|
|
|
|
*matHeaderCellDef |
|
|
|
|
|
class="px-1" |
|
|
|
|
|
mat-header-cell |
|
|
|
|
|
mat-sort-header="name" |
|
|
|
|
|
> |
|
|
|
|
|
<ng-container i18n>Name</ng-container> |
|
|
|
|
|
</th> |
|
|
|
|
|
<td *matCellDef="let element" class="px-1" mat-cell> |
|
|
|
|
|
<gf-symbol-icon |
|
|
|
|
|
*ngIf="element.url" |
|
|
|
|
|
class="d-inline mr-1" |
|
|
|
|
|
[tooltip]="element.name" |
|
|
|
|
|
[url]="element.url" |
|
|
|
|
|
></gf-symbol-icon> |
|
|
|
|
|
<span>{{ element.name }} </span> |
|
|
|
|
|
</td></ng-container |
|
|
> |
|
|
> |
|
|
<ng-container matColumnDef="id"> |
|
|
|
|
|
<th *matHeaderCellDef class="px-1" mat-header-cell mat-sort-header> |
|
|
|
|
|
<ng-container i18n>Id</ng-container> |
|
|
|
|
|
</th> |
|
|
|
|
|
<td |
|
|
|
|
|
*matCellDef="let element" |
|
|
|
|
|
class="d-none d-lg-table-cell px-1" |
|
|
|
|
|
mat-cell |
|
|
|
|
|
> |
|
|
|
|
|
{{ element.id }} |
|
|
|
|
|
</td> |
|
|
|
|
|
</ng-container> |
|
|
|
|
|
|
|
|
|
|
|
<ng-container matColumnDef="name"> |
|
|
<ng-container matColumnDef="url"> |
|
|
<th *matHeaderCellDef class="px-1" mat-header-cell mat-sort-header> |
|
|
<th |
|
|
<ng-container i18n>Name</ng-container> |
|
|
*matHeaderCellDef |
|
|
</th> |
|
|
class="px-1" |
|
|
<td *matCellDef="let element" class="px-1" mat-cell> |
|
|
mat-header-cell |
|
|
<gf-symbol-icon |
|
|
mat-sort-header="url" |
|
|
*ngIf="element.url" |
|
|
> |
|
|
class="d-inline d-sm-none mr-1" |
|
|
<ng-container i18n>Url</ng-container> |
|
|
[tooltip]="element.name" |
|
|
</th> |
|
|
[url]="element.url" |
|
|
<td *matCellDef="let element" class="px-1" mat-cell> |
|
|
></gf-symbol-icon> |
|
|
{{ element.url }} |
|
|
<span>{{ element.name }} </span> |
|
|
</td> |
|
|
</td> |
|
|
</ng-container> |
|
|
</ng-container> |
|
|
|
|
|
|
|
|
|
|
|
<ng-container matColumnDef="url"> |
|
|
<ng-container matColumnDef="actions"> |
|
|
<th *matHeaderCellDef class="px-1" mat-header-cell mat-sort-header> |
|
|
<th |
|
|
<ng-container i18n>Url</ng-container> |
|
|
*matHeaderCellDef |
|
|
</th> |
|
|
class="px-1 text-center" |
|
|
<td |
|
|
i18n |
|
|
*matCellDef="let element" |
|
|
mat-header-cell |
|
|
class="d-none d-lg-table-cell px-1" |
|
|
></th> |
|
|
mat-cell |
|
|
<td *matCellDef="let element" class="px-1 text-center" mat-cell> |
|
|
|
|
|
<button |
|
|
|
|
|
class="mx-1 no-min-width px-2" |
|
|
|
|
|
mat-button |
|
|
|
|
|
[matMenuTriggerFor]="platformMenu" |
|
|
|
|
|
(click)="$event.stopPropagation()" |
|
|
> |
|
|
> |
|
|
{{ element.url }} |
|
|
<ion-icon name="ellipsis-vertical"></ion-icon> |
|
|
</td> |
|
|
</button> |
|
|
</ng-container> |
|
|
<mat-menu #platformMenu="matMenu" xPosition="before"> |
|
|
|
|
|
<button mat-menu-item (click)="onUpdatePlatform(element)"> |
|
|
<ng-container matColumnDef="actions"> |
|
|
<ion-icon class="mr-2" name="create-outline"></ion-icon> |
|
|
<th |
|
|
<span i18n>Edit</span> |
|
|
*matHeaderCellDef |
|
|
</button> |
|
|
class="px-1 text-center" |
|
|
<button mat-menu-item (click)="deletePlatform(element.id)"> |
|
|
i18n |
|
|
<ion-icon class="mr-2" name="trash-outline"></ion-icon> |
|
|
mat-header-cell |
|
|
<span i18n>Delete</span> |
|
|
></th> |
|
|
|
|
|
<td *matCellDef="let element" class="px-1 text-center" mat-cell> |
|
|
|
|
|
<button |
|
|
|
|
|
class="mx-1 no-min-width px-2" |
|
|
|
|
|
mat-button |
|
|
|
|
|
[matMenuTriggerFor]="platformMenu" |
|
|
|
|
|
(click)="$event.stopPropagation()" |
|
|
|
|
|
> |
|
|
|
|
|
<ion-icon name="ellipsis-vertical"></ion-icon> |
|
|
|
|
|
</button> |
|
|
</button> |
|
|
<mat-menu #platformMenu="matMenu" xPosition="before"> |
|
|
</mat-menu> |
|
|
<button mat-menu-item (click)="onUpdatePlatform(element)"> |
|
|
</td> |
|
|
<ion-icon class="mr-2" name="create-outline"></ion-icon> |
|
|
<td *matFooterCellDef class="px-1" mat-footer-cell></td> |
|
|
<span i18n>Edit</span> |
|
|
</ng-container> |
|
|
</button> |
|
|
|
|
|
<button mat-menu-item (click)="deletePlatform(element.id)"> |
|
|
|
|
|
<ion-icon class="mr-2" name="trash-outline"></ion-icon> |
|
|
|
|
|
<span i18n>Delete</span> |
|
|
|
|
|
</button> |
|
|
|
|
|
</mat-menu> |
|
|
|
|
|
</td> |
|
|
|
|
|
<td *matFooterCellDef class="px-1" mat-footer-cell></td> |
|
|
|
|
|
</ng-container> |
|
|
|
|
|
|
|
|
|
|
|
<tr *matHeaderRowDef="displayedColumns" mat-header-row></tr> |
|
|
<tr *matHeaderRowDef="displayedColumns" mat-header-row></tr> |
|
|
<tr *matRowDef="let row; columns: displayedColumns" mat-row></tr> |
|
|
<tr *matRowDef="let row; columns: displayedColumns" mat-row></tr> |
|
|
</table> |
|
|
</table> |
|
|
</div> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
Fabio Azevedo (CTW)
2 years ago