Conservancy/reimbursinator
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'master' of https://github.com/danieldupriest/reimbursinator into delete_report_api

Browse source
This commit is contained in:
Rupika 2019-02-10 12:14:17 -08:00
commit b0f489bfeb
3 changed files with 97 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
front/static/edit_report.html
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>

70
front/static/js/viewHistory.js
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
});

19
front/static/new_report.html
View file

@ -36,8 +36,21 @@
</div>
</nav>
<div class="container pt-3">
<p>Create a new report</p>
</div>
<script src="js/logout.js"></script>
<div class="row">
<div class="col-sm-6 mx-auto">
<div class="card bg-light text-dark">
<div class="card-header">
<h3>Create a new report</h3>
<div class="form-group">
<label for="title">Report title:</label>
<input type="text" class="form-control" id="title">
</div>
<button type="button" class="btn btn-primary" herf="#Create">Create</button>
</div>
</div>
</div>
</div>
</div>
<script src="js/logout.js"></script>
</body>
</html>