Merge pull request #63: Added View Report functionality

CheckingViewReport
This commit is contained in:
Daniel Dupriest 2019-02-09 15:07:02 -08:00 committed by GitHub
commit 7a52211ad2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 81 additions and 3 deletions

Binary file not shown.

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

@ -252,8 +252,10 @@ function displayListOfReports(parsedData) {
} else {
// View button
dateSubmitted = new Date(reports[i].date_submitted).toLocaleDateString("en-US");
actionButton.classList.add("btn-success");
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);
@ -266,6 +268,63 @@ function displayListOfReports(parsedData) {
}
}
function displayReport(parsedData){
//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 displayTable = document.createElement("table");
displayTable.classList.add("table table-striped table-responsive-sm");
displayTable.style.visibility = "visible";
cardBody.appendChild(displayTable);
*/
const sections = parsedData.sections;
for (let key in sections) {
let section = sections[key];
if(section.completed) {
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) {
const url = getEndpointDomain() + "api/v1/reports";
getDataFromEndpoint(url, displayListOfReports);
@ -277,6 +336,11 @@ document.addEventListener("click", function(event) {
const url = getEndpointDomain() + "api/v1/report/" + event.target.dataset.rid;
getDataFromEndpoint(url, createEditReportForm);
}
// TODO: Add view report
if(event.target && event.target.classList.contains("view-report-button"))
{
console.log("View button clicked");
const url = getEndpointDomain() + "api/v1/report/" + event.target.dataset.rid;
getDataFromEndpoint(url, displayReport);
}
// TODO: Add View Report
});