2924 ordernar cronometro arrastando (#2930)

* Add ordenação do cronometro arrastando Fix #2924

* Add informação de sucesso para o usuario

* Arrumando recomendações relatadas no PR

* Arrumando js relatado no PR

sapl/painel/urls.py

@@ -4,7 +4,7 @@ from .apps import AppConfig
 from .views import (cronometro_painel, get_dados_painel, painel_mensagem_view,
                     painel_parlamentar_view, painel_view, painel_votacao_view,
                     switch_painel, verifica_painel, votante_view, CronometroPainelCrud,
-                    PainelConfigCrud, painel_parcial_view)
+                    PainelConfigCrud,ordena_cronometro, painel_parcial_view)
 
 app_name = AppConfig.name
 
@@ -23,6 +23,7 @@ urlpatterns = [
     url(r'^painel/cronometro$', cronometro_painel, name='cronometro_painel'),
     
     url(r'^sistema/cronometro/', include(CronometroPainelCrud.get_urls())),
+    url(r'^sistema/ordena_cronometro/', ordena_cronometro, name='ordena_cronometro'),
     url(r'^sistema/painel-config/', include(PainelConfigCrud.get_urls())),
 
     url(r'^voto-individual/$', votante_view,

sapl/painel/views.py

@@ -32,9 +32,19 @@ VOTACAO_NOMINAL = 2
 class CronometroPainelCrud(CrudAux):
     model = Cronometro
 
+    class ListView(CrudAux.ListView):
+        template_name = "painel/cronometro_list.html"
+        
     class BaseMixin(CrudAux.BaseMixin):
         form_class = CronometroForm
 
+def ordena_cronometro(request):
+    ordem = request.POST.getlist("ordem", [])
+    for index, o in enumerate(ordem, 1):
+        c = Cronometro.objects.get(id=o)
+        c.ordenacao = index
+        c.save()
+    return JsonResponse({'type':'success','msg':'Ordem alterada com sucesso.'})
 
 class PainelConfigCrud(CrudAux):
     model = PainelConfig
@@ -715,3 +725,4 @@ def get_dados_painel(request, pk):
 
     # Retorna que não há nenhuma matéria já votada ou aberta
     return response_nenhuma_materia(get_presentes(pk, response, None))
+

sapl/templates/painel/cronometro_list.html

@@ -0,0 +1,99 @@
+{% extends "crud/list_tabaux.html" %}
+{% load i18n %}
+{% load i18n common_tags crispy_forms_tags%}
+
+{% block container_table_list %}
+
+  {% if not rows %}
+    <p>{{ NO_ENTRIES_MSG }}</p>
+  {% else %}
+    <div class="container-table">
+      <div class="result-count">{% blocktrans with verbose_name_plural=view.verbose_name_plural %}Total de {{ verbose_name_plural }}: <strong>{{count}}</strong>{% endblocktrans %}</div>
+      <table class="table table-striped table-hover table-link-ordering">
+        <thead>
+          <tr>
+            {% for name in headers %}
+              <th>
+                    {{ name }}
+              </th>
+            {% endfor %}
+            <th></th>
+          </tr>
+        </thead>
+      <tbody id="sortable">
+        {% for o in object_list %}
+        <tr data-value='{{o.id}}'>
+
+          <td>
+            <a href='/sistema/cronometro/{{o.id}}'>{{o}}</a>
+          </td>
+          <td>
+            {{o.duracao_cronometro}}
+          </td>
+          <td>
+            {% if o.ativo %}Sim{% else %}Não{% endif %}
+          </td>
+          <td>
+            <spam><b>{{o.ordenacao}}</b></spam>
+          </td>
+          <td>
+            <spam class="ui-icon ui-icon-arrowthick-2-n-s"></spam>
+          </td>
+        </tr>
+        {% endfor %}
+      
+      </tbody>
+      </table>
+    </div>
+  {% endif %}
+
+{% endblock container_table_list %}
+
+
+{% block extra_js %}
+    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
+    <script>
+        $(function() { 
+                var divNova = $('<div></div>')
+                divNova.innerText = "";
+                divNova.addClass('alert alert-success')
+                divNova.attr("style", "margin-left:190px;margin-right:190px")
+                divNova[0].style.visibility = "hidden"
+                
+                var list = $("#content");
+                list[0].insertBefore(divNova[0], list[0].childNodes[0]);
+                
+                $( "#sortable" ).sortable({
+                    beforeStop: function( event, ui ) {
+                      var order = []
+                      $("#sortable tr").each((index,obj) => {
+                        if($(obj).data('value')){
+                          order.push($(obj).data('value'))
+                        }
+                      })
+
+                      $.ajax({
+	                        data: {ordem:order},
+	                        type: 'POST',
+	                        url: "{% url 'sapl.painel:ordena_cronometro' %}",
+                          traditional: true,
+	                        headers: {
+                                'X-CSRFToken': getCookie('csrftoken')
+                          },
+                          success: function(data){
+          						      var msg = data;
+                            $( "#sortable tr td spam b" ).each(function(index,obj) {
+                              $(obj).text(index+1);
+                            });
+                            divNova[0].style.visibility = "visible"
+                            divNova[0].innerText = data['msg'];
+                          },
+	                      });
+                    }
+                });
+
+                $( "#sortable" ).disableSelection();
+        }); 
+    </script>
+{% endblock %}