Commit 80287b3fb83b6039f68db087a3b9bb6c5a540ccd
1 parent
49ae9a42
Exists in
master
and in
6 other branches
respostas-page: fix basic filter and router
Showing
4 changed files
with
166 additions
and
157 deletions
Show diff stats
src/app/index.route.js
@@ -149,7 +149,7 @@ | @@ -149,7 +149,7 @@ | ||
149 | } | 149 | } |
150 | }) | 150 | }) |
151 | .state('respostas', { | 151 | .state('respostas', { |
152 | - url: '/respostas?tema&filtro&task', | 152 | + url: '/respostas?tema&filtro', |
153 | reloadOnSearch: false, | 153 | reloadOnSearch: false, |
154 | ncyBreadcrumb: {label: 'Respostas'}, | 154 | ncyBreadcrumb: {label: 'Respostas'}, |
155 | views: { | 155 | views: { |
src/app/pages/respostas/respostas.controller.js
@@ -18,7 +18,7 @@ | @@ -18,7 +18,7 @@ | ||
18 | 18 | ||
19 | vm.init(); | 19 | vm.init(); |
20 | vm.loadData(); | 20 | vm.loadData(); |
21 | - // vm.attachListeners(); // attach listeners after load data (SYNC) | 21 | + vm.attachListeners(); |
22 | vm.$rootScope.focusMainContent(); | 22 | vm.$rootScope.focusMainContent(); |
23 | 23 | ||
24 | $log.debug('RespostasPageController'); | 24 | $log.debug('RespostasPageController'); |
@@ -31,11 +31,22 @@ | @@ -31,11 +31,22 @@ | ||
31 | vm.per_page = 10; | 31 | vm.per_page = 10; |
32 | vm.themes = null; | 32 | vm.themes = null; |
33 | vm.selectedTheme = null; | 33 | vm.selectedTheme = null; |
34 | - vm.filtredPrograms = null; | ||
35 | vm.filtredProposals = null; | 34 | vm.filtredProposals = null; |
36 | vm.query = null; | 35 | vm.query = null; |
37 | vm.search = vm.$location.search(); | 36 | vm.search = vm.$location.search(); |
38 | 37 | ||
38 | + if (vm.search.tema) { | ||
39 | + vm._filtredByThemeSlug = vm.search.tema; | ||
40 | + } | ||
41 | + | ||
42 | + if (vm.search.filtro) { | ||
43 | + vm._filtredByQuery = vm.search.filtro; | ||
44 | + } | ||
45 | + | ||
46 | + if (vm.search.tema || vm.search.filtro) { | ||
47 | + vm.loadingFilter = true; | ||
48 | + } | ||
49 | + | ||
39 | vm.loading = null; | 50 | vm.loading = null; |
40 | vm.error = null; | 51 | vm.error = null; |
41 | }; | 52 | }; |
@@ -57,11 +68,7 @@ | @@ -57,11 +68,7 @@ | ||
57 | vm.loadingThemes = false; | 68 | vm.loadingThemes = false; |
58 | vm.loading = false; | 69 | vm.loading = false; |
59 | 70 | ||
60 | - // REMOVED: function called twice. | ||
61 | - // vm.loadProposals(function() { | ||
62 | - // vm.attachListeners(); | ||
63 | - // }); | ||
64 | - vm.attachListeners(); | 71 | + vm.filter(); |
65 | }, function(error) { | 72 | }, function(error) { |
66 | vm.error = error; | 73 | vm.error = error; |
67 | vm.$log.error(error); | 74 | vm.$log.error(error); |
@@ -70,30 +77,6 @@ | @@ -70,30 +77,6 @@ | ||
70 | }); | 77 | }); |
71 | }; | 78 | }; |
72 | 79 | ||
73 | - // RespostasPageController.prototype.loadProposals = function(cb) { | ||
74 | - // var vm = this; | ||
75 | - | ||
76 | - // // load Proposals | ||
77 | - // vm.loadingProposals = true; | ||
78 | - // vm.DialogaService.searchProposals({ | ||
79 | - // page: vm.page, | ||
80 | - // per_page: vm.per_page | ||
81 | - // }, function(data) { | ||
82 | - // vm.filtredProposals = data.articles; | ||
83 | - // vm.total_proposals = parseInt(data._obj.headers('total')); | ||
84 | - | ||
85 | - // vm.loadingProposals = false; | ||
86 | - | ||
87 | - // if (cb) { | ||
88 | - // cb(); | ||
89 | - // } | ||
90 | - // }, function(error) { | ||
91 | - // vm.error = error; | ||
92 | - // vm.$log.error(error); | ||
93 | - // vm.loadingProposals = false; | ||
94 | - // }); | ||
95 | - // }; | ||
96 | - | ||
97 | RespostasPageController.prototype.attachListeners = function() { | 80 | RespostasPageController.prototype.attachListeners = function() { |
98 | var vm = this; | 81 | var vm = this; |
99 | 82 | ||
@@ -101,16 +84,22 @@ | @@ -101,16 +84,22 @@ | ||
101 | vm.selectedTheme = selectedCategory; | 84 | vm.selectedTheme = selectedCategory; |
102 | }); | 85 | }); |
103 | 86 | ||
104 | - vm.$scope.$watch('pagePropostas.selectedTheme', function(newValue/*, oldValue*/) { | 87 | + vm.$scope.$watch('pageRespostas.selectedTheme', function(newValue/*, oldValue*/) { |
105 | vm.search.tema = newValue ? newValue.slug : null; | 88 | vm.search.tema = newValue ? newValue.slug : null; |
106 | vm.$location.search('tema', vm.search.tema); | 89 | vm.$location.search('tema', vm.search.tema); |
107 | - vm.filterProposals(); | 90 | + |
91 | + if (!vm.loadingFilter) { | ||
92 | + vm.filterProposals(); | ||
93 | + } | ||
108 | }); | 94 | }); |
109 | 95 | ||
110 | - vm.$scope.$watch('pagePropostas.query', function(newValue/*, oldValue*/) { | 96 | + vm.$scope.$watch('pageRespostas.query', function(newValue/*, oldValue*/) { |
111 | vm.search.filtro = newValue ? newValue : null; | 97 | vm.search.filtro = newValue ? newValue : null; |
112 | vm.$location.search('filtro', vm.search.filtro); | 98 | vm.$location.search('filtro', vm.search.filtro); |
113 | - vm.filterProposals(); | 99 | + |
100 | + if (!vm.loadingFilter) { | ||
101 | + vm.filterProposals(); | ||
102 | + } | ||
114 | }); | 103 | }); |
115 | }; | 104 | }; |
116 | 105 | ||
@@ -128,6 +117,34 @@ | @@ -128,6 +117,34 @@ | ||
128 | vm.filterProposals(pageIndex); | 117 | vm.filterProposals(pageIndex); |
129 | }; | 118 | }; |
130 | 119 | ||
120 | + RespostasPageController.prototype.filter = function() { | ||
121 | + var vm = this; | ||
122 | + | ||
123 | + if (vm.loadingThemes || vm.loadingProposals) { | ||
124 | + vm.$log.info('No proposals or themes loaded yet. Abort.'); | ||
125 | + return; | ||
126 | + } | ||
127 | + | ||
128 | + if (vm._filtredByThemeSlug) { | ||
129 | + var slug = vm._filtredByThemeSlug; | ||
130 | + | ||
131 | + vm.DialogaService.getThemeBySlug(slug, function(theme) { | ||
132 | + vm.selectedTheme = theme; | ||
133 | + }, function(error) { | ||
134 | + vm.$log.error('Error when try to "getThemeBySlug"', error); | ||
135 | + }); | ||
136 | + } | ||
137 | + | ||
138 | + if (vm._filtredByQuery) { | ||
139 | + vm.query = vm._filtredByQuery; | ||
140 | + } | ||
141 | + | ||
142 | + if (vm._filtredByThemeSlug || vm._filtredByQuery) { | ||
143 | + vm.filterProposals(); | ||
144 | + vm.loadingFilter = false; | ||
145 | + } | ||
146 | + }; | ||
147 | + | ||
131 | RespostasPageController.prototype.filterProposals = function(_page, _per_page) { | 148 | RespostasPageController.prototype.filterProposals = function(_page, _per_page) { |
132 | var vm = this; | 149 | var vm = this; |
133 | 150 | ||
@@ -142,6 +159,7 @@ | @@ -142,6 +159,7 @@ | ||
142 | var params = { | 159 | var params = { |
143 | page: page, | 160 | page: page, |
144 | per_page: per_page, | 161 | per_page: per_page, |
162 | + archived: true | ||
145 | }; | 163 | }; |
146 | 164 | ||
147 | if (vm.selectedTheme) { | 165 | if (vm.selectedTheme) { |
@@ -165,8 +183,6 @@ | @@ -165,8 +183,6 @@ | ||
165 | RespostasPageController.prototype.submitSearch = function() { | 183 | RespostasPageController.prototype.submitSearch = function() { |
166 | var vm = this; | 184 | var vm = this; |
167 | 185 | ||
168 | - vm.loadingFilter = true; | ||
169 | - | ||
170 | // scroll to result grid | 186 | // scroll to result grid |
171 | var $searchResult = angular.element('#search-result'); | 187 | var $searchResult = angular.element('#search-result'); |
172 | if ($searchResult && $searchResult.length > 0) { | 188 | if ($searchResult && $searchResult.length > 0) { |
src/app/pages/respostas/respostas.html
1 | <div class="container"> | 1 | <div class="container"> |
2 | - <div class="row"> | ||
3 | - <div class="col-sm-12"> | ||
4 | - <div ncy-breadcrumb></div> | 2 | + <div class="row"> |
3 | + <div class="col-sm-12"> | ||
4 | + <div ncy-breadcrumb></div> | ||
5 | + </div> | ||
5 | </div> | 6 | </div> |
6 | - </div> | ||
7 | </div> | 7 | </div> |
8 | - | ||
9 | <div class="page--respostas" role="main"> | 8 | <div class="page--respostas" role="main"> |
10 | - <section class="section-info" ng-if="pageRespostas.loading || pageRespostas.error"> | ||
11 | - <div class="container"> | ||
12 | - <div class="row"> | ||
13 | - <div class="col-md-12"> | ||
14 | - <div ng-if="pageRespostas.loading && !pageRespostas.error"> | ||
15 | - <div class="alert alert-info" role="alert">Carregando conteúdo...</div> | ||
16 | - </div> | ||
17 | - | ||
18 | - <div ng-if="pageRespostas.error"> | ||
19 | - <div class="alert alert-danger" role="alert"> | ||
20 | - Erro ao carregar o conteúdo principal. | 9 | + <section class="section-info" ng-if="pageRespostas.loading || pageRespostas.error"> |
10 | + <div class="container"> | ||
11 | + <div class="row"> | ||
12 | + <div class="col-md-12"> | ||
13 | + <div ng-if="pageRespostas.loading && !pageRespostas.error"> | ||
14 | + <div class="alert alert-info" role="alert">Carregando conteúdo...</div> | ||
15 | + </div> | ||
16 | + <div ng-if="pageRespostas.error"> | ||
17 | + <div class="alert alert-danger" role="alert"> | ||
18 | + Erro ao carregar o conteúdo principal. | ||
19 | + </div> | ||
20 | + </div> | ||
21 | + </div> | ||
21 | </div> | 22 | </div> |
22 | - </div> | ||
23 | </div> | 23 | </div> |
24 | - </div> | ||
25 | - </div> | ||
26 | - </section> | ||
27 | - | ||
28 | - <section class="section--header" ng-if="pageRespostas.filtredProposals || pageRespostas.themes"> | ||
29 | - <div class="container"> | ||
30 | - <div class="row"> | ||
31 | - <div class="col-sm-12"> | ||
32 | - <h1>Respostas</h1> | ||
33 | - </div> | ||
34 | - </div> | ||
35 | - </div> | ||
36 | - </section> | ||
37 | - | ||
38 | - <section class="section--articles section-gray section-space-up" ng-if="pageRespostas.filtredProposals || pageRespostas.themes"> | ||
39 | - <div class="container"> | ||
40 | - <div id="lista-de-respostas" class="row"> | ||
41 | - <div class="col-sm-4 col-md-3"> | ||
42 | - <div class="row visible-xs"> | ||
43 | - <div class="col-xs-12"> | ||
44 | - <div class="input-group input-group-lg input-group-search"> | ||
45 | - <label for="articleQueryFilter" class="control-label sr-only">Buscar respostas:</label> | ||
46 | - <input id="articleQueryFilter" type="search" class="form-control input-search" ng-model="pageRespostas.query" placeholder="Buscar respostas" aria-label="Buscar respostas"> | ||
47 | - <span class="input-group-btn"> | ||
48 | - <button type="button" class="btn btn-default" ng-click="pageRespostas.submitSearch()"> | ||
49 | - <span class="icon-circle icon-small color-theme-common-bg"> | ||
50 | - <span class="glyphicon glyphicon-search"></span> | ||
51 | - </span> | ||
52 | - <span class="sr-only">Buscar</span> | ||
53 | - </button> | ||
54 | - </span> | ||
55 | - </div> | ||
56 | - <br/> | ||
57 | - </div> | ||
58 | - </div> | ||
59 | - <div ng-if="pageRespostas.themes"> | ||
60 | - <category-list categories="pageRespostas.themes" selected-category="pageRespostas.selectedTheme"></category-list> | ||
61 | - </div> | ||
62 | - <div ng-if="!pageRespostas.themes && pageRespostas.loadingThemes"> | ||
63 | - <div class="alert alert-info" role="alert"> | ||
64 | - Carregando temas. | 24 | + </section> |
25 | + <section class="section--header" ng-if="pageRespostas.filtredProposals || pageRespostas.themes"> | ||
26 | + <div class="container"> | ||
27 | + <div class="row"> | ||
28 | + <div class="col-sm-12"> | ||
29 | + <h1>O Dialoga Brasil já respondeu às solicitações!</h1> | ||
30 | + <p> | ||
31 | + Vários programas contaram com centenas de participações e elas foram respondidas pelo governo. | ||
32 | + Confira abaixo as propostas que foram respondidas: | ||
33 | + </p> | ||
34 | + </div> | ||
65 | </div> | 35 | </div> |
66 | - </div> | ||
67 | - <div ng-if="!pageRespostas.themes && pageRespostas.themesError"> | ||
68 | - <div class="alert alert-danger" role="alert"> | ||
69 | - Não foi possível carregar a lista de temas neste momento. | ||
70 | - </div> | ||
71 | - </div> | ||
72 | </div> | 36 | </div> |
73 | - <div class="col-sm-8 col-md-9"> | ||
74 | - <div class="row hidden-xs" ng-if="pageRespostas.filtredProposals"> | ||
75 | - <div class="col-xs-12"> | ||
76 | - <div class="input-group input-group-lg input-group-search"> | ||
77 | - <label for="articleQueryFilter" class="control-label sr-only">Buscar respostas:</label> | ||
78 | - <input id="articleQueryFilter" type="search" class="form-control input-search" ng-model="pageRespostas.query" placeholder="Buscar respostas" aria-label="Buscar respostas"> | ||
79 | - <span class="input-group-btn"> | ||
80 | - <button type="button" class="btn btn-default" ng-click="pageRespostas.submitSearch()"> | ||
81 | - <span class="icon-circle icon-small color-theme-common-bg"> | ||
82 | - <span class="glyphicon glyphicon-search"></span> | ||
83 | - </span> | ||
84 | - <span class="sr-only">Buscar</span> | ||
85 | - </button> | ||
86 | - </span> | ||
87 | - </div> | ||
88 | - </div> | ||
89 | - </div> | ||
90 | - | ||
91 | - <div id="search-result" class="row" ng-if="pageRespostas.filtredProposals"> | ||
92 | - <div class="col-sm-12"> | ||
93 | - <header class="header"> | ||
94 | - <h2>Total de Respostas: "<b>{{pageRespostas.total_proposals}} respostas</b>"</h2> | ||
95 | - </header> | ||
96 | - </div> | ||
97 | - </div> | ||
98 | - | ||
99 | - <div class="row"> | ||
100 | - <div class="col-sm-12" ng-if="!pageRespostas.loadingProposals && pageRespostas.filtredProposals && pageRespostas.total_proposals"> | ||
101 | - <proposal-grid proposals="pageRespostas.filtredProposals"></proposal-grid> | ||
102 | - <app-paginator | ||
103 | - page="pageRespostas.page" | ||
104 | - per-page="pageRespostas.per_page" | ||
105 | - total="pageRespostas.total_proposals" | ||
106 | - change-page="pageRespostas.changePage(pageIndex)" | ||
107 | - ></app-paginator> | 37 | + </section> |
38 | + <section class="section--articles section-gray section-space-up" ng-if="pageRespostas.filtredProposals || pageRespostas.themes"> | ||
39 | + <div class="container"> | ||
40 | + <div id="lista-de-respostas" class="row"> | ||
41 | + <div class="col-sm-4 col-md-3"> | ||
42 | + <div class="row visible-xs"> | ||
43 | + <div class="col-xs-12"> | ||
44 | + <div class="input-group input-group-lg input-group-search"> | ||
45 | + <label for="articleQueryFilter" class="control-label sr-only">Buscar respostas:</label> | ||
46 | + <input id="articleQueryFilter" type="search" class="form-control input-search" ng-model="pageRespostas.query" placeholder="Buscar respostas" aria-label="Buscar respostas"> | ||
47 | + <div class="input-group-btn"> | ||
48 | + <button type="button" class="btn btn-default" ng-click="pageRespostas.submitSearch()"> | ||
49 | + <div class="icon-circle icon-small color-theme-common-bg"> | ||
50 | + <span class="glyphicon glyphicon-search"></span> | ||
51 | + </div> | ||
52 | + <span class="sr-only">Buscar</span> | ||
53 | + </button> | ||
54 | + </div> | ||
55 | + </div> | ||
56 | + <br/> | ||
57 | + </div> | ||
58 | + </div> | ||
59 | + <div ng-if="pageRespostas.themes"> | ||
60 | + <category-list categories="pageRespostas.themes" selected-category="pageRespostas.selectedTheme"></category-list> | ||
61 | + </div> | ||
62 | + <div ng-if="!pageRespostas.themes && pageRespostas.loadingThemes"> | ||
63 | + <div class="alert alert-info" role="alert"> | ||
64 | + Carregando temas. | ||
65 | + </div> | ||
66 | + </div> | ||
67 | + <div ng-if="!pageRespostas.themes && pageRespostas.themesError"> | ||
68 | + <div class="alert alert-danger" role="alert"> | ||
69 | + Não foi possível carregar a lista de temas neste momento. | ||
70 | + </div> | ||
71 | + </div> | ||
72 | + </div> | ||
73 | + <div class="col-sm-8 col-md-9"> | ||
74 | + <div class="row hidden-xs" ng-if="pageRespostas.filtredProposals"> | ||
75 | + <div class="col-xs-12"> | ||
76 | + <div class="input-group input-group-lg input-group-search"> | ||
77 | + <label for="articleQueryFilter" class="control-label sr-only">Buscar propostas:</label> | ||
78 | + <input id="articleQueryFilter" type="search" class="form-control input-search" ng-model="pageRespostas.query" placeholder="Buscar respostas" aria-label="Buscar respostas"> | ||
79 | + <div class="input-group-btn"> | ||
80 | + <button type="button" class="btn btn-default" ng-click="pageRespostas.submitSearch()"> | ||
81 | + <div class="icon-circle icon-small color-theme-common-bg"> | ||
82 | + <span class="glyphicon glyphicon-search"></span> | ||
83 | + </div> | ||
84 | + <span class="sr-only">Buscar</span> | ||
85 | + </button> | ||
86 | + </div> | ||
87 | + </div> | ||
88 | + </div> | ||
89 | + </div> | ||
90 | + <div id="search-result" class="row" ng-if="pageRespostas.filtredProposals"> | ||
91 | + <div class="col-sm-12"> | ||
92 | + <header class="header"> | ||
93 | + <h2>Total de Propostas: "<b>{{pageRespostas.total_proposals}} propostas</b>"</h2> | ||
94 | + </header> | ||
95 | + </div> | ||
96 | + </div> | ||
97 | + <div class="row"> | ||
98 | + <div class="col-sm-12" ng-if="!pageRespostas.loadingProposals && pageRespostas.filtredProposals && pageRespostas.total_proposals"> | ||
99 | + <proposal-grid proposals="pageRespostas.filtredProposals"></proposal-grid> | ||
100 | + <app-paginator page="pageRespostas.page" per-page="pageRespostas.per_page" total="pageRespostas.total_proposals" change-page="pageRespostas.changePage(pageIndex)"></app-paginator> | ||
101 | + </div> | ||
102 | + <div ng-if="pageRespostas.loadingProposals"> | ||
103 | + <div class="alert alert-info" role="alert"> | ||
104 | + Carregando propostas. | ||
105 | + </div> | ||
106 | + </div> | ||
107 | + <div ng-if="!pageRespostas.loadingProposals && pageRespostas.proposalsError"> | ||
108 | + <div class="alert alert-danger" role="alert"> | ||
109 | + Não foi possível carregar a lista de propostas neste momento. | ||
110 | + </div> | ||
111 | + </div> | ||
112 | + </div> | ||
113 | + </div> | ||
108 | </div> | 114 | </div> |
109 | - <div ng-if="pageRespostas.loadingProposals"> | ||
110 | - <div class="alert alert-info" role="alert"> | ||
111 | - Carregando respostas. | ||
112 | - </div> | ||
113 | - </div> | ||
114 | - <div ng-if="!pageRespostas.loadingProposals && pageRespostas.proposalsError"> | ||
115 | - <div class="alert alert-danger" role="alert"> | ||
116 | - Não foi possível carregar a lista de respostas neste momento. | ||
117 | - </div> | ||
118 | - </div> | ||
119 | - </div> | ||
120 | </div> | 115 | </div> |
121 | - </div> | ||
122 | - </div> | ||
123 | - </section> | 116 | + </section> |
124 | </div> | 117 | </div> |
src/app/pages/respostas/respostas.scss
1 | .page--respostas { | 1 | .page--respostas { |
2 | - // .proposal-box--middle { | ||
3 | - // background-color: #fff; | ||
4 | - // } | 2 | + .proposal-box--middle { |
3 | + background-color: #fff; | ||
4 | + } | ||
5 | 5 | ||
6 | - // .topics-select--wrapper { | ||
7 | - // margin: 20px 0; | ||
8 | - // } | 6 | + .topics-select--wrapper { |
7 | + margin: 20px 0; | ||
8 | + } | ||
9 | } | 9 | } |