  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
            <h1>Perfiles</h1>
          </div>
          <div class="col-sm-6">
            <ol class="breadcrumb float-sm-right">
              <li class="breadcrumb-item"><a href="#">Home</a></li>
              <li class="breadcrumb-item"><a href="#">Configuración</a></li>
              <li class="breadcrumb-item"><a href="#">Perfiles</a></li>
              <!--<li class="breadcrumb-item active">Opción</li>-->
            </ol>
          </div>
        </div>
      </div><!-- /.container-fluid -->
    </section>

    <!-- Modal perfiles -->
    <div class="modal fade" id="modal_perfiles" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
      <div class="modal-dialog modal-lg">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Nuevo perfil</h5>   
          </div>
          <div class="modal-body">
            <form class="form-horizontal" autocomplete="off"> 
              <div class="row">

                <label class="control-label col-sm-12">Descripción</label>
                <div class="form-group col-sm-8">
                  <div>
                    <input type="text" class="form-control text-uppercase" name="descripcion_perfil" id="descripcion_perfil">
                  </div>
                </div>
                <div class="form-group col-sm-2">
                  <!-- <label for="permisos" class="col-sm-1 col-form-label"></label> -->
                  <div class="form-control custom-switch ml-4" style="border: none;">
                    <input type="checkbox" class="custom-control-input" name="estado_perfil" id="estado_perfil" onclick="checkbox_select('estado_perfil', 'estado_perfil', '');">
                    <label class="custom-control-label" for="estado_perfil"></label>
                  </div>
                </div>
                <div class="pt-2 col-sm-2" id="msj_estado_perfil">Inactivo</div>
              </div>
            </form>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-success" data-dismiss="modal">Cerrar <i class="fas fa-times ml-3"></i></button>
            <button type="button" class="btn btn-success" onclick="registraPerfil('<?php echo $_GET['id_usuario'] ?>', 'registrar_perfil', '../controlador/perfil.controlador.php');">Guardar <i class="far fa-save ml-3"></i></button>
          </div>
        </div>
      </div>
    </div>

    <!-- Main content -->
    <section class="content">

      <div class="container-fluid">
        <div class="row">
          <div class="col-12">
            <!-- Default box -->
            <div class="card">
              <!-- <div class="card-header">
                <h3 class="card-title">Opción no disponible</h3>

                <div class="card-tools">
                  <button type="button" class="btn btn-tool" data-card-widget="collapse" data-toggle="tooltip" title="Collapse">
                    <i class="fas fa-minus"></i></button>
                  <button type="button" class="btn btn-tool" data-card-widget="remove" data-toggle="tooltip" title="Remove">
                    <i class="fas fa-times"></i></button>
                </div>
              </div> -->
              <form class="form-horizontal" action="" method="post" autocomplete="off" id="frm_perfil">  
                <div class="card-body">
                  <?php 
                    require_once "../../controlador/perfil.controlador.php";

                    $perfiControlador = new ControladorPerfil();
                    $perfiles = $perfiControlador->ctrConsultaPerfiles();

                   ?>
                  <div class="row">
                    <button type="button" class="btn btn-success col-sm-12 mb-3" data-toggle="modal" data-target="#modal_perfiles">Crear perfil <i class="fas fa-plus ml-2"></i></button>
                    <div class="table-responsive">
                      <table class="table">
                        <thead class="text-left">
                          <tr style="border: none;">
                            <th class="h5">Id</th>
                            <th class="h5">Descripción</th>
                            <th class="h5 text-center" colspan="2">Estado</th>
                            <th class="h5 text-center">Actualizar</th>
                          </tr>
                        </thead>
                        <tbody>
                          <?php 

                            // Variable definir si un proceso está seleccionado o no.
                            $checked = '';
                            $estadotexto = '';
                            foreach ($perfiles as $perfil) { 
                              // Si el estado del proceso iterado es la variable checked almacena es string que posteriormente será impreso como atributo en el checkbox
                              if($perfil['estado'] == 1){
                              
                                $checked = 'checked=""';
                                $estadotexto = 'Activo';

                              }else{

                                $checked = '';
                                $estadotexto = 'Inactivo';
                              
                              }
                            ?>

                            <tr>
                              <td><?php echo $perfil['id'] ?></td>
                              <td>
                                <input type="text" class="form-control text-uppercase" name="descripcion<?php echo $perfil['id'] ?>" id="descripcion<?php echo $perfil['id'] ?>" value="<?php echo utf8_encode($perfil['descripcion']) ?>" placeholder="Descripción de perfil">
                              </td>
                              <td class="text-center">
                                <div class="form-group row">
                                  <!-- <label for="permisos" class="col-sm-1 col-form-label"></label> -->
                                  <div class="form-control custom-switch ml-4" style="border: none;">
                                    <input type="checkbox" class="custom-control-input" name="customSwitperfil<?php echo $perfil['id'] ?>" id="customSwitperfil<?php echo $perfil['id'] ?>" <?php echo $checked ?> onclick="checkbox_select('customSwitperfil<?php echo $perfil['id'] ?>', 'msj_checkbox_<?php echo $perfil['id'] ?>', '<?php echo $perfil['id'] ?>');">
                                    <label class="custom-control-label" for="customSwitperfil<?php echo $perfil['id'] ?>"></label>
                                  </div>
                                </div>
                              </td>
                              <td style="width: 40px;">
                                  <div class="pt-2" id="msj_checkbox_<?php echo $perfil['id'] ?>"><?php echo $estadotexto ?></div>
                              </td>
                              <td class="text-center">
                                <button class="btn btn-success" type="button" onclick="actualizaPerfil('<?php echo $perfil['id'] ?>', 'descripcion<?php echo $perfil['id'] ?>', 'customSwitperfil<?php echo $perfil['id'] ?>', '<?php echo $_GET['id_usuario'] ?>', 'actualizar_perfil', '../controlador/perfil.controlador.php');"><i class="far fa-save m-2 fa-lg"></i></button>
                              </td>
                            </tr>
                          <?php } ?>  
                        </tbody>
                      </table>
                    </div>
                  </div>
                </div>
                <!-- /.card-body -->
                <div class="card-footer text-right">
                 
                </div>
              </form>  
              <!-- /.card-footer-->
            </div>
            <!-- /.card -->
          </div>
        </div>
      </div>
    </section>
    <!-- /.content -->
  </div>