programas.html 2.79 KB
<div class="row">
  <div class="col-sm-3">
    <div class="category-list">
      <aside class="navigation">
        <h3 class="title"><b>Programas</b> por Tema</h3>
        <div class="list-group category-list">
          <button type="button" class="list-group-item category-item"
            ng-repeat="category in vm.categories"
            ng-class="{active: vm.categoryFilter.slug === category.slug}"
            ng-click="vm.filterByCategory(category)">

            <span ng-class="[category.iconClass]"></span>
            <span>{{::category.name}}</span>
            <span class="glyphicon glyphicon-chevron-right pull-right"></span>

          </button>
        </div>
      </aside>
    </div>
  </div>

  <div class="col-sm-9">
    <div class="program-list">
      <div class="header">
        <h2>Programas</h2>
        <button type="button" class="btn btn-link" ng-click="vm.showAll()">
          <span class="glyphicon glyphicon-chevron-right"></span> Ver todos os programas
        </button>
      </div>
      <div>
        <div class="col-sm-12">
          <div class="form-inline">
            <div class="form-group">
              <label for="programListFilter" class="control-label sr-only">Filtrar programas:</label>
              <input id="programListFilter" type="search" class="form-control" ng-model="vm.query" placeholder="Filtrar programas" aria-label="Filtrar programas" >

              <select class="form-control" ng-model="vm.categoryFilter" ng-options="category.name for category in vm.categories track by category.slug">
                <option value="">-- Filtrar por tema --</option>
              </select>

              <select class="form-control" ng-model="vm.orderCriteria" ng-options="orderCriteria.label for orderCriteria in vm.orderCriteries">
                <option value="">-- Ordernar por: --</option>
              </select>

              <div class="checkbox">
                <label>
                  <input type="checkbox" ng-model="orderReverse">
                  Reverso
                </label>
              </div>

              <input id="programListLimit" type="number" class="form-control input-sm" size="4" step="2" ng-model="vm.limitTo" aria-label="Limitar" >
              <label for="programListLimit" class="control-label">Limite</label>

            </div>
          </div>
        </div>
        <div ng-repeat="program in vm.programs | filterByCategory:vm.categoryFilter | filterByCriteria:vm.orderCriteria:orderReverse | filter:vm.query | limitTo:vm.limitTo as results">
          <programa-box program="program" class="col-sm-12 col-md-6"></programa-box>
          <div ng-if="$odd" class="clearfix"></div>
        </div>
        <div class="animate-repeat" ng-if="results.length == 0">
          Nenhum programa encontrado.
        </div>
      </div>
    </div>
  </div>
</div>