dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #42019
[Branch ~dhis2-devs-core/dhis2/trunk] Rev 21469: tracker-capture: new layout for events in data entry widget - WIP
------------------------------------------------------------
revno: 21469
committer: Abyot Asalefew Gizaw <abyota@xxxxxxxxx>
branch nick: dhis2
timestamp: Wed 2015-12-16 11:52:24 +0100
message:
tracker-capture: new layout for events in data entry widget - WIP
added:
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-notes.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
modified:
dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.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
=== added 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 1970-01-01 00:00:00 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-buttons.html 2015-12-16 10:52:24 +0000
@@ -0,0 +1,19 @@
+<div class="form-group hideInPrint" ng-if="displayCustomForm !== 'TABLE'">
+ <div class='row'><hr></div>
+ <a href ng-click="completeIncompleteEvent()"
+ class="btn btn-warning"
+ ng-disabled="selectedEnrollment.status !== 'ACTIVE' || currentEvent.editingNotAllowed || currentEvent.orgUnit !== selectedOrgUnit.id"
+ ng-if="currentEvent.eventDate && (currentEvent.status === 'SCHEDULE' || currentEvent.status === 'ACTIVE' || currentEvent.status === 'VISITED')">{{'complete'| translate}}</a>
+ <a href ng-click="completeIncompleteEvent()"
+ class="btn btn-warning"
+ ng-disabled="selectedEnrollment.status !== 'ACTIVE' || currentEvent.editingNotAllowed && currentEvent.status !== 'COMPLETED' || currentEvent.orgUnit !== selectedOrgUnit.id"
+ ng-if="currentEvent.eventDate && currentEvent.status === 'COMPLETED'">{{'incomplete'| translate}}</a>
+ <a href ng-click="skipUnskipEvent()"
+ class="btn btn-warning"
+ ng-disabled="selectedEnrollment.status !== 'ACTIVE' || currentEvent.editingNotAllowed || currentEvent.orgUnit !== selectedOrgUnit.id"
+ ng-if="!currentEvent.eventDate">{{currentEvent.status === 'SKIPPED' ? 'unskip' : 'skip'| translate}}</a>
+ <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 class="btn btn-info" ng-click="print('print-div');">{{'print_form'| translate}}</a>
+</div>
\ No newline at end of file
=== added file 'dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-notes.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-notes.html 1970-01-01 00:00:00 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry-notes.html 2015-12-16 10:52:24 +0000
@@ -0,0 +1,34 @@
+<div ng-show="currentEvent" class='remove-default-padding overflow-ellipsis'>
+<div class='row'><hr></div>
+<div class="add-default-padding">
+ <textarea class="form-control" rows="3" ng-model="note.value" placeholder="{{'add_new_note_here'| translate}}"></textarea>
+ <div class="vertical-spacing hideInPrint">
+ <button type="button"
+ class="btn btn-primary"
+ ng-click="addNote()">
+ {{'add'| translate}}
+ </button>
+ <button type="button"
+ class="btn btn-default small-horizonal-spacing hideInPrint"
+ ng-click="clearNote()">
+ {{'clear'| translate}}
+ </button>
+ </div>
+</div>
+<table class="table table-striped dhis2-table-hover">
+ <tr ng-repeat="note in currentEvent.notes">
+ <td class="add-default-left-padding">
+ <d2-pop-over content="note" template="popover.html" details="{{'details'| translate}}">
+ <div>{{note.heading}}</div>
+ </d2-pop-over>
+ <script type="text/ng-template" id="popover.html">
+ <div class="wrap-text">{{content.value}}</div>
+ <hr>
+ <p><strong>{{'created_by' | translate}}: </strong>{{content.storedBy}}</p>
+ <p><strong>{{'date' | translate}}: </strong>{{content.storedDate}}</p>
+ </script>
+ </td>
+ </tr>
+</table>
+</div>
+<div ng-show="currentEvent && !currentEvent.notes" class="alert alert-warning">{{'no_notes_exist'| translate}}</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.html'
--- dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.html 2015-12-16 09:43:38 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/dataentry.html 2015-12-16 10:52:24 +0000
@@ -34,52 +34,7 @@
</div>
<div class="table-responsive hideInPrint" ng-if="selectedEnrollment && selectedEnrollment.enrollment">
- <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 -->
- <span class='pull-right'>
-
- <span ng-if="stageNeedsEvent(stage) && selectedEnrollment.status === 'ACTIVE'">
- <a href title="{{'create_new_event'| translate}}" ng-click="showCreateEvent(stage)" style="vertical-align:middle"><i class="fa fa-plus"></i></a>
- </span>
- </span>
- <!-- event add/filter icon ends -->
-
- </th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td ng-repeat="stage in programStages">
- <div class="inline-block" ng-repeat="dhis2Event in eventsByStage[stage.id]">
- <div class="event-container"
- ng-class="getEventStyle(dhis2Event)"
- ng-show="!currentPeriod[stage.id] || !filterEvents || currentPeriod[stage.id] && currentPeriod[stage.id].event === dhis2Event.event"
- ng-click="showDataEntry(dhis2Event, false)">
- {{dhis2Event.orgUnitName}}<br/>
- {{dhis2Event.sortingDate}}<br>
- <span ng-if="eventsByStage[stage.id].length > 1 && !filterEvents">[{{eventsByStage[stage.id].length - $index}}]</span>
- </div>
- </div>
- <span ng-if="eventsByStage[stage.id].length > 1 && filterEvents">
- <span ng-if="currentEvent.programStage !== stage.id">
- <div class="event-paging">
- <a href class="event-paging" ng-click="showDataEntryForEvent(eventsByStage[stage.id][0])">{{'show_more'| translate}}</a>
- </div>
- </span>
- <event-paginator ng-if="stage.id === currentEvent.programStage"></event-paginator>
- </span>
- <div ng-if="!eventsByStage[stage.id] || eventsByStage[stage.id].length < 1">
- <div class="alert alert-warning">{{'no_events_exist'| translate}}</div>
- </div>
- </td>
- </tr>
- </tbody>
- </table>
+ <div ng-include="'components/dataentry/event-layout.html'"></div>
</div>
<div ng-if="!selectedEnrollment || !selectedEnrollment.enrollment" class="alert alert-danger">{{notEnrolledLabel}}</div>
@@ -87,76 +42,7 @@
<form name="outerForm" novalidate>
<div ng-if="currentEvent">
- <!-- event dates/scheduling begin -->
- <div class="row" ng-if="(displayCustomForm !== 'TABLE') && !currentStage.periodType">
-
- <div ng-class="{true: 'col-md-12', false: 'col-md-6'} [currentStage.hideDueDate]">
- {{currentEvent.excecutionDateLabel}}
- <input type="text"
- placeholder="{{dhis2CalendarFormat.keyDateFormat}}"
- class="form-control"
- ng-class="{'input-success': eventDateSaved}"
- d2-date
- max-date="0"
- min-date=""
- ng-model="currentEvent.eventDate"
- ng-disabled="currentEvent.status === 'SKIPPED' || selectedEnrollment.status !== 'ACTIVE' || currentEvent.editingNotAllowed"
- ng-required="true"
- blur-or-change="saveEventDate()"/>
- <span ng-if="invalidDate" class="error">{{'date_required'| translate}}</span>
- </div>
- <div class="col-md-6" ng-if="!currentStage.hideDueDate">
- <span ng-if="currentEvent.eventDate || currentEvent.status === 'SKIPPED' || currentEvent.dueDate">
- {{'due_date'| translate}}
- </span>
- <span ng-if="!currentEvent.eventDate && currentEvent.status !== 'SKIPPED' && !selectedEntity.inactive">
- <a href ng-click="enableRescheduling()" title="{{ schedulingEnabled ? 'disable_rescheduling' : 'enable_rescheduling' | translate}}"><span class="text-primary bold">{{'reschedule_duedate'| translate}}</span></a>
- </span>
- <input type="text"
- placeholder="{{dhis2CalendarFormat.keyDateFormat}}"
- class="form-control"
- ng-class="{'input-success': dueDateSaved}"
- d2-date
- ng-model="currentEvent.dueDate"
- blur-or-change="saveDueDate()"
- ng-disabled="currentEvent.eventDate || !schedulingEnabled || selectedEnrollment.status !== 'ACTIVE' || currentEvent.editingNotAllowed"/>
- <span ng-if="invalidDate" class="error">{{'date_required'| translate}}</span>
- </div>
- </div>
- <!-- event dates/scheduling end -->
-
- <!-- coordinates begin -->
- <div class="row" ng-if="currentStage.captureCoordinates && currentEvent.eventDate">
- <div class="col-md-6">
- {{'latitude'| translate}}<span><a href ng-click="showMap(currentEvent)" title="{{'get_from_map'| translate}}"><i class="fa fa-map-marker fa-2x"></i></a></span>
- <input type="number"
- ng-model="currentEvent.coordinate.latitude"
- class="form-control"
- ng-class="{'input-success': latitudeSaved}"
- name="latitude"
- d2-coordinate-validator
- ng-blur="saveCoordinate('LAT')"
- ng-disabled="currentEvent.enrollmentStatus !== 'ACTIVE' || currentEvent.editingNotAllowed"
- ng-required="false"/>
- <div ng-messages="outerForm.latitude.$error" ng-if="interacted(outerForm.latitude)" class="required" ng-messages-include="../dhis-web-commons/angular-forms/error-messages.html">
- </div>
- </div>
- <div class="col-md-6">
- {{'longitude'| translate}}<span><a href ng-click="showMap(currentEvent)" title="{{'get_from_map'| translate}}"><i class="fa fa-map-marker fa-2x"></i></a></span>
- <input type="number"
- ng-model="currentEvent.coordinate.longitude"
- class="form-control"
- ng-class="{'input-success': longitudeSaved}"
- name="longitude"
- d2-coordinate-validator
- ng-blur="saveCoordinate('LNG')"
- ng-disabled="currentEvent.enrollmentStatus !== 'ACTIVE' || currentEvent.editingNotAllowed"
- ng-required="false"/>
- <div ng-messages="outerForm.longitude.$error" ng-if="interacted(outerForm.longitude)" class="required" ng-messages-include="../dhis-web-commons/angular-forms/error-messages.html">
- </div>
- </div>
- </div>
- <!-- coordinates begin -->
+ <div ng-include="'components/dataentry/event-details.html'"></div>
<!-- data entry form begins -->
<div ng-if="currentEvent.eventDate">
@@ -165,74 +51,20 @@
</div>
<!-- the table form is insensitive to the event date being present. In this situation the eventdate is set inside the table form -->
<div class="clear vertical-spacing" ng-if="displayCustomForm === 'TABLE'" ng-include="'components/dataentry/table-entry-form.html'"></div>
-
<!-- data entry form ends -->
-
- <!-- data entry/event buttons begins -->
-
- <div class="form-group hideInPrint" ng-if="displayCustomForm !== 'TABLE'">
- <div class='row'><hr></div>
- <a href ng-click="completeIncompleteEvent()"
- class="btn btn-warning"
- ng-disabled="selectedEnrollment.status !== 'ACTIVE' || currentEvent.editingNotAllowed || currentEvent.orgUnit !== selectedOrgUnit.id"
- ng-if="currentEvent.eventDate && (currentEvent.status === 'SCHEDULE' || currentEvent.status === 'ACTIVE' || currentEvent.status === 'VISITED')">{{'complete'| translate}}</a>
- <a href ng-click="completeIncompleteEvent()"
- class="btn btn-warning"
- ng-disabled="selectedEnrollment.status !== 'ACTIVE' || currentEvent.editingNotAllowed && currentEvent.status !== 'COMPLETED' || currentEvent.orgUnit !== selectedOrgUnit.id"
- ng-if="currentEvent.eventDate && currentEvent.status === 'COMPLETED'">{{'incomplete'| translate}}</a>
- <a href ng-click="skipUnskipEvent()"
- class="btn btn-warning"
- ng-disabled="selectedEnrollment.status !== 'ACTIVE' || currentEvent.editingNotAllowed || currentEvent.orgUnit !== selectedOrgUnit.id"
- ng-if="!currentEvent.eventDate">{{currentEvent.status === 'SKIPPED' ? 'unskip' : 'skip'| translate}}</a>
- <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 class="btn btn-info" ng-click="print('print-div');">{{'print_form'| translate}}</a>
- </div>
- <!-- data entry/event buttons ends -->
+
+ <!-- data entry/event buttons begins -->
+ <div ng-include="'components/dataentry/dataentry-buttons.html'"></div>
+ <!-- data entry/event buttons ends -->
</div>
</form>
- <div ng-if="displayCustomForm !== 'TABLE'">
- <div ng-show="currentEvent" class='remove-default-padding overflow-ellipsis'>
- <div class='row'><hr></div>
- <div class="add-default-padding">
- <textarea class="form-control" rows="3" ng-model="note.value" placeholder="{{'add_new_note_here'| translate}}"></textarea>
- <div class="vertical-spacing hideInPrint">
- <button type="button"
- class="btn btn-primary"
- ng-click="addNote()">
- {{'add'| translate}}
- </button>
- <button type="button"
- class="btn btn-default small-horizonal-spacing hideInPrint"
- ng-click="clearNote()">
- {{'clear'| translate}}
- </button>
- </div>
- </div>
- <table class="table table-striped dhis2-table-hover">
- <tr ng-repeat="note in currentEvent.notes">
- <td class="add-default-left-padding">
- <d2-pop-over content="note" template="popover.html" details="{{'details'| translate}}">
- <div>{{note.heading}}</div>
- </d2-pop-over>
- <script type="text/ng-template" id="popover.html">
- <div class="wrap-text">{{content.value}}</div>
- <hr>
- <p><strong>{{'created_by' | translate}}: </strong>{{content.storedBy}}</p>
- <p><strong>{{'date' | translate}}: </strong>{{content.storedDate}}</p>
- </script>
- </td>
- </tr>
- </table>
- </div>
- <div ng-show="currentEvent && !currentEvent.notes" class="alert alert-warning">{{'no_notes_exist'| translate}}</div>
+ <div ng-if="displayCustomForm !== 'TABLE'">
+ <div ng-include="'components/dataentry/dataentry-notes.html'"></div>
</div>
- </div>
-
+ </div>
</div>
</div>
=== added 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 1970-01-01 00:00:00 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-details.html 2015-12-16 10:52:24 +0000
@@ -0,0 +1,70 @@
+<!-- event dates/scheduling begin -->
+<div class="row" ng-if="(displayCustomForm !== 'TABLE') && !currentStage.periodType">
+
+ <div ng-class="{true: 'col-md-12', false: 'col-md-6'} [currentStage.hideDueDate]">
+ {{currentEvent.excecutionDateLabel}}
+ <input type="text"
+ placeholder="{{dhis2CalendarFormat.keyDateFormat}}"
+ class="form-control"
+ ng-class="{'input-success': eventDateSaved}"
+ d2-date
+ max-date="0"
+ min-date=""
+ ng-model="currentEvent.eventDate"
+ ng-disabled="currentEvent.status === 'SKIPPED' || selectedEnrollment.status !== 'ACTIVE' || currentEvent.editingNotAllowed"
+ ng-required="true"
+ blur-or-change="saveEventDate()"/>
+ <span ng-if="invalidDate" class="error">{{'date_required'| translate}}</span>
+ </div>
+ <div class="col-md-6" ng-if="!currentStage.hideDueDate">
+ <span ng-if="currentEvent.eventDate || currentEvent.status === 'SKIPPED' || currentEvent.dueDate">
+ {{'due_date'| translate}}
+ </span>
+ <span ng-if="!currentEvent.eventDate && currentEvent.status !== 'SKIPPED' && !selectedEntity.inactive">
+ <a href ng-click="enableRescheduling()" title="{{ schedulingEnabled ? 'disable_rescheduling' : 'enable_rescheduling' | translate}}"><span class="text-primary bold">{{'reschedule_duedate'| translate}}</span></a>
+ </span>
+ <input type="text"
+ placeholder="{{dhis2CalendarFormat.keyDateFormat}}"
+ class="form-control"
+ ng-class="{'input-success': dueDateSaved}"
+ d2-date
+ ng-model="currentEvent.dueDate"
+ blur-or-change="saveDueDate()"
+ ng-disabled="currentEvent.eventDate || !schedulingEnabled || selectedEnrollment.status !== 'ACTIVE' || currentEvent.editingNotAllowed"/>
+ <span ng-if="invalidDate" class="error">{{'date_required'| translate}}</span>
+ </div>
+</div>
+<!-- event dates/scheduling end -->
+
+<!-- coordinates begin -->
+<div class="row" ng-if="currentStage.captureCoordinates && currentEvent.eventDate">
+ <div class="col-md-6">
+ {{'latitude'| translate}}<span><a href ng-click="showMap(currentEvent)" title="{{'get_from_map'| translate}}"><i class="fa fa-map-marker fa-2x"></i></a></span>
+ <input type="number"
+ ng-model="currentEvent.coordinate.latitude"
+ class="form-control"
+ ng-class="{'input-success': latitudeSaved}"
+ name="latitude"
+ d2-coordinate-validator
+ ng-blur="saveCoordinate('LAT')"
+ ng-disabled="currentEvent.enrollmentStatus !== 'ACTIVE' || currentEvent.editingNotAllowed"
+ ng-required="false"/>
+ <div ng-messages="outerForm.latitude.$error" ng-if="interacted(outerForm.latitude)" class="required" ng-messages-include="../dhis-web-commons/angular-forms/error-messages.html">
+ </div>
+ </div>
+ <div class="col-md-6">
+ {{'longitude'| translate}}<span><a href ng-click="showMap(currentEvent)" title="{{'get_from_map'| translate}}"><i class="fa fa-map-marker fa-2x"></i></a></span>
+ <input type="number"
+ ng-model="currentEvent.coordinate.longitude"
+ class="form-control"
+ ng-class="{'input-success': longitudeSaved}"
+ name="longitude"
+ d2-coordinate-validator
+ ng-blur="saveCoordinate('LNG')"
+ ng-disabled="currentEvent.enrollmentStatus !== 'ACTIVE' || currentEvent.editingNotAllowed"
+ ng-required="false"/>
+ <div ng-messages="outerForm.longitude.$error" ng-if="interacted(outerForm.longitude)" class="required" ng-messages-include="../dhis-web-commons/angular-forms/error-messages.html">
+ </div>
+ </div>
+</div>
+<!-- coordinates begin -->
\ No newline at end of file
=== added 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 1970-01-01 00:00:00 +0000
+++ dhis-2/dhis-web/dhis-web-apps/src/main/webapp/dhis-web-tracker-capture/components/dataentry/event-layout.html 2015-12-16 10:52:24 +0000
@@ -0,0 +1,46 @@
+<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 -->
+ <span class='pull-right'>
+
+ <span ng-if="stageNeedsEvent(stage) && selectedEnrollment.status === 'ACTIVE'">
+ <a href title="{{'create_new_event'| translate}}" ng-click="showCreateEvent(stage)" style="vertical-align:middle"><i class="fa fa-plus"></i></a>
+ </span>
+ </span>
+ <!-- event add/filter icon ends -->
+
+ </th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td ng-repeat="stage in programStages">
+ <div class="inline-block" ng-repeat="dhis2Event in eventsByStage[stage.id]">
+ <div class="event-container"
+ ng-class="getEventStyle(dhis2Event)"
+ ng-show="!currentPeriod[stage.id] || !filterEvents || currentPeriod[stage.id] && currentPeriod[stage.id].event === dhis2Event.event"
+ ng-click="showDataEntry(dhis2Event, false)">
+ {{dhis2Event.orgUnitName}}<br/>
+ {{dhis2Event.sortingDate}}<br>
+ <span ng-if="eventsByStage[stage.id].length > 1 && !filterEvents">[{{eventsByStage[stage.id].length - $index}}]</span>
+ </div>
+ </div>
+ <span ng-if="eventsByStage[stage.id].length > 1 && filterEvents">
+ <span ng-if="currentEvent.programStage !== stage.id">
+ <div class="event-paging">
+ <a href class="event-paging" ng-click="showDataEntryForEvent(eventsByStage[stage.id][0])">{{'show_more'| translate}}</a>
+ </div>
+ </span>
+ <event-paginator ng-if="stage.id === currentEvent.programStage"></event-paginator>
+ </span>
+ <div ng-if="!eventsByStage[stage.id] || eventsByStage[stage.id].length < 1">
+ <div class="alert alert-warning">{{'no_events_exist'| translate}}</div>
+ </div>
+ </td>
+ </tr>
+ </tbody>
+</table>
\ No newline at end of file
