{% include 'a_header.twig' %}


          <div class="row">
            <div class="col-md-12 col-sm-12 col-xs-12">
              <div class="x_panel">
                <div class="x_title">
                  <h2>Opciones grupos.</h2>
                  <div class="clearfix"></div>
                </div>
                <div class="x_content">

                  <form method="POST" data-parsley-validate class="form-horizontal form-label-left">
                    <div class="form-group">
                      <label class="control-label col-md-3 col-sm-3 col-xs-12" for="newgrp">Añadir grupo: </span>
                      </label>
                      <div class="col-md-6 col-sm-6 col-xs-12">
                        <input type="text" id="newgrp" name="newgrp" required="required" class="form-control col-md-7 col-xs-12">
                      </div>
                    </div>
                      <button type="submit" class="btn btn-primary">Añadir</button>

                  </form>
                </div>

                  <hr/>
                  <h3 class="text-muted font-13 m-b-30">
                    Tabla de grupos</code>
                  </h3>
                  <table id="datatable" class="table table-striped table-bordered">
                    <thead>
                      <tr>
                        <th># </th>
                        <th>Grupo </th>
                        <th>Acciones </th>
                      </tr>
                    </thead>

                    <tbody>
                    {% for group in groups %}
                    <tr>
                      <td>{{group.ID_G}}</td>
                      <td>{{group.Name}}</td>
                      <td>
                      <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-modal-changename_{{group.ID_G}}">Editar nombre</button>
                      <button type="button" class="btn btn-danger" data-toggle="modal" data-target=".bs-modal-delete_{{group.ID_G}}">Borrar</button>
                      </td>
                    </tr>
                    {% endfor %}
                    </tbody>
                  </table>

                  {% for group in groups %}
                    <div class="modal fade bs-modal-changename_{{group.ID_G}}" tabindex="-1" role="dialog" aria-hidden="true" style="display: none;">
                      <div class="modal-dialog modal-lg">
                        <form method="POST" action="?page=groups&id_g={{group.ID_G}}&do=changename" data-parsley-validate class="form-horizontal form-label-left">
                          <div class="modal-content">

                            <div class="modal-header">
                              <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span>
                              </button>
                              <h4 class="modal-title" id="myModalLabel">Cambiando el nombre de {{group.Name}}</h4>
                            </div>
                            <div class="modal-body"> 
                              <div class="form-group">
                                <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">Nuevo nombre: <span class="required">*</span>
                                </label>
                                <div class="col-md-6 col-sm-6 col-xs-12">
                                  <input type="text" id="name{{group.ID_G}}" name="name{{group.ID_G}}" required="required" class="form-control col-md-7 col-xs-12" value="{{group.Name}}">
                                </div>
                              </div>     
                            </div>
                            <div class="modal-footer">
                              <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
                              <button type="submit" class="btn btn-danger">Cambiar nombre</button>
                            </div>
                          </div>
                        </form>
                      </div>
                    </div>


                    <div class="modal fade bs-modal-delete_{{group.ID_G}}" tabindex="-1" role="dialog" aria-hidden="true" style="display: none;">
                      <div class="modal-dialog modal-lg">
                        <form method="POST" action="?page=groups&id_g={{group.ID_G}}&do=deletegrp" data-parsley-validate class="form-horizontal form-label-left">
                          <div class="modal-content">

                            <div class="modal-header">
                              <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span>
                              </button>
                              <h4 class="modal-title" id="myModalLabel">¿Borrar el grupo {{group.Name}}?</h4>
                            </div>
                            <div class="modal-body">      
                            </div>
                            <div class="modal-footer">
                              <button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
                              <button type="submit" class="btn btn-danger">Borrar</button>
                            </div>
                          </div>
                        </form>
                      </div>
                    </div>
                  {% endfor %}
              </div>
            </div>
            

          </div>


        </div>
        <!-- /page content -->


{% include 'a_footer.twig' %}