{# skill/index.html.twig #}

{% extends 'base.html.twig' %}

{% block page %}
  <form name="form" action='{{ asset("skill") }}'>
    <input type="hidden" id="CSRFSession" value='{{ CSRFSession }}'/>
    <table>
      <tr valign="top">
        <td style ="width:270px;">
          <h3 style="margin-top:0px;"> Liste des activités </h3>
        </td>
        <td>
          <input type="button" value="Ajouter" id="ajouter" onclick="location.href='{{asset('skill/add')}}'" class='ui-button'/>
        </td>
      </tr>
    </table>
  </form>
  <table class='CJDataTable' data-sort='[1,"asc"]'>
    <thead>
      <tr>
        <th class="dataTableNoSort">&nbsp;</th>
        <th> Nom de l'activité </th>
      </tr>
    </thead>
    <tbody>
      {% for s in skills %}
        <tr>
          <td>
            <input type="hidden" name="skill_name" value="{{ s.nom }}"/>
            <a href='{{ asset("skill/") }}{{ s.id }}'>
              <span class="pl-icon pl-icon-edit" title="Modifier"></span>
            </a>
            {% if s.id in usedSkills == false %}
              &nbsp;&nbsp;
              <span id='{{ s.id }}' class="pl-icon pl-icon-drop pointer" title="Supprimer" onclick="confirmDel(this.id)">
                <script>
                  function confirmDel(id){
                    if (window.confirm("Voulez-vous vraiment supprimer cette activité ?")){
                      CSRFToken = $('#CSRFSession').val();
                      $.ajax({
                        url : '{{ asset("skill") }}',
                        type : 'DELETE',
                        data : {id: id, CSRFToken: CSRFToken},
                        success: function(response){
                          if (response == "Ok"){
                            window.location.reload('/skill');
                          }
                        },
                        error: function(){
                          CJInfo("Une erreur est survenue lors de la suppression","error")
                        }
                      });
                    }
                  }
                </script>
              </span>
            {% endif %}
          </td>
          <td>{{ s.nom }}</td>
        </tr>
      {% endfor %}
    </tbody>
  </table>
{% endblock %}