<head>
  
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-9C6BXEM9F9"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-9C6BXEM9F9');
</script>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale = 1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>

<!-- Bootstrap 3.3.5 -->
<link rel="stylesheet" href="<?php echo base_url(); ?>/assets/admin/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/default/easyui.css">

<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/color.css">
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/demo/demo.css">
<link rel="stylesheet" href="<?php echo base_url(); ?>/assets/admin/plugins/Font-Awesome/css/all.min.css">

<script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.min.js"></script>
<script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
<script src="<?php echo base_url(); ?>/assets/admin/bootstrap/js/bootstrap.min.js"></script>

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Marcellus&display=swap" rel="stylesheet">


<div class="boxdaftardetil" id="daftardetil">
    <center>
        <br/>
        <img src="/assets/images/<?php echo FLD_APP; ?>/swa_banhub_logo.png" width="100%">
        <div style="margin-top:10px;"></div>

        <span id="jdldaftardetil">
            <h2><?php echo "STATUS PENDAFTARAN<br/>SAAT INI" ?></h2>
        </span>
    </center>



    <center>    <span class="statusheader"><?php echo $balik==0 ? "Daftar Pemudik" :"Daftar Arus Balik"; ?></b></span></center>

    <div class="boxinfod"></div>
    <div id="qranda"></div>

<!--
    <center>    <span class="statusheader">Ingin membatalkan Pesanan :</b><br/></span></center>
    Silakan klik tombol berikut, jika ternyata Anda ingin membatalkan <?php //echo $balik==0 ?  "perjalanan Mudik" : "perjalanan arus balik"; ?> anda dengan <b>PEDA MATENG</b>

    <center>
                        <div style="margin-top:30px"></div>
                        <a href="#" onclick="batalpesan('<?php //echo $koded; ?>','<?php //echo $balik; ?>')">
                            <button id="batalpesan" type="button" class="btn btn-danger" style="font-size:20px;width:200px;border-radius:20px;">Batalkan Pesanan</button></a>
                    </center>

-->


                    <center>
            <div style="margin-top:10px"></div>
            <a href="#" onclick="batalkan()">
                <button id="bataldetil" type="button" class="btn btn-secondary" style="font-size:20px;width:200px;border-radius:20px;background-color:#ccc;">Tutup</button></a>
        </center>


</div>
<input type="hidden" id="tj" name="tj">
<input type="hidden" id="jml" name="jml">

<script>
    $(document).ready(function() {
        cekdata('<?php echo $nowa; ?>', '<?php echo $nik; ?>','<?php echo $balik; ?>');

    });


    function cekdata(k, n,balik) {
//        alert('nik '+n+' nowa '+ k);
        $.ajax({
            type: 'post',
            url: "/cekkoded",
            data: {
                "<?= csrf_token() ?>": "<?= csrf_hash() ?>",
                thenik: n,
                thenowa: k,
                thecap : '111',
                balik:balik
            },
            success: function(data) {
                var rsp = $.parseJSON(data);

                $('.boxinfod').html(rsp.pemudikall);
                          $('#statusnow').html(rsp.statusnow);
                          var html = '<b>e-TIKET Telah Terbit</b><br/>';
                          html += 'Silakan diunduh. Saat daftar ulang silakan tunjukkan e-tiket melalui pdf/aplikasi ataupun dalam bentuk print out<br/><br/>';
                          html += '<center><a href="/etiketcetak/'+ rsp.koded+'"><button type="button" class="btn btn-warning">unduh e-TIKET</button></a></center><br/>';

                          $.each(rsp.dataqr, function(index, val) {
                            html += '<center><a href="/assets/etiket/'+val['etiket']+'.png" target="_blank"><img src="'+'/assets/etiket/'+val['etiket']+'.png" width="140px"></img></a><br/><br/><br/></center>';

                            });

                          html += '<B><?php echo $balik==0 ? "TUJUAN":"ASAL" ?> : '+rsp.dataqr[0]['tujuan']+'<br/>';
                          html += '<B>NOMOR BUS : '+rsp.dataqr[0]['nobus']+'<br/>';
                          html += '<B>NAMA BUS : '+rsp.dataqr[0]['namabus']+'<br/>';
                          html += '<B>NO POL BUS : '+rsp.dataqr[0]['nopol']+'<br/>';
                          html += '<B>BERANGKAT : '+rsp.dataqr[0]['berangkat_tgl']+'<br/>';

              			  if(balik == '0')	
              			  html += '<B>TEMPAT KUMPUL : '+rsp.dataqr[0]['tempatkumpul']+'<br/>';
						  else 
              			  html += '<B>TUJUAN : '+rsp.dataqr[0]['tempatkumpul']+'<br/>';
                            
              
                          $('#qranda').html(html);

                $('.boxinfod').html(rsp.pemudikall);
                $('#tj').val(rsp.tujuan);
                $('#jml').val(rsp.jumlah);


            }

        });

    }

    function batalkan()
    {
        window.location.replace("https://pedamateng.penghubung.jatengprov.go.id/swa");

    }

    function batalpesan(k,balik){
        alert("Anda sudah tidak dapat membatalkan pesanan");
    }    
    function batalpesanORI(k,balik){


            $.messager.confirm('Confirm','Kalau anda yakin ingin membatalkan pesanan, silakan klik tombol "OK"?',function(r){
                if (r){
                    $.post('/batalpesan',{j:$('#jml').val(),t:$('#tj').val(),k:k,balik:balik,"<?= csrf_token() ?>": "<?= csrf_hash() ?>"},function(result){
                        if (result.success){
                            batalkan();
                            hitungkuota();
 
                        } else {
                            $.messager.show({    // show error message
                                title: 'Error',
                                msg: result.errorMsg
                            });
                        }
                    },'json');
                }
            });
        }


        function hitungkuota() {
           $.ajax({
               type: 'post',
               url: "<?php echo base_url(); ?>/hitungkuota",
               data: {
                   "<?= csrf_token() ?>": "<?= csrf_hash() ?>"
               },
               success: function(data) {
                   var rsp = $.parseJSON(data);
                   if (rsp.kuota > 0)
                       $('.boxinfo').html("<center><br/>Saat ini masih tersedia kuota untuk :<br/><b>" + rsp.kuota + " orang</b></center>");
                   else {
                       $('.boxinfo').html("<center>Selamat Datang di PEDA MATENG<br/>Saat ini kuota telah Habis, silakan akses di lain waktu untuk melihat kemungkinan adanya penambahan kuota</b></center>");

                   }
               }

           });

       }        

</script>



<style>
    body {
        background-color: #B90049 !important;
        color : #fff !important;
    }
    .nodaf {
        font-size: 20px;
        color: #666;
        text-align: center;
        font-weight: bold;
    }

    table.pdftr {
        border-style: solid;
        border-width: 2px;
        border-color: #ccc;
        background-color: #DAC787;
        padding: 10px;
    }

    table.pdftr td {
        border-style: solid;
        border-width: 2px;
        border-color: #ccc;
        padding: 10px;
    }

    .checkbox {
        display: inline-flex;
        cursor: pointer;
        position: relative;
    }

    .checkbox>span {
        color: #34495E;
        padding: 0.5rem 0.25rem;
    }



    .checkbox>input {
        height: 25px;
        width: 25px;
        -webkit-appearance: none;
        -moz-appearance: none;
        -o-appearance: none;
        appearance: none;
        border: 1px solid #34495E;
        border-radius: 4px;
        outline: none;
        transition-duration: 0.3s;
        background-color: #41B883;
        cursor: pointer;
    }

    .checkbox>input:checked {
        border: 1px solid #41B883;
        background-color: #34495E;
    }

    .checkbox>input:checked+span::before {
        content: '\2713';
        display: block;
        text-align: center;
        color: #41B883;
        position: absolute;
        left: 0.7rem;
        top: 0.2rem;
    }

    .checkbox>input:active {
        border: 2px solid #34495E;
    }

    .nodaf {
        font-size: 40px;
        color: #666;
        text-align: center;
        font-weight: bold;
    }

    .statusheader {
        text-align: center;
        font-size: 18px;
        font-weight: bold;
        margin-top: 25px;
        margin-bottom: 20px;
        background-color: rgba(242,224,184,0.8);
        width: 100%;
        float:left;
    }
    


</style>