dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #32676
[Branch ~dhis2-devs-core/dhis2/trunk] Rev 16659: tracker capture - grid based report for upcoming events with possibilities to sort by columns and...
------------------------------------------------------------
revno: 16659
committer: Abyot Asalefew Gizaw <abyota@xxxxxxxxx>
branch nick: dhis2
timestamp: Mon 2014-09-08 18:06:40 +0200
message:
tracker capture - grid based report for upcoming events with possibilities to sort by columns and also show/hide of columns/attributes
modified:
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/report/upcoming-events-controller.js
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/report/upcoming-events.html
--
lp:dhis2
https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk
Your team DHIS 2 developers is subscribed to branch lp:dhis2.
To unsubscribe from this branch go to https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk/+edit-subscription
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/report/upcoming-events-controller.js'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/report/upcoming-events-controller.js 2014-09-01 13:04:19 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/report/upcoming-events-controller.js 2014-09-08 16:06:40 +0000
@@ -43,7 +43,7 @@
//watch for selection of program
$scope.$watch('selectedProgram', function() {
if( angular.isObject($scope.selectedProgram)){
- $scope.reportStarted = false;
+ $scope.reportFinished = false;
$scope.dataReady = false;
}
});
@@ -60,7 +60,7 @@
return false;
}
- $scope.reportStarted = true;
+ $scope.reportFinished = false;
$scope.dataReady = false;
$scope.programStages = [];
@@ -69,7 +69,7 @@
});
AttributesFactory.getByProgram($scope.selectedProgram).then(function(atts){
- $scope.attributes = TEIGridService.generateGridColumns(atts, $scope.selectedOuMode.name);
+ $scope.gridColumns = TEIGridService.generateGridColumns(atts, $scope.selectedOuMode.name);
});
//fetch TEIs for the selected program and orgunit/mode
@@ -85,7 +85,7 @@
var teis = TEIGridService.format(data,true);
$scope.teiList = [];
DHIS2EventFactory.getByOrgUnitAndProgram($scope.selectedOrgUnit.id, $scope.selectedOuMode.name, $scope.selectedProgram.id, null, null).then(function(eventList){
- $scope.dhis2Events = [];
+ $scope.dhis2Events = [];
angular.forEach(eventList, function(ev){
if(ev.dueDate){
ev.dueDate = DateUtils.format(ev.dueDate);
@@ -118,99 +118,47 @@
}
}
});
- $scope.reportStarted = false;
+ $scope.reportFinished = true;
$scope.dataReady = true;
});
});
};
- $scope.showReschedule = function(dhis2Event, selectedTei){
+ $scope.showHideColumns = function(){
+
+ $scope.hiddenGridColumns = 0;
+
+ angular.forEach($scope.gridColumns, function(gridColumn){
+ if(!gridColumn.show){
+ $scope.hiddenGridColumns++;
+ }
+ });
var modalInstance = $modal.open({
- templateUrl: 'components/report/rescheduling.html',
- controller: 'ReschedulingController',
+ templateUrl: 'views/column-modal.html',
+ controller: 'ColumnDisplayController',
resolve: {
- dhis2Event: function () {
- return dhis2Event;
- },
- attributes: function(){
- return $scope.attributes;
- },
- selectedTei: function(){
- return selectedTei;
- },
- entityName: function(){
- return $scope.selectedProgram.trackedEntity.name;
+ gridColumns: function () {
+ return $scope.gridColumns;
+ },
+ hiddenGridColumns: function(){
+ return $scope.hiddenGridColumns;
}
}
});
- modalInstance.result.then({
+ modalInstance.result.then(function (gridColumns) {
+ $scope.gridColumns = gridColumns;
+ }, function () {
});
- };
-})
-
-//Controller for event details
-.controller('ReschedulingController',
- function($scope,
- $modalInstance,
- DHIS2EventFactory,
- dhis2Event,
- selectedTei,
- attributes,
- entityName){
-
- $scope.selectedTei = selectedTei;
- $scope.attributes = attributes;
- $scope.entityName = entityName;
- $scope.currentEvent = dhis2Event;
-
-
- $scope.save = function(){
-
-
- if($scope.currentEvent.dueDate == ''){
- $scope.invalidDate = true;
- return false;
- }
- else{
- var rawDate = $filter('date')($scope.currentEvent.dueDate, 'yyyy-MM-dd');
- var convertedDate = moment($scope.currentEvent.dueDate, 'YYYY-MM-DD')._d;
- convertedDate = $filter('date')(convertedDate, 'yyyy-MM-dd');
-
- if(rawDate !== convertedDate){
- $scope.invalidDate = true;
- return false;
- }
-
- var e = {event: $scope.currentEvent.event,
- enrollment: $scope.currentEvent.enrollment,
- dueDate: $scope.currentEvent.dueDate,
- status: $scope.currentEvent.status,
- program: $scope.currentEvent.program,
- programStage: $scope.currentEvent.programStage,
- orgUnit: $scope.currentEvent.orgUnit,
- trackedEntityInstance: $scope.currentEvent.trackedEntityInstance
- };
-
- DHIS2EventFactory.update(e).then(function(data){
- $scope.invalidDate = false;
- $scope.dueDateSaved = true;
- $scope.currentEvent.sortingDate = $scope.currentEvent.dueDate;
- var statusColor = EventUtils.getEventStatusColor($scope.currentEvent);
- var continueLoop = true;
- for(var i=0; i< $scope.dhis2Events.length && continueLoop; i++){
- if($scope.dhis2Events[i].event === $scope.currentEvent.event ){
- $scope.dhis2Events[i].statusColor = statusColor;
- continueLoop = false;
- }
- }
- });
- }
-
};
- $scope.close = function () {
- $modalInstance.close();
+ $scope.sortTEIGrid = function(gridHeader){
+ if ($scope.sortHeader === gridHeader.id){
+ $scope.reverse = !$scope.reverse;
+ return;
+ }
+ $scope.sortHeader = gridHeader.id;
+ $scope.reverse = false;
};
});
\ No newline at end of file
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/report/upcoming-events.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/report/upcoming-events.html 2014-09-01 13:04:19 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/report/upcoming-events.html 2014-09-08 16:06:40 +0000
@@ -4,8 +4,8 @@
<div id="leftBar">
<div class="left-bar-menu" ng-controller="LeftBarMenuController">
<ul class="nav nav-pills nav-stacked">
- <li><a href ng-click="showHome()">{{'registration_and_data_entry' | translate}}</a></li>
- <li><a href ng-click="showReportTypes()">{{'reports' | translate}}</a></li>
+ <li><a href ng-click="showHome()">{{'registration_and_data_entry'| translate}}</a></li>
+ <li><a href ng-click="showReportTypes()">{{'reports'| translate}}</a></li>
</ul>
</div>
<div id="orgUnitTree" style="margin-top:20px">
@@ -18,12 +18,30 @@
<!--- selected org unit ends -->
</div>
-<div id="mainPage" class="bordered-div">
- <h2>{{'upcoming_events' | translate}}</h2>
+<div id="mainPage" class="page">
+ <!--<h2>{{'upcoming_events'| translate}}</h2>-->
+ <!-- top bar begins -->
+ <div class="row top-bar">
+ <div class="col-sm-12">
+ {{'upcoming_events'| translate}}
+ <div class="pull-right">
+ <div class="btn-group" dropdown is-open="status.isopen">
+ <button type="button" class="btn btn-default dropdown-toggle" ng-disabled="!teiList.length">
+ <i class="fa fa-cog" title="{{'settings'| translate}}"></i>
+ </button>
+ <ul class="dropdown-menu pull-right" role="menu">
+ <li ng-show="teiList.length > 0"><a href ng-click="showHideColumns()">{{'show_hide_columns'| translate}}</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ </div>
+ <!-- top bar ends -->
+
<form name="outerForm" novalidate>
<div ng-include="'components/report/reportForm.html'"></div>
</form>
- <img src="../images/ajax-loader-bar.gif" ng-if="!dataReady && reportStarted"/>
+ <img src="../images/ajax-loader-bar.gif" ng-if="!dataReady && reportFinished"/>
<div ng-if="dataReady">
<div ng-switch="teiList.length">
<div ng-switch-when="undefined">
@@ -39,36 +57,36 @@
<div ng-switch-default>
<!-- report begins -->
- <div class="vertical-spacing">
- <table class="table table-compact table-striped">
- <thead>
+ <div class="vertical-spacing">
+ <table class="listTable dhis2-table-striped-border dhis2-table-hover">
+ <thead>
<tr>
- <th>{{selectedProgram.trackedEntity.name}}</th>
- <th>{{selectedProgram.name}} {{'upcoming_event'| translate}}</th>
- </tr>
+ <th ng-show="gridColumn.show" ng-repeat="gridColumn in gridColumns" ng-click="sortTEIGrid(gridColumn)">
+ {{gridColumn.name}}
+ <i ng-if="sortHeader == gridColumn.id && reverse" class="fa fa-sort-desc"></i>
+ <i ng-if="sortHeader == gridColumn.id && !reverse" class="fa fa-sort-asc"></i>
+ </th>
+ <th>
+ {{'upcoming_event' | translate}}
+ </th>
+ </tr>
</thead>
- <tr ng-repeat="tei in teiList">
- <td>
- <span ng-repeat="attribute in attributes">
- <span class="bold">{{attribute.name}}:</span> {{tei[attribute.id]}}<br>
- </span>
- </td>
- <td>
- <span class='bold inline-block' ng-if='!dhis2Events[tei.id]'>{{'no_visit_made'| translate}}</span>
- <span class="inline-block" ng-repeat="ev in dhis2Events[tei.id] | orderBy: 'dueDate'">
- <span class="block align-center">{{ev.orgUnitName}}</span>
- <span class="stage-container"
- title="{{'reschedule'| translate}}"
- ng-class="{'{{ev.statusColor}}': true}"
- ng-click="showReschedule(ev, tei)">
- {{ev.name}}<br/>
- {{ev.dueDate}}<br>
+ <tbody id="list">
+ <tr ng-repeat="tei in teiList | orderBy:sortHeader:reverse"
+ ng-click="showDashboard(trackedEntity)"
+ title="{{'go_to_dashboard'| translate}}">
+ <td ng-show="gridColumn.show"
+ ng-repeat="gridColumn in gridColumns">
+ {{tei[gridColumn.id]}}
+ </td>
+ <td>
+ <span ng-repeat="ev in dhis2Events[tei.id] | orderBy: 'dueDate' | limitTo:1">
+ {{ev.name}} / {{ev.dueDate}}
</span>
- <i class="fa fa-arrow-right" ng-show="$index < dhis2Events[tei.id].length - 1"></i>
- </span>
- </td>
- </tr>
- </table>
+ </td>
+ </tr>
+ </tbody>
+ </table>
</div>
<!-- report ends -->
</div>
