Difference between revisions of "Edit dhis2 web pages"
|Line 56:||Line 56:|
Latest revision as of 13:58, 20 November 2013
If your project involves editing the existing DHIS2 web pages, rather than just making a downloadable web app, you should read the following.
DHIS2 uses Struts and Velocity to render web pages.
The Velocity templates have the extension *.vm and exist in the src/main/webapp/<project-name>/ directories.
Each web module is in a separate Maven project, so for example 'Tracker' is in 'dhis-web-caseentry', and the directory to find the .vm files is: src/main/webapp/dhis-web-casentry/
Make special HTML tags that are app-dependent hidden when the page loads, so that the page looks good also if the app isn't installed on the server.
As an example, if you want to make changes to the patient dashboard (in Tracker), you want to edit the patientDashboard.vm. If you want a new box after the three boxes on the existing screen, find the text in the page:
<td> <div class="link-area" style="width:120%"> <p class='header'> $i18n.getString("relationships")
Below the closing </td>, insert a new element. For example:
<td> <div id="applet1" class="link-area"> <p class='header'> A header </p> <div class="contentProviderTable"> Some content. </div> </div> </td>
In this case you also need to change the style="width:120%" in the div above so that it doesn't overlap with yours.
And then you add a script tag on the bottom of the page.
One example could be to insert into the .vm file:
$patient.name has uid = $patient.uid and $patient.organisationUnit.uid
<script> var patientName = $patient.name; var patientUid = $patient.uid; var orgunit = $patient.organisationUnit.uid; </script>
If you're editing the patientDashboard.vm file, you may want to insert this at the top, since the patient-variable is used for some other patients (relatives) later in the page.