52 lines
1.9 KiB
Twig
52 lines
1.9 KiB
Twig
|
{% extends 'base.html.twig' %}
|
||
|
|
{% block body %}
|
||
|
|
<div class="container mt-4">
|
||
|
|
<h1>Gestion des projets</h1>
|
||
|
|
<button class="btn btn-primary mb-3" id="btnAdd">+ Nouveau projet</button>
|
||
|
|
|
||
|
|
<table class="table table-bordered">
|
||
|
|
<thead><tr><th>ID</th><th>Nom</th><th>Statut</th><th>Actions</th></tr></thead>
|
||
|
|
<tbody>
|
||
|
|
{% for projet in projets %}
|
||
|
|
<tr>
|
||
|
|
<td>{{ projet.id }}</td>
|
||
|
|
<td>{{ projet.nom }}</td>
|
||
|
|
<td>{{ projet.statut }}</td>
|
||
|
|
<td>
|
||
|
|
<button class="btn btn-warning btn-edit" data-url="{{ path('projet_edit', {'id': projet.id}) }}">Modifier</button>
|
||
|
|
<form style="display:inline" method="post" action="{{ path('projet_delete', {'id': projet.id}) }}">
|
||
|
|
<button class="btn btn-danger" onclick="return confirm('Supprimer ?')">Supprimer</button>
|
||
|
|
</form>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
{% endfor %}
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="modal fade" id="crudModal" tabindex="-1">
|
||
|
|
<div class="modal-dialog"><div class="modal-content">
|
||
|
|
<div class="modal-header"><h5 class="modal-title">Formulaire</h5></div>
|
||
|
|
<div class="modal-body" id="modal-body"></div>
|
||
|
|
</div></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
document.addEventListener('click', async e => {
|
||
|
|
if(e.target.id === 'btnAdd'){
|
||
|
|
const res = await fetch('{{ path("projet_new") }}');
|
||
|
|
const html = await res.text();
|
||
|
|
document.getElementById('modal-body').innerHTML = html;
|
||
|
|
new bootstrap.Modal(document.getElementById('crudModal')).show();
|
||
|
|
}
|
||
|
|
if(e.target.classList.contains('btn-edit')){
|
||
|
|
const url = e.target.dataset.url;
|
||
|
|
const res = await fetch(url);
|
||
|
|
const html = await res.text();
|
||
|
|
document.getElementById('modal-body').innerHTML = html;
|
||
|
|
new bootstrap.Modal(document.getElementById('crudModal')).show();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
{% endblock %}
|