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

Refactor event handlers and include classList polyfill

Browse source
This commit is contained in:
Preston Doman 2019-02-02 15:02:09 -08:00
parent 2a2f8011b9
commit 1066e50cc7
2 changed files with 20 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
front/static/edit_report.html
View file

@ -7,6 +7,7 @@
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/classlist/1.2.20171210/classList.min.js"></script>
<link rel="shortcut icon" href="img/favicon.ico"> <link rel="shortcut icon" href="img/favicon.ico">
<title>Reimbursinator</title> <title>Reimbursinator</title>
</head> </head>
@ -45,11 +46,13 @@
<div class="card-body"> <div class="card-body">
<table class="table table-striped table-responsive-sm" style="visibility:hidden"> <table class="table table-striped table-responsive-sm" style="visibility:hidden">
<thead> <thead>
<tr>
<th>Title</th> <th>Title</th>
<th>Date Created</th> <th>Date Created</th>
<th class="d-none d-lg-table-cell">State</th> <th class="d-none d-lg-table-cell">State</th>
<th class="d-none d-md-table-cell">Date Submitted</th> <th class="d-none d-md-table-cell">Date Submitted</th>
<th>Action</th> <th>Action</th>
</tr>
</thead> </thead>
<tbody> <tbody>
</tbody> </tbody>

25
front/static/js/viewHistory.js
View file

@ -80,12 +80,6 @@ function createFormGroup(key, field) {
formGroup.appendChild(label); formGroup.appendChild(label);
break; break;
case "date": case "date":
input.type = "datetime";
input.value = field.value;
input.classList.add("form-control");
formGroup.appendChild(label);
formGroup.appendChild(input);
break;
case "decimal": case "decimal":
input.type = "text"; input.type = "text";
input.value = field.value; input.value = field.value;
@ -172,7 +166,6 @@ function createEditReportForm(parsedData) {
accordion.classList.add("accordion"); accordion.classList.add("accordion");
accordion.id = "editReportAccordion"; accordion.id = "editReportAccordion";
// Traverse the report's sections array // Traverse the report's sections array
const sections = parsedData.sections; const sections = parsedData.sections;
for (let key in sections) { for (let key in sections) {
@ -259,9 +252,9 @@ function displayListOfReports(parsedData) {
if (state === "created") { if (state === "created") {
// Edit button // Edit button
dateSubmitted = "TBD"; dateSubmitted = "TBD";
actionButton.classList.add("btn-primary"); actionButton.classList.add("btn-primary", "edit-report-button"); // Add event listener class
actionButton.innerHTML = "Edit"; actionButton.innerHTML = "Edit";
actionButton.addEventListener("click", openEditReportForm); //actionButton.addEventListener("click", openEditReportForm);
} else { } else {
// View button // View button
dateSubmitted = new Date(reports[i].date_submitted).toLocaleDateString("en-US"); dateSubmitted = new Date(reports[i].date_submitted).toLocaleDateString("en-US");
@ -279,15 +272,17 @@ function displayListOfReports(parsedData) {
} }
} }
function getReportHistory(event) { document.addEventListener("DOMContentLoaded", function(event) {
const url = getEndpointDomain() + "api/v1/reports"; const url = getEndpointDomain() + "api/v1/reports";
getDataFromEndpoint(url, displayListOfReports); getDataFromEndpoint(url, displayListOfReports);
} });
function openEditReportForm(event) { document.addEventListener("click", function(event) {
const url = getEndpointDomain() + "api/v1/report/" + this.dataset.rid; if (event.target && event.target.classList.contains("edit-report-button")) {
console.log("Edit button clicked");
const url = getEndpointDomain() + "api/v1/report/" + event.target.dataset.rid;
getDataFromEndpoint(url, createEditReportForm); getDataFromEndpoint(url, createEditReportForm);
} }
// TODO: Add view report
document.addEventListener("DOMContentLoaded", getReportHistory); });