<!-- ******************************************************************************** | |
* Copyright (c) 2015-2018 Contributors to the Eclipse Foundation | |
* | |
* See the NOTICE file(s) distributed with this work for additional | |
* information regarding copyright ownership. | |
* | |
* This program and the accompanying materials are made available under the | |
* terms of the Eclipse Public License v. 2.0 which is available at | |
* http://www.eclipse.org/legal/epl-2.0. | |
* | |
* SPDX-License-Identifier: EPL-2.0 | |
* | |
******************************************************************************** --> | |
<style> | |
.modal-body >>> .dropup .dropdown-menu { | |
margin-bottom: 38px !important; | |
} | |
.modal-body >>> .ui-tree .ui-tree-container { | |
margin: 0 0 4px 0 !important; | |
width: 100%; | |
overflow: visible; | |
} | |
.modal-body >>> .ui-tree { | |
min-height: 50vh !important; | |
max-height: 76vh !important; | |
overflow: auto; | |
} | |
.modal-body >>> .ui-tree .ui-treenode .ui-treenode-content .ui-treenode-label { | |
padding-right: .75em; | |
} | |
</style> | |
<div bsModal #lgEditSearchFieldsModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="SelectSearchComponents" aria-hidden="true"> | |
<div class="modal-dialog modal-lg"> | |
<div class="modal-content"> | |
<div class="modal-header"> | |
<button type="button" title="{{TtlClose}}" class="close" (click)="childModal.hide()" aria-label="Close"> | |
<span aria-hidden="true">×</span> | |
</button> | |
<h4 class="modal-title">{{LblSearchFieldEditor}}</h4> | |
</div> | |
<div class="modal-body"> | |
<div class="container-fluid"> | |
<div class="row"> | |
<div class="col-md-4" style="min-height: 50vh; max-height: 77vh;"> | |
<input [(ngModel)]="selectedSearchAttribute" [typeahead]="typeAheadValues" | |
(typeaheadOnSelect)="typeaheadOnSelect($event)" | |
typeaheadOptionField="label" | |
typeaheadGroupField="group" | |
typeaheadOptionsLimit="15" | |
placeholder="Suchtext eingeben" | |
class="form-control" | |
style="margin-bottom: 15px;"> | |
<searchattribute-tree [searchAttributes]="searchAttributes" [environments]="environments"></searchattribute-tree> | |
</div> | |
<div class="col-md-8" style="min-height: 50vh; max-height: 77vh; overflow-y:auto;"> | |
<label for="search-source" class="control-label" style="padding: 8px 0 15px 0;">{{LblSelectedSearchAttributes}}</label> | |
<div *ngIf="layout.getSourceNames().length === 0" style="text-align: center;"> | |
Keine Suchattribute ausgewählt. | |
</div> | |
<div *ngFor="let env of layout.getSourceNames()"> | |
<div *ngIf="layout.getConditions(env).length > 0"> | |
<span style="font-weight: bold;">{{mapSourceNameToName(env)}}</span> | |
<table class="table table-bordered searchdefinition"> | |
<colgroup> | |
<col style="width: 44%;"> | |
<col style="width: 44%;"> | |
<col style="width: 4%;"> | |
<col style="width: 4%;"> | |
<col style="width: 4%;"> | |
</colgroup> | |
<tr *ngFor="let condition of layout.getConditions(env)"> | |
<td>{{condition?.type}}</td> | |
<td>{{condition?.attribute}}</td> | |
<td style="width: 30px; text-align: center; vertical-align: middle;"> | |
<span class="glyphicon glyphicon-menu-up" [ngStyle]="{'visibility': isFirst(condition) ? 'hidden': 'visible'}" style="cursor: pointer; margin-bottom: 0;" (click)="moveUp(condition)"></span> | |
</td> | |
<td style="width: 30px; text-align: center; vertical-align: middle;"> | |
<span class="glyphicon glyphicon-menu-down" [ngStyle]="{'visibility': isLast(condition)? 'hidden': 'visible'}" style="cursor: pointer;" (click)="moveDown(condition)"></span> | |
</td> | |
<td style="text-align: center;"><span class="glyphicon glyphicon-remove" style="cursor: pointer" title="{{TtlRemove}}" (click)="removeCondition(condition)"></span></td> | |
</tr> | |
</table> | |
</div> | |
</div> | |
</div> | |
</div> | |
<div class="row" style="margin-top: 15px;"> | |
<div class="col-md-12"> | |
<button type="button" class="btn btn-default pull-right" (click)="addSearchFields()" [disabled]="conditions.length === 0"> | |
<span class="glyphicon glyphicon-ok"></span> {{LblApplyChanges}} | |
</button> | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> |