  <div id="loader" class="loader" style="display:none;"></div>
  <?php
  $unit    = str_replace("'","`",(isset($_GET['unit'])) ? $_GET['unit'] : "");
  
  $qunit=mysqli_query($connect,"select * from tb_unit where id_unit='".$unit."'");
  $runit=mysqli_fetch_array($qunit);
  ?>

    <br>


    <section class="content">
      <div class="container-fluid">
        <div class="row">
          <div class="col-md-12">
            <div class="card card-info">
              <div class="card-header" style="background:#eb5d99;color:white;">
                <h3 class="card-title">Pretest - <?php echo $runit['judul_unit'];?></h3>
                

                <button data-unit="<?php echo $runit['id_unit'];?>" type="button" class="tambah btn btn-default btn-sm" style="margin-top:-1px;float:right;">
                  <i class="fas fa-plus-square"></i> &nbsp; Tambah
                </button>

                </form>

                


              </div>
              <!-- /.card-header -->
              <div class="card-body table-responsive p-0">
                <table class="table table-striped">
                  <thead>                  
                    <tr>
                      <th width="5%">No</th>
                      <th width="30%">Soal</th>
                      <th width="20%" style="text-align:right;">Pilihan</th>
                    </tr>
                  </thead>
                  <tbody>
                  <?php
                  $bilangan=1;
                  $q=mysqli_query($connect,"select * from tb_pretest where id_unit='".$runit['id_unit']."' order by id_pretest asc")or die(mysqli_error($connect));
                  while($r=mysqli_fetch_array($q)){

                  ?>
                    
                    <tr>
                      
                      <td align="center"><?php echo $bilangan++;?></td>
                      
                      <td>
                        <?php echo $r['soal'];?>
                      </td>

                    
                     
                      <td align="right">


                        <button title="Edit Soal" data-id="<?php echo $r['id_pretest'];?>" data-unit="<?php echo $runit['id_unit'];?>" class='edit btn btn-info btn-sm'>
                            <i class="fas fa-edit"></i>
                        </button>


                        <button title="Set Kunci Jawaban" data-id="<?php echo $r['id_pretest'];?>" data-unit="<?php echo $runit['id_unit'];?>" class='key btn btn-success btn-sm'>
                            <i class="fas fa-key"></i>
                        </button>
                        
                        

                        
                        <button data-id="<?php echo $r['id_pretest'];?>"  data-unit="<?php echo $runit['id_unit'];?>" class='hapus btn btn-danger btn-sm'>
                            <i class="fas fa-trash"></i>
                        </button>



                      </td>

                    </tr>

                    <?php }?>
                  </tbody>
                </table>


              </div>
            </div>
            <!-- /.card -->
            <!-- /.card -->
          </div>
          <!-- /.col -->
        </div>
      </div><!-- /.container-fluid -->
    </section>







        <div class="modal fade" id="tambah" role="dialog">
          <div class="modal-dialog modal-lg">
           <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title">Tambah Soal Pretest</h5>
              <button type="button" class="close" onclick="tutup()" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body" id="modal-body-tambah">
       
            </div>
           </div>
          </div>
         </div>


         <div class="modal fade" id="edit" role="dialog">
          <div class="modal-dialog modal-xl">
           <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title">Edit Soal Pretest</h5>
              <button type="button" class="close" onclick="tutup()" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body" id="modal-body-edit">
       
            </div>
           </div>
          </div>
         </div>



         <div class="modal fade" id="key" role="dialog">
          <div class="modal-dialog modal-xs">
           <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title">Set Kunci Jawaban</h5>
              <button type="button" class="close" onclick="tutup()" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body" id="modal-body-key">
       
            </div>
           </div>
          </div>
         </div>


 

         <div class="modal fade" id="hapus" role="dialog">
          <div class="modal-dialog">
           <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title">Hapus Soal Pretest ?</h5>
              <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body" id="modal-body-hapus">
       
            </div>
           </div>
          </div>
         </div>





          <style>
          .loader {
          position: fixed;
          left: 0px;
          top: 0px;
          width: 100%;
          height: 100%;
          z-index: 9999;
          background: url('assets/img/loading.gif') 50% 50%   no-repeat;    
          }
          </style>

          <script src="assets/js/jquery.min.js"></script>
          <script type='text/javascript'>
                  function tutup(){
                      location.reload();
                  }
                  
                  $(document).ready(function(){
                      
                   
                      

                      // MODAL TAMBAH TEMA
                      $('.tambah').click(function(){

                          $(".loader").show();
                          var unit = $(this).data('unit');

                          // AJAX request
                          $.ajax({
                              url: 'ajax/admin/pretest/tambah.php',
                              type: 'post',
                              data: {
                                  unit: unit
                              },
                              success: function(response){ 

                                  $('#modal-body-tambah').html(response); 
                                  $('#tambah').modal('show'); 
                                  $(".loader").hide();
                              }
                          });
                      });


                      // MODAL EDIT TEMA
                      $('.edit').click(function(){

                          $(".loader").show();
                          var id = $(this).data('id');
                          var unit = $(this).data('unit');
                          // AJAX request
                          $.ajax({
                              url: 'ajax/admin/pretest/edit.php',
                              type: 'post',
                              data: {
                                  id: id,
                                  unit: unit
                              },
                              success: function(response){ 

                                  $('#modal-body-edit').html(response); 
                                  $('#edit').modal('show'); 
                                  $(".loader").hide();
                              }
                          });
                      });





                      // MODAL EDIT TEMA
                      $('.key').click(function(){

                          $(".loader").show();
                          var id = $(this).data('id');
                          var unit = $(this).data('unit');
                          // AJAX request
                          $.ajax({
                              url: 'ajax/admin/pretest/key.php',
                              type: 'post',
                              data: {
                                  id: id,
                                  unit: unit
                              },
                              success: function(response){ 

                                  $('#modal-body-key').html(response); 
                                  $('#key').modal('show'); 
                                  $(".loader").hide();
                              }
                          });
                      });





                      // MODAL EDIT TEMA
                      $('.pembahasan').click(function(){

                          $(".loader").show();
                          var id = $(this).data('id');
                          var unit = $(this).data('unit');
                          // AJAX request
                          $.ajax({
                              url: 'ajax/admin/pretest/pembahasan.php',
                              type: 'post',
                              data: {
                                  id: id,
                                  unit: unit
                              },
                              success: function(response){ 

                                  $('#modal-body-pembahasan').html(response); 
                                  $('#pembahasan').modal('show'); 
                                  $(".loader").hide();
                              }
                          });
                      });


                     


                      // MODAL HAPUS TEMA
                      $('.hapus').click(function(){

                          $(".loader").show();
                          var id = $(this).data('id');
                          var unit = $(this).data('unit');
                          // AJAX request
                          $.ajax({
                              url: 'ajax/admin/pretest/hapus.php',
                              type: 'post',
                              data: {
                                  id: id,
                                  unit: unit
                              },
                              success: function(response){ 

                                  $('#modal-body-hapus').html(response); 
                                  $('#hapus').modal('show'); 
                                  $(".loader").hide();
                              }
                          });
                      });






                  });
          </script>

