indexing-model-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-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 style="display: flex;">
                    <div style="flex:1;">
                        <mat-form-field class="indexingModelLabel" appearance="outline">
                            <mat-label>{{lang.modelName}}</mat-label>
                            <input matInput name="label" [(ngModel)]="indexingModel.label">
                        </mat-form-field>
                    </div>
                    <div class="defaultModel">
                        <mat-slide-toggle color="primary" name="default" [(ngModel)]="indexingModel.default">
                            {{lang.defaultModel}}
                        </mat-slide-toggle>
                    </div>
                </div>
                <mat-tab-group>
                    <mat-tab [label]="lang.indexingForm">
                        <app-indexing-form #indexingForm [indexingFormId]="indexingModel.id"></app-indexing-form>
                        <div class="col-md-12 text-center">
                            <button mat-raised-button color="primary" (click)="onSubmit()"
                                [disabled]="(!indexingForm.isModified() && !isModified()) || indexingModel.label === ''">{{creationMode ? lang.save : lang.update}}</button>
                        </div>
                    </mat-tab>
                </mat-tab-group>
            </mat-card>
        </mat-sidenav-content>
        <mat-sidenav #snav2 [mode]="appService.getViewMode() ? 'over' : 'side'"
            [fixedInViewport]="appService.getViewMode()" fixedTopGap="56" position='end' opened
            class="col-md-4 col-sm-12">
            <mat-tab-group>
                <mat-tab [label]="lang.availableFields">
                    <app-field-list *ngIf="indexingForm !== undefined" [dataFields]="indexingForm.getAvailableFields()">
                    </app-field-list>
                </mat-tab>
                <mat-tab [label]="lang.availableCustomFields">
                    <app-field-list *ngIf="indexingForm !== undefined"
                        [dataCustomFields]="indexingForm.getAvailableCustomFields()"></app-field-list>
                </mat-tab>
            </mat-tab-group>
        </mat-sidenav>
    </mat-sidenav-container>
</div>