Improve search and filters to proposals

Leonardo Merlin
1 parent 6c43d39c
Showing 2 changed files with 56 additions and 48 deletions Show diff stats
src/app/pages/propostas/propostas.controller.js
src/app/pages/propostas/propostas.html
@@ -27,11 +27,11 @@
   PropostasPageController.prototype.init = function() {
     var vm = this;
+    vm.page = 1;
+    vm.per_page = 20;
     vm.themes = null;
     vm.selectedTheme = null;
     vm.filtredPrograms = null;
-    vm.selectedProgram = null;
-    vm.proposals = null;
     vm.filtredProposals = null;
     vm.query = null;
     vm.search = vm.$location.search();
@@ -73,11 +73,14 @@
     // load Proposals
     vm.loadingProposals = true;
-    vm.DialogaService.getProposals({}, function(data) {
-      vm.proposals = data.articles;
-      vm.filtredProposals = vm.proposals;
+    vm.DialogaService.searchProposals({
+      page: vm.page,
+      per_page: vm.per_page
+    }, function(data) {
+      vm.filtredProposals = data.articles;
+      vm.total_proposals = parseInt(data._obj.headers('total'));
+
       vm.loadingProposals = false;
-      vm.loading = false;
       if (cb) {
         cb();
@@ -86,7 +89,6 @@
       vm.error = error;
       vm.$log.error(error);
       vm.loadingProposals = false;
-      vm.loading = false;
     });
   };
@@ -100,23 +102,13 @@
     vm.$scope.$watch('pagePropostas.selectedTheme', function(newValue/*, oldValue*/) {
       vm.search.tema = newValue ? newValue.slug : null;
       vm.$location.search('tema', vm.search.tema);
-      vm.filtredProposals = vm.getFiltredProposals();
-    });
-
-    vm.$scope.$on('change-selectedTopic', function(event, selectedTopic) {
-      vm.selectedProgram = selectedTopic;
-    });
-
-    vm.$scope.$watch('pagePropostas.selectedProgram', function(newValue/*, oldValue*/) {
-      vm.search.programa = newValue ? newValue.slug : null;
-      vm.$location.search('programa', vm.search.programa);
-      vm.filtredProposals = vm.getFiltredProposals();
+      vm.filterProposals();
     });
     vm.$scope.$watch('pagePropostas.query', function(newValue/*, oldValue*/) {
       vm.search.filtro = newValue ? newValue : null;
       vm.$location.search('filtro', vm.search.filtro);
-      vm.filtredProposals = vm.getFiltredProposals();
+      vm.filterProposals();
     });
   };
@@ -127,35 +119,45 @@
     vm.selectedTheme = null;
   };
-  PropostasPageController.prototype.getFiltredProposals = function() {
+  PropostasPageController.prototype.changePage = function(pageIndex) {
     var vm = this;
-    if (!vm.proposals) {
-      vm.$log.info('No proposals loaded yet. Abort.');
-      return null;
-    }
-
-    var input = vm.proposals;
-    var output = input;
-    var query = vm.query;
-    var selectedTheme = vm.selectedTheme;
-    var selectedProgram = vm.selectedProgram;
+    vm.page = pageIndex;
+    vm.filterProposals(pageIndex);
+  };
-    var filter = vm.$filter('filter');
+  PropostasPageController.prototype.filterProposals = function(_page, _per_page) {
+    var vm = this;
-    if (selectedTheme) {
-      output = vm.DialogaService.filterProposalsByCategorySlug(output, selectedTheme.slug);
+    if (vm.loadingProposals){
+      vm.$log.debug('Content is not loaded yet.');
+      return;
     }
-    if (selectedProgram) {
-      output = vm.DialogaService.filterProposalsByProgramId(output, selectedProgram.id);
-    }
+    var page = _page || vm.page;
+    var per_page = _per_page || vm.per_page;
+    var query = vm.query;
+    var params = {
+      page: page,
+      per_page: per_page,
+    };
-    if (query) {
-      output = filter(output, query, false);
+    if (vm.selectedTheme) {
+      params.article_id = vm.selectedTheme.id;
     }
-    return output;
+    if (query) {params.query = query; }
+
+    vm.loadingProposals = true;
+    vm.DialogaService.searchProposals(params, function(data){
+      vm.total_proposals = parseInt(data._obj.headers('total'));
+      vm.filtredProposals = data.articles;
+      vm.loadingProposals = false;
+    }, function (error) {
+      vm.error = error;
+      vm.$log.error(error);
+      vm.loadingProposals = false;
+    });
   };
   PropostasPageController.prototype.submitSearch = function() {
@@ -167,7 +169,7 @@
     var $searchResult = angular.element('#search-result');
     if ($searchResult && $searchResult.length > 0) {
       angular.element('body').animate({scrollTop: $searchResult.offset().top}, 'fast');
-      vm.filtredProposals = vm.getFiltredProposals();
+      vm.filterProposals();
     }else {
       vm.$log.warn('#search-result element not found.');
     }
@@ -26,7 +26,7 @@
     </div>
   </section>
-  <section class="section--header" ng-if="pagePropostas.proposals || pagePropostas.themes">
+  <section class="section--header" ng-if="pagePropostas.filtredProposals || pagePropostas.themes">
     <div class="container">
       <div class="row">
         <div class="col-sm-12">
@@ -36,7 +36,7 @@
     </div>
   </section>
-  <section class="section--articles section-gray section-space-up" ng-if="pagePropostas.proposals || pagePropostas.themes">
+  <section class="section--articles section-gray section-space-up" ng-if="pagePropostas.filtredProposals || pagePropostas.themes">
     <div class="container">
       <div id="lista-de-propostas" class="row">
         <div class="col-sm-4 col-md-3">
@@ -72,7 +72,7 @@
           </div>
         </div>
         <div class="col-sm-8 col-md-9">
-          <div class="row hidden-xs" ng-if="pagePropostas.proposals">
+          <div class="row hidden-xs" ng-if="pagePropostas.filtredProposals">
             <div class="col-xs-12">
               <div class="input-group input-group-lg input-group-search">
                 <label for="articleQueryFilter" class="control-label sr-only">Buscar propostas:</label>
@@ -89,24 +89,30 @@
             </div>
           </div>
-          <div id="search-result" class="row" ng-if="pagePropostas.proposals">
+          <div id="search-result" class="row" ng-if="pagePropostas.filtredProposals">
             <div class="col-sm-12">
               <header class="header">
-                <h2>Total de Propostas: "<b>{{pagePropostas.filtredProposals.length}} propostas</b>"</h2>
+                <h2>Total de Propostas: "<b>{{pagePropostas.total_proposals}} propostas</b>"</h2>
               </header>
             </div>
           </div>
           <div class="row">
-            <div class="col-sm-12" ng-if="pagePropostas.proposals">
+            <div class="col-sm-12" ng-if="!pagePropostas.loadingProposals && pagePropostas.filtredProposals && pagePropostas.total_proposals">
               <proposal-grid proposals="pagePropostas.filtredProposals"></proposal-grid>
+              <app-paginator
+                page="pagePropostas.page"
+                per-page="pagePropostas.per_page"
+                total="pagePropostas.total_proposals"
+                change-page="pagePropostas.changePage(pageIndex)"
+              ></app-paginator>
             </div>
-            <div ng-if="!pagePropostas.proposals && pagePropostas.loadingProposals">
+            <div ng-if="pagePropostas.loadingProposals">
               <div class="alert alert-info" role="alert">
                 Carregando propostas.
               </div>
             </div>
-            <div ng-if="!pagePropostas.proposals && pagePropostas.proposalsError">
+            <div ng-if="!pagePropostas.loadingProposals && pagePropostas.proposalsError">
               <div class="alert alert-danger" role="alert">
                 Não foi possível carregar a lista de propostas neste momento.
               </div>