eHealthAfrica/direct-delivery-dashboard

<div class="panel panel-default">
  <div class="panel-heading clearfix">
    <div ng-include="'app/configurations/locations/menu.html'"></div>
  </div>
  <div class="panel-body">
    <form role="form" class="form form-inline">
        <div class="import clearfix">
          <div class="form-group" ng-show="locationWardsCtrl.states.length > 0">
            <label>select state</label>
            <select
                            class="form-control"
                            ng-show="locationWardsCtrl.states.length > 0"
                            ng-model="locationWardsCtrl.state"
                            ng-change="locationWardsCtrl.getZones(locationWardsCtrl.state)">
              <option ng-repeat="state in locationWardsCtrl.states track by $index" value="{{state}}">{{state.name}}</option>
            </select>
          </div>
                    <div class="form-group" ng-show="locationWardsCtrl.zones.length > 0">
            <label>select zone</label>
            <select class="form-control"  ng-model="locationWardsCtrl.zone" ng-change="locationWardsCtrl.getLgas(locationWardsCtrl.zone)">
              <option ng-repeat="zone in locationWardsCtrl.zones track by $index" value="{{zone}}">{{zone.name}}</option>
            </select>
          </div>
          <div class="form-group" ng-show="locationWardsCtrl.lgas.length > 0">
            <label>select LGA</label>
            <select class="form-control"  ng-model="locationWardsCtrl.lga">
              <option ng-repeat="lga in locationWardsCtrl.lgas track by $index" value="{{lga}}">{{lga.name}}</option>
            </select>
          </div>
          <div class="form-group">
            <ng-csv-import
              content="locationWardsCtrl.csv.content"
              header="locationWardsCtrl.csv.header"
              separator="locationWardsCtrl.csv.separator"
              finished="locationWardsCtrl.finished(locationWardsCtrl.csv.result)"
              result="locationWardsCtrl.csv.result">
            </ng-csv-import>
          </div>
          <div class="form-group pull-right">
            <button class="btn btn-lg "
                    ng-class="{'btn-success': locationWardsCtrl.csv.result.length > 0, 'btn-default': locationWardsCtrl.csv.result.length === 0}"
                    ng-click="locationWardsCtrl.save()"
                    ng-disabled="locationWardsCtrl.csv.result.length === 0">
              <i class="fa "
                 ng-class="{'fa-check': locationWardsCtrl.csv.result.length > 0, 'fa-times': locationWardsCtrl.csv.result.length === 0}"></i>
              Save
            </button>
          </div>
        </div>
    </form>
    <div class="alert alert-warning" ng-show="flocationWardsCtrl.invalidUploads">
      <i class="fa fa-warning"></i> wardss highlighted in red background cannot be upload due to missing parent locations
    </div>
    <div ng-if="locationWardsCtrl.csv.result.length > 0">
      <table class="table table-bordered table-hover table-condensed">
        <tr style="font-weight: bold">
          <th style="">Name</th>
          <th>Level</th>
          <th style="">OSMID</th>
          <th style="">Country</th>
          <th style="">G/P Zone</th>
          <th style="">State</th>
          <th style="">Zone</th>
          <th style="">LGA</th>
        </tr>
        <tr ng-repeat="location in locationWardsCtrl.csv.result track by $index">
          <td>{{location.name}}</td>
          <td ng-bind="location.level"></td>
          <td ng-bind="location.osmId"></td>
          <td ng-bind="location.admin_level_0"></td>
          <td ng-bind="location.admin_level_1"></td>
          <td ng-bind="location.admin_level_2"></td>
          <td ng-bind="location.admin_level_3"></td>
          <td ng-bind="location.admin_level_4"></td>
        </tr>
      </table>
    </div>
  </div>
</div>