Display completed report. Login and go to report history and click on "view" button and the report will display

This commit is contained in:
Jack 2019-02-08 17:26:45 -08:00
parent d4c972e5d9
commit af2d748536
2 changed files with 59 additions and 1 deletions

View file

@ -81,6 +81,20 @@
</div>
</div>
</div>
<div class="modal" id="viewReportModal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="viewReportModalLabel"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-view">
</div>
</div>
</div>
</div>
<script src="js/logout.js"></script>
<script src="js/viewHistory.js"></script>
</body>

View file

@ -254,6 +254,8 @@ function displayListOfReports(parsedData) {
dateSubmitted = new Date(reports[i].date_submitted).toLocaleDateString("en-US");
actionButton.classList.add("btn-success", "view-report-button");
actionButton.innerHTML = "View";
actionButton.setAttribute("data-toggle", "modal");
actionButton.setAttribute("data-target", "#viewReportModal");
}
let dateSubmittedCell = bodyRow.insertCell(3);
@ -267,8 +269,50 @@ function displayListOfReports(parsedData) {
}
function displayReport(parsedData){
window.alert(parsedData.date_created); //Able to get the correct report ID now just needs to display the
//Able to get the correct report ID now just needs to display the
//report as an modual
const modalBody = document.querySelector(".modal-view");
const modalLabel = document.querySelector("#viewReportModalLabel");
while (modalBody.firstChild) {
modalBody.removeChild(modalBody.firstChild);
}
// Add report title and date
const reportTitle = parsedData.title;
const dateCreated = new Date(parsedData.date_created).toLocaleDateString("en-US");
modalLabel.innerHTML = reportTitle + " " + dateCreated;
const card = document.createElement("div");
card.classList.add("card");
const cardHeader = document.createElement("div");
cardHeader.classList.add("card-header");
const cardBody = document.createElement("div");
cardBody.classList.add("card-body");
const sections = parsedData.sections;
for (let key in sections) {
let section = sections[key];
const h4 = document.createElement("h4");
const value = document.createTextNode(section.title);
h4.appendChild(value);
cardBody.appendChild(h4);
let fields = section.fields;
for (let key in fields) {
let field = fields[key];
const p1 = document.createElement("p");
const p1Value = document.createTextNode(field.label + ": " +field.value);
p1.appendChild(p1Value);
cardBody.appendChild(p1);
}
cardHeader.appendChild(cardBody);
card.appendChild(cardHeader);
}
modalBody.appendChild(card);
}
document.addEventListener("DOMContentLoaded", function(event) {