<style>
.form-control:focus{
	border:2px solid red;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
</style>
<div class="panel panel-default"  onload="startTime()"> 
	<div class="panel-footer">
		<div class='row'>
			<div class='col-md-8'>
				<?php 
					$b = date('m') * 1;
					$h = date('l'); 
					$hari = $hari[date('N', strtotime($h))];
					echo $hari.", ".date('d')." ".$bulan[$b]." ".date('Y')." &bull; "."<span id='txt'></span>"; 
				?>
				<br><br>
				<div class="form-group">
					<div class="row">
						<div class="col-md-2">
							<label class="control-label" style='padding-top:10px;'>Pelanggan<span class="text-danger">*</span></label>
						</div>
						<div class="col-md-4"> 
							<input type='text' class='form-control'  name='pelanggan' style="text-transform: uppercase;" value='Umum' id='pelangganketik'  >
						</div> 
						<div class="col-md-2">
							<label class="control-label" style='padding-top:10px;'>No.</label>
						</div>
						<div class="col-md-4"> 
							<input type='text' class='form-control'  name='no_transaksi' value='<?=$no?>' readonly>
						</div>
					</div>
				</div> 
			</div>
			<div class='col-md-4'>
				<br>
				<div class='totd'>
					<div class="row">
						<div class="col-sm-1">
							RP.
						</div>
						<div class="col-sm-11" align='right'>
							<div id='totala'>0</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>	
</div>

<div class="panel panel-default">
	<div class="panel-heading" style='padding:15px 10px'>
		<div class='row' style='margin-bottom:20px;'>
			<div class='col-sm-4'>
				<input type='text' class='form-control' placeholder='Code Barcode' id='barcode'>
			</div>
		</div>
		<form action="" method="post" data-parsley-validate enctype="multipart/form-data" id='submitrow'>
			<div class="row">
				<div class='col-sm-4'>
					Nama Obat :
					<select name='id_barang' id='pilih_barang' class='form-control' required>
						<option value=''> - Pilih Obat -</option>
						<?php
						if(isset($barang) && count($barang) > 0): foreach($barang as $row):
							echo "<option value='$row[id_barang]' data-isi='$row[isi]' data-kode='$row[kode]' data-resep='$row[harga_resep]' data-satuan='$row[harga_satuan]' data-box='$row[harga_box]' data-stok='$row[stok]' data-nama='$row[nama] - $row[satuan]' data-satuan='$row[satuan]'>$row[nama] - $row[stok] $row[satuan]</option>";
						endforeach; endif;
						?>
					</select>
				</div>
				<div class='col-sm-2'>
					Qty : <input type='number' value='' required class='form-control numbers' id='pilih_qty' name='pilih_qty' data-max='1' data-harga='0'> 
				</div>
				<div class='col-sm-2'>
					Jenis Harga : 
					<select class='form-control' name='jenis_harga' id='jenis_harga'>
						<option value='2'>Satuan</option>
						<option value='1'>Resep</option>
						<option value='3'>Box</option>
					</select>
				</div>
				<div class='col-sm-2'>
					Total : <input type='text' readonly required class='form-control' id='pilih_total' name='pilih_total'> 
				</div>
				<div class='col-sm-2'>
					&nbsp;<br>
					<button type='submit' class='btn btn-sm btn-success'><i class='fa fa-plus'></i> Tambahkan</button>
				</div>
			</div>
		</form>
	</div>
	<form action="" method="post" data-parsley-validate enctype="multipart/form-data" id='submitalls'>
		<input type='text' name='pelanggan' id='pelanggan' value='UMUM'  class='hide'>
		<input type='text' name='no' required class='hide' value='<?=$no?>'> 
		
		<div class="panel-body">
			<div class="table-responsive">
				<table class="table table-striped table-bordered table-hover" id='listable'>
					<thead>
						<tr style='background:#DDDDDD;'> 
							<th width=''>Nama Barang</th> 
							<th width='50'>Isi</th> 
							<th width='50'>Qty</th>  
							<th width='100'>Jenis Harga</th>  
							<th width='150'>Harga</th> 
							<th width='150'>Total</th>  
							<th width='50'></th>
						</tr>
					</thead> 
					<tbody>
					
					</tbody>
				</table>
			</div>
			<table class="  subsub" style='width:100%;'>
				<tr>
					<td width='500'>
						Keterangan :
						<input type='text' name='keterangan' value='' class='form-control'>
					</td>
					<td></td>
					<td width='150'>Sub Total</td>
					<td width='200'>
						<div id='divtotal'>Rp. 0</div>
						<input type='text' name='subtotal' id='subtotal' required class='form-control hide' readonly value='0'>
					</td>
				</tr>
				<tr>
					<td></td>
					<td></td>
					<td>Diskon</td>
					<td> 
						<input type='number' name='diskon' id='diskon' required value='0' class='form-control diskon'>
					</td>
				</tr>
				<tr>
					<td></td>
					<td></td>
					<td>Diskon Rp</td>
					<td>
						<div id='divpotongan'>Rp. 0</div>
						<input type='text' name='potongan' id='potongan' required value='0' class='form-control hide' readonly>
					</td>
				</tr>
				<tr>
					<td></td>
					<td></td>
					<td>Grand Total</td>
					<td>
						<div id='divgrand_total'>Rp. 0</div>
						<input type='text' name='grand_total' id='grand_total' required  class='form-control hide' readonly value='0'>
					</td>
				</tr>
				<tr>
					<td></td>
					<td></td>
					<td>Bayar</td>
					<td>
						<input type='number' name='bayar' id='bayar' required  class='form-control' value='0'>
					</td>
				</tr>
				<tr>
					<td></td>
					<td></td>
					<td>Sisa</td>
					<td> 
						<input type='text' name='sisa' id='sisa' required class='form-control' readonly value='0'>
					</td>
				</tr>
			</table>
		</div>
		<div class="panel-footer">
			<button type="submit" onclick=" " class="btn btn-primary">Submit</button>
			<a href='<?=$url?>transaksi' class='btn btn-default'>Batal</a>
		</div>	
	</form>
</div>
<style>
	.subsub div{
		font-weight:bold;
		padding:5px 10px;
		border:1px solid #CCCCCC;
		background:#EFEFEF;
		text-align:right;
	}
	.subsub td{
		padding:0px ;
	}
	.subsub .form-control{
		padding:0px 10px;
	}
	.table{ 
	}
	.totd{
		padding:10px;
		background:#0B2A05;
		color:#FFFFFF;
		font-size:20px;
	}
	#submitrow input{
		color:#000000;
	}
	#listable tr:hover{
		background:#EFEFEF;
	}
</style> 
<script>
	window.onload = function() {
	  var input = document.getElementById("barcode").focus();
	}
	

	
</script>