<?
session_start();
include"../plg/ses.php";
?>
<!DOCTYPE html>
<html>
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../plg/w3.css">
<body onload="dropFunction()">
<?include"../menu.php";?>
<hr/>
<div class="w3-container">

<div style="overflow:auto;width:100%;scrollbar-width: none;">
<form action="lemparkpiver2.php" method="post" id="lempar">
<table cellpadiing="0" cellspacing="0" style="width:100%">
  <tr>
    <th class="w3-small w3-blue w3-border w3-padding">NAMA</th>
    <th class="w3-small w3-blue w3-border">NIP</th>
    <th class="w3-small w3-blue w3-border">UNIT</th>
    <th class="w3-small w3-blue w3-border">JABATAN</th>
    <th class="w3-small w3-blue w3-border">LOKASI</th>
    <th class="w3-small w3-blue w3-border" style="display:none" id="hkpi">KPI SEMESTER</th>
  </tr>
  <tr>
    <td valign="top">
      <input type="text" id="nama" name="nama" class="w3-border w3-border-green w3-small w3-input " onclick="dropFunction()"
      style="width:300px;font-weight:bold;" readonly="true" placeholder="PILIH PEGAWAI DIBAWAH ..."/>
      <input type="hidden" name="nama2" id="nama2" readonly/>
    </td>
    <td valign="top">
      <input type="text" id="nip" name="nip" class="w3-border w3-small w3-input" onclick="" style="width:150px" readonly/>
    </td>
    <td valign="top">
      <input type="text" id="unit" name="unit" class="w3-border w3-small w3-input" onclick="" style="width:200px" readonly/>
    </td>
    <td valign="top">
      <input type="text" id="jab" name="jab" class="w3-border w3-small w3-input" rows="2" style="width:400px;" readonly/>
    </td>
    <td valign="top">
      <input type="text" id="loka" name="loka" class="w3-border w3-small w3-input" onclick="" style="width:200px;" readonly/>
      <input type="hidden" id="kodejab" name="kodejab"/>
    </td>
    <td valign="top" style="display:none" id="dkpi">
      <select class="w3-border-green w3-small w3-input" style="width:200px;font-weight:bold;text-align:center;display:;"
      onchange="tampilbtn()" id="selkpi" name="selkpi">
        <option>PILIH SEMESTER</option>
        <option>I - <?=date('Y')?></option>
      </select>
    </td>
  </tr>
</table>
</form>
</div>
<br/>
<center>
<div class="w3-btn w3-blue w3-small w3-round-large" id="tbkpi" style="display:none" onclick="lempar()">BUAT TABEL KPI</div>
<div class="w3-btn w3-red w3-small w3-round-large" id="tbkpi" style="display:" onclick="location.reload()">BATALKAN FORM</div>
</center>
<br/>

    <div class="w3-dropdown-content w3-bar-block w3-card w3-light-grey" id="myDIV"
    style="width:98%;overflow:scroll;height:70%;">
    <center>
      <input class="w3-input" type="text" placeholder="Cari Pegawai.." id="myInput"
      onkeyup="filterFunction()" style="width:500px;">
    </center>

      <table class="w3-table-all w3-margin-top" id="myTable" style="width:100%">
        <tr class="" style="position:">
          <th style="width:300px" class="w3-small">NAMA</th>
          <th style="width:150px" class="w3-small">NIP</th>
          <th style="width:200px" class="w3-small">UNIT</th>
          <th style="width:400px" class="w3-small">JABATAN</th>
          <th style="width:200px" class="w3-small">LOKASI</th>
          <th style="width:100px" class="w3-small">PILIH</th>
          <th style="display:none">
            <?
            include"../plg/kon.php";
            $sql1 = "select * from karyawan";
            $res1 = $conn->query($sql1);
            while($b = $res1->fetch_assoc()){
              //$b['nama'].$b['nip'].$b['unit'].$b['jab'].$b['lokasi'];
            }
            ?>
          </th>
        </tr>
        <?
        //include"../plg/kon.php";
        $sql = "select * from karyawan where del='0' and saverec='1'";
        $res = $conn->query($sql);
        while($a = $res->fetch_assoc()){
          $lokk = $a['lokasi'];
          $kj = $a['kodejab'];
        ?>
        <tr>
          <td class="w3-small" style="width:300px"><?=$a['nama']?></td>
          <td class="w3-small" style="width:150px"><?=$a['nip']?></td>
          <td class="w3-small" style="width:200px"><?=$a['unit']?></td>
          <td class="w3-small" style="width:400px"><?=$a['jab']?></td>
          <td class="w3-small" style="width:200px"><?=$lokk?></td>
          <td class="w3-small" style="width:100px"><div class="w3-btn w3-tiny w3-green w3-round-large"
            onclick="masukan('<?=$a['nama']?>','<?=$a['nip']?>','<?=$a['unit']?>','<?=$a['jab']?>','<?=$lokk?>','<?=$a['kodejab']?>')">PILIH</div></td>
        </tr>
        <?}?>
      </table>
    </div>



</div>

<script>
// Dropdown
function dropFunction() {
  var x = document.getElementById("myDIV");
  if (x.className.indexOf("w3-show") == -1) {
    x.className += " w3-show";
  } else {
    x.className = x.className.replace(" w3-show", "");
  }
}

// Filter
function filterFunction() {
  var input, filter, ul, li, a, i;
  input = document.getElementById("myInput");
  filter = input.value.toUpperCase();
  div = document.getElementById("myDIV");
  a = div.getElementsByTagName("tr");
  for (i = 0; i < a.length; i++) {
    txtValue = a[i].textContent || a[i].innerText;
    if (txtValue.toUpperCase().indexOf(filter) > -1) {
      a[i].style.display = "";
    } else {
      a[i].style.display = "none";
    }
  }
}

function masukan(a,b,c,d,e,f){
  document.getElementById('nama').value=a;
  document.getElementById('nama2').value=a;
  document.getElementById('nip').value=b;
  document.getElementById('unit').value=c;
  document.getElementById('jab').value=d;
  document.getElementById('loka').value=e;
  document.getElementById('kodejab').value=f;
  document.getElementById('hkpi').style="display:";
  document.getElementById('dkpi').style="display:";
  document.getElementById('nama').disabled=true;
  //dropFunction();
  //alert();

}

function tampilbtn(){
  sel = document.getElementById('selkpi').value;
  if(sel == 'PILIH SEMESTER'){
    document.getElementById('tbkpi').style="display:none";
  }else{
    document.getElementById('tbkpi').style="display:";
  }
}

function lempar(){
  var r = confirm("APAKAH DATA KPI AKAN DIBUAT ?...");
  if(r == true){
    document.getElementById('lempar').submit();
  }

}

</script>


</div>

</body>
</html>
