| <!-- ******************************************************************************** |
| * Copyright (c) 2015-2020 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; |
| } |
| |
| .auto-width-typeahead >>> typeahead-container { |
| width: auto!important; |
| } |
| </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"> |
| <h4 class="modal-title">{{ 'search.edit-searchfields.title-search-field-editor' | translate }}</h4> |
| <button type="button" title="{{ 'search.edit-searchfields.tooltip-close' | translate }}" class="close" (click)="childModal.hide()" aria-label="Close"> |
| <span aria-hidden="true">×</span> |
| </button> |
| </div> |
| <div class="modal-body"> |
| <div class="container-fluid"> |
| <div class="row"> |
| <div class="col-md-4 auto-width-typeahead" style="min-height: 50vh; max-height: 77vh;"> |
| <input [(ngModel)]="selectedSearchAttribute" [typeahead]="typeAheadValues" |
| (typeaheadOnSelect)="typeaheadOnSelect($event)" |
| typeaheadOptionField="label" |
| typeaheadGroupField="group" |
| typeaheadOptionsLimit="15" |
| placeholder="{{ 'search.edit-searchfields.enter-search-text' | translate }}" |
| 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="col-form-label" style="padding: 8px 0 15px 0;">{{ 'search.edit-searchfields.lbl-selected-search-attributes' | translate }}</label> |
| <div *ngIf="layout.getSourceNames().length === 0" style="text-align: center;"> |
| {{ 'search.edit-searchfields.no-search-attributes-selected' | translate }} |
| </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="fa fa-chevron-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="fa fa-chevron-down" [ngStyle]="{'visibility': isLast(condition)? 'hidden': 'visible'}" style="cursor: pointer;" (click)="moveDown(condition)"></span> |
| </td> |
| <td style="text-align: center;"><span class="fa fa-times" style="cursor: pointer" title="{{ 'search.edit-searchfields.remove' | translate }}" (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="fa fa-check"></span> {{ 'search.edit-searchfields.btn-apply-changes' | translate }} |
| </button> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |