<div class="col-md-12 nopadding">
  <div class="col-md-5">
    <select
      data-ng-model="res.operand"
      class="form-control"
      ng-if="attr.type=='java.lang.String'"
    >
      <!-- Term Options -->
      <optgroup label="{{ 'elastic.search.rule.text' | translate }}">
        <option value="startWith"
          >{{ 'elastic.search.rule.startswith' | translate }}</option
        >
        <option value="endWith"
          >{{ 'elastic.search.rule.endswith' | translate }}</option
        >
        <option value="regexp"
          >{{ 'elastic.search.rule.contains' | translate }}</option
        >
        <option value="equals"
          >{{ 'elastic.search.rule.equals' | translate }}</option
        >
        <option value="notEquals"
          >{{ 'elastic.search.rule.notequals' | translate }}</option
        >
      </optgroup>

      <!-- Term Options -->
      <optgroup label="{{ 'elastic.search.rule.liste' | translate }}">
        <option value="include"
          >{{ 'elastic.search.rule.include' | translate }}</option
        >
      </optgroup>

      <!-- Generic Options -->
      <optgroup label="{{ 'elastic.search.rule.generic' | translate }}">
        <option value="exists"
          >{{ 'elastic.search.rule.exists' | translate }}</option
        >
        <option value="notExists"
          >{{ 'elastic.search.rule.notexists' | translate }}</option
        >
        <option value="spaceExists"
          >{{ 'elastic.search.rule.spaceexists' | translate }}</option
        >
      </optgroup>
    </select>

    <!-- Number -->
    <select
      data-ng-model="res.operand"
      class="form-control"
      ng-if="attr.type=='java.lang.Number'
                            || attr.type=='java.lang.Float'|| attr.type=='java.math.BigDecimal'
                            || attr.type=='java.lang.Short'|| attr.type=='java.math.BigDecimal'
                            || attr.type=='java.lang.Double' || attr.type=='java.lang.Integer'
                            || attr.type=='java.lang.Long' "
    >
      <optgroup label="{{ 'elastic.search.rule.numeral' | translate }}">
        <option value="equals">=</option>
        <option value="gt">&gt;</option>
        <option value="gte">&ge;</option>
        <option value="lt">&lt;</option>
        <option value="lte">&le;</option>
      </optgroup>

      <optgroup label="{{ 'elastic.search.rule.generic' | translate }}">
        <option value="exists"
          >{{ 'elastic.search.rule.exists' | translate }}</option
        >
        <option value="notExists"
          >{{ 'elastic.search.rule.notexists' | translate }}</option
        >
      </optgroup>
    </select>

    <!--Date-->
    <select
      data-ng-model="res.operand"
      class="form-control"
      ng-if="attr.type=='java.sql.Timestamp' || attr.type=='java.sql.Date' || attr.type=='java.util.Date'"
    >
      <optgroup label="{{ 'elastic.search.rule.exact' | translate }}">
        <option value="equals">=</option>
      </optgroup>
      <optgroup label="{{ 'elastic.search.rule.range' | translate }}">
        <option value="lt">&lt;</option>
        <option value="lte">&le;</option>
        <option value="gt">&gt;</option>
        <option value="gte">&ge;</option>
      </optgroup>
      <optgroup label="{{ 'elastic.search.rule.rangebounded' | translate }}">
        <option value="last"
          >{{ 'elastic.search.rule.last' | translate }}</option
        >
        <option value="next"
          >{{ 'elastic.search.rule.next' | translate }}</option
        >
      </optgroup>
      <optgroup label="{{ 'elastic.search.rule.generic' | translate }}">
        <option value="exists"
          >{{ 'elastic.search.rule.exists' | translate }}</option
        >
        <option value="notExists"
          >{{ 'elastic.search.rule.notexists' | translate }}</option
        >
      </optgroup>
    </select>

    <!--Boolean-->
    <select
      data-ng-model="res.operand"
      class="form-control"
      ng-if="attr.type=='java.lang.Boolean'"
    >
      <optgroup label="{{ 'elastic.search.rule.exact' | translate }}">
        <option value="equals">=</option>
      </optgroup>
      <optgroup label="{{ 'elastic.search.rule.generic' | translate }}">
        <option value="exists"
          >{{ 'elastic.search.rule.exists' | translate }}</option
        >
        <option value="notExists"
          >{{ 'elastic.search.rule.notexists' | translate }}</option
        >
      </optgroup>
    </select>
  </div>

  <div class="col-md-7 nopaddingLeft">
    <!-- LES INPUTS-->
    <div class="col-md-10 nopadding">
      <input
        data-ng-if="inputFloatNeeded() && (attr.type=='java.lang.Number' || attr.type=='java.lang.Float' ||
                    attr.type=='java.math.BigDecimal' || attr.type=='java.lang.Double' || attr.type=='java.lang.Long' ) && !showAllValues"
        class="form-control"
        ng-model="res.value"
        type="text"
        required
      />

      <input
        data-ng-if="inputFloatNeeded() && ( attr.type=='java.lang.Integer' ||
              attr.type=='java.lang.Short')
               && !showAllValues  && inputFloatNeeded()"
        class="form-control"
        ng-model="res.value"
        step="1"
        type="number"
        required
      />

      <div
        javautildate
        gcatt="{ 'name' : 'value' }"
        result="res.newValueUtil"
        data-ng-if="inputNeeded() && (attr.type =='java.sql.Timestamp'
                        || attr.type=='java.sql.Date' || attr.type=='java.util.Date') && !showAllValues"
      ></div>

      <input
        ng-if="inputdayNeeded() && ( attr.type =='java.sql.Timestamp' || attr.type=='java.sql.Date' || attr.type=='java.util.Date') &&
                 !showAllValues"
        class="form-control"
        placeholder="{{ 'elastic.search.day' | translate }}"
        ng-model="res.newvalue"
        type="number"
        step="1"
      />

      <select
        class="form-control"
        data-ng-model="res.newValueUtil.value"
        data-ng-options="item as formatDateShow(item) for item in autocompleteglobalsearch"
        ng-if=" (attr.type =='java.sql.Timestamp'
                      || attr.type=='java.sql.Date' || attr.type=='java.util.Date' ) && showAllValues && inputNeeded()"
        data-animation="am-flip-x"
      ></select>

      <div
        javalangboolean
        gcatt="{ 'name' : 'value' }"
        result="res.newValueUtil"
        data-ng-if="inputBooleanNeeded() && attr.type =='java.lang.Boolean' && !showAllValues"
        class="xsmargintop"
      ></div>

      <input
        type="text"
        ng-if=" attr.type == 'java.lang.String' && !showAllValues && inputNeeded() "
        bs-options="item as item for item in autocompleteglobalsearch"
        class="form-control"
        ng-model="res.value"
        data-animation="am-flip-x"
        bs-typeahead
        autocomplete="off"
      />
      <select
        class="form-control"
        data-ng-model="res.value"
        data-ng-options="item as item for item in autocompleteglobalsearch"
        ng-if=" ( attr.type=='java.lang.String'
                      || attr.type=='java.lang.Number' || attr.type=='java.lang.Float'||attr.type=='java.lang.BigDecimal'
                      || attr.type=='java.lang.Double' || attr.type=='java.lang.Integer' || attr.type=='java.lang.Long') && showAllValues && inputNeeded() && res.operand !== 'include'"
        data-animation="am-flip-x"
      ></select>

      <div
        class="form-control"
        style="min-height:120px;max-height: 150px; overflow: auto;"
        ng-if="attr.type == 'java.lang.String'  && showAllValues && inputNeeded() && res.operand === 'include'"
      >
        <div class="col-md-12 nopadding">
          <div class="search">
            <span class="fa fa-filter"></span>
            <input
              type="text"
              ng-model="filtercomponentscorrection"
              class="form-control"
              placeholder="{{ 'hpo.data.prepare.filter' | translate }}"
              ng-keydown="filtercomponentscorrection = $event.keyCode === 27 ? '' : filtercomponentscorrection "
            />
            <a
              ng-show="filtercomponentscorrection.length > 0"
              ng-click="filtercomponentscorrection = ''"
            >
              <span class="fa fa-times-circle"></span>
            </a>
          </div>
        </div>
        <ul style="padding:0 0 0 10px;">
          <li
            class="checkbox col-md-12"
            ng-repeat="item in autocompleteglobalsearchinclude | orderBy : 'name'"
            ng-hide="!filterFunc(filtercomponentscorrection,item.name)"
            style="display:inline-block;min-height:20px;max-height:40px;max-width:140px;padding:0 0 0 5px;"
          >
            <input
              type="checkbox"
              ng-model="item.selected"
              ng-change="clickedCheckbox(item)"
            />
            <span>{{ item.name }}</span>
          </li>
        </ul>
      </div>
    </div>

    <div class="col-md-2 nopadding">
      <a
        class="btn btn-md btn-default remover"
        data-ng-click="searchForValues()"
        title="{{ !showAllValues ? 'elastic.search.searchValues' : 'elastic.search.returnsearchValues' | translate }}"
        ng-if="(attr.type =='java.sql.Timestamp'
                  || attr.type=='java.sql.Date' || attr.type=='java.util.Date'
                  || attr.type=='java.lang.String'
                  || attr.type=='java.lang.Number' || attr.type=='java.lang.Float'||attr.type=='java.lang.BigDecimal'
                  || attr.type=='java.lang.Double' || attr.type=='java.lang.Integer' || attr.type=='java.lang.Long') && inputNeeded()"
      >
        <i
          ng-class="{ 'fa fa-list': !showAllValues , 'fa fa-pencil': showAllValues  }"
        ></i>
      </a>
    </div>
  </div>
</div>
