<div class="col-xs-12 force-padding full-height">

  <div bs-active-pane="tabs.activeTab" ng-model="tabs.activeTab" ng-show="tabs.length > 1" bs-tabs>
      <div ng-repeat="tab in tabs track by $index" title="{{ tab.title | translate }}" bs-pane></div>
  </div>

  <div ng-show="tabs.activeTab === 0">
    <div class="col-md-12" ng-hide="currentParameter && currentParameter.edit">
      <div class="col-md-12 gcDatatableCrud marginTop">
          <div class="row">
              <div class="col-xs-12 nopadding">
                  <div class="btn btn-success btn-sm pull-right " ng-click="run()"
                          ng-disabled="checkInformations()">
                      <translate>hpo.multicritere.compare.run</translate>
                  </div>

                  <div class="btn btn-default btn-sm  pull-right marginLeft" ng-click="emptyParameter(true)"
                        ng-disabled="checkInformations()">
                      <translate>hpo.multicritere.parameters.empty</translate>
                  </div>

                  <save-and-get-template-hpo config-name="configName"
                                          data="currentParameter"
                                          run-return="getReturnedTemplate"
                                          save-template-html="saveTemplateHtml"
                                          get-template-html="getTemplateHtml"
                                          ng-hide="currentParameter.edit"
                                          exclude-properties="propertiestoexclude"></save-and-get-template-hpo>
              </div>
          </div>
      </div>
    </div>

    <div class="row nomargin" ng-if="currentParameter && currentParameter.edit">

      <div class="col-md-12 maintitlehpo nopadding" >
          <h2>
            <translate>hpo.multicritere.retenu.info</translate>
            <button type="button" class="btn btn-sm btn-success pull-right"
              ng-disabled="!currentParameter.name"
              ng-click="saveInfo(ftiCompare.uid , currentParameter.id ,
                                currentParameter.name , currentParameter.commentaire ,
                                currentParameter.savePriority)">
              <span translate>hpo.multicritere.retenu.saveinfo</span>
            </button>
          </h2>
      </div>

      <div class="col-md-12 marginTop nopadding">
        <div class="form-group clearfix">
            <div class="col-xs-6 nopaddingLeft">
                <label class="required"><translate>model.featuretypes.attributes.name</translate></label>

                <input type="text"
                   class="form-control"
                   ng-model="currentParameter.name"
                   limit="25"/>
            </div>

            <div class="col-xs-6 nopaddingRight">
                <label><translate>hpo.common.commentaire</translate></label>
                <textarea type="textarea" class="form-control" id="inputalias"
                  placeholder="{{ 'hpo.common.easyget' | translate }}"
                  ng-model="currentParameter.commentaire"/>
            </div>
        </div>
      </div>

      <div class="col-md-12 marginTop nopadding">
        <div class="form-group clearfix">
          <div class="col-md-12">
            <input type="checkbox" ng-model="currentParameter.savePriority" />
            <span translate>hpo.multicritere.retenu.useasLast</span>
          </div>
        </div>
      </div>

      <div class="col-md-12 nopadding marginTop">
        <div class="row nomargin">
          <div class="col-md-12">
            <div class="col-md-5 nopadding">
              <label><translate>hpo.multicritere.analyse.method</translate></label>
            </div>
            <div class="col-md-7 nopadding">
              <div class="col-md-12">
                <input type="radio" ng-model="currentParameter.typeAttribute" ng-value="'add'" disabled/>
                <translate>hpo.common.add</translate>
              </div>
              <div class="col-md-12">
                <input type="radio" ng-model="currentParameter.typeAttribute" ng-value="'update'" disabled/>
                <translate>hpo.common.replace</translate>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="row nomargin">
        <div class="col-md-12 marginTop nopadding">
          <div class="form-group clearfix">
            <div class="col-xs-5">
                <label><translate>hpo.multicritere.analyse.selected</translate></label>
            </div>
            <div class="col-xs-7">
                {{ currentParameter.attributeAlias }}
            </div>
          </div>
        </div>
      </div>

      <div class="row nomargin">
        <div class="col-md-12 marginTop nopadding">
          <div class="col-xs-5">
              <label><translate>hpo.multicritere.retenu.layerStyle</translate> : </label>
          </div>
          <div class="col-md-7 nopadding">
            <div class="col-md-12">
              <input type="radio" ng-model="currentParameter.updateStyle" ng-value="'nothing'" disabled/>
              <translate>hpo.multicritere.retenu.layerStyleNo</translate>
            </div>
            <div class="col-md-12">
              <input type="radio" ng-model="currentParameter.updateStyle" ng-value="'update'"
                      ng-disabled="!currentParameter.existingStyle" disabled/>
              {{ ('hpo.multicritere.retenu.layerStyleupdate' | translate ) + currentParameter.fti.defaultStyle }}
            </div>
            <div class="col-md-12">
              <input type="radio" ng-model="currentParameter.updateStyle" ng-value="'add'" disabled/>
              {{ ('hpo.multicritere.retenu.layerStyleAdd' | translate ) + " " + currentParameter.style }}
            </div>
          </div>
        </div>
      </div>

    </div>

    <div class="col-md-12 nopadding">

      <div class="col-md-12 nopadding marginTop maintitlehpo">
            <h2 class="col-md-12 nopadding">
              <translate>common.configuration</translate>
              <div class="btn btn-success btn-sm pull-right " ng-click="run()"
                      ng-show="currentParameter && currentParameter.edit"
                      ng-disabled="checkInformations()">
                  <translate>hpo.multicritere.compare.run</translate>
              </div>
            </h2>
      </div>

      <div class="col-md-12 nopadding marginTop">
          <div class="col-md-3">
              <div class="panel panel-primary panel-hpo">
                  <h4 class="adjust-positions text-left" translate>hpo.common.component</h4>
                  <div class="row marginTop" ng-if="ftis">
                      <div class="col-md-12">
                        <div class="col-md-12">
                          <div class="search">
                            <span class="fa fa-filter"></span>
                            <input type="text" ng-model="filtercomponents" class="form-control"
                                placeholder="{{ 'hpo.data.prepare.filter' | translate }}"
                            ng-keydown="filtercomponents = $event.keyCode === 27 ? '' : filtercomponents "/>
                            <a ng-show="filtercomponents.length > 0" ng-click="filtercomponents = ''">
                              <span class="fa fa-times-circle"></span>
                            </a>
                          </div>
                        </div>
                      </div>
                  </div>

                  <div class="row adjust-positions text-sized" css-manipulate='{"mh":"350px","ovy":"auto"}' ng-if="ftis">
                    <div class="col-md-12"  ng-hide="!fti || !filterFunc(filtercomponents,fti.alias)"
                        ng-repeat="fti in ftis | orderBy:'alias' ">
                        <input type="radio" ng-model="currentParameter.fti" ng-value="fti" ng-disabled="currentParameter.edit"/>
                        {{ fti.alias }}
                    </div>
                  </div>

                  <div class="row adjust-positions" ng-if="!ftis || ftis.length == 0">
                    <div class="col-md-12">
                      <div class="alert alert-info">
                        <translate>hpo.common.noftis</translate>
                      </div>
                    </div>
                  </div>
                  <br />
              </div>
          </div>

          <div class="col-md-3">
            <div class="panel panel-primary panel-hpo">
                <h4 class="adjust-positions text-left marginRight">
                    <translate>hpo.multicritere.retenu.analyse</translate>
                </h4>
                <div class="row marginTop">
                    <div class="col-md-12">
                      <div class="col-md-12">
                        <div class="alert alert-info" ng-show="availablePonderations.length === 0">
                          <translate>hpo.common.nodata</translate>
                        </div>
                        <div class="search" ng-hide="availablePonderations.length === 0">
                          <span class="fa fa-filter"></span>
                          <input type="text" ng-model="filterponderation" class="form-control"
                              placeholder="{{ 'hpo.data.prepare.filter' | translate }}"
                          ng-keydown="filterponderation = $event.keyCode === 27 ? '' : filterponderation "/>
                          <a ng-show="filterponderation.length > 0" ng-click="filterponderation = ''">
                            <span class="fa fa-times-circle"></span>
                          </a>
                        </div>
                      </div>
                    </div>
                </div>

                <div class="row adjust-positions text-sized" css-manipulate='{"mh":"350px","ovy":"auto"}'
                      ng-hide="availablePonderations.length === 0">
                  <div class="col-md-12"  ng-hide="!ponderation || !filterFunc(filterponderation,ponderation.properties.NAME)"
                      ng-repeat="ponderation in availablePonderations | orderBy:'alias' ">
                      <div class="input-group">
                        <span class="input-group-addon">
                          <input type="radio" ng-model="currentParameter.ponderation"
                                    ng-value="ponderation.properties.IDENTIFIANT"/>
                        </span>
                        <input type="text" class="form-control"
                                placeholder="" aria-label="" aria-describedby="basic-addon1"
                                ng-model="ponderation.properties.NAME" readonly>
                        <span class="input-group-addon btn btn-info" ng-click="getPonderationInfo(ponderation)">
                            <i class="fa fa-info"></i>
                        </span>
                      </div>
                  </div>
                </div>
                <br />
            </div>
        </div>

          <div class="col-md-3">
            <div class="panel panel-primary panel-hpo">
                <h4 class="adjust-positions text-left marginRight">
                    <translate>hpo.multicritere.retenu.seuil</translate>
                </h4>

                <div class="row adjust-positions text-sized" css-manipulate='{"mh":"350px","ovy":"auto"}'>
                  <div class="col-md-12">
                    <input type="radio" ng-model="currentParameter.seuil" ng-value="'lineaire'"/>
                    {{ 'hpo.multicritere.retenu.lineaire' | translate }}
                  </div>
                  <div class="col-md-12">
                      <input type="radio" ng-model="currentParameter.seuil" ng-value="'budget'"
                              ng-disabled="!availableCorrespondance ||
                                            availableCorrespondance.length === 0"/>
                      {{ 'hpo.multicritere.retenu.budget' | translate }}
                  </div>
                  <div class="col-md-12" ng-show="currentParameter.fti">
                    <div class="alert alert-info" ng-show="!availableCorrespondance ||
                                  availableCorrespondance.length === 0">
                      <button type="button" class="btn btn-success btn-sm"
                        ng-click="addCorrespondance(currentParameter.fti)">
                        <i class="fa fa-plus"></i>
                      </button>
                      <translate>hpo.multicritere.retenu.correspondanceitemneeded</translate>
                    </div>
                  </div>
                </div>
                <br/>
            </div>
        </div>

        <div class="col-md-3">
            <div class="panel panel-primary panel-hpo">
                <h4 class="adjust-positions text-left" translate>hpo.multicritere.retenu.priorities</h4>
                <div class="row marginTop nomargin">
                    <div class="col-md-12 ">
                      <div class="form-group row nomargin">
                        <span for="exampleInputSeuil"
                                class="col-sm-6  control-label nopadding"
                                style="padding-top:7px;">{{ 'hpo.multicritere.retenu.priority' | translate }} 1 </span>
                        <div class="col-sm-6">
                          <input type="number" class="form-control" id="exampleInputSeuil" aria-describedby="emailHelp"
                                              ng-model="currentParameter.priority1" required>
                        </div>
                      </div>
                    </div>
                    <div class="col-md-12 ">
                      <div class="form-group row nomargin">
                        <span for="exampleInputSeuil"
                                class="col-sm-6  control-label nopadding"
                                style="padding-top:7px;">{{ 'hpo.multicritere.retenu.priority' | translate }} 2 </span>
                        <div class="col-sm-6">
                          <input type="number" class="form-control" id="exampleInputSeuil" aria-describedby="emailHelp"
                                              ng-model="currentParameter.priority2" required>
                        </div>
                      </div>
                    </div>
                    <div class="col-md-12 ">
                      <div class="form-group row nomargin">
                        <span for="exampleInputSeuil"
                                class="col-sm-6 control-label nopadding"
                                style="padding-top:7px;">{{ 'hpo.multicritere.retenu.priority' | translate }} 3 </span>
                        <div class="col-sm-6">
                          <input type="number" class="form-control" id="exampleInputSeuil" aria-describedby="emailHelp"
                                              ng-model="currentParameter.priority3" required>
                        </div>
                      </div>
                    </div>
                </div>
                <br />
            </div>
        </div>

      </div>

    </div>



      <div class="maintitlehpo col-md-12">
            <h2 class="col-md-12">
              <div class="col-md-4 nopadding">
                <translate>hpo.multicritere.retenu.resultpreview</translate>
              </div>
              <div class="col-md-8 nopadding">
                <div class="btn btn-success btn-sm  pull-right marginLeft" ng-click="saveAgainScenario(currentParameter)"
                      ng-if="currentParameter &&
                             currentParameter.result &&
                             currentParameter.fti && !loading && currentParameter.edit">
                    <translate>hpo.multicritere.retenu.resaveresult</translate>
                </div>
                <div class="btn btn-success btn-sm  pull-right marginLeft" ng-click="saveScenario(currentParameter)"
                      ng-if="currentParameter &&
                             currentParameter.result &&
                             currentParameter.fti && !loading">
                    <translate>hpo.multicritere.retenu.saveresult</translate>
                </div>
              </div>
            </h2>
      </div>

      <div class="col-md-12" style="min-height:150px;margin-bottom:50px;">
        <div class="alert alert-info" ng-show="!currentParameter.result || loading">
          <translate>hpo.common.nodata</translate>
        </div>
        <div class="alert alert-info" ng-show=" currentParameter && currentParameter.result &&
                      currentParameter.result.show && currentParameter.result.specialAttributeUse && !loading ">
          <translate>hpo.multicritere.retenu.specialusecorrespondance</translate>
          {{ currentParameter.result.specialAttributeUse.alias }}
        </div>
        <div class="col-md-12" ng-if="currentParameter &&
                                currentParameter.result &&
                                currentParameter.fti && !loading"
                                ng-repeat="idx in elements track by $index">

          <div class="card card-hpo-interm card-info" ng-class="{ '' : (($index+1) % 10) <= 3 ,
                              'block-info' : (($index+1) % 10) > 3 && (($index+1) % 10) <= 6 ,
                              'block-success' : (($index+1) % 10) > 6 && (($index+1) % 10) <= 9  }">
          <div class="card-block">
              <h4 class="card-header">
                <div class="col-md-3">
                  <center>
                    <translate>hpo.multicritere.retenu.priority</translate>
                    <span class="badge">{{ idx }}</span>
                  </center>
                </div>
                <div class="col-md-4">
                  <center>
                    <translate  ng-show="currentParameter.result.type === 'lineaire'">hpo.multicritere.retenu.vallineaire</translate>
                    <translate  ng-show="currentParameter.result.type === 'budget'">hpo.multicritere.retenu.budget</translate>
                    <span  class="badge">{{ currentParameter.result['lineaire' + idx].toFixed(0) }}</span>
                    <translate  ng-show="currentParameter.result.type === 'lineaire'">m</translate>
                  </center>
                </div>
                <div class="col-md-5">
                  <center>
                    <translate ng-show="currentParameter.result.type === 'lineaire'">hpo.multicritere.retenu.lineaire</translate>
                    <translate ng-show="currentParameter.result.type === 'budget'">hpo.multicritere.retenu.pourbudget</translate>
                    <span class="badge badge-secondary">{{ currentParameter.result['percentage' + idx].toFixed(3) }}</span>
                  </center>
                </div>
              </h4>
              <div class="card-body marginTop">
                <div class="col-md-12 marginTop">
                  <div class="alert alert-info" ng-show="!currentParameter.result['priority' + idx] ||
                          !currentParameter.result['priority' + idx].features ||
                          currentParameter.result['priority' + idx].features.length === 0">
                    <translate>hpo.common.nodata</translate>
                  </div>
                  <div fti="currentParameter.fti"
                    ng-hide="!currentParameter.result['priority' + idx] ||
                            !currentParameter.result['priority' + idx].features ||
                            currentParameter.result['priority' + idx].features.length === 0"
                    res="analysis.results"
                    class="tableshow"
                    attributes="attributes"
                    auto-adjust-height="false"
                    height="{{datatableHeightHistoric}}"
                    buttonactions="buttonactions"
                    reset-filter-on-toggle="true"
                    display-total-number="true"
                    table-fill-page="false"
                    where="false"
                    geojsondata="currentParameter.result['priority' + idx]"
                    geoj="currentParameter.result['priority' + idx]"
                    hide-crud="false"
                    date-format="'dd-MM-yyyy'"
                    double-decimal-from-string-size="true"
                    usesweetalert="true"
                    start-count="10"
                    relationshow="true"
                    supplement-attributes="supplementAttributes"
                    no-default-action="true"
                    button-edit="buttonEditIcon"
                    crud="datatableCrudHpo"
                    import-csv="false"
                    export-csv="{{ currentParameter.fti.name + '.csv' }}"
                    dont-change-count-at-filter-toogle="true"
                    show-chart="true"
                    dont-use-guid="true"
                    gcdata-datatable></div>
                </div>
              </div>
          </div>
        </div>
        </div>
      </div>
    </div>
  </div>
</div>
  <div ng-show="tabs.activeTab === 1">
    <div class="col-md-12">
      <div class="correctPositionDataTAble"></div>
      <div id="hpoPrepareDataHistorique"
               fti="ftiCompare"
               attributes="ftiCompareattributes"
               height="{{datatableHeightHistoric}}"
               auto-adjust-height="false"
               table-fill-page="false"
               crud="datatableCalageCrudHpo"
               relationshow="true"
               date-format="'dd MMM yyyy HH:mm'"
               reset-filter-on-toggle="true"
               display-total-number="true"
               dont-show-filter="false"
               hide-crud="false"
               usesweetalert="true"
               translate-attrs="translateFtiAttributes"
               display-total-number="true"
               start-count="10"
               button-edit="buttonEditIcon"
               specialactions="buttonSpecialActions"
               where="whereFilter"
               hide-filter="hideFilter"
               dont-use-guid="true"
               gcdata-datatable></div>
    </div>
  </div>
</div>
