dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #42064
[Branch ~dhis2-devs-core/dhis2/trunk] Rev 21489: tracker-capture: new event layout in data-entry widget - WIP
------------------------------------------------------------
revno: 21489
committer: Abyot Asalefew Gizaw <abyota@xxxxxxxxx>
branch nick: dhis2
timestamp: Thu 2015-12-17 17:15:10 +0100
message:
tracker-capture: new event layout in data-entry widget - WIP
removed:
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-paging.html
modified:
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-buttons.html
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-controller.js
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.html
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-details.html
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-layout.html
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/i18n/i18n_app.properties
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/directives.js
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/styles/style.css
--
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/dataentry/dataentry-buttons.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-buttons.html 2015-12-17 15:00:48 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-buttons.html 2015-12-17 16:15:10 +0000
@@ -20,5 +20,8 @@
<a href ng-click="deleteEvent()"
ng-disabled="selectedEnrollment.status === 'COMPLETED' || currentEvent.editingNotAllowed || currentEvent.orgUnit !== selectedOrgUnit.id"
class="btn btn-danger">{{'delete'| translate}}</a>
+ <a href ng-click="showCreateEvent(currentStage)"
+ ng-if="stageNeedsEvent(currentStage) && selectedEnrollment.status === 'ACTIVE'"
+ class="btn btn-primary">{{'add_new_event'| translate}}</a>
<a href class="btn btn-info" ng-click="print('print-div');">{{'print_form'| translate}}</a>
</div>
\ No newline at end of file
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-controller.js'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-controller.js 2015-12-17 15:00:48 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-controller.js 2015-12-17 16:15:10 +0000
@@ -8,7 +8,6 @@
$log,
$timeout,
$translate,
- Paginator,
CommonUtils,
DateUtils,
EventUtils,
@@ -27,8 +26,11 @@
EventCreationService,
$q) {
+ $scope.eventPageSize = 4;
$scope.maxOptionSize = 30;
$scope.dashboardReady = false;
+ $scope.eventPagingStart = 0;
+ $scope.eventPagingEnd = $scope.eventPageSize;
//Data entry form
$scope.outerForm = {};
@@ -267,7 +269,7 @@
}
allSorted = orderByFilter(allSorted, '-sortingDate').reverse();
- var evs = {all: allSorted, byStage: $scope.eventsByStageAsc};
+ var evs = {all: $scope.allEventsSorted, byStage: $scope.eventsByStageAsc};
var flag = {debug: true, verbose: true};
//If the events is displayed in a table, it is necessary to run the rules for all visible events.
@@ -353,6 +355,7 @@
$scope.getEvents = function () {
+ $scope.allEventsSorted = [];
var events = CurrentSelection.getSelectedTeiEvents();
events = $filter('filter')(events, {program: $scope.selectedProgram.id});
if (angular.isObject(events)) {
@@ -404,9 +407,13 @@
$scope.currentEvent = dhis2Event;
}
}
+
+ $scope.allEventsSorted.push(dhis2Event);
}
});
-
+
+ $scope.allEventsSorted = orderByFilter($scope.allEventsSorted, '-sortingDate').reverse();
+ console.log('the event: ', $scope.allEventsSorted);
sortEventsByStage(null);
$scope.showDataEntry($scope.currentEvent, true);
}
@@ -454,24 +461,46 @@
}
}
- $scope.stageNeedsEvent = function (stage) {
- //In case the event is a table, we sould always allow adding more events(rows)
- if (stage.displayEventsInTable) {
- return true;
- }
-
- if ($scope.eventsByStage[stage.id].length < 1) {
- return true;
- }
-
- if (stage.repeatable) {
- for (var j = 0; j < $scope.eventsByStage[stage.id].length; j++) {
- if (!$scope.eventsByStage[stage.id][j].eventDate && $scope.eventsByStage[stage.id][j].status !== 'SKIPPED') {
- return false;
- }
- }
- return true;
- }
+ $scope.stageNeedsEvent = function (stage) {
+ if($scope.selectedEnrollment && $scope.selectedEnrollment.status === 'ACTIVE'){
+ if(!stage){
+ if(!$scope.allEventsSorted || $scope.allEventsSorted.length === 0){
+ return true;
+ }
+
+ for(var key in $scope.eventsByStage){
+ stage = $scope.stagesById[key];
+ if(stage && stage.repeatable){
+ for (var j = 0; j < $scope.eventsByStage[stage.id].length; j++) {
+ if (!$scope.eventsByStage[stage.id][j].eventDate && $scope.eventsByStage[stage.id][j].status !== 'SKIPPED') {
+ return false;
+ }
+ }
+ return true;
+ }
+ }
+ return false;
+ }
+
+ //In case the event is a table, we sould always allow adding more events(rows)
+ if (stage.displayEventsInTable) {
+ return true;
+ }
+
+ if ($scope.eventsByStage[stage.id].length === 0) {
+ return true;
+ }
+
+ if (stage.repeatable) {
+ for (var j = 0; j < $scope.eventsByStage[stage.id].length; j++) {
+ if (!$scope.eventsByStage[stage.id][j].eventDate && $scope.eventsByStage[stage.id][j].status !== 'SKIPPED') {
+ return false;
+ }
+ }
+ return true;
+ }
+ }
+
return false;
};
@@ -485,6 +514,7 @@
};
$scope.showCreateEvent = function (stage,eventCreationAction) {
+
var dummyEvent = EventUtils.createDummyEvent($scope.eventsByStage[stage.id], $scope.selectedEntity, $scope.selectedProgram, stage, $scope.selectedOrgUnit, $scope.selectedEnrollment);
var modalInstance = $modal.open({
@@ -536,13 +566,6 @@
$scope.showDataEntry = function (event, rightAfterEnrollment) {
if (event) {
-
- Paginator.setItemCount($scope.eventsByStage[event.programStage].length);
- Paginator.setPage($scope.eventsByStage[event.programStage].indexOf(event));
- Paginator.setPageCount(Paginator.getItemCount());
- Paginator.setPageSize(1);
- Paginator.setToolBarDisplay(5);
-
if ($scope.currentEvent && !rightAfterEnrollment && $scope.currentEvent.event === event.event) {
//clicked on the same stage, do toggling
$scope.currentEvent = null;
@@ -1525,19 +1548,24 @@
}
}
- $scope.allEventsSorted = CurrentSelection.getSelectedTeiEvents();
-
if (operation) {
if (operation === 'ADD') {
var ev = EventUtils.reconstruct(newEvent, $scope.currentStage, $scope.optionSets);
ev.enrollment = newEvent.enrollment;
ev.visited = newEvent.visited;
+ ev.orgUnitName = newEvent.orgUnitName;
+ ev.name = newEvent.name;
+ ev.sortingDate =newEvent.sortingDate;
+
$scope.allEventsSorted.push(ev);
}
if (operation === 'UPDATE') {
var ev = EventUtils.reconstruct($scope.currentEvent, $scope.currentStage, $scope.optionSets);
ev.enrollment = $scope.currentEvent.enrollment;
ev.visited = $scope.currentEvent.visited;
+ ev.orgUnitName = $scope.currentEvent.orgUnitName;
+ ev.name = $scope.currentEvent.name;
+ ev.sortingDate = $scope.currentEvent.sortingDate;
var index = -1;
for (var i = 0; i < $scope.allEventsSorted.length && index === -1; i++) {
if ($scope.allEventsSorted[i].event === $scope.currentEvent.event) {
@@ -1560,14 +1588,11 @@
}
}
- CurrentSelection.setSelectedTeiEvents($scope.allEventsSorted);
-
$timeout(function () {
$rootScope.$broadcast('tei-report-widget', {});
}, 200);
- }
-
- $scope.allEventsSorted = orderByFilter($scope.allEventsSorted, '-sortingDate').reverse();
+ }
+ $scope.allEventsSorted = orderByFilter($scope.allEventsSorted, '-sortingDate').reverse();
};
$scope.showLastEventInStage = function (stageId) {
@@ -1629,7 +1654,19 @@
}
return status;
};
-
+
+ $scope.getEventPage = function(direction){
+ if(direction === 'FORWARD'){
+ $scope.eventPagingStart += $scope.eventPageSize;
+ $scope.eventPagingEnd += $scope.eventPageSize;
+ }
+
+ if(direction === 'BACKWARD'){
+ $scope.eventPagingStart -= $scope.eventPageSize;
+ $scope.eventPagingEnd -= $scope.eventPageSize;
+ }
+ };
+
$scope.deselectCurrent = function(id){
if($scope.currentEvent.event === id){
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.html 2015-12-17 15:00:48 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.html 2015-12-17 16:15:10 +0000
@@ -2,7 +2,23 @@
<div ng-include="'components/dataentry/dataentry-print.html'">
</div>
<div class="panel-heading handle bold">
- {{dataentryWidget.title| translate}}
+ {{dataentryWidget.title| translate}}
+ <span ng-if="currentStage && stageNeedsEvent(currentStage) && selectedEnrollment.status === 'ACTIVE'">
+ <a href title="{{'create_new_event'| translate}}" ng-click="showCreateEvent(stage,eventCreationActions.add)" style="vertical-align:middle">
+ {{'add'|translate}}
+ </a>
+ |
+ <a href title="{{'schedule_new_event'| translate}}" ng-click="showCreateEvent(stage,eventCreationActions.schedule)" style="vertical-align:middle">
+ {{'schedule'|translate}}
+ </a>
+ |
+ <a href title="Make referral" ng-click="showCreateEvent(stage, eventCreationActions.referral)" style="vertical-align: middle" ng-if="showReferral">
+ Referral
+ </a>
+ </span>
+ <!--<span class="nav-pills" ng-if="stageNeedsEvent(null)">
+ | <a href ng-click="showCreateEvent(currentStage)" title="{{'add_new_event'| translate}}"><span ng-class="{true: 'widget - link - active', false: 'widget - link'} [!editingDisabled]">{{'add_new_event'| translate}}</span></a>
+ </span>-->
<span class="pull-right widget-link">
<a href ng-click="toggleTableEditMode()" title="{{tableEditMode === tableEditModes.form ? 'use combined table edit mode' : 'use form only table edit mode'}}"><span ng-if="tableEditMode === tableEditModes.form"><i class="fa fa-clipboard vertical-center"></i></span><span ng-if="tableEditMode !== tableEditModes.form"><i class="fa fa-external-link vertical-center"></i></span></a>
<a href ng-click="toggleEventsTableDisplay()" title="{{showEventsAsTables ? 'toggle_table_view_off' : 'toggle_table_view_on'| translate}}" ng-show="stagesCanBeShownAsTable"><span ng-if="!showEventsAsTables"><i class="fa fa-bars vertical-center"></i></span><span ng-if="showEventsAsTables"><i class="fa fa-square vertical-center"></i></span></a>
@@ -32,8 +48,8 @@
</tr>
</table>
</div>
- <!--TREE-->
- <div class="table-responsive hideInPrint" ng-if="selectedEnrollment && selectedEnrollment.enrollment">
+
+ <div class="hideInPrint" ng-if="selectedEnrollment && selectedEnrollment.enrollment">
<div ng-include="'components/dataentry/event-layout.html'"></div>
</div>
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-details.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-details.html 2015-12-17 15:00:48 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-details.html 2015-12-17 16:15:10 +0000
@@ -16,7 +16,7 @@
blur-or-change="saveEventDate()"/>
<span ng-if="invalidDate === currentEvent.event" class="error">{{'date_required'| translate}}</span>
</div>
- <div ng-if="!currentEvent.eventDate && currentEvent.status !== 'SKIPPED'" class="col-md-6">
+ <div ng-if="!currentStage.hideDueDate || !currentEvent.eventDate && currentEvent.status !== 'SKIPPED'" class="col-md-6">
<span ng-if="currentEvent.eventDate || currentEvent.status === 'SKIPPED' || currentEvent.dueDate">
{{'due_date'| translate}}
</span>
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-layout.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-layout.html 2015-12-17 15:00:48 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-layout.html 2015-12-17 16:15:10 +0000
@@ -1,12 +1,35 @@
-<table class="table table-bordered">
+<div class="row col-sm-12">
+ <div ng-repeat="dhis2Event in allEventsSorted.slice(eventPagingStart, eventPagingEnd)">
+ <div class="event-container" ng-click="getEventPage('BACKWARD')" ng-if="$index === 0 && eventPagingStart > 0">
+ <br/>
+ {{'previous'| translate}}
+ </div>
+ <div class="event-container" title="[{{'org_unit' | translate}}: {{dhis2Event.orgUnitName}}, {{'program_stage' | translate}}: {{dhis2Event.name}}]" ng-class="getEventStyle(dhis2Event)" ng-click="showDataEntry(dhis2Event, false)">
+ {{dhis2Event.sortingDate}}<br/>
+ {{dhis2Event.orgUnitName}}<br/>
+ {{dhis2Event.name}}
+ </div>
+ <div class="arrow-container" ng-if="$index + 1 % (eventPagingEnd - eventPagingStart) > 1">
+ <i class="fa fa-arrow-right"></i>
+ </div>
+ <div class="event-container" ng-click="getEventPage('FORWARD')" ng-if="$index + 1 === (eventPagingEnd - eventPagingStart)">
+ <br/>
+ {{'next'| translate}}
+ </div>
+ </div>
+
+ <div ng-if="allEventsSorted.length < 1">
+ <div class="alert alert-warning">{{'no_events_exist'| translate}}</div>
+ </div>
+</div>
+
+<hr>
+<!--<table class="table table-bordered">
<thead>
<tr>
<th class="active" style="vertical-align:middle" ng-repeat="stage in programStages">
- {{stage.name}}
-
- <!-- event add/filter icon begins -->
+ {{stage.name}}
<span class='pull-right'>
-
<span ng-if="stageNeedsEvent(stage) && selectedEnrollment.status === 'ACTIVE'">
<a href title="{{'create_new_event'| translate}}" ng-click="showCreateEvent(stage,eventCreationActions.add)" style="vertical-align:middle">
{{'add'|translate}}
@@ -21,8 +44,6 @@
</a>
</span>
</span>
- <!-- event add/filter icon ends -->
-
</th>
</tr>
</thead>
@@ -53,4 +74,4 @@
</td>
</tr>
</tbody>
-</table>
\ No newline at end of file
+</table>-->
\ No newline at end of file
=== removed file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-paging.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-paging.html 2015-04-17 07:19:16 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-paging.html 1970-01-01 00:00:00 +0000
@@ -1,43 +0,0 @@
-<div class="paging-container">
-
- <div class="event-paging">
-
- <span ng-show="eventsByStage[stage.id].indexOf(currentEvent) > 0">
- <a href ng-click="showDataEntryForEvent(eventsByStage[stage.id][0])" title="{{'first'| translate}}">
- ««
- </a>
- <a href ng-click="showDataEntryForEvent(eventsByStage[stage.id][eventsByStage[stage.id].indexOf(currentEvent)-1])" title="{{'previous'| translate}}">
- «
- </a>
- </span>
- <span ng-hide="eventsByStage[stage.id].indexOf(currentEvent) > 0">
- <span title="{{'first'| translate}}">««</span>
- <span title="{{'previous'| translate}}">«</span>
- </span>
-
-
- <a href ng-click="showDataEntryForEvent(eventsByStage[stage.id][i])"
- title="{{'event_recorded_on'| translate}} {{eventsByStage[stage.id][i].sortingDate}} {{'at' | translate}} {{eventsByStage[stage.id][i].orgUnitName}}"
- ng-repeat="i in [] | forLoop:paginator.lowerLimit():eventsByStage[stage.id].length | limitTo:paginator.getToolBarDisplay()"
- ng-class="eventsByStage[stage.id].indexOf(currentEvent) === i && 'active'">
- {{i + 1}}
- </a>
-
-
- <span ng-show="eventsByStage[stage.id].indexOf(currentEvent) < eventsByStage[stage.id].length - 1">
- <a href ng-click="showDataEntryForEvent(eventsByStage[stage.id][eventsByStage[stage.id].indexOf(currentEvent) + 1])" title="{{'next'| translate}}" >
- »
- </a>
- <a href ng-click="showLastEventInStage(stage.id)" title="{{'last'| translate}}">
- »»
- </a>
- </span>
- <span ng-hide="eventsByStage[stage.id].indexOf(currentEvent) < eventsByStage[stage.id].length - 1">
- <span class="next" title="{{'next'| translate}}">» </span>
- <span class="last" title="{{'last'| translate}}">»»</span>
- </span>
-
-
- </div>
-
-</div>
\ No newline at end of file
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/i18n/i18n_app.properties'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/i18n/i18n_app.properties 2015-12-16 10:22:49 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/i18n/i18n_app.properties 2015-12-17 16:15:10 +0000
@@ -93,6 +93,7 @@
add_note=Add note
search_note=Search notes
add_new_note_here=Add new note here
+add_new_event=Add new event
skip=Skip
unskip=Schedule back
complete=Complete
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/directives.js'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/directives.js 2015-12-17 15:00:48 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/scripts/directives.js 2015-12-17 16:15:10 +0000
@@ -6,17 +6,6 @@
var trackerCaptureDirectives = angular.module('trackerCaptureDirectives', [])
-.directive('eventPaginator', function factory() {
-
- return {
- restrict: 'E',
- controller: function ($scope, Paginator) {
- $scope.paginator = Paginator;
- },
- templateUrl: 'components/dataentry/event-paging.html'
- };
-})
-
.directive('stringToNumber', function () {
return {
require: 'ngModel',
=== modified file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/styles/style.css'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/styles/style.css 2015-12-17 15:00:48 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/styles/style.css 2015-12-17 16:15:10 +0000
@@ -147,13 +147,18 @@
}
.event-container {
+ display: inline-block;
cursor: pointer;
opacity: 1.0;
text-align: center;
- margin: 2px;
+ margin: 5px;
padding: 5px;
border: 2px dotted;
- border-radius: 4px;
+ border-radius: 4px;
+ width: 130px;
+ height: 70px;
+ overflow: hidden;
+ float: left;
}
.event-container:hover {
@@ -161,6 +166,12 @@
font-weight: bold;
}
+.arrow-container {
+ display: inline-block;
+ float: left;
+ padding-top: 30px;
+}
+
.stage-completed {
background-color: #b9ffb9;
}
@@ -1140,52 +1151,6 @@
vertical-align: middle;
}
-div.event-paging
-{
- width:100%;
- background-color: #ebf0f6;
- float:left;
- text-align: left;
- height:16px;
- margin-top: 5px;
- border-radius: 4px;
-}
-
-div.event-paging span, div.event-paging a
-{
- font-weight: bold;
- padding: 0 5px;
- font-size: 12px;
-}
-
-div.event-paging a
-{
- text-decoration: none;
- color: #FF9900;
-}
-
-div.event-paging a.active
-{
- text-decoration: none;
- color: #000;
- cursor: default;
-}
-
-div.event-paging a:hover
-{
- color: #000;
-}
-
-div.event-paging span.page
-{
- color:#000;
-}
-
-div.event-paging span.seperator
-{
- display:none;
-}
-
input, button, select, textarea {
color: #444;
}
