add progression

templates/projet/_form.html.twig

@@ -0,0 +1,6 @@
+{{ form_start(form, {'action': action}) }}
+{{ form_widget(form) }}
+<div class="mt-3 text-end">
+    <button class="btn btn-success">Enregistrer</button>
+</div>
+{{ form_end(form) }}

templates/projet/_list.html.twig

@@ -0,0 +1,14 @@
+<table class="table">
+  <thead><tr><th>ID</th><th>Nom</th><th>Actions</th></tr></thead>
+  <tbody>
+    {% for projet in projets %}
+      <tr>
+        <td>{{ projet.id }}</td>
+        <td>{{ projet.nom }}</td>
+        <td>
+          <button data-bs-toggle="modal" data-bs-target="#modal" data-action="{{ path('projet_edit', {'id': projet.id}) }}">Edit</button>
+        </td>
+      </tr>
+    {% endfor %}
+  </tbody>
+</table>

templates/projet/crud.html.twig

@@ -0,0 +1,51 @@
+{% 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 %}