dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #19437
[Branch ~dhis2-devs-core/dhis2/trunk] Rev 8469: Create a dynamic design form which works well with many resolution of screen ( Person dashboard ).
------------------------------------------------------------
revno: 8469
committer: Tran Chau <tran.hispvietnam@xxxxxxxxx>
branch nick: dhis2
timestamp: Thu 2012-10-11 10:29:05 +0700
message:
Create a dynamic design form which works well with many resolution of screen ( Person dashboard ).
modified:
dhis-2/dhis-web/dhis-web-caseentry/src/main/webapp/dhis-web-caseentry/patientDashboard.vm
dhis-2/dhis-web/dhis-web-caseentry/src/main/webapp/dhis-web-caseentry/style/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-caseentry/src/main/webapp/dhis-web-caseentry/patientDashboard.vm'
--- dhis-2/dhis-web/dhis-web-caseentry/src/main/webapp/dhis-web-caseentry/patientDashboard.vm 2012-10-09 03:53:11 +0000
+++ dhis-2/dhis-web/dhis-web-caseentry/src/main/webapp/dhis-web-caseentry/patientDashboard.vm 2012-10-11 03:29:05 +0000
@@ -4,213 +4,206 @@
» <a href="javascript:dashboardHistoryToggle();" >$i18n.getString( 'history' )</a>
</h3>
-<table>
+<table class='mainPageTable'>
<tr>
- <td valign='top'>
- <table>
- <tr>
- <td>
- <div class="link-area">
- <table width='100%'>
- <tr><th>
- $i18n.getString("demographics")
- <a href="javascript:showUpdatePatientForm( '$patient.id', true );"><span class='bold'>«$i18n.getString("edit_profile")»</span></a>
- #if( $auth.hasAccess( "dhis-web-caseentry", "getPatientLocation" ) )
- <a href="javascript:getPatientLocation( '$patient.id', true );"><span class='bold'> «$i18n.getString("change_location")»</span></a>
- #end
- </th></tr>
- </table>
- <div class="contentProviderTable">
- <table width='100%'>
- <tr>
- <td>$i18n.getString("full_name")</td>
- <td>$!patient.getFullName()</td>
- </tr>
- <tr>
- <td>$i18n.getString("location")</td>
- <td>$!patient.organisationUnit.name</td>
- </tr>
- <tr>
- <td>$i18n.getString("gender")</td>
- <td>$i18n.getString($!patient.gender)</td>
- </tr>
- <tr>
- <td>$i18n.getString("date_of_birth")</td>
- <td>$format.formatDate( $!patient.birthDate) $!patient.getAge()</td>
- </tr>
- <tr>
- <td>$i18n.getString("phone_number")</td>
- <td>
- #if($!patient.phoneNumber && $!patient.phoneNumber!='')
- $!patient.phoneNumber
- #else
- [$i18n.getString('none')]
- #end
- </td>
- </tr>
- <tr>
- <td>$i18n.getString("health_worker")</td>
- <td>
- #if($!patient.healthWorker )
- $!patient.healthWorker.name
- #else
- [$i18n.getString('none')]
- #end
- </td>
- </tr>
- #foreach( $identifier in $identifiers )
- <tr>
- #if($!identifier.identifierType)
- <td>$identifier.identifierType.name</td>
- #else
- <td>$i18n.getString("system_identifier")</td>
- #end
- <td>$identifier.identifier</td>
- </tr>
- #end
- #foreach( $attributeValue in $attributeValues )
- <tr>
- <td>$attributeValue.patientAttribute.name</td>
- <td>
- #if($attributeValue.patientAttribute.valueType=='YES/NO')
- #if($attributeValue.value=='true')
- $i18n.getString("yes")
- #else
- $i18n.getString("no")
- #end
- #elseif($attributeValue.patientAttribute.valueType=='DATE')
- $format.formatDate( $attributeValue.value )
- #else
- $attributeValue.value
- #end
- </td>
- </tr>
- #end
- </table>
- </div>
- </div>
- </td>
- <td>
- <div class="link-area" style='height:120px;'>
- <table width='100%'>
- <tr><th>
- $i18n.getString("active_programs")
- <a href='javascript:showProgramEnrollmentForm( "$patient.id" )'><span class='bold'>«$i18n.getString("enroll_program")»</span></a>
- </th>
- </tr>
- </table>
- <div class="contentProviderTable" style='height:76px;'>
- <table width='100%' id='activeTB' name='activeTB'>
- #foreach( $programInstance in $activeProgramInstances )
- #set($programStageInstanceId = '')
- #if($programInstance.program.type==2)
- #foreach( $programStageInstance in $programInstance.programStageInstances)
- #set($programStageInstanceId = $programStageInstance.id)
- #end
- #end
-
- #set($flag = 'false')
- #foreach( $programStageInstance in $programInstance.programStageInstances )
- #set( $status = $programStageInstance.getEventStatus() )
- #if( $status!=1 && $status!=5 && $flag=='false')
- <tr id='tr1_$programInstance.id' type='$programInstance.program.type'
- programStageInstanceId='$programStageInstanceId' style='cursor:pointer;'
- onclick='javascript:loadActiveProgramStageRecords("$programInstance.id", "$programStageInstance.id")' >
- <td id='td_$programInstance.id'>
- <a><span id='infor_$programInstance.id'>$programInstance.program.name ($format.formatDate($programInstance.enrollmentDate))</span></a>
- </td>
- </tr>
- #if($programInstance.program.type==1)
- <tr>
- <td id='tr2_$programInstance.id' onclick='javascript:loadActiveProgramStageRecords("$programInstance.id", "$programStageInstance.id")' style='cursor:pointer;'>
- <a>>> $programStageInstance.programStage.name ($format.formatDate($programStageInstance.dueDate))</a>
- </td>
- </tr>
- #end
- #set($flag = 'true')
- #end
- #end
- #if($flag=='false')
- <tr id='tr1_$programInstance.id' type='$programInstance.program.type'
- programStageInstanceId='$programStageInstanceId' style='cursor:pointer;'
- onclick='javascript:loadActiveProgramStageRecords("$programInstance.id", false)' >
- <td id='td_$programInstance.id'>
- <a><span id='infor_$programInstance.id'>$programInstance.program.name ($format.formatDate($programInstance.enrollmentDate))</span></a>
- </td>
- </tr>
- #end
- #end
- #foreach($program in $singlePrograms)
- <tr id='tr_$program.id' name='tr_$program.id' style='cursor:pointer;'
- onclick='javascript:saveSingleEnrollment("$patient.id","$program.id")' >
- <td>
- <a><span id='infor_$program.id'></span></a>
- <script>
- var infor = "$program.name" + " (" + getCurrentDate() + ")";
- setInnerHTML("infor_$program.id", infor);
- </script>
- </td>
- </tr>
- <tr style='cursor:pointer;'>
- <td id='tr2_$programInstance.id'></td>
- </tr>
- #end
- </table>
- </div>
- </div>
-
- <div class="link-area" style='height:50px;'>
- <table width='100%'>
- <tr><th>$i18n.getString("completed_programs")</th></tr>
- <tr>
- <td>
- <select id="completedList" name="completedList" onchange="javascript:loadActiveProgramStageRecords(this.value);" style="width:100%">
- <option value="">[$i18n.getString("please_select")]</option>
- #foreach($programInstance in $completedProgramInstances)
- #set($programStageInstanceId = '')
- #if($programInstance.program.type==2)
- #foreach( $programStageInstance in $programInstance.programStageInstances)
- #set($programStageInstanceId = $programStageInstance.id)
- #end
- #end
- <option value="$programInstance.id" type='$programInstance.program.type'>$programInstance.program.name ($format.formatDate($programInstance.enrollmentDate))</option>
- #end
- </select>
- </td>
- </tr>
- </table>
- </div>
- </td>
- <td>
- <div class="link-area">
- <table width='100%'>
- <tr><th>
- $i18n.getString("relationships")
- <a href="javascript:setFieldValue( 'isShowPatientList', 'false' ); showRelationshipList( '$patient.id' );"><span class='bold'>«$i18n.getString("management")»</span></a>
- <a href="javascript:showAddRelationshipPatient( '$patient.id', false );"><span class='bold'> «$i18n.getString("add_new_patient")»</span></a>
- </th></tr>
- </table>
- <div class="contentProviderTable">
- <table width='100%'>
- #foreach( $rel in $relationship )
- #if($rel.patientA.id==$patient.id)
- <tr onclick="showPatientDashboardForm($rel.patientB.id)" title='$i18n.getString( "move_to_dashboard_of" ) $rel.patientB.getFullName()'>
- <td><a href='#'>$rel.relationshipType.bIsToA</a></td>
- <td><a href='#'>$rel.patientB.getFullName()</a></td>
- </tr>
- #else
- <tr onclick="showPatientDashboardForm($rel.patientA.id)" title='$i18n.getString( "move_to_dashboard_of" ) $rel.patientB.getFullName()'>
- <td><a href='#'>$rel.relationshipType.aIsToB</a></td>
- <td><a href='#'>$rel.patientA.getFullName()</a></td>
- </tr>
- #end
- #end
- </table>
- </div>
- </div>
- </td>
- </tr>
- </table>
+ <td width='33%'>
+ <div class="link-area">
+ <table width='100%'>
+ <tr><th>$i18n.getString("demographics")</th></tr>
+ <tr><th>
+ <a href="javascript:showUpdatePatientForm( '$patient.id', true );"><span class='bold'>«$i18n.getString("edit_profile")»</span></a>
+ #if( $auth.hasAccess( "dhis-web-caseentry", "getPatientLocation" ) )
+ <a href="javascript:getPatientLocation( '$patient.id', true );"><span class='bold'> «$i18n.getString("change_location")»</span></a>
+ #end
+ </th></tr>
+ </table>
+ <div class="contentProviderTable">
+ <table width='100%'>
+ <tr>
+ <td>$i18n.getString("full_name")</td>
+ <td>$!patient.getFullName()</td>
+ </tr>
+ <tr>
+ <td>$i18n.getString("location")</td>
+ <td>$!patient.organisationUnit.name</td>
+ </tr>
+ <tr>
+ <td>$i18n.getString("gender")</td>
+ <td>$i18n.getString($!patient.gender)</td>
+ </tr>
+ <tr>
+ <td>$i18n.getString("date_of_birth")</td>
+ <td>$format.formatDate( $!patient.birthDate) $!patient.getAge()</td>
+ </tr>
+ <tr>
+ <td>$i18n.getString("phone_number")</td>
+ <td>
+ #if($!patient.phoneNumber && $!patient.phoneNumber!='')
+ $!patient.phoneNumber
+ #else
+ [$i18n.getString('none')]
+ #end
+ </td>
+ </tr>
+ <tr>
+ <td>$i18n.getString("health_worker")</td>
+ <td>
+ #if($!patient.healthWorker )
+ $!patient.healthWorker.name
+ #else
+ [$i18n.getString('none')]
+ #end
+ </td>
+ </tr>
+ #foreach( $identifier in $identifiers )
+ <tr>
+ #if($!identifier.identifierType)
+ <td>$identifier.identifierType.name</td>
+ #else
+ <td>$i18n.getString("system_identifier")</td>
+ #end
+ <td>$identifier.identifier</td>
+ </tr>
+ #end
+ #foreach( $attributeValue in $attributeValues )
+ <tr>
+ <td>$attributeValue.patientAttribute.name</td>
+ <td>
+ #if($attributeValue.patientAttribute.valueType=='YES/NO')
+ #if($attributeValue.value=='true')
+ $i18n.getString("yes")
+ #else
+ $i18n.getString("no")
+ #end
+ #elseif($attributeValue.patientAttribute.valueType=='DATE')
+ $format.formatDate( $attributeValue.value )
+ #else
+ $attributeValue.value
+ #end
+ </td>
+ </tr>
+ #end
+ </table>
+ </div>
+ </div>
+ </td>
+ <td width='33%'>
+ <div class="link-area" style='height:120px;'>
+ <table width='100%'>
+ <tr><th>$i18n.getString("active_programs")</th></tr>
+ <tr><th>
+ <a href='javascript:showProgramEnrollmentForm( "$patient.id" )'><span class='bold'>«$i18n.getString("enroll_program")»</span></a>
+ </th></tr>
+ </table>
+ <div class="contentProviderTable" style='height:76px;'>
+ <table width='100%' id='activeTB' name='activeTB'>
+ #foreach( $programInstance in $activeProgramInstances )
+ #set($programStageInstanceId = '')
+ #if($programInstance.program.type==2)
+ #foreach( $programStageInstance in $programInstance.programStageInstances)
+ #set($programStageInstanceId = $programStageInstance.id)
+ #end
+ #end
+
+ #set($flag = 'false')
+ #foreach( $programStageInstance in $programInstance.programStageInstances )
+ #set( $status = $programStageInstance.getEventStatus() )
+ #if( $status!=1 && $status!=5 && $flag=='false')
+ <tr id='tr1_$programInstance.id' type='$programInstance.program.type'
+ programStageInstanceId='$programStageInstanceId' style='cursor:pointer;'
+ onclick='javascript:loadActiveProgramStageRecords("$programInstance.id", "$programStageInstance.id")' >
+ <td id='td_$programInstance.id'>
+ <a><span id='infor_$programInstance.id'>$programInstance.program.name ($format.formatDate($programInstance.enrollmentDate))</span></a>
+ </td>
+ </tr>
+ #if($programInstance.program.type==1)
+ <tr>
+ <td id='tr2_$programInstance.id' onclick='javascript:loadActiveProgramStageRecords("$programInstance.id", "$programStageInstance.id")' style='cursor:pointer;'>
+ <a>>> $programStageInstance.programStage.name ($format.formatDate($programStageInstance.dueDate))</a>
+ </td>
+ </tr>
+ #end
+ #set($flag = 'true')
+ #end
+ #end
+ #if($flag=='false')
+ <tr id='tr1_$programInstance.id' type='$programInstance.program.type'
+ programStageInstanceId='$programStageInstanceId' style='cursor:pointer;'
+ onclick='javascript:loadActiveProgramStageRecords("$programInstance.id", false)' >
+ <td id='td_$programInstance.id'>
+ <a><span id='infor_$programInstance.id'>$programInstance.program.name ($format.formatDate($programInstance.enrollmentDate))</span></a>
+ </td>
+ </tr>
+ #end
+ #end
+ #foreach($program in $singlePrograms)
+ <tr id='tr_$program.id' name='tr_$program.id' style='cursor:pointer;'
+ onclick='javascript:saveSingleEnrollment("$patient.id","$program.id")' >
+ <td>
+ <a><span id='infor_$program.id'></span></a>
+ <script>
+ var infor = "$program.name" + " (" + getCurrentDate() + ")";
+ setInnerHTML("infor_$program.id", infor);
+ </script>
+ </td>
+ </tr>
+ <tr style='cursor:pointer;'>
+ <td id='tr2_$programInstance.id'></td>
+ </tr>
+ #end
+ </table>
+ </div>
+ </div>
+
+ <div class="link-area" style='height:50px;'>
+ <table width='100%'>
+ <tr><th>$i18n.getString("completed_programs")</th></tr>
+ <tr>
+ <td>
+ <select id="completedList" name="completedList" onchange="javascript:loadActiveProgramStageRecords(this.value);" style="width:100%">
+ <option value="">[$i18n.getString("please_select")]</option>
+ #foreach($programInstance in $completedProgramInstances)
+ #set($programStageInstanceId = '')
+ #if($programInstance.program.type==2)
+ #foreach( $programStageInstance in $programInstance.programStageInstances)
+ #set($programStageInstanceId = $programStageInstance.id)
+ #end
+ #end
+ <option value="$programInstance.id" type='$programInstance.program.type'>$programInstance.program.name ($format.formatDate($programInstance.enrollmentDate))</option>
+ #end
+ </select>
+ </td>
+ </tr>
+ </table>
+ </div>
+ </td>
+ <td width='33%'>
+ <div class="link-area">
+ <table width='100%'>
+ <tr><th>$i18n.getString("relationships")</th></tr>
+ <tr><th>
+ <a href="javascript:setFieldValue( 'isShowPatientList', 'false' ); showRelationshipList( '$patient.id' );"><span class='bold'>«$i18n.getString("management")»</span></a>
+ <a href="javascript:showAddRelationshipPatient( '$patient.id', false );"><span class='bold'> «$i18n.getString("add_new_patient")»</span></a>
+ </th></tr>
+ </table>
+ <div class="contentProviderTable">
+ <table width='100%'>
+ #foreach( $rel in $relationship )
+ #if($rel.patientA.id==$patient.id)
+ <tr onclick="showPatientDashboardForm($rel.patientB.id)" title='$i18n.getString( "move_to_dashboard_of" ) $rel.patientB.getFullName()'>
+ <td><a href='#'>$rel.relationshipType.bIsToA</a></td>
+ <td><a href='#'>$rel.patientB.getFullName()</a></td>
+ </tr>
+ #else
+ <tr onclick="showPatientDashboardForm($rel.patientA.id)" title='$i18n.getString( "move_to_dashboard_of" ) $rel.patientB.getFullName()'>
+ <td><a href='#'>$rel.relationshipType.aIsToB</a></td>
+ <td><a href='#'>$rel.patientA.getFullName()</a></td>
+ </tr>
+ #end
+ #end
+ </table>
+ </div>
+ </div>
</td>
</tr>
</table>
=== modified file 'dhis-2/dhis-web/dhis-web-caseentry/src/main/webapp/dhis-web-caseentry/style/style.css'
--- dhis-2/dhis-web/dhis-web-caseentry/src/main/webapp/dhis-web-caseentry/style/style.css 2012-10-06 14:34:31 +0000
+++ dhis-2/dhis-web/dhis-web-caseentry/src/main/webapp/dhis-web-caseentry/style/style.css 2012-10-11 03:29:05 +0000
@@ -196,7 +196,7 @@
padding-left:1px;
padding-bottom:0px;
height:120px;
- width:350px;
+ width:100%;
overflow:hidden;
position:relative;
}
@@ -209,7 +209,7 @@
padding-left:1px;
padding-bottom:0px;
height:172px;
- width:350px;
+ width:100%;
overflow:hidden;
position:relative;
}
@@ -217,7 +217,7 @@
.contentProviderTable
{
height: 122px;
- width: 350px;
+ width: 100%;
overflow-y: auto;
overflow-x:hidden;
}