<h3 ng-if="editModalIsNew">
  <translate>model.featuretypes.relations.create</translate>
</h3>
<h3 ng-if="!editModalIsNew">
  <translate>model.featuretypes.relations.edit</translate>
</h3>

<div
  class="alert alert-danger"
  role="alert"
  ng-if="currentFeatureType.attributes.length==0"
>
  <span class="glyphicon glyphicon-exclamation-sign"></span>
  <translate>model.featuretypes.relations.no_featuretype_attribute</translate>
</div>

<form
  ng-submit="addRelationToFeatureType(); closeThisDialog()"
  class="form"
  role="form"
  ng-if="currentFeatureType.attributes.length>0"
>
  <!-- Type of Restriction -->
  <div class="form-group clearfix">
    <div class="col-xs-12">
      <!--     <select
                    ng-model="currentFeatureTypeRelation.type"
                    ng-options="k as v for (k,v) in relationsTypes"
                    id="inputrelation"
                    class="form-control"
                    ng-disabled="!isNewResource && currentFeatureTypeRelation.type" required>
            </select>-->
      <select
        ng-model="currentFeatureTypeRelation.type"
        ng-options="k as v for (k,v) in relationsTypes"
        id="inputrelation"
        class="form-control"
        ng-change="cleanFeatureTypeRelation()"
        required
      >
      </select>
    </div>
  </div>

  <!-- REL_NM -->
  <div class="form-group clearfix" ng-if="currentFeatureTypeRelation.type">
    <div class="col-xs-6">
      <label><translate>model.featuretypes.relations.name</translate></label>
      <input
        type="text"
        class="form-control"
        ng-model="currentFeatureTypeRelation.name"
        ng-disabled="!editModalIsNew"
        required
      />
    </div>
    <div class="col-xs-6">
      <label><translate>model.featuretypes.relations.alias</translate></label>
      <input
        type="text"
        class="form-control"
        ng-model="currentFeatureTypeRelation.alias"
        required
      />
    </div>
  </div>

  <div
    class="form-group clearfix"
    ng-if="currentFeatureTypeRelation.type=='REL_SIMPLE' || currentFeatureTypeRelation.type=='REL_NM'   "
  >
    <div class="col-xs-6">
      <label for="inputcomponentstart"
        ><translate
          >model.featuretypes.relations.componentStart</translate
        ></label
      >
      <input
        type="text"
        class="form-control"
        id="inputcomponentstart"
        ng-model="currentFeatureTypeRelation.componentStart"
        disabled
        required
      />
    </div>

    <div class="col-xs-6">
      <label for="inputcomponentend"
        ><translate>model.featuretypes.relations.componentEnd</translate></label
      >
      <select
        ng-model="componentEndSelect.uid"
        ng-options="featureType.uid as featureType.name for featureType in featureTypesList"
        id="inputcomponentend"
        class="form-control"
        ng-change="updateEndComponent()"
        required
      >
      </select>
    </div>

    <!-- REL_SIMPLE -->

    <div class="col-xs-6" ng-if="currentFeatureTypeRelation.type=='REL_SIMPLE'">
      <label for="inputcomponentfieldstart"
        ><translate>model.featuretypes.relations.fieldStart</translate></label
      >
      <select
        ng-model="currentFeatureTypeRelation.fieldStart"
        ng-options="attribute.name as attribute.name for attribute in currentFeatureType.attributes"
        id="inputcomponentfieldstart"
        class="form-control"
        required
      >
      </select>
    </div>
    <div
      class="col-xs-6"
      ng-if="currentFeatureTypeRelation.type=='REL_SIMPLE' && currentFeatureTypeRelation.componentEnd"
    >
      <label for="inputcomponentfieldend"
        ><translate>model.featuretypes.relations.fieldEnd</translate></label
      >

      <select
        ng-model="currentFeatureTypeRelation.fieldEnd"
        ng-options="attribute.name as attribute.name for attribute in endAttributes"
        id="inputcomponentfieldend"
        class="form-control"
        required
      >
      </select>
    </div>
    <div class="col-xs-6" ng-show="currentFeatureTypeRelation.componentEnd"
      ng-if="currentFeatureTypeRelation.type==='REL_SIMPLE'">
      <label for="cascadeDelete">
        <translate>model.featuretypes.relations.cascadeDelete
        </translate>
      </label>
      <input type="checkbox" class="cascadeDeleteCheckBox"
        id="cascadeDelete"
        ng-model="currentFeatureTypeRelation.cascadeDelete">
    </div>
  </div>
  <!-- RELATION WS REL_WS-->
  <div class="form-group clearfix">
    <div class="col-xs-12" ng-if="currentFeatureTypeRelation.type=='REL_WS'">
      <label for="inputname"
        ><translate>model.featuretypes.relations.url</translate></label
      >
      <input
        type="text"
        class="form-control"
        id="inputname"
        ng-model="currentFeatureTypeRelation.url"
      />
    </div>
    <div class="col-xs-12" ng-if="currentFeatureTypeRelation.type=='REL_WS'">
      <label for="inputname"
        ><translate
          >model.featuretypes.relations.attributeview</translate
        ></label
      >
      <input
        type="text"
        class="form-control"
        id="inputname"
        ng-model="currentFeatureTypeRelation.attributeview"
      />
    </div>
    <div class="col-xs-12" ng-if="currentFeatureTypeRelation.type=='REL_WS'">
      <label for="inputname"
        ><translate>model.featuretypes.relations.htmlview</translate></label
      >
      <input
        type="text"
        class="form-control"
        id="inputname"
        ng-model="currentFeatureTypeRelation.htmlview"
      />
    </div>
    <div class="col-xs-12" ng-if="currentFeatureTypeRelation.type=='REL_WS'">
      <label for="inputname"
        ><translate>model.featuretypes.relations.link</translate></label
      >
      <input
        type="text"
        class="form-control"
        id="inputname"
        ng-model="currentFeatureTypeRelation.link"
      />
    </div>
  </div>

  <!-- Actions -->
  <div
    class="form-group clearfix"
    ng-if="currentFeatureType.attributes.length>0"
  >
    <div class="col-xs-12 text-right">
      <close-modale-button></close-modale-button>
      <button
        type="submit"
        class="btn btn-primary"
        ng-disabled="
                    !currentFeatureTypeRelation.componentEnd && currentFeatureTypeRelation.type=='REL_NM'||
                    ((!currentFeatureTypeRelation.fieldStart
                        ||
                    !currentFeatureTypeRelation.fieldEnd)
                        &&
                    currentFeatureTypeRelation.type=='REL_SIMPLE')"
      >
        <translate>common.save</translate>
      </button>
    </div>
  </div>
</form>
