Skip to content
Snippets Groups Projects
parameters-administration.component.html 6.02 KiB
Newer Older
  • Learn to ignore specific revisions
  • <mat-sidenav-container autosize class="maarch-container">
    
                <h3 mat-subheader>{{'lang.actions' | translate}}</h3>
    
                <a mat-list-item routerLink="/administration/parameters/new">
                    <mat-icon color="primary" mat-list-icon class="fa fa-plus"></mat-icon>
                    <p mat-line>
    
                        {{'lang.add' | translate}}
    
        <mat-sidenav-content>
            <div class="bg-head">
                <div class="bg-head-title" [class.customContainerRight]="appService.getViewMode()">
                    <div class="bg-head-title-label">
    
                    </div>
                    <div class="bg-head-title-tool">
                        <header-right></header-right>
                    </div>
    
                <div class="bg-head-content" [class.fullContainer]="appService.getViewMode()">
                </div>
            </div>
            <div class="container" [class.fullContainer]="appService.getViewMode()">
                <div class="container-content">
                    <div *ngIf="loading" style="display:flex;height:100%;">
                        <mat-spinner style="margin:auto;"></mat-spinner>
    
                    <mat-card *ngIf="!loading" class="card-app-content">
    
                            <mat-tab [label]="'lang.technicalParameters' | translate">
    
                                <div class="row">
                                    <div class="col-md-6 col-xs-6">
                                        <mat-form-field>
                                            <input matInput [formControl]="adminService.getFilterField()"
                                                placeholder="{{'lang.filterBy' | translate}}">
                                        </mat-form-field>
                                    </div>
                                    <div class="col-md-6 col-xs-6">
                                        <mat-paginator #paginator [length]="100" [hidePageSize]="true" [pageSize]="10">
                                        </mat-paginator>
                                    </div>
                                </div>
                                <mat-table #table [dataSource]="adminService.getDataSource()" matSort matSortDisableClear>
                                    <ng-container matColumnDef="id">
                                        <mat-header-cell *matHeaderCellDef mat-sort-header>{{'lang.id' | translate}}
                                        </mat-header-cell>
                                        <mat-cell *matCellDef="let element">
                                            {{element.id}} </mat-cell>
                                    </ng-container>
                                    <ng-container matColumnDef="description">
                                        <mat-header-cell *matHeaderCellDef mat-sort-header
                                            [class.hide-for-mobile]="appService.getViewMode()">
                                            {{'lang.description' | translate}}
                                        </mat-header-cell>
                                        <mat-cell *matCellDef="let element"
                                            [class.hide-for-mobile]="appService.getViewMode()">
                                            {{element.description}} </mat-cell>
                                    </ng-container>
                                    <ng-container matColumnDef="value">
                                        <mat-header-cell *matHeaderCellDef mat-sort-header>{{'lang.value' | translate}}
                                        </mat-header-cell>
                                        <mat-cell *matCellDef="let element">
                                            {{element.value}} </mat-cell>
                                    </ng-container>
                                    <ng-container matColumnDef="actions">
                                        <mat-header-cell *matHeaderCellDef></mat-header-cell>
                                        <mat-cell *matCellDef="let element" style="justify-content: flex-end;">
                                            <button mat-icon-button color="warn" matTooltip="{{'lang.delete' | translate}}"
                                                (click)="$event.stopPropagation();deleteParameter(element.id)">
                                                <mat-icon class="fa fa-trash-alt fa-2x" aria-hidden="true"></mat-icon>
                                            </button>
                                        </mat-cell>
                                    </ng-container>
                                    <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
                                    <mat-row *matRowDef="let row; columns: displayedColumns;"
                                        routerLink="/administration/parameters/{{row.id}}" style="cursor:pointer;"
                                        matTooltip="{{'lang.view' | translate}}"></mat-row>
                                </mat-table>
                                <div class="mat-paginator"
                                    style="min-height:48px;min-height: 48px;display: flex;justify-content: end;align-items: center;padding-right: 20px;">
                                    {{parameters.length}} {{'lang.parameters' | translate}}</div>
                            </mat-tab>
                            <mat-tab [label]="'lang.customization' | translate">
                                <ng-template matTabContent>
                                    <app-parameters-customization></app-parameters-customization>
                                </ng-template>
                            </mat-tab>
    
                            <mat-tab [label]="'lang.lifeCycle' | translate">
                                <ng-template matTabContent>
                                    <app-life-cyle></app-life-cyle>
                                </ng-template>
                            </mat-tab>
    
                    </mat-card>
                </div>
            </div>
        </mat-sidenav-content>