src/app/pages/search/search.component.html

<!--
******************************************************************************
* Copyright © 2017-2018 PTA GmbH.
* All rights reserved. This program and the accompanying materials
* are made available under the terms of the Eclipse Public License v1.0
* which accompanies this distribution, and is available at
* 
*     http://www.eclipse.org/legal/epl-v10.html
* 
******************************************************************************
-->

<div class="search-body">

    <div style="min-width: 1048px; overflow: auto">
        <div *ngIf="bannerMessage.isActive" [ngClass]="{ 'alert':true, 
                'alert-danger': bannerMessage.status === bannerMessageStatus.error,
                'alert-info': bannerMessage.status === bannerMessageStatus.info,
                'alert-warning': bannerMessage.status === bannerMessageStatus.warning,
                'alert-success': bannerMessageStatus.success }">
            <div class="close" (click)="bannerMessage.hide()">x</div>
            {{bannerMessage.text}}
        </div>
        <div class="maincontent">
            <div class="row">
                <div class="col-xs-3">
                    <span style="font-size: 30px">Suche</span>
                </div>
            </div>
            <div class="panel-group">
                <div class="panel panel-default search-dialog" style="max-width: 1000px">
                    <div class="panel-heading">
                        <h4 class="panel-title">
                            <a data-toggle="collapse" href="#collapse9">Filter</a>
                        </h4>
                    </div>
                    <div id="collapse9" class="panel-collapse ">
                        <div class="panel-body">
                            <form #searchForm="ngForm">
                                <fieldset style="size: fixed">
                                    <table class="table">
                                        <tbody>
                                            <tr>
                                                <td class="text-right" style="width: 250px;"><label>Suchbegriff</label></td>
                                                <td colspan="8">
                                                    <div class="input-group z-index-0">
                                                        <input [(ngModel)]="currentSearchFilter.searchString" type="search" class="form-control" (keyup.enter)="search()"
                                                            placeholder="Suchbegriff..." name="searchInput">
                                                        <div class="input-group-btn">
                                                            <button type="button" class="btn btn-primary z-index-0" (click)="search()">
                                                                        <span class="glyphicon glyphicon-search"></span>
                                                                    </button>
                                                        </div>
                                                    </div>
                                                </td>
                                                <td></td>
                                            </tr>
                                            <tr>
                                                <td class="text-right">
                                                    <label>Zuständigkeit / weitergeleitet an</label>
                                                </td>
                                                <td colspan="8">
                                                    <app-autocomplete [(responsibilityForwarding)]="currentSearchFilter.responsibilityForwarding"></app-autocomplete>
                                                </td>
                                                <td colspan="2"></td>
                                            </tr>
                                            <tr>
                                                <td class="text-right"><label>Bereich</label></td>
                                                <td class="text-left" style="width: 17%">
                                                    <div class="form-group">
                                                        <select class="form-control" [(ngModel)]="currentSearchFilter.fkRefBranch" name="branchSelection">
                                                                    <option value="-1">Alle</option>
                                                                    <option *ngFor="let branch of branches" value="{{ branch.id }}">{{ branch.description }}</option>
                                                                </select>
                                                    </div>
                                                </td>
                                                <td colspan="3"></td>
                                                <td width="20" class="text-right">
                                                    <label>Status</label>
                                                </td>
                                                <td width="160">
                                                    <span class="filterCheckbox"><input type="checkbox"  
                                                            class="responsibility-checkbox-gr" [(ngModel)]="currentSearchFilter.statusOpenSelection" name="statusOpen"></span>offen
                                                </td>
                                                <td width="160">
                                                    <span class="filterCheckbox"><input type="checkbox"  
                                                            class="responsibility-checkbox-gr" [(ngModel)]="currentSearchFilter.statusInWorkSelection" name="statusInWork"></span>in Arbeit
                                                </td>
                                                <td colspan="4"></td>
                                            </tr>
                                            <tr>
                                                <td class="text-right" style="border: none;"><label>Netzgebiet</label></td>
                                                <td class="text-left" style="width: 17%; border: none;">
                                                    <div class="form-group">
                                                        <select class="form-control" [(ngModel)]="currentSearchFilter.fkRefGridTerritory" name="gridTerritorySelection">
                                                                    <option value="-1">Alle</option>
                                                                    <option *ngFor="let gridTerritory of gridTerritories" value="{{ gridTerritory.id }}">{{ gridTerritory.description }}</option>
                                                                </select>
                                                    </div>
                                                </td>
                                                <td colspan="4" style="border: none;"></td>
                                                <td width="160" style="border: none;">
                                                    <span class="filterCheckbox"><input type="checkbox"  
                                                            class="responsibility-checkbox-gr" [(ngModel)]="currentSearchFilter.statusDoneSelection" name="statusDone"></span>erledigt
                                                </td>
                                                <td width="160" style="border: none;">
                                                    <span class="filterCheckbox"><input type="checkbox"  
                                                                    class="responsibility-checkbox-gr" [(ngModel)]="currentSearchFilter.statusClosedSelection" name="statusClosed"></span>geschlossen
                                                </td>
                                                <td style="border: none;"></td>
                                            </tr>
                                            <tr>
                                                <td class="text-right" style="border: none;"><label>Priorität</label></td>
                                                <td class="text-left" style="width: 17%; border: none;">
                                                    <div class="form-group">
                                                        <select class="form-control" [(ngModel)]="currentSearchFilter.fkRefNotificationPriority" name="prioSelection">
                                                                    <option value="-1">Alle</option>
                                                                    <option *ngFor="let priority of priorities" value="{{ priority.id }}">{{ priority.name }}</option>
                                                                </select>
                                                    </div>
                                                </td>
                                                <td colspan="4" style="border: none;"></td>
                                                <td style="border: none;">                                                    
                                                </td>
                                                <td style="border: none;">                                                   
                                                </td>
                                                <td style="border: none;"></td>
                                            </tr>
                                            <tr height="50px">
                                                <td class="text-right"><label>Schnellsuche</label></td>
                                                <td colspan="4">
                                                    <span class="filterCheckbox"><input type="checkbox"  
                                                            class="responsibility-checkbox-gr" [(ngModel)]="currentSearchFilter.fastSearchSelected" name="fastSearchSelected"></span>Schnellsuche ausführen
                                                </td>
                                                <td colspan="6"></td>
                                            </tr>
                                            <tr height="50px">
                                                <td class="text-left" style="display:-ms-grid">
                                                    <span>
                                                        <button class="btn btn-primary btn-sm" style="width: 100px" (click)="search()" autofocus type="submit">Suchen</button>
                                                    </span>
                                                    <span>
                                                        <button id="deletesearch" type="button" class="btn btn-primary btn-sm" style="width: 100px" (click)="deleteSearch(currentSearchFilter)">Suche löschen</button>
                                                    </span>
                                                </td>
                                                <td colspan="9"></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </fieldset>
                            </form>
                        </div>
                    </div>
                </div>
                <app-search-result-list [globalSearchFilter]="globalSearchFilter" (onEditNotification)="openDialogEditEntry($event)" (onLookUpNotification)="openDialogLookUpEntry($event)"></app-search-result-list>
            </div>
        </div>
    </div>
</div>