Commit a0b137a9af51642e7b9b852f7e8df4b747283953
1 parent
670ba360
Exists in
master
and in
8 other branches
Small improvements at event-list directive
Showing
6 changed files
with
32 additions
and
75 deletions
Show diff stats
src/app/components/article-service/article.service.js
@@ -138,7 +138,7 @@ | @@ -138,7 +138,7 @@ | ||
138 | }, params); | 138 | }, params); |
139 | 139 | ||
140 | UtilService.get(url, {params: paramsExtended}).then(function(data){ | 140 | UtilService.get(url, {params: paramsExtended}).then(function(data){ |
141 | - cbSuccess(data); | 141 | + cbSuccess(data.articles); |
142 | }).catch(function(error){ | 142 | }).catch(function(error){ |
143 | cbError(error); | 143 | cbError(error); |
144 | }); | 144 | }); |
src/app/components/event-list/event-list.directive.js
@@ -19,18 +19,24 @@ | @@ -19,18 +19,24 @@ | ||
19 | vm.$log = $log; | 19 | vm.$log = $log; |
20 | 20 | ||
21 | vm.init(); | 21 | vm.init(); |
22 | + // vm.attachListeners(); | ||
22 | } | 23 | } |
23 | 24 | ||
24 | EventListController.prototype.init = function () { | 25 | EventListController.prototype.init = function () { |
25 | var vm = this; | 26 | var vm = this; |
26 | 27 | ||
27 | - vm.eventList = []; | ||
28 | - vm.isListVisible = false; | 28 | + if(!vm.events){ |
29 | + throw { name: 'NotDefined', message: 'The attribute "events" is undefined.'}; | ||
30 | + } | ||
31 | + | ||
32 | + if(!vm.isCollapsed){ | ||
33 | + vm.isCollapsed = true; | ||
34 | + } | ||
29 | }; | 35 | }; |
30 | 36 | ||
31 | EventListController.prototype.toggleView = function () { | 37 | EventListController.prototype.toggleView = function () { |
32 | var vm = this; | 38 | var vm = this; |
33 | - vm.isListVisible = !vm.isListVisible; | 39 | + vm.isCollapsed = !vm.isCollapsed; |
34 | }; | 40 | }; |
35 | 41 | ||
36 | EventListController.prototype.subscribe = function (data) { | 42 | EventListController.prototype.subscribe = function (data) { |
@@ -42,8 +48,12 @@ | @@ -42,8 +48,12 @@ | ||
42 | var directive = { | 48 | var directive = { |
43 | restrict: 'E', | 49 | restrict: 'E', |
44 | templateUrl: 'app/components/event-list/event-list.html', | 50 | templateUrl: 'app/components/event-list/event-list.html', |
51 | + scope: { | ||
52 | + events: '=', | ||
53 | + isCollapsed: '=' | ||
54 | + }, | ||
45 | controller: EventListController, | 55 | controller: EventListController, |
46 | - controllerAs: 'eventListCtrl', | 56 | + controllerAs: 'vm', |
47 | bindToController: true | 57 | bindToController: true |
48 | }; | 58 | }; |
49 | 59 |
src/app/components/event-list/event-list.html
@@ -3,7 +3,7 @@ | @@ -3,7 +3,7 @@ | ||
3 | <section class="color-theme-common-bg"> | 3 | <section class="color-theme-common-bg"> |
4 | 4 | ||
5 | <div class="container"> | 5 | <div class="container"> |
6 | - <div class="event-bar--trigger"> | 6 | + <div class="event-bar--trigger" ng-click="vm.toggleView()"> |
7 | <div class="event-bar--trigger-top"> | 7 | <div class="event-bar--trigger-top"> |
8 | <div class="col-sm-6"> | 8 | <div class="col-sm-6"> |
9 | <h1 class="title"> | 9 | <h1 class="title"> |
@@ -12,19 +12,20 @@ | @@ -12,19 +12,20 @@ | ||
12 | </h1> | 12 | </h1> |
13 | </div> | 13 | </div> |
14 | <div class="col-sm-6"> | 14 | <div class="col-sm-6"> |
15 | - <h2 class="event-bar--trigger-toggle text-right" ng-click="eventListCtrl.toggleView()"> | 15 | + <h2 class="event-bar--trigger-toggle text-right"> |
16 | <span><b>18</b> bate papos <b>agendados</b></span> | 16 | <span><b>18</b> bate papos <b>agendados</b></span> |
17 | <span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span> | 17 | <span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span> |
18 | </h2> | 18 | </h2> |
19 | </div> | 19 | </div> |
20 | </div> | 20 | </div> |
21 | + <div class="clearfix"></div> | ||
21 | </div> | 22 | </div> |
22 | </div> | 23 | </div> |
23 | </section> | 24 | </section> |
24 | 25 | ||
25 | <section class="section-table"> | 26 | <section class="section-table"> |
26 | <div class="container"> | 27 | <div class="container"> |
27 | - <!-- <div class="event-tab--trigger" ng-show="!eventListCtrl.isListVisible" ng-click="eventListCtrl.toggleView()"> | 28 | + <!-- <div class="event-tab--trigger" ng-show="vm.isCollapsed" ng-click="vm.toggleView()"> |
28 | <div class="event-tab--header"> | 29 | <div class="event-tab--header"> |
29 | <div class="event-tab--icon"> | 30 | <div class="event-tab--icon"> |
30 | <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span> | 31 | <span class="glyphicon glyphicon-calendar" aria-hidden="true"></span> |
@@ -38,81 +39,26 @@ | @@ -38,81 +39,26 @@ | ||
38 | </button> | 39 | </button> |
39 | </div> --> | 40 | </div> --> |
40 | 41 | ||
41 | - <div class="event-list--panel ng-hide" ng-show="eventListCtrl.isListVisible"> | 42 | + <div class="event-list--panel ng-hide" ng-show="!vm.isCollapsed"> |
42 | <div class="event-list--table-wrapper"> | 43 | <div class="event-list--table-wrapper"> |
43 | <div class="table-responsive"> | 44 | <div class="table-responsive"> |
44 | <table class="table event-list--table"> | 45 | <table class="table event-list--table"> |
45 | <!-- <thead></thead> --> | 46 | <!-- <thead></thead> --> |
46 | <tbody> | 47 | <tbody> |
47 | - <tr> | 48 | + <tr ng-repeat="event in vm.events"> |
48 | <td> | 49 | <td> |
49 | - <span class="date">dd/mm/aaaa</span> | 50 | + <span class="date">{{event.start_date | date : "dd/MM/yyyy"}}</span> |
50 | <span class="separator">-</span> | 51 | <span class="separator">-</span> |
51 | - <span class="time">HH:mm</span> | 52 | + <span class="time">{{event.start_date | date : "HH:mm"}}</span> |
52 | <span class="separator">-</span> | 53 | <span class="separator">-</span> |
53 | - <span class="description">Mais médicos, Segurança Nacional, SAMU</span> | ||
54 | - <button type="button" class="btn color-theme-common-bg" ng-click="eventListCtrl.subscribe('EVENT_ID')"> | 54 | + <span class="description">[DESCRIÇÃO]</span> |
55 | + <button type="button" class="btn color-theme-common-bg" ng-click="vm.subscribe('EVENT_ID')"> | ||
55 | Inscreva-se | 56 | Inscreva-se |
56 | - <span class="sr-only">no bate-papo com (ministro) no dia (date) as (hh:mm) horas</span> | 57 | + <span class="sr-only">no bate-papo com (ministro) no dia {event.start_date | date : "dd/MM/yyyy"}} as {{event.start_date | date : "HH:mm"}} horas</span> |
57 | </button> | 58 | </button> |
58 | <span class="subscribers">123 inscritos</span> | 59 | <span class="subscribers">123 inscritos</span> |
59 | </td> | 60 | </td> |
60 | </tr> | 61 | </tr> |
61 | - <tr> | ||
62 | - <td> | ||
63 | - <span class="date">dd/mm/aaaa</span> | ||
64 | - <span class="separator">-</span> | ||
65 | - <span class="time">HH:mm</span> | ||
66 | - <span class="separator">-</span> | ||
67 | - <span class="description">Mais médicos, Segurança Nacional, SAMU</span> | ||
68 | - <button type="button" class="btn color-theme-common-bg">Inscreva-se</button> | ||
69 | - <span class="subscribers">123 inscritos</span> | ||
70 | - </td> | ||
71 | - </tr> | ||
72 | - <tr> | ||
73 | - <td> | ||
74 | - <span class="date">dd/mm/aaaa</span> | ||
75 | - <span class="separator">-</span> | ||
76 | - <span class="time">HH:mm</span> | ||
77 | - <span class="separator">-</span> | ||
78 | - <span class="description">Mais médicos, Segurança Nacional, SAMU</span> | ||
79 | - <button type="button" class="btn color-theme-common-bg">Inscreva-se</button> | ||
80 | - <span class="subscribers">123 inscritos</span> | ||
81 | - </td> | ||
82 | - </tr> | ||
83 | - <tr> | ||
84 | - <td> | ||
85 | - <span class="date">dd/mm/aaaa</span> | ||
86 | - <span class="separator">-</span> | ||
87 | - <span class="time">HH:mm</span> | ||
88 | - <span class="separator">-</span> | ||
89 | - <span class="description">Mais médicos, Segurança Nacional, SAMU</span> | ||
90 | - <button type="button" class="btn color-theme-common-bg">Inscreva-se</button> | ||
91 | - <span class="subscribers">123 inscritos</span> | ||
92 | - </td> | ||
93 | - </tr> | ||
94 | - <tr> | ||
95 | - <td> | ||
96 | - <span class="date">dd/mm/aaaa</span> | ||
97 | - <span class="separator">-</span> | ||
98 | - <span class="time">HH:mm</span> | ||
99 | - <span class="separator">-</span> | ||
100 | - <span class="description">Mais médicos, Segurança Nacional, SAMU</span> | ||
101 | - <button type="button" class="btn color-theme-common-bg">Inscreva-se</button> | ||
102 | - <span class="subscribers">123 inscritos</span> | ||
103 | - </td> | ||
104 | - </tr> | ||
105 | - <tr> | ||
106 | - <td> | ||
107 | - <span class="date">dd/mm/aaaa</span> | ||
108 | - <span class="separator">-</span> | ||
109 | - <span class="time">HH:mm</span> | ||
110 | - <span class="separator">-</span> | ||
111 | - <span class="description">Mais médicos, Segurança Nacional, SAMU</span> | ||
112 | - <button type="button" class="btn color-theme-common-bg">Inscreva-se</button> | ||
113 | - <span class="subscribers">123 inscritos</span> | ||
114 | - </td> | ||
115 | - </tr> | ||
116 | </tbody> | 62 | </tbody> |
117 | <!-- <tfooter></tfooter> --> | 63 | <!-- <tfooter></tfooter> --> |
118 | </table> | 64 | </table> |
src/app/components/event-list/event-list.scss
@@ -17,8 +17,8 @@ | @@ -17,8 +17,8 @@ | ||
17 | transition: .3s linear all; | 17 | transition: .3s linear all; |
18 | 18 | ||
19 | &.ng-hide { | 19 | &.ng-hide { |
20 | - height: 0px; | ||
21 | - line-height: 0px; | 20 | + height: 0; |
21 | + line-height: 0; | ||
22 | } | 22 | } |
23 | 23 | ||
24 | // .event-list--header { | 24 | // .event-list--header { |
@@ -72,6 +72,7 @@ | @@ -72,6 +72,7 @@ | ||
72 | 72 | ||
73 | .event-bar--trigger { | 73 | .event-bar--trigger { |
74 | color: #fff; | 74 | color: #fff; |
75 | + cursor: pointer; | ||
75 | 76 | ||
76 | h1 { | 77 | h1 { |
77 | margin-bottom: 20px; | 78 | margin-bottom: 20px; |
src/app/pages/inicio/inicio.controller.js
@@ -60,8 +60,8 @@ | @@ -60,8 +60,8 @@ | ||
60 | }); | 60 | }); |
61 | 61 | ||
62 | // Load event list | 62 | // Load event list |
63 | - vm.DialogaService.getEvents({}, function(data) { | ||
64 | - vm.events = data; | 63 | + vm.DialogaService.getEvents({}, function(events) { |
64 | + vm.events = events; | ||
65 | vm.loadingEvents = false; | 65 | vm.loadingEvents = false; |
66 | }, function(error) { | 66 | }, function(error) { |
67 | vm.$log.error('Error on getEvents.', error); | 67 | vm.$log.error('Error on getEvents.', error); |
src/app/pages/inicio/inicio.html
@@ -23,7 +23,7 @@ | @@ -23,7 +23,7 @@ | ||
23 | 23 | ||
24 | <section class="section-event"> | 24 | <section class="section-event"> |
25 | <div ng-if="pageInicio.events"> | 25 | <div ng-if="pageInicio.events"> |
26 | - <event-list events="[]"></event-list> | 26 | + <event-list events="pageInicio.events"></event-list> |
27 | </div> | 27 | </div> |
28 | <div ng-if="!pageInicio.events && pageInicio.loadingEvents" class="container"> | 28 | <div ng-if="!pageInicio.events && pageInicio.loadingEvents" class="container"> |
29 | <div class="row"> | 29 | <div class="row"> |