indexation.component.html

<mat-sidenav-container class="maarch-container">
    <mat-sidenav #snavLeft class="panel-left" #snav [mode]="appService.getViewMode() ? 'over' : 'side'"
        [fixedInViewport]="appService.getViewMode()" [opened]="appService.getViewMode() ? false : true"
        autoFocus="false" style="overflow-x:hidden;" [ngStyle]="{'width': appService.getViewMode() ? '95%' : '600px'}">
        <header-panel [snavLeft]="snav"></header-panel>
        <div *ngIf="actionService.loading" class="loading">
            <mat-spinner style="margin:auto;"></mat-spinner>
        </div>
        <ng-container *ngIf="indexingModels.length > 0">
            <div class="listModels">
                <button mat-button class="button-form-primary listModels-button"
                    [matMenuTriggerFor]="IndexingModelsMenu">
                    <mat-icon mattPrefix class="fab fa-wpforms"></mat-icon>
                    <span class="menu-label" [title]="currentIndexingModel.label">
                        {{currentIndexingModel.label}} {{currentIndexingModel.default ? '(' + lang.default + ')': ''}}
                    </span>
                    <i class="fa fa-chevron-down menu-icon"></i>
                </button>
                <mat-menu #IndexingModelsMenu="matMenu" [class]="'menuForm listModels-menu'">
                    <button mat-menu-item disabled style="text-align:center;"
                        (click)="$event.stopPropagation();">{{lang.indexingModel}}</button>
                    <ng-container *ngFor="let indexingModel of indexingModels | sortBy: 'label'">
                        <button mat-menu-item *ngIf="indexingModel.master === null"
                            (click)="loadIndexingModel(indexingModel)" [title]="indexingModel.label"
                            [class.listModels-menu-selected]="indexingModel.id === currentIndexingModel.id">{{indexingModel.label}}
                            {{indexingModel.default ? '(' + lang.default + ')': ''}}</button>
                        <ng-container
                            *ngFor="let privateIndexingModel of indexingModels | sortBy: 'label' ;let itPrivate=index">
                            <button mat-menu-item *ngIf="privateIndexingModel.master === indexingModel.id"
                                (click)="loadIndexingModel(privateIndexingModel)" [title]="privateIndexingModel.label"
                                [class.listModels-menu-selected]="privateIndexingModel.id === currentIndexingModel.id"
                                style="padding-left: 50px;display: flex;align-items: center;">
                                <div style="flex:1;">
                                    {{privateIndexingModel.label}} <span
                                        class="listModels-menu-badge">{{lang.private}}</span>
                                </div>
                                <button mat-icon-button class="listModels-menu-delete"
                                    *ngIf="privateIndexingModel.id !== currentIndexingModel.id" [title]="lang.delete"
                                    (click)="$event.stopPropagation();deletePrivateIndexingModel(privateIndexingModel.id, itPrivate)">
                                    <mat-icon class="fa fa-trash" color="warn">
                                    </mat-icon>
                                </button>
                            </button>
                        </ng-container>
                    </ng-container>
                </mat-menu>
                <button mat-icon-button type="button" color="primary" (click)="savePrivateIndexingModel()"
                    [title]="lang.createPrivateIndexingModel">
                    <mat-icon class="far fa-copy"></mat-icon>
                </button>
            </div>
            <div class="indexing-form-container">
                <app-indexing-form *ngIf="currentIndexingModel.id !== undefined" #indexingForm
                    [groupId]="currentGroupId" [indexingFormId]="currentIndexingModel.id"></app-indexing-form>
            </div>
            <div class="actions-indexing-form">
                <ng-container *ngIf="actionsList.length > 0">
                    <button mat-button class="button-form-primary" [matMenuTriggerFor]="menu"
                        style="flex:1;margin-right:20px;" [title]="selectedAction.label">
                        <span class="menu-label" [innerHTML]="selectedAction.label">
                        </span>
                        <i class="fa fa-chevron-down menu-icon"></i></button>
                    <mat-menu #menu="matMenu" [class]="'menuForm'">
                        <ng-container *ngFor="let action of actionsList">
                            <button mat-menu-item *ngIf="action.id !== selectedAction.id" (click)="selectAction(action)"
                                [title]="action.label" [innerHTML]="action.label"></button>
                        </ng-container>
                    </mat-menu>
                    <button mat-button *ngIf="!appService.getViewMode()" [disabled]="actionService.loading" class="button-form-primary-filled"
                        style="width: 150px;align-items: center;justify-content: center;text-align: center;display: flex;"
                        (click)="onSubmit()">{{lang.validate}}</button>
                    <button mat-icon-button *ngIf="appService.getViewMode()" class="button-form-primary"
                        (click)="onSubmit()">
                        <mat-icon class="fa fa-check"></mat-icon>
                    </button>
                </ng-container>
                <div class="emptyAction" *ngIf="actionsList.length === 0" [innerHTML]="lang.noAvaiblableAction"></div>
            </div>
        </ng-container>
        <div *ngIf="indexingModels.length === 0" class="emptyModel" [innerHTML]="lang.noAvailableIndexingModel"></div>
    </mat-sidenav>
    <mat-sidenav-content>
        <div class="bg-head">
            <div class="bg-head-title" [class.customContainerRight]="appService.getViewMode()">
                <div class="bg-head-title-label">
                    <header-left [snavLeft]="snav"></header-left>
                </div>
                <div class="bg-head-title-tool">
                    <header-right></header-right>
                </div>
            </div>
        </div>
        <div class="document-container" [class.fullContainer]="appService.getViewMode()">
            <div class="content">
                <app-document-viewer #appDocumentViewer [tmpFilename]="tmpFilename" style="height:100%;width:100%;">
                </app-document-viewer>
            </div>
        </div>
    </mat-sidenav-content>
    <mat-sidenav #snav2 [fixedInViewport]="appService.getViewMode()" position='end'
        [opened]="appService.getViewMode() ? false : false" [mode]="appService.getViewMode() ? 'over' : 'side'"
        class="panel-right" style="overflow-x:hidden;" [class.docView]="!filtersListService.filterMode"
        [ngStyle]="{'width': appService.getViewMode() ? '80%' : '30%'}" autoFocus="false">
    </mat-sidenav>
</mat-sidenav-container>