63 lines
2.3 KiB
HTML
63 lines
2.3 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block content %}
|
|
<section class="section">
|
|
<div class="container">
|
|
<h1 class="title">Bienvenue sur NenuScanner</h1>
|
|
{% if objects %}
|
|
<div class="content">
|
|
<p>Voici les objets existants dans la base de données :
|
|
<ul>
|
|
{% for object in objects %}
|
|
<li><a href="/object/{{ object.id }}">{{ object.name }}</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
{% else %}
|
|
<p>Il n'y a aucun objet pour le moment...</p>
|
|
{% endif %}
|
|
<button id="add-object" class="button is-link">Ajouter un nouvel objet</button>
|
|
<div id="add-object-modal" class="modal">
|
|
<div class="modal-background"></div>
|
|
<form action="/create-object/" method="POST">
|
|
<div class="modal-content">
|
|
<div class="field">
|
|
<label class="label">Nom de l'objet</label>
|
|
<div class="control">
|
|
<input class="input" type="text" name="name" placeholder="Nom de l'objet" required>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field is-grouped is-grouped-centered">
|
|
<div class="control">
|
|
<button class="button is-link">Créer un objet</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<button class="modal-close is-large" aria-label="close"></button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{% endblock content %}
|
|
|
|
{% block extrajs %}
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
let addObjectButton = document.getElementById('add-object');
|
|
let addObjectModal = document.getElementById('add-object-modal');
|
|
|
|
// Modal button show the modal
|
|
addObjectButton.addEventListener('click', () => {
|
|
addObjectModal.classList.add('is-active');
|
|
});
|
|
|
|
(document.querySelectorAll('.modal-background, .modal-close, .modal-card-head .delete, .modal-card-foot .button') || []).forEach((close) => {
|
|
close.addEventListener('click', () => {
|
|
addObjectModal.classList.remove('is-active');
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
{% endblock extrajs %}
|