52 lines
1.6 KiB
HTML
52 lines
1.6 KiB
HTML
|
{% extends "base.html" %}
|
||
|
|
{% block content %}
|
||
|
|
<div class="columns">
|
||
|
|
<div class="column col-md-12 col-mx-auto col-4">
|
||
|
|
<h1>Welkom {{user.username}}!</h1>
|
||
|
|
<h2>Voeg een nieuw feest toe</h2>
|
||
|
|
<div>
|
||
|
|
<label for="party_name">Feest Naam:</label>
|
||
|
|
<input type="text" id="party_name" name="party_name" placeholder="Feest Naam">
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<button class="btn btn-primary" id="add_party">Voeg toe</button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<h2>Kies een al bestaand feest</h2>
|
||
|
|
|
||
|
|
{% for party in parties %}
|
||
|
|
<div class="column col-12 bg-secondary text-primary text-center"><a href="/party/{{ party.id }}"
|
||
|
|
class="text-large">{{ party.name }}</a></div>
|
||
|
|
{% if !loop.last %}
|
||
|
|
<div class="divider text-center"></div>
|
||
|
|
{% endif %}
|
||
|
|
|
||
|
|
{% else %}
|
||
|
|
<div class="column col-12 bg-secondary text-primary text-center">
|
||
|
|
<p class="text-large">Nog geen feesten aangemaakt!</p>
|
||
|
|
</div>
|
||
|
|
{% endfor %}
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
document.getElementById("add_party").addEventListener("click", function () {
|
||
|
|
var party_name = document.getElementById("party_name").value;
|
||
|
|
fetch("/api/party", {
|
||
|
|
method: "POST",
|
||
|
|
headers: {
|
||
|
|
"Content-Type": "application/json"
|
||
|
|
},
|
||
|
|
body: JSON.stringify({
|
||
|
|
name: party_name
|
||
|
|
})
|
||
|
|
}).then(function (response) {
|
||
|
|
return response.json();
|
||
|
|
}).then(function (data) {
|
||
|
|
window.location.href = "/party/" + data.id;
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
</script>
|
||
|
|
{% endblock %}
|