init order

This commit is contained in:
_Bastler 2021-12-15 13:25:10 +01:00
parent 71f6a352f1
commit 572a1c8a45
3 changed files with 54 additions and 57 deletions

View File

@ -1,25 +1,26 @@
<table mat-table matSort [dataSource]="permissions" (matSortChange)="sortData($event)">
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef mat-sort-header="name"> {{'permissions.name' | i18n}} </th>
<td mat-cell *matCellDef="let permission">
<mat-icon inline=true>{{'services.' + permission.name + '.icon' | i18n}}</mat-icon>
{{'services.' + permission.name + '.title' | i18n}}
<mat-icon inline=true *ngIf="permission.addon">add_circle</mat-icon>
<br>
<small>{{'services.' + permission.name + '.subtitle' | i18n}}</small>
</td>
</ng-container>
<table mat-table matSort [dataSource]="permissions" (matSortChange)="sortData($event)" matSortActive="name"
matSortDirection="asc">
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef mat-sort-header="name"> {{'permissions.name' | i18n}} </th>
<td mat-cell *matCellDef="let permission">
<mat-icon inline=true>{{'services.' + permission.name + '.icon' | i18n}}</mat-icon>
{{'services.' + permission.name + '.title' | i18n}}
<mat-icon inline=true *ngIf="permission.addon">add_circle</mat-icon>
<br>
<small>{{'services.' + permission.name + '.subtitle' | i18n}}</small>
</td>
</ng-container>
<ng-container matColumnDef="starts">
<th mat-header-cell *matHeaderCellDef mat-sort-header="starts"> {{'permissions.starts' | i18n}} </th>
<td mat-cell *matCellDef="let permission">{{permission.starts | datef:datetimeformat}}</td>
</ng-container>
<ng-container matColumnDef="starts">
<th mat-header-cell *matHeaderCellDef mat-sort-header="starts"> {{'permissions.starts' | i18n}} </th>
<td mat-cell *matCellDef="let permission">{{permission.starts | datef:datetimeformat}}</td>
</ng-container>
<ng-container matColumnDef="expires">
<th mat-header-cell *matHeaderCellDef mat-sort-header="expires"> {{'permissions.expires' | i18n}} </th>
<td mat-cell *matCellDef="let permission">{{permission.expires | datef:datetimeformat}}</td>
</ng-container>
<ng-container matColumnDef="expires">
<th mat-header-cell *matHeaderCellDef mat-sort-header="expires"> {{'permissions.expires' | i18n}} </th>
<td mat-cell *matCellDef="let permission">{{permission.expires | datef:datetimeformat}}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="permissionColumns"></tr>
<tr mat-row *matRowDef="let myRowData; columns: permissionColumns"></tr>
</table>
<tr mat-header-row *matHeaderRowDef="permissionColumns"></tr>
<tr mat-row *matRowDef="let myRowData; columns: permissionColumns"></tr>
</table>

View File

@ -1,4 +1,4 @@
import {Component, OnInit, Input, SimpleChanges, OnChanges} from '@angular/core';
import {Component, OnInit, Input} from '@angular/core';
import {Sort} from '@angular/material/sort';
import {I18nService} from './../../services/i18n.service';
@ -7,7 +7,7 @@ import {I18nService} from './../../services/i18n.service';
templateUrl: './permissions.component.html',
styleUrls: ['./permissions.component.scss']
})
export class PermissionsComponent implements OnInit, OnChanges {
export class PermissionsComponent implements OnInit {
datetimeformat: String;
@Input() permissions;
@ -20,10 +20,6 @@ export class PermissionsComponent implements OnInit, OnChanges {
this.datetimeformat = this.i18n.get('format.datetime', []);
}
ngOnChanges(changes: SimpleChanges): void {
this.sortData({ "active": "name", "direction": "asc" });
}
sortData(sort: Sort) {
const data = this.permissions.slice();
if(!sort.active || sort.direction === '') {

View File

@ -1,33 +1,33 @@
<table mat-table matSort [dataSource]="quotas" (matSortChange)="sortData($event)">
<table mat-table matSort [dataSource]="quotas" (matSortChange)="sortData($event)" matSortActive="name"
matSortDirection="asc">
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef mat-sort-header="name"> {{'quotas.name' | i18n}} </th>
<td mat-cell *matCellDef="let quota">
<mat-icon inline=true>{{'services.' + quota.name + '.icon' | i18n}}</mat-icon>
{{'services.' + quota.name + '.title' | i18n}}
</td>
</ng-container>
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef mat-sort-header="name"> {{'quotas.name' | i18n}} </th>
<td mat-cell *matCellDef="let quota">
<mat-icon inline=true>{{'services.' + quota.name + '.icon' | i18n}}</mat-icon>
{{'services.' + quota.name + '.title' | i18n}}
</td>
</ng-container>
<ng-container matColumnDef="value">
<th mat-header-cell *matHeaderCellDef mat-sort-header="value"> {{'quotas.value' | i18n}} </th>
<td mat-cell *matCellDef="let quota"><span *ngIf="quota.disposable">{{quota.value}}</span> </td>
</ng-container>
<ng-container matColumnDef="value">
<th mat-header-cell *matHeaderCellDef mat-sort-header="value"> {{'quotas.value' | i18n}} </th>
<td mat-cell *matCellDef="let quota"><span *ngIf="quota.disposable">{{quota.value}}</span> </td>
</ng-container>
<ng-container matColumnDef="fixed_value">
<th mat-header-cell *matHeaderCellDef> {{'quotas.fixed_value' | i18n}} <mat-icon #primaryHint="matTooltip" inline
matTooltip="{{'quotas.fixed_value.hint' | i18n}}">info</mat-icon>
</th>
<td mat-cell *matCellDef="let quota"><span *ngIf="!quota.disposable">{{quota.value}}</span> </td>
</ng-container>
<ng-container matColumnDef="fixed_value">
<th mat-header-cell *matHeaderCellDef> {{'quotas.fixed_value' | i18n}} <mat-icon
#primaryHint="matTooltip" inline matTooltip="{{'quotas.fixed_value.hint' | i18n}}">info</mat-icon>
</th>
<td mat-cell *matCellDef="let quota"><span *ngIf="!quota.disposable">{{quota.value}}</span> </td>
</ng-container>
<ng-container matColumnDef="quotaUnit">
<th mat-header-cell *matHeaderCellDef> {{'quotas.unit' | i18n}} </th>
<td mat-cell *matCellDef="let quota">
<span *ngIf="quota.unit">{{'quotas.unit.' + quota.unit | i18n}}</span>
<span *ngIf="!quota.unit">#</span>
</td>
</ng-container>
<ng-container matColumnDef="quotaUnit">
<th mat-header-cell *matHeaderCellDef> {{'quotas.unit' | i18n}} </th>
<td mat-cell *matCellDef="let quota">
<span *ngIf="quota.unit">{{'quotas.unit.' + quota.unit | i18n}}</span>
<span *ngIf="!quota.unit">#</span>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="quotaColumns"></tr>
<tr mat-row *matRowDef="let myRowData; columns: quotaColumns"></tr>
</table>
<tr mat-header-row *matHeaderRowDef="quotaColumns"></tr>
<tr mat-row *matRowDef="let myRowData; columns: quotaColumns"></tr>
</table>