indexing-models-administration.component.html

<div class="admin-container" [class.admin-is-mobile]="appService.getViewMode()">
    <mat-sidenav-container autosize class="admin-sidenav-container">
        <mat-sidenav #snav [mode]="appService.getViewMode() ? 'over' : 'side'"
            [fixedInViewport]="appService.getViewMode()" fixedTopGap="56"
            [opened]="appService.getViewMode() ? false : true">
            <menu-shortcut></menu-shortcut>
            <menu-nav></menu-nav>
            <mat-nav-list>
                <h3 mat-subheader>{{lang.actions}}</h3>
                <a mat-list-item routerLink="/administration/indexingModels/new">
                    <mat-icon color="primary" mat-list-icon class="fa fa-plus"></mat-icon>
                    <p mat-line>
                        {{lang.add}}
                    </p>
                </a>
            </mat-nav-list>
            <mat-divider></mat-divider>
        </mat-sidenav>
        <mat-sidenav-content>
            <div *ngIf="loading" style="display:flex;height:100%;">
                <mat-spinner style="margin:auto;"></mat-spinner>
            </div>
            <mat-card *ngIf="!loading" class="card-app-content">
                <div class="row">
                    <div class="col-md-6 col-xs-6">
                        <mat-form-field>
                            <input matInput (keyup)="applyFilter($event.target.value)" placeholder="{{lang.filterBy}}">
                        </mat-form-field>
                    </div>
                    <div class="col-md-6 col-xs-6">
                        <mat-paginator #paginator [length]="100" [pageSize]="10">
                        </mat-paginator>
                    </div>
                </div>
                <mat-table #table [dataSource]="dataSource" matSort matSortActive="label" matSortDirection="asc">
                    <ng-container matColumnDef="label">
                        <mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.label}}</mat-header-cell>
                        <mat-cell *matCellDef="let element"> {{element.label}} </mat-cell>
                    </ng-container>
                    <ng-container matColumnDef="private">
                        <mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.perimeter}}</mat-header-cell>
                        <mat-cell *matCellDef="let element">
                            <span [ngClass]="{'dataLabelWarn': element.private, 'dataLabelPrimary': !element.private}" class="label">{{element.private ? lang.private : lang.public}}</span>
                        </mat-cell>
                    </ng-container>
                    <ng-container matColumnDef="default">
                        <mat-header-cell *matHeaderCellDef mat-sort-header>{{lang.default}}</mat-header-cell>
                        <mat-cell *matCellDef="let element">
                                <span [ngClass]="{'dataLabelWarn': !element.default, 'dataLabelPrimary': element.default}" class="label">{{element.default ? lang.yes : lang.no}}</span>
                        </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" [disabled]="element.is_system == 'Y'"
                                matTooltip="{{lang.delete}}" (click)="$event.stopPropagation();delete(element)">
                                <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/indexingModels/{{row.id}}" style="cursor:pointer;"
                        matTooltip="{{lang.view}}"></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;">
                    {{indexingModels.length}} {{lang.indexingModels}}</div>
            </mat-card>
        </mat-sidenav-content>
        <mat-sidenav #snav2 [mode]="appService.getViewMode() ? 'over' : 'side'"
            [fixedInViewport]="appService.getViewMode()" fixedTopGap="56" position='end'
            [opened]="appService.getViewMode() ? false : false">
        </mat-sidenav>
    </mat-sidenav-container>
</div>