<div class="header">
  <label translate>rulecfg.getFeaturesFromLineAssociation.listTitle</label>
  <div class="add-container">
    <div class="add-inner">
      <label translate>rulecfg.getFeaturesFromLineAssociation.add</label>
      <div class="add-action">
        <select
          ng-options="featureType as featureType.alias for featureType in associatedFtis"
          class="form-control"
          ng-model="manualComponent.value"
        >
          <option value="" disabled selected hidden translate>rulecfg.getFeaturesFromLineAssociation.chooseComponent</option>
        </select>
        <div
          select-drag
          map="map"
          ftisid="[manualComponent.value.uid]"
          res="manualSelection.geojson"
          onfinish="refreshTable()"
          geomselect="geomselect"
        ></div>
      </div>
    </div>
  </div>
</div>
<div
  gcdata-datatable
  fti="relationObjFti"
  no-default-action="true"
  res=""
  attributes="relationObjFti.attributes"
  geojsondata="associatedFeatures"
  single-selection="true"
  display-total-number="true"
  reset-filter-on-toggle="true"
  prevent-toggle-all-from-selection="true"
  specialactions="specialActions"
  remove-fid="true"
  no-selection="true"
  remove-edit-btn="true"
  map="map"
  table-fill-page="false"
  class="datatable-container"
></div>
<div class="popup-button">
  <button
    class="btn btn-default"
    ng-click="closeThisDialog()"
    translate
  >
    common.cancel
  </button>
  <button
    class="btn btn-primary"
    ng-click="validateAssociatedFeatures();closeThisDialog()"
    translate
  >
    common.validate
  </button>
</div>