maestrano/mno-enterprise-angular

<div class="dashboard-marketplace-compare">
  <mno-loader ng-show="vm.isLoading" class="top-buffer-4"></mno-loader>
  <!-- Header -->
  <div class="row show-header top-buffer-4">
    <div class="col-md-12">
      <a ui-sref="home.marketplace()" class="text-muted">
        <i class="fa fa-chevron-left"></i> {{ 'mno_enterprise.templates.dashboard.marketplace.show.back' | translate }}
      </a>
    </div>
  </div>
  <div class="marketplace-compare-wrap" ng-show="!vm.isLoading">
    <div class="row">
      <div class="col-md-12">
        <h1>{{ 'mno_enterprise.templates.dashboard.marketplace.compare.title' | translate }}</h1>
        <div class="marketplace-compare-info">
          <table class="marketplace-compare-table table table-bordered">
            <tr>
              <th></th>
              <td ng-repeat="app in vm.comparedApps | limitTo:4"><a ui-sref="home.marketplace.app({appId: app.id})"><img class="media-object" ng-src="{{::app.logo}}" alt="{{::app.name}}"></a></td>
            </tr>
            <tr>
              <th>{{ 'mno_enterprise.templates.dashboard.marketplace.compare.application_provider' | translate }}</th>
              <td ng-repeat="app in vm.comparedApps | limitTo:4">{{::app.name}}</td>
            </tr>
            <tr>
              <th>{{ 'mno_enterprise.templates.dashboard.marketplace.compare.category' | translate }}</th>
              <td ng-repeat="app in vm.comparedApps | limitTo:4">{{::app.categories[2]}}</td>
            </tr>
            <tr>
              <th>{{ 'mno_enterprise.templates.dashboard.marketplace.compare.key_benefits' | translate }}</th>
              <td ng-repeat="app in vm.comparedApps | limitTo:4">
                <ul>
                  <li ng-repeat="benefit in app.key_benefits track by $index">
                    {{::benefit}}
                  </li>
                </ul>
              </td>
            </tr>
            <tr>
              <th>{{ 'mno_enterprise.templates.dashboard.marketplace.compare.short_description' | translate }}</th>
              <td ng-repeat="app in vm.comparedApps | limitTo:4">{{::app.tiny_description}}</td>
            </tr>
            <tr ng-if="vm.isReviewingEnabled">
              <th>{{ 'mno_enterprise.templates.dashboard.marketplace.compare.rating' | translate }}</th>
              <td ng-repeat="app in vm.comparedApps | limitTo:4">
                <p ng-if="!app.average_rating">{{ 'mno_enterprise.templates.dashboard.marketplace.compare.no_review' | translate }}</p>
                <average-star-rating display-rating="true" ng-if="app.average_rating" ng-model="app.average_rating" max="5"></average-star-rating>
              </td>
            </tr>
            <tr>
              <th>{{ 'mno_enterprise.templates.dashboard.marketplace.compare.companies_number' | translate }}</th>
              <td ng-repeat="app in vm.comparedApps | limitTo:4">{{::app.running_instances_count}}</td>
            </tr>
            <tr ng-if="vm.isPriceShown">
              <th>{{ 'mno_enterprise.templates.dashboard.marketplace.compare.pricing' | translate }}</th>
              <td ng-repeat="app in vm.comparedApps | limitTo:4">
                <ul>
                  <li ng-repeat="plan in app.pricing_plans[vm.pricing_plans]">
                    <b>{{::plan.name}}</b><br>
                    <span ng-if="plan.price.value">{{::plan.currency}} {{::plan.price.value}} {{::plan.factor}}</span>
                    <span ng-if="!plan.price.value">{{ 'mno_enterprise.templates.dashboard.marketplace.compare.pricing_not_available' | translate }}</span>
                  </li>
                </ul>
              </td>
            </tr>
            <tr class="text-center">
              <th></th>
              <td ng-repeat="app in vm.comparedApps | limitTo:4">
                <mno-app-install-btn app="app"></mno-app-install-btn>
              </td>
            </tr>
          </table>
        </div>
      </div>
    </div>
  </div>
</div>