Create modal to show timeline details (#499)

secultce · Jan 9, 2025 · 48ea63a · 48ea63a
1 parent fe45aa4
commit 48ea63a
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 6 deletions.
diff --git a/cypress/e2e/admin/agents/agent-timeline.cy.js b/cypress/e2e/admin/agents/agent-timeline.cy.js
@@ -14,7 +14,7 @@ describe('Painel de Controle - Página de timeline de Agentes', () => {
         cy.get('tbody > tr > :nth-child(2)').contains(/\d{2}\/\d{2}\/\d{4}/).should('be.visible');
         cy.get('tbody > tr > :nth-child(3)').contains('unknown').should('be.visible');
         cy.get(':nth-child(5) > .btn').contains('Detalhes').should('be.visible')
-        
+
         cy.get(':nth-child(1) > :nth-child(5) > .btn').click();
         cy.get('.modal-body > .table > thead > tr > :nth-child(2)').contains('De');
         cy.get('.modal-body > .table > thead > tr > :nth-child(3)').contains('Para');

diff --git a/cypress/e2e/admin/space/space-timeline.cy.js b/cypress/e2e/admin/space/space-timeline.cy.js
@@ -1,17 +1,23 @@
 describe('Painel de Controle - Página de timeline dos Espaços', () => {
     beforeEach(() => {
         cy.viewport(1920, 1080);
-        cy.login('alessandrofeitoza@example.com', 'Aurora@2024');
-        cy.visit('/painel/espacos/69461af3-52f2-4c6b-ad30-ce92e478e9bd/timeline');
+        cy.login('henriquelopeslima@example.com', 'Aurora@2024');
+        cy.visit('painel/espacos/608756eb-4830-49f2-ae14-1160ca5252f4/timeline');
     });
 
-    it('Garante que a página de timeline dos espaços existe', () => {
-        cy.get('h2').contains('Espaços - SECULT - Timeline').should('be.visible');
+    it('Garante que a página de timeline dos espaços existe e que exibe os detalhes corretamente', () => {
+        cy.get('h2').contains('Espaços - Galeria Caatinga - Timeline').should('be.visible');
         cy.get('.d-flex > div > .btn').contains('Voltar').should('be.visible');
 
         cy.get('tr > :nth-child(1) > a').contains('The resource was created').should('be.visible');
         cy.get('tbody > tr > :nth-child(2)').contains(/\d{2}\/\d{2}\/\d{4}/).should('be.visible');
         cy.get('tbody > tr > :nth-child(3)').contains('unknown').should('be.visible');
         cy.get(':nth-child(5) > .btn').contains('Detalhes').should('be.visible')
+
+        cy.get(':nth-child(1) > :nth-child(5) > .btn').click();
+        cy.get('.modal-body > .table > thead > tr > :nth-child(2)').contains('De');
+        cy.get('.modal-body > .table > thead > tr > :nth-child(3)').contains('Para');
+        cy.get('#modal-timeline-table-body > :nth-child(2) > :nth-child(2)').contains('N/A');
+        cy.get('#modal-timeline-table-body > :nth-child(2) > :nth-child(3)').contains('Galeria Caatinga');
     });
 });
diff --git a/templates/_admin/space/timeline.html.twig b/templates/_admin/space/timeline.html.twig
@@ -4,6 +4,7 @@
 
 {% block content %}
     {% include '_components/modal-confirm-remove.html.twig' %}
+    {% include "_components/modal-timeline.html.twig" %}
 
     <section class="d-flex">
         {% include "_components/side-bar.html.twig" %}
@@ -41,7 +42,12 @@
                                     <td>{{ item.device }}</td>
                                     <td></td>
                                     <td>
-                                        <a href="{{ path('admin_space_timeline', {id: space.id}) }}" class="btn btn-outline-dark btn-sm">{{ 'details'|trans }}</a>
+                                        <button type="button" class="btn btn-outline-dark btn-sm"
+                                                data-bs-toggle="modal"
+                                                data-bs-target="#modal-timeline"
+                                                onclick="openModal({{ item.from | json_encode() }}, {{ item.to | json_encode() }})">
+                                            {{ 'details' | trans }}
+                                        </button>
                                     </td>
                                 </tr>
                             {% endfor %}
@@ -53,3 +59,7 @@
         </div>
     </section>
 {% endblock %}
+{% block extra_javascripts %}
+    {{ parent() }}
+    <script src="{{ asset('js/modal-timeline.js') }}"></script>
+{% endblock %}