maestrano/mno-enterprise

View on GitHub
frontend-admin/src/app/views/organization/add-app-modal/add-app-modal.html

Summary

Maintainability
Test Coverage
<div id="add-app-modal">
  <!-- Modal Header -->
  <div class="modal-header">
    <h3 class="modal-title">Add more apps</h3>
    <div class="close" type="button" ng-click="vm.closeModal()">×</div>
  </div>
  <!-- Modal Body -->
  <div class="modal-body" style="max-height:{{vm.modal_height}};">
    <div class="alert alert-danger modal-error" ng-if="vm.displayError">
      <div class="close" type="button" ng-click="vm.closeError()" >×</div>
      <strong>Error:</strong> <b ng-repeat="app in vm.ListOfApps track by $index">{{app}}{{$last ? '' : ', '}}</b> could not be added. Please try again in a moment.
    </div>
    <div class="apps-search" ng-if="!vm.loading.modal">
      <input type="search" ng-model="vm.appSearch" placeholder="Search..."/>
    </div>
    <div class="apps-container">
      <div class="app-loader" ng-if="vm.loading.modal">
        <i class="fa fa-pulse fa-spinner "></i>
      </div>
      <div class="app-icon" ng-repeat="app in vm.marketplace.filtered_apps | filter:{name: vm.appSearch}">
        <div class="app-icon-wrapper" ng-click="vm.toggleApp(app)">
          <div class="checked" ng-show="app.checked">
            <i class="fa fa-check fa-5x"></i>
          </div>
          <img class="app-logo img-thumbnail" ng-src="{{app.logo}}" alt="{{::app.name}} logo" title="{{::app.tiny_description}}">
        </div>
        <div class="app-title">
          {{::app.name}}
        </div>
      </div>
    </div>
  </div>
  <!-- Modal Footer -->
  <div class="modal-footer">
    <div class="row">
      <div class="col-md-12">
        <button ng-click="vm.addApps()" ng-disabled="vm.loading.apps" class="btn btn-primary arrow">
          <span ng-show="vm.loading.apps"><i class="fa fa-pulse fa-spinner"></i></span>
          Add
        </button>
        <button ng-click="vm.closeModal()" class="btn btn-default">
          Cancel
        </button>
      </div>
    </div>
  </div>
</div>