Skip to content

Commit

Permalink
#5 leverage template page for delete distribution
Browse files Browse the repository at this point in the history
  • Loading branch information
@rcmenno
rcmenno committed Nov 17, 2023
1 parent e918a53 commit d99d9bb
Show file tree
Hide file tree
Showing 3 changed files with 33 additions and 129 deletions.
3 changes: 1 addition & 2 deletions PWA/public/FetchEventHandlers/DeleteDistributionRequestHandler.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,7 @@ export class DeleteDistributionRequestHandler {
async handleEvent(event) {
try {
const distributions = await Database.instance.readDistributions();
console.log(distributions);
return ResponseTools.replaceTemplateKeysWithValues(await fetch(RouteEvents.deleteDistribution), {
return ResponseTools.replaceTemplateKeysWithValues(await ResponseTools.wrapInHtmlTemplate(fetch(RouteEvents.deleteDistribution)), {
columns: Distribution.colums,
rows: distributions
});
Expand Down
154 changes: 30 additions & 124 deletions PWA/public/list_distrib_delete.html
View file
Original file line number Diff line number Diff line change
@@ -1,129 +1,35 @@
<!DOCTYPE html>
<html>

<script type="text/javascript" src="/navbar-burger.js"></script>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>ReliefBox</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/css/bulma.min.css">
<style>
#noteligible {
background-color: #F53335 !important;
}
#eligible {
background-color: #03e03e !important;
}
.label[style*="color: white"] {
color: white !important;
font-weight: normal !important;
}
</style>
<script type="text/javascript">
function checkCookiesStats() {
if(navigator.cookieEnabled) {
document.getElementById("check-cookies").innerHTML="";
} else {
document.getElementById("check-cookies").innerHTML="You must enable cookies in your browser to use ReliefBox";
}
}
</script>
</head>

<body onload="checkCookiesStats()">
<section class="hero is-primary is-fullheight">

<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<!-- <a class="navbar-item">-->
<img src="images/ReliefBox-horizontal-nobackground.png" width="220" height="30">
<!-- </a>-->

<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>

<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-start">
<a href="/index.html" class="navbar-item">
Home
</a>

<a href="https://reliefbox.readthedocs.io/" class="navbar-item" target="_blank" rel="noopener noreferrer">
Documentation
</a>
<div class="column">
<div class="box">
<div class="columns">
{{#columns}}
<div class="column">
<label class="label is-medium">{{ . }}</label>
</div>
{{/columns}}
</div>
</nav>

<div class="hero-body">
<div class="container has-text-centered">

<div class="column is-4 is-offset-4">
<!-- <div class="box">-->
<!-- <div class="notification is-danger">-->
<label id="check-cookies" class="label is-medium" style="color:red; background-color:white"></label>
<!-- </div>-->
<!-- </div>-->
</div>

<div class="column">
<div class="box">
<div class="columns">
{{#columns}}
<div class="column">
<label class="label is-medium">{{ . }}</label>
</div>
{{/columns}}
</div>
{{#rows}}
<div class="columns">
<div class="column">
<form action="/delete_distrib_confirm" method="POST">
<div class="control" hidden>
<input id="select_distrib_id" class="input" type="text" name="distrib_id" value="{{ distrib_name }}">
</div>
<button class="button is-info is-small" style="font-size:100%">{{ distrib_name }}</button>
</form>
</div>
<div class="column">
<label class="label is-small" style="font-size:100%">{{ distrib_place }}</label>
</div>
<div class="column">
<label class="label is-small" style="font-size:100%">{{ distrib_date }}</label>
</div>
<div class="column">
<label class="label is-small" style="font-size:100%">{{ distrib_items }}</label>
</div>
<div class="column">
<label class="label is-small" style="font-size:100%">{{ distrib_donor }}</label>
</div>
</div>
{{/rows}}
{{#rows}}
<div class="columns">
<div class="column">
<form action="/delete_distrib_confirm" method="POST">
<div class="control" hidden>
<input id="select_distrib_id" class="input" type="text" name="distrib_id" value="{{ distrib_name }}">
</div>
</div>
</div>
</div>

<div class="hero-foot">
<nav class="navbar">
<div class="container">
<div id="navbarMenuHeroA" class="navbar-menu">
<div class="navbar-end" hidden>
<div class="navbar-item">
Built with love by &nbsp;<a href="https://www.510.global/"> <img src="/images/510logo.jpg"></a>
&nbsp; <a href="https://github.com/rodekruis/relief-app"> see the project on GitHub</a>.
</div>
</div>
</div>
<button class="button is-info is-small" style="font-size:100%">{{ distrib_name }}</button>
</form>
</div>
<div class="column">
<label class="label is-small" style="font-size:100%">{{ distrib_place }}</label>
</div>
</nav>
<div class="column">
<label class="label is-small" style="font-size:100%">{{ distrib_date }}</label>
</div>
<div class="column">
<label class="label is-small" style="font-size:100%">{{ distrib_items }}</label>
</div>
<div class="column">
<label class="label is-small" style="font-size:100%">{{ distrib_donor }}</label>
</div>
</div>
{{/rows}}
</div>
</section>
<script src="/app.js"></script>
</body>
</html>
</div>
5 changes: 2 additions & 3 deletions PWA/src/FetchEventHandlers/DeleteDistributionRequestHandler.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,9 @@ export class DeleteDistributionRequestHandler implements FetchEventHandler {

async handleEvent(event: FetchEvent): Promise<Response> {
try {
const distributions: [Distribution] = await Database.instance.readDistributions()
console.log(distributions)
const distributions: [Distribution] = await Database.instance.readDistributions()
return ResponseTools.replaceTemplateKeysWithValues(
await fetch(RouteEvents.deleteDistribution), {
await ResponseTools.wrapInHtmlTemplate(fetch(RouteEvents.deleteDistribution)), {
columns: Distribution.colums,
rows: distributions
})
Expand Down

0 comments on commit d99d9bb

Please sign in to comment.