dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #39915
[Branch ~dhis2-devs-core/dhis2/trunk] Rev 20217: tracker-capture: TEI grid loading progress indicator
------------------------------------------------------------
revno: 20217
committer: Abyot Asalefew Gizaw <abyota@xxxxxxxxx>
branch nick: dhis2
timestamp: Thu 2015-09-17 17:26:24 +0200
message:
tracker-capture: TEI grid loading progress indicator
modified:
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/controllers.js
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/services.js
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/views/home.html
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/views/tei.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/scripts/controllers.js'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/controllers.js 2015-09-16 14:17:44 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/controllers.js 2015-09-17 15:26:24 +0000
@@ -53,10 +53,11 @@
$scope.enrollment = {programStartDate: '', programEndDate: '', operator: $scope.defaultOperators[0]};
$scope.searchMode = { listAll: 'LIST_ALL', freeText: 'FREE_TEXT', attributeBased: 'ATTRIBUTE_BASED' };
$scope.optionSets = null;
+ $scope.attributesById = null;
$scope.doSearch = true;
//Registration
- $scope.showRegistrationDiv = false;
+ $scope.showRegistrationDiv = false;
//watch for selection of org unit from tree
$scope.$watch('selectedOrgUnit', function() {
@@ -65,10 +66,22 @@
SessionStorageService.set('SELECTED_OU', $scope.selectedOrgUnit);
- $scope.trackedEntityList = [];
+ $scope.trackedEntityList = null;
$scope.optionSets = CurrentSelection.getOptionSets();
+ $scope.attributesById = CurrentSelection.getAttributesById();
+
+ if(!$scope.attributesById){
+ $scope.attributesById = [];
+ MetaDataFactory.getAll('attributes').then(function(atts){
+ angular.forEach(atts, function(att){
+ $scope.attributesById[att.id] = att;
+ });
+ CurrentSelection.setAttributesById($scope.attributesById);
+ });
+ }
+
if(!$scope.optionSets){
$scope.optionSets = [];
MetaDataFactory.getAll('optionSets').then(function(optionSets){
@@ -143,12 +156,12 @@
$scope.getProgramAttributes = function(program){
$scope.selectedProgram = program;
- if($scope.selectedProgram){
+ /*if($scope.selectedProgram){
$location.path('/').search({program: $scope.selectedProgram.id});
}
else{
$location.path('/').search({});
- }
+ }*/
$scope.trackedEntityList = null;
@@ -216,8 +229,7 @@
if(!$scope.searchText){
$scope.emptySearchText = true;
- $scope.teiFetched = false;
- $scope.teiCount = null;
+ $scope.teiFetched = false;
return;
}
@@ -234,8 +246,7 @@
if(!$scope.attributeUrl.hasValue){
$scope.emptySearchAttribute = true;
- $scope.teiFetched = false;
- $scope.teiCount = null;
+ $scope.teiFetched = false;
return;
}
@@ -255,8 +266,7 @@
$scope.fetchTeis = function(){
$scope.teiFetched = false;
- $scope.trackedEntityList = null;
- $scope.teiCount = null;
+ $scope.trackedEntityList = null;
//get events for the specified parameters
TEIService.search($scope.searchingOrgUnit.id,
@@ -266,10 +276,6 @@
$scope.attributeUrl.url,
$scope.pager,
true).then(function(data){
- if(data.rows){
- $scope.teiCount = data.rows.length;
- }
-
if( data.metaData && data.metaData.pager ){
$scope.pager = data.metaData.pager;
$scope.pager.toolBarDisplay = 5;
@@ -282,11 +288,12 @@
//process tei grid
$scope.trackedEntityList = TEIGridService.format(data,false, $scope.optionSets, null);
+
$scope.showTrackedEntityDiv = true;
$scope.showSearchDiv = false;
$scope.teiFetched = true;
$scope.doSearch = true;
-
+
if(!$scope.sortColumn.id){
$scope.sortGrid({id: 'created', name: 'registration_date', valueType: 'date', displayInListNoProgram: false, showFilter: false, show: false});
}
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/services.js'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/services.js 2015-09-17 11:21:04 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/services.js 2015-09-17 15:26:24 +0000
@@ -10,7 +10,7 @@
var store = new dhis2.storage.Store({
name: "dhis2tc",
adapters: [dhis2.storage.IndexedDBAdapter, dhis2.storage.DomSessionStorageAdapter, dhis2.storage.InMemoryAdapter],
- objectStores: ['programs', 'programStages', 'trackedEntities', 'attributes', 'relationshipTypes', 'optionSets', 'programValidations', 'ouLevels', 'programRuleVariables', 'programRules','constants']
+ objectStores: ['programs', 'programStages', 'trackedEntities', 'attributes', 'relationshipTypes', 'optionSets', 'programValidations', 'ouLevels', 'programRuleVariables', 'programRules', 'programIndicators', 'constants']
});
return{
currentStore: store
@@ -1434,10 +1434,11 @@
};
})
-.service('TEIGridService', function(OrgUnitService, OptionSetService, DateUtils, $translate, AttributesFactory){
+.service('TEIGridService', function(OrgUnitService, OptionSetService, CurrentSelection, DateUtils, $translate){
return {
format: function(grid, map, optionSets, invalidTeis){
+
invalidTeis = !invalidTeis ? [] : invalidTeis;
if(!grid || !grid.rows){
return;
@@ -1452,62 +1453,58 @@
var entityList = [];
- AttributesFactory.getAll().then(function(atts){
-
- var attributes = [];
- angular.forEach(atts, function(att){
- attributes[att.id] = att;
- });
-
- angular.forEach(grid.rows, function(row){
- if(invalidTeis.indexOf(row[0]) === -1 ){
- var entity = {};
- var isEmpty = true;
-
- entity.id = row[0];
- entity.created = DateUtils.formatFromApiToUser( row[1] );
- entity.orgUnit = row[3];
- entity.type = row[4];
- entity.inactive = row[5] !== "" ? row[5] : false;
-
- OrgUnitService.get(row[3]).then(function(ou){
- if(ou && ou.name){
- entity.orgUnitName = ou.name;
- }
- });
-
- for(var i=6; i<row.length; i++){
- if(row[i] && row[i] !== ''){
- isEmpty = false;
- var val = row[i];
-
- if(attributes[grid.headers[i].name] &&
- attributes[grid.headers[i].name].optionSetValue &&
- optionSets &&
- attributes[grid.headers[i].name].optionSet &&
- optionSets[attributes[grid.headers[i].name].optionSet.id] ){
- val = OptionSetService.getName(optionSets[attributes[grid.headers[i].name].optionSet.id].options, val);
- }
- if(attributes[grid.headers[i].name] && attributes[grid.headers[i].name].valueType === 'date'){
- val = DateUtils.formatFromApiToUser( val );
- }
-
- entity[grid.headers[i].name] = val;
- }
- }
-
- if(!isEmpty){
- if(map){
- entityList[entity.id] = entity;
- }
- else{
- entityList.push(entity);
- }
- }
- }
- });
- });
- return {headers: attributes, rows: entityList, pager: grid.metaData.pager};
+ var attributes = CurrentSelection.getAttributesById();
+
+ angular.forEach(grid.rows, function(row){
+ if(invalidTeis.indexOf(row[0]) === -1 ){
+ var entity = {};
+ var isEmpty = true;
+
+ entity.id = row[0];
+ entity.created = DateUtils.formatFromApiToUser( row[1] );
+ entity.orgUnit = row[3];
+ entity.type = row[4];
+ entity.inactive = row[5] !== "" ? row[5] : false;
+
+ OrgUnitService.get(row[3]).then(function(ou){
+ if(ou && ou.name){
+ entity.orgUnitName = ou.name;
+ }
+ });
+
+ for(var i=6; i<row.length; i++){
+ if(row[i] && row[i] !== ''){
+ isEmpty = false;
+ var val = row[i];
+
+ if(attributes[grid.headers[i].name] &&
+ attributes[grid.headers[i].name].optionSetValue &&
+ optionSets &&
+ attributes[grid.headers[i].name].optionSet &&
+ optionSets[attributes[grid.headers[i].name].optionSet.id] ){
+ val = OptionSetService.getName(optionSets[attributes[grid.headers[i].name].optionSet.id].options, val);
+ }
+ if(attributes[grid.headers[i].name] && attributes[grid.headers[i].name].valueType === 'date'){
+ val = DateUtils.formatFromApiToUser( val );
+ }
+
+ entity[grid.headers[i].name] = val;
+ }
+ }
+
+ if(!isEmpty){
+ if(map){
+ entityList[entity.id] = entity;
+ }
+ else{
+ entityList.push(entity);
+ }
+ }
+ }
+ });
+
+ return {headers: attributes, rows: entityList, pager: grid.metaData.pager};
+
},
generateGridColumns: function(attributes, ouMode){
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/views/home.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/views/home.html 2015-09-17 11:21:04 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/views/home.html 2015-09-17 15:26:24 +0000
@@ -31,7 +31,7 @@
<div class="page" id="mainPage">
- <div ng-if="!selectedOrgUnit">
+ <div ng-if="!selectedOrgUnit && !treeLoaded">
<img src="../images/ajax-loader-bar.gif" alt="{{'in_progress'| translate}}" ng-if="!selectedOrgUnit"/><br>
{{'loading_metadata'| translate}}
</div>
@@ -49,7 +49,7 @@
<label class="btn btn-default" ng-model="enrollmentStatus" btn-radio="'COMPLETED'" title="{{completedEnrollmentsLabel}}" ng-click='filterByEnrollmentStatus("COMPLETED")'><i class="fa fa-check mouse-pointer"></i></label>
<label class="btn btn-default" ng-model="enrollmentStatus" btn-radio="'CANCELLED'" title="{{cancelledEnrollmentsLabel}}" ng-click='filterByEnrollmentStatus("CANCELLED")'><i class="fa fa-times mouse-pointer"></i></label>
</span>
- <span class="small-horizonal-spacing" ng-if="pager.total">
+ <span class="small-horizonal-spacing" ng-if="teiFetched && pager.total">
({{'total'| translate}}: {{pager.total}})
</span>
</span>
@@ -62,7 +62,7 @@
<i class="fa fa-cog" title="{{settingsLabel}}"></i>
</button>
<ul class="dropdown-menu pull-right" role="menu">
- <li ng-show="trackedEntityList.rows.length > 0"><a href ng-click="showHideColumns()">{{showHideLabel}}</a></li>
+ <li ng-if="trackedEntityList.rows.length > 0"><a href ng-click="showHideColumns()">{{showHideLabel}}</a></li>
</ul>
</div>
</div>
@@ -161,10 +161,8 @@
<!-- registration form ends -->
<!-- entity grid begins -->
- <img src="../images/ajax-loader-bar.gif" alt="{{'in_progress'| translate}}" ng-if="!teiFetched && searchText && !emptySearchTex"/>
- <div class="row" ng-if="showTrackedEntityDiv">
- <div class="col-md-12" ng-include="'views/tei.html'"></div>
- </div>
+ <i ng-if="!teiFetched" class="fa fa-spinner fa-spin fa-2x"></i>
+ <div class="row col-md-12" ng-include="'views/tei.html'"></div>
<!-- entity grid ends -->
</div>
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/views/tei.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/views/tei.html 2015-09-15 13:51:19 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/views/tei.html 2015-09-17 15:26:24 +0000
@@ -1,54 +1,56 @@
-<div ng-switch="teiCount">
- <div ng-switch-when="undefined">
- <div class="alert alert-warning vertical-spacing">
- {{'no'| translate}} {{selectedProgram.trackedEntity.name|| 'records' | translate}} {{'found'| translate}}
- </div>
- </div>
- <div ng-switch-when="0">
- <div class="alert alert-warning vertical-spacing">
- {{'no'| translate}} {{selectedProgram.trackedEntity.name|| 'records' | translate}} {{'found'| translate}}
- </div>
- </div>
- <div ng-switch-default>
-
- <!-- entity begins -->
- <div class="vertical-spacing">
- <table class="table table-striped dhis2-table-hover table-bordered">
- <thead>
- <tr>
- <th ng-repeat="gridColumn in gridColumns| filter:{show: true}" class='mouse-pointer' ng-click="sortGrid(gridColumn)">
- <!-- sort icon begins -->
- <span ng-hide="gridColumn.showFilter" class="bold pointer" title="{{'sort'| translate}}">
- <span ng-class="{true: 'red'} [sortColumn.id === gridColumn.id]"><i class="fa fa-sort"></i></span>
- {{gridColumn.name}}
- </span>
- <!-- sort icon ends -->
- </th>
- </tr>
- </thead>
- <tbody id="list">
- <tr ng-repeat="trackedEntity in trackedEntityList.rows | orderBy:d2Sort:reverse"
- ng-click="selectedTei.trackedEntityInstance ? assignRelationship(trackedEntity) : showDashboard(trackedEntity)"
- ng-class="{true: 'inactive-tei'} [trackedEntity.inactive]"
- title="{{selectedTei.trackedEntityInstance ? 'select' : 'go_to_dashboard'| translate}}">
- <td ng-repeat="gridColumn in gridColumns| filter:{show: true}">
- <span ng-switch="gridColumn.valueType">
- <span ng-switch-when="bool">
- <span ng-if="trackedEntity[gridColumn.id] === 'true'">{{'yes'| translate}}</span>
- <span ng-if="trackedEntity[gridColumn.id] === 'false'">{{ 'no' | translate}}</span>
- </span>
- <span ng-switch-when="trueOnly">
- <span ng-if="trackedEntity[gridColumn.id] === 'true'"><i class="fa fa-check"></i></span>
- </span>
- <span ng-switch-default>{{trackedEntity[gridColumn.id]}}</span>
- </span>
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- <!-- entity ends -->
- <serverside-paginator></serverside-paginator>
-
- </div>
-</div>
\ No newline at end of file
+<div ng-if="trackedEntityList.rows">
+ <div ng-switch="trackedEntityList.rows.length">
+ <div ng-switch-when="undefined">
+ <div class="alert alert-warning vertical-spacing">
+ {{'no'| translate}} {{selectedProgram.trackedEntity.name|| 'records' | translate}} {{'found'| translate}}
+ </div>
+ </div>
+ <div ng-switch-when="0">
+ <div class="alert alert-warning vertical-spacing">
+ {{'no'| translate}} {{selectedProgram.trackedEntity.name|| 'records' | translate}} {{'found'| translate}}
+ </div>
+ </div>
+ <div ng-switch-default>
+
+ <!-- entity begins -->
+ <div class="vertical-spacing">
+ <table class="table table-striped dhis2-table-hover table-bordered">
+ <thead>
+ <tr>
+ <th ng-repeat="gridColumn in gridColumns| filter:{show: true}" class='mouse-pointer' ng-click="sortGrid(gridColumn)">
+ <!-- sort icon begins -->
+ <span ng-hide="gridColumn.showFilter" class="bold pointer" title="{{'sort'| translate}}">
+ <span ng-class="{true: 'red'} [sortColumn.id === gridColumn.id]"><i class="fa fa-sort"></i></span>
+ {{gridColumn.name}}
+ </span>
+ <!-- sort icon ends -->
+ </th>
+ </tr>
+ </thead>
+ <tbody id="list">
+ <tr ng-repeat="trackedEntity in trackedEntityList.rows | orderBy:d2Sort:reverse"
+ ng-click="selectedTei.trackedEntityInstance ? assignRelationship(trackedEntity) : showDashboard(trackedEntity)"
+ ng-class="{true: 'inactive-tei'} [trackedEntity.inactive]"
+ title="{{selectedTei.trackedEntityInstance ? 'select' : 'go_to_dashboard'| translate}}">
+ <td ng-repeat="gridColumn in gridColumns| filter:{show: true}">
+ <span ng-switch="gridColumn.valueType">
+ <span ng-switch-when="bool">
+ <span ng-if="trackedEntity[gridColumn.id] === 'true'">{{'yes'| translate}}</span>
+ <span ng-if="trackedEntity[gridColumn.id] === 'false'">{{ 'no' | translate}}</span>
+ </span>
+ <span ng-switch-when="trueOnly">
+ <span ng-if="trackedEntity[gridColumn.id] === 'true'"><i class="fa fa-check"></i></span>
+ </span>
+ <span ng-switch-default>{{trackedEntity[gridColumn.id]}}</span>
+ </span>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ <!-- entity ends -->
+ <serverside-paginator></serverside-paginator>
+
+ </div>
+ </div>
+</div>