<link href="<?php echo $base?>plugins/daterangepicker/daterangepicker-bs3.css" rel="stylesheet" type="text/css" />
<link href="<?php echo $base?>plugins/iCheck/all.css" rel="stylesheet" type="text/css" />
<link href="<?php echo $base?>plugins/timepicker/bootstrap-timepicker.min.css" rel="stylesheet"/>
<script src="<?php echo $base?>plugins/input-mask/jquery.inputmask.js" type="text/javascript"></script>
<script src="<?php echo $base?>plugins/input-mask/jquery.inputmask.date.extensions.js" type="text/javascript"></script>
<script src="<?php echo $base?>plugins/input-mask/jquery.inputmask.extensions.js" type="text/javascript"></script>
<script src="<?php echo $base?>plugins/daterangepicker/daterangepicker.js" type="text/javascript"></script>
<script src="<?php echo $base?>plugins/timepicker/bootstrap-timepicker.min.js" type="text/javascript"></script>
<script src="<?php echo $base?>plugins/iCheck/icheck.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="<?php echo $base?>plugins/autocomplete/shieldui-all.css" />
<link href="<?php echo $base?>bootstrap/css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">
<script type="text/javascript" src="<?php echo $base?>bootstrap/js/bootstrap-datetimepicker.js" charset="UTF-8"></script>
<script type="text/javascript" src="<?php echo $base?>bootstrap/js/locales/bootstrap-datetimepicker.id.js" charset="UTF-8"></script>
<script type="text/javascript" src="<?php echo $base?>plugins/autocomplete/shieldui-all.min.js"></script>
<script type="text/javascript">
	function angubah() {
  		var ang1 = document.getElementById('ang1').value;
		var ang2 = document.getElementById('ang2').value;
		var ang3 = document.getElementById('ang3').value;
		var ang4 = document.getElementById('ang4').value;
		var ang5 = document.getElementById('ang5').value;
		var ang6 = document.getElementById('ang6').value;
		var ang7 = document.getElementById('ang7').value;
		var ang8 = document.getElementById('ang8').value;
		var ang9 = document.getElementById('ang9').value;
		var ang10 = document.getElementById('ang10').value;
		var ang11 = document.getElementById('ang11').value;
		var ang12 = document.getElementById('ang12').value;
		var ang13 = document.getElementById('ang13').value;
	
		if(ang1 > 0){	
			$('#dp1').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp1').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang2 > 0){	
			$('#dp2').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp2').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang3 > 0){	
			$('#dp3').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp3').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang4 > 0){	
			$('#dp4').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp4').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang5 > 0){	
			$('#dp5').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp5').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang6 > 0){	
			$('#dp6').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp6').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang7 > 0){	
			$('#dp7').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp7').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang8 > 0){	
			$('#dp8').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp8').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang9 > 0){	
			$('#dp9').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp9').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang10 > 0){	
			$('#dp10').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp10').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang11 > 0){	
			$('#dp11').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp11').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang12 > 0){	
			$('#dp12').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp12').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if(ang13 > 0){	
			$('#dp13').css({"background-color": "#00a65a", "color": "#FFF"});
		}else{
			$('#dp13').css({"background-color": "#f4f4f4", "color": "#555"});
		}
		
		if($('#pmi').prop('checked')==true) {
			
			if(ang1 >0 ){ ang1 = parseFloat(ang1) + 1000; }
			if(ang2 >0 ){ ang2 = parseFloat(ang2) + 1000; }
			if(ang3 >0 ){ ang3 = parseFloat(ang3) + 1000; }
			if(ang4 >0 ){ ang4 = parseFloat(ang4) + 1000; }
			if(ang5 >0 ){ ang5 = parseFloat(ang5) + 1000; }
			if(ang6 >0 ){ ang6 = parseFloat(ang6) + 1000; }
			if(ang7 >0 ){ ang7 = parseFloat(ang7) + 1000; }
			if(ang8 >0 ){ ang8 = parseFloat(ang8) + 1000; }
			if(ang9 >0 ){ ang9 = parseFloat(ang9) + 1000; }
			if(ang10 >0 ){ ang10 = parseFloat(ang10) + 1000; }
			if(ang11 >0 ){ ang11 = parseFloat(ang11) + 1000; }
			if(ang12 >0 ){ ang12 = parseFloat(ang12) + 1000; }
			if(ang13 >0 ){ ang13 = parseFloat(ang13) + 1000; }
		}

		
		var total = parseFloat(ang1) + parseFloat(ang2) + parseFloat(ang3) + parseFloat(ang4) + parseFloat(ang5) + parseFloat(ang6) + parseFloat(ang7) + parseFloat(ang8) + parseFloat(ang9) + parseFloat(ang10) + parseFloat(ang11) + parseFloat(ang12) + parseFloat(ang13);
		
		$('#totalhide').val(total);
		//alert(total);
		var total = total.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
		$("#total").html("Rp. "+total);
	}
</script>
<SCRIPT LANGUAGE="JavaScript">
<!--
function format_num(id) {
		var fnf = document.getElementById("bayar");
		if (isNaN(fnf)) {
			fnf.addEventListener('keyup', function(evt){
				var n = parseInt(this.value.replace(/\D/g,''),10);
				fnf.value = n.toLocaleString();
			}, false);
		}
		
			var bayar = document.getElementById("bayar").value.replace(/,/g, '');
			var total = document.getElementById('totalhide').value;

		   if (bayar > 0){
				var susuk = parseFloat(bayar) - parseFloat(total);
				document.getElementById('kembali').value = susuk.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
		   }else{
				document.getElementById('kembali').value = 0;
			}

    }
//-->
</SCRIPT>
<aside class="right-side">                
                <section class="content-header">
                    <h1>
                        Pembelian Tiket
                    </h1>
                    <ol class="breadcrumb">
                        <li><a href="home"><i class="fa fa-dashboard"></i> Home</a></li>
                        <li><a href="#">Tiket</a></li>
                        <li class="active">Transaksi Pembelian Tiket</li>
                    </ol>
                </section>

                <!-- Main content -->
                <section class="content">
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="box">
                               <?php
								$idjadwal = $xcode;

							    	if($idjadwal==""){
	
								?> 
									<script>window.location = "<?php echo $base?>daftar-jadwal"</script>
                                <?php
                                }
				    include("config/connection.php");
              		$sql ="select tb_jadwal.*, DATE_FORMAT(tb_jadwal.tanggal,'%d-%m-%Y') as tgl, tb_kapal.Nama as namakapal, tb_nahkoda.Nahkoda, pDari.Nama as dari, pTujuan.Nama as tujuan, tb_jenis_kapal.Jenis
							from tb_jadwal inner join tb_kapal on tb_jadwal.Id_Kapal = tb_kapal.Id_Kapal
							inner join tb_nahkoda on tb_jadwal.Id_Nahkoda = tb_nahkoda.Id_Nahkoda
							inner join tb_pelabuhan pDari on (pDari.Id_Pelabuhan = tb_jadwal.Dari)
							inner join tb_pelabuhan pTujuan on (pTujuan.Id_Pelabuhan = tb_jadwal.Tujuan)
							inner join tb_jenis_kapal on tb_kapal.Id_Jenis = tb_jenis_kapal.Id
							where tb_jadwal.Status = '1' and tb_jadwal.Id_Jadwal = '".$idjadwal."'";
					$hasil = mysql_query($sql) or die("Kesalahan Pada SQL");
					mysql_close($test);
					
					$row = mysql_fetch_object($hasil);
						$id = $row->Id_Jadwal;
						$namakapal = $row->namakapal;
						$Nahkoda = $row->Nahkoda;
						$dari = $row->dari;
						$tujuan = $row->tujuan;
						$Kuota_Order = $row->Kuota_Order;
						$Sisa = $row->Sisa;
						$tanggal = $row->tgl;
						$Waktu = $row->Waktu;
						$Jenis = $row->Jenis;
						
			?>
        <div class="box-body">
            <form class="form-horizontal" role="form" method="POST" enctype="multipart/form-data" action="<?php echo $base?>order-tiket-proses">
        	<div class="col-sm-4">
				<?php  
                    include("config/connection.php");
                    $sql ="select tb_angkutan.*, tb_detil_angkutan_def.harga from tb_angkutan inner join tb_detil_angkutan_def on tb_detil_angkutan_def.id_angkutan = tb_angkutan.id_angkutan ";
                    $hasil = mysql_query($sql) or die("Kesalahan Pada SQL");
                    mysql_close($test);
                    
                    while($row = mysql_fetch_object($hasil)){
                        $id_angkutan = $row->id_angkutan;
                        $namaangkutan = $row->nama;
                        $harga = $row->harga;
                ?>
            	<div class="input-group" style="margin-bottom:10px; width:100%">
                	<span class="input-group-addon" id="dp<?php echo $id_angkutan?>" <?php if($id_angkutan == '1'){?> style="width:55%; background-color:#00a65a; color:#FFF" <?php }else{?> style="width:55%;" <?php } ?>><?php echo $namaangkutan?></span>
                    <select name="nama<?php echo $id_angkutan?>" class="form-control" style="width:45%" id="ang<?php echo $id_angkutan?>" onchange="angubah();">
                    	<?php 
							if($id_angkutan == '1'){
								echo '<option value="'.$harga * 1 .'" selected>1</option>';
							}
						?>
                        <option value="<?php echo $harga * 0?>">0</option>
                        <option value="<?php echo $harga * 1?>">1</option>
                        <option value="<?php echo $harga * 2?>">2</option>
                        <option value="<?php echo $harga * 3?>">3</option>
                        <option value="<?php echo $harga * 4?>">4</option>
                        <option value="<?php echo $harga * 5?>">5</option>
                        <option value="<?php echo $harga * 6?>">6</option>
                        <option value="<?php echo $harga * 7?>">7</option>
                        <option value="<?php echo $harga * 8?>">8</option>
                        <option value="<?php echo $harga * 9?>">9</option>
                        <option value="<?php echo $harga * 10?>">10</option>
                    </select>
              	</div>
                <?php } ?>
            </div>
            <div class="col-sm-8">
                                <h5 style="float:right; width:100%; text-align:right; padding-right:30px;"><?php echo "Tanggal : ".$tanggal; ?></h5>
                                <h5 style="float:right; width:100%; text-align:right; padding-right:30px;"><?php echo "Jam Berangkat : ".$Waktu." Wita"; ?></h5>
            	<div class="callout callout-primary" style="margin-top:10%">
                    <input type="hidden" name="id_jadwal" value="<?php echo $idjadwal?>" id="idjadwal">
                    <div  style="min-height:30px;">
								<?php  
                                    include("config/connection.php");
                                    $sql ="select tb_angkutan.*, tb_detil_angkutan_def.harga from tb_angkutan inner join tb_detil_angkutan_def on tb_detil_angkutan_def.id_angkutan = tb_angkutan.id_angkutan where tb_angkutan.id_jenis_angkutan = 1 and tb_angkutan.id_angkutan = 1 ";
                                    $hasil = mysql_query($sql) or die("Kesalahan Pada SQLs");
                                    mysql_close($test);
                                    
                                    $row = mysql_fetch_object($hasil);
										$harga = $row->harga;
                                ?>

                        <h2 class="modal-title" id="myModalLabel" style="float:right">
                            <div id="total" style="font-size:40px">
                            	Rp. <?php echo number_format($harga +1000);?>
                            </div>
                            <input type="hidden" id="totalhide" value="<?php echo $harga+1000 ?>">
                            
                        </h2>
                    </div>
                    <div class="modal-body" >
                    	<div class="form-group">
                        	<div class="checkbox">
                                <label>
                                    <input type="checkbox" id="pmi" onClick="cek()"> Termasuk PMI
                                </label>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="Operator" class="control-label">Nama</label>
                            <input type="text" name="nama" required class="form-control" style="height:55px; font-size:25px;">
                         </div>
                        <div class="form-group">
                            <label for="Operator" class="control-label">No. Identitas (KTP/SIM/Lainnya)</label>
                            <input type="text" name="no_identitas" required class="form-control" style="height:55px; font-size:25px;">
                         </div>
                        <div class="form-group">
                            <input style="height:55px; font-size:25px;" type="text" class="col-sm-7" placeholder = "0" id="bayar"  onkeyup="format_num();">
                            <input style="height:55px; font-size:25px;" type="text" class="col-sm-1" value=">>" disabled="disabled">
                            <input style="height:55px; font-size:25px;" type="text" class="col-sm-4" id="kembali" value="0" disabled="disabled">
                     	</div>
                        <div class="form-group">  
                            <button type="submit" class="btn btn-success" style="width:100px; height:45px; font-size:18px"><i class='glyphicon glyphicon-ok-circle' style="margin-right:5px;"></i> Beli</button>
                        </div>
                    </div>
                </form>
                </div>
                </div>
			</div>
      </div>
  </div>
</div>            