@extends('layouts.plain')

<style>
    .card {

    }

    .form-control:focus {
        background-color: #b5e5f9 !important;
    }

	.table-scrollable {
		margin: 0;
		padding: 0;
	}

	table {
		table-layout: fixed !important;
	}

	.uppercase {
		text-transform: uppercase;
	}

	/* query LOADX */

	.loader {
      position: fixed;
        top: 50%;
        left: 50%;
      width: 100px;
      aspect-ratio: 1;
      background:
        radial-gradient(farthest-side,#ffa516 90%,#0000) center/16px 16px,
        radial-gradient(farthest-side,green   90%,#0000) bottom/12px 12px;
      background-repeat: no-repeat;
      animation: l17 1s infinite linear;
      position: relative;
    }
    .loader::before {    
      content:"";
      position: absolute;
      width: 8px;
      aspect-ratio: 1;
      inset: auto 0 16px;
      margin: auto;
      background: #ccc;
      border-radius: 50%;
      transform-origin: 50% calc(100% + 10px);
      animation: inherit;
      animation-duration: 0.5s;
    }
    @keyframes l17 { 
      100%{transform: rotate(1turn)}
    }

	/* penutup LOADX */

    /* menghilangkan padding */
    .content-header {
        padding: 0 !important;
    }

</style>

@section('content')

<div class="content-wrapper">
    <div class="content-header">
        <div class="container-fluid">

        </div>
    </div>

    <div class="content">
        <div class="container-fluid">
        <div class="row">
            <div class="col-12">
            <div class="card">
                <div class="card-body">

                    <form action="{{($tipx=='new')? url('/beli/store?flagz='.$flagz.'&golz='.$golz.'') : url('/beli/update/'.$header->NO_ID.'&flagz='.$flagz.'&golz='.$golz.'' ) }}" method="POST" name ="entri" id="entri" >
  
                        @csrf
                        <div class="tab-content mt-3">
                            <div class="form-group row">
                                <div class="col-md-1" align="right">
                                    <label for="NO_BUKTI" class="form-label">Bukti#.</label>
                                </div>
								

                                   <input type="text" class="form-control NO_ID" id="NO_ID" name="NO_ID"
                                    placeholder="Masukkan NO_ID" value="{{$header->NO_ID ?? ''}}" hidden readonly>

									<input name="tipx" class="form-control tipx" id="tipx" value="{{$tipx}}" hidden>
									<input name="flagz" class="form-control flagz" id="flagz" value="{{$flagz}}" hidden>
									<input name="golz" class="form-control golz" id="golz" value="{{$golz}}" hidden>

								
								
                                <div class="col-md-2">
                                    <input type="text" class="form-control NO_BUKTI" id="NO_BUKTI" name="NO_BUKTI"
                                    placeholder="Masukkan Bukti#" value="{{$header->NO_BUKTI}}" readonly>
                                </div>

                                <div class="col-md-1" align="right">
                                    <label for="TGL" class="form-label">Tgl</label>
                                </div>
                                <div class="col-md-2">
								  <input class="form-control date" id="TGL" name="TGL" data-date-format="dd-mm-yyyy" type="text" autocomplete="off" value="{{date('d-m-Y',strtotime($header->TGL))}}">
                                </div>

								<div class="col-md-1" align="right">
                                    <label for="JTEMPO" class="form-label">Jatuh Tempo</label>
                                </div>
                                <div class="col-md-2">
								  <input class="form-control date" id="JTEMPO" name="JTEMPO" data-date-format="dd-mm-yyyy" type="text" autocomplete="off" value="{{date('d-m-Y',strtotime($header->JTEMPO))}}">
                                </div>
								
                            </div>

							<div {{( $flagz =='RB') ? '' : 'hidden' }} class="form-group row">

								<div class="col-md-1" align="right">
									<label style="color:red">*</label>									
									<label for="NO_BELI" class="form-label">No Beli</label>
								</div>
								<div class="col-md-2 input-group" >
								<input type="text" class="form-control NO_BELI" id="NO_BELI" name="NO_BELI" placeholder="Pilih Beli"value="{{$header->NO_BELI}}" style="text-align: left" readonly >
								<button type="button" class="btn btn-primary" onclick="browseBeli()"><i class="fa fa-search"></i></button>
								</div>
								
								
								
							</div>

                            <div class="form-group row">

								<div class="col-md-1" align="right">
									<label style="color:red">*</label>									
                                    <label for="NO_PO" class="form-label">PO#</label>
                                </div>
                               	<div class="col-md-2 input-group" >
                                  <input type="text" class="form-control NO_PO" id="NO_PO" name="NO_PO" placeholder="Pilih PO"value="{{$header->NO_PO}}" style="text-align: left" readonly >
        						  <button type="button" class="btn btn-primary" onclick="browsePo()"><i class="fa fa-search"></i></button>
                                </div>
                                

								<div class="col-md-4">
								    <input type="text" hidden class="form-control KODES" id="KODES" name="KODES" placeholder="Masukkan Suplier#" value="{{$header->KODES}}"readonly>
                                    <input type="text" class="form-control NAMAS" id="NAMAS" name="NAMAS" placeholder="-" value="{{$header->NAMAS}}" readonly>
                                    <input type="text" hidden class="form-control ALAMAT" id="ALAMAT" name="ALAMAT" value="{{$header->ALAMAT}}"placeholder="Alamat" readonly >
                                    <input type="text" hidden class="form-control KOTA" id="KOTA" name="KOTA" value="{{$header->KOTA}}"placeholder="Kota" readonly>
                                
									<input hidden type="text" onclick="select()" onblur="hitung()" class="form-control HARI" id="HARI" name="HARI" placeholder="Masukkan HARI" 
									value="{{ number_format( $header->HARI, 0, '.', ',') }}" style="text-align: right" >
							    </div>

                                <div class="col-md-3" >
                                  	<input type="checkbox" class="form-check-input" id="PKP" name="PKP" readonly  value="{{$header->PKP}}" {{ ($header->PKP == 1) ? 'checked' : '' }}>
                                    <label for="PKP" class="form-label">Pkp</label>
                                    
                                   <input type="text" hidden class="form-control ZPKP" id="ZPKP" name="ZPKP" value="{{$header->PKP}}" placeholder="Masukkan Pkp" >
                                   
                                  
                                </div>
                                
                                
                            </div>
							

							<div class="form-group row">

								<div class="col-md-1" align="right">
                                    <label for="GUDANG" class="form-label">Gudang</label>
                                </div>
                                <div class="col-md-2">
                                    <input type="text" class="form-control GUDANG" id="GUDANG" name="GUDANG" placeholder="Masukkan Gudang"  value="{{$header->GUDANG}}"  readonly >
                                </div>

								<div class="col-md-2">
									<select id="TYPE" class="form-control"  name="TYPE">
										<option value="CASH" {{ ($header->TYPE == 'CASH') ? 'selected' : '' }}>Cash</option>
										<option value="KREDIT" {{ ($header->TYPE == 'KREDIT') ? 'selected' : '' }}>Kredit</option>
									</select>
								</div> 
								
                            </div>

						<!-- loader tampil di modal  -->
						<div class="loader" style="z-index: 1055;" id='LOADX' ></div>
						<!-- tutupan load -->

						<!-- style text box model baru -->

							<style>
								/* Ensure specificity with class targeting */
								.form-group.special-input-label {
									position: relative;

									/* geser kanan kirinya di atur disini */
									margin-left: 50px ;
								}
						
								/* Ensure only bottom border for input */
								.form-group.special-input-label input {
									width: 100%;
									padding: 10px 0;
									border: none !important;
									border-bottom: 2px solid #ccc !important;
									outline: none !important;
									font-size: 16px !important;
									background: transparent !important; /* Remove any background color */
								}
						
								/* Bottom border color change on focus */
								.form-group.special-input-label input:focus {
									border-bottom: 2px solid #007BFF !important; /* Change color on focus */
								}
						
								/* Style the label with a higher specificity */
								.form-group.special-input-label label {
									position: absolute;
									top: 12px;
									/* buat label di inputan */
									color: #888 !important;
									font-size: 16px !important;
									transition: 0.3s ease all;
									pointer-events: none;
								}
						
								/* Move label above input when focused or has content */
								.form-group.special-input-label input:focus + label,
								.form-group.special-input-label input:not(:placeholder-shown) + label {
									top: -10px !important;
									font-size: 14px !important;
									/* buat label diatas */
									color: #007BFF !important;
								}
							</style>

							<!-- tutupannya -->

							<div class="form-group row">
								<!-- code text box baru -->
								<div class="col-md-5 form-group row special-input-label">

									<input type="text" class="NOTES" id="NOTES" name="NOTES" 
										value="{{$header->NOTES}}" placeholder=" " >
									<label for="NOTES">Notes</label>
								</div>
								<!-- tutupannya -->
                            </div>
							
							
                            <hr style="margin-top: 30px; margin-buttom: 30px">
							
							<div style="overflow-y:scroll;" class="col-md-12 scrollable" align="right">

								<table id="datatable" class="table table-striped table-border">

									<thead>
										<tr>
										<th width="50px" style="text-align:center">No.</th>

											<th {{( $golz =='J' || $golz =='N') ? '' : 'hidden' }} width="100px">Barang
											</th>
											<th {{( $golz =='J' || $golz =='N') ? '' : 'hidden' }} width="200px" style="text-align:center">Nama</th>

											<th width="75px" style="text-align:center">Stn-PO</th>
											<th width="100px" style="text-align:center">XQty</th>
											<th width="50px" style="text-align:center">X</th>
											<th width="100px" style="text-align:center">Qty PO</th>

											<th width="75px" style="text-align:center">Satuan</th>
											<th width="100px" style="text-align:center">Qty</th>  

											<th {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} width="150px" style="text-align:center">Harga</th>
											<th {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} width="150px" style="text-align:center">Total</th>
											<th {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} width="150px" style="text-align:center">PPN</th>
											<th {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} width="150px" style="text-align:center">DPP</th>
											<th {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} width="150px" style="text-align:center">Diskon</th>
											<th width="200px" style="text-align:center">Ket</th>

											<th></th>
																
										</tr>
									<tbody id="detailPod">
			
									<tbody>
																		@foreach ($detail as $detail)		
										<tr>
											<td>
												<input type="hidden" name="NO_ID[]{{$no}}" id="NO_ID" type="text" value="{{$detail->NO_ID}}" 
												class="form-control NO_ID" onkeypress="return tabE(this,event)" readonly>
												
												<input name="REC[]" id="REC{{$no}}" type="text" value="{{$detail->REC}}" class="form-control REC" onkeypress="return tabE(this,event)" readonly style="text-align:center">
											</td>
											<!-- <td>
												<input name="NO_PO[]" id="NO_PO0" type="text" value="{{$detail->NO_PO}}" class="form-control NO_PO" readonly >
											</td>										 -->

											<td {{( $golz =='J' || $golz =='N') ? '' : 'hidden' }}>
												<input name="KD_BRG[]" id="KD_BRG{{$no}}" type="text" class="form-control KD_BRG " 
												value="{{$detail->KD_BRG}}" onblur="browseBarang({{$no}})">
											</td>

											<td {{( $golz =='J' || $golz =='N') ? '' : 'hidden' }}>
												<input name="NA_BRG[]" id="NA_BRG{{$no}}" type="text" class="form-control NA_BRG " value="{{$detail->NA_BRG}}">
											</td>

											<td>
												<input name="SATUAN_PO[]" id="SATUAN_PO{{$no}}" type="text" class="form-control SATUAN_PO" value="{{$detail->SATUAN_PO}}">
											</td>									
											<td>
												<input name="XQTY[]" onclick="select()" onblur="hitung()" value="{{$detail->XQTY}}" id="XQTY{{$no}}" type="text" style="text-align: right"  class="form-control XQTY" >
											</td>									
											<td>
												<input name="KALI[]" onclick="select()" onblur="hitung()" value="{{$detail->KALI}}" id="KALI{{$no}}" type="text" style="text-align: right"  class="form-control KALI" >
											</td>										
											<td>
												<input name="QTY_PO[]" onclick="select()" onblur="hitung()" value="{{$detail->QTY_PO}}" id="QTY_PO{{$no}}" type="text" style="text-align: right"  class="form-control QTY_PO" >
												<input hidden name="SISA[]" onclick="select()" onblur="hitung()" value="{{$detail->SISA}}" id="SISA{{$no}}" type="text" style="text-align: right"  class="form-control SISA" >
											</td>
											
											<td>
												<input name="SATUAN[]" id="SATUAN{{$no}}" type="text" class="form-control SATUAN" value="{{$detail->SATUAN}}" readonly >
											</td>										
											<td>
												<input name="QTY[]" onclick="select()" onblur="hitung()" value="{{$detail->QTY}}" id="QTY{{$no}}" type="text" style="text-align: right"  class="form-control QTY" >
											</td>
																																	
											<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
												<input name="HARGA[]" onclick="select()" onblur="hitung()" value="{{$detail->HARGA}}" id="HARGA{{$no}}" type="text" style="text-align: right"  class="form-control HARGA">
											</td>
		
											<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
												<input name="TOTAL[]" onblur="hitung()"  value="{{$detail->TOTAL}}" id="TOTAL{{$no}}" type="text" style="text-align: right"  class="form-control TOTAL" readonly>
											</td>
											<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
												<input name="PPNX[]" onblur="hitung()"  value="{{$detail->PPN}}" id="PPNX{{$no}}" type="text" style="text-align: right"  class="form-control PPNX" readonly>
											</td>
											<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
												<input name="DPP[]" onblur="hitung()"  value="{{$detail->DPP}}" id="DPP{{$no}}" type="text" style="text-align: right"  class="form-control DPP" readonly>
											</td>
											<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }}>
												<input name="PDISK[]" onblur="hitung()"  value="{{$detail->PDISK}}" id="PDISK{{$no}}" type="text" style="text-align: right"  class="form-control PDISK" >
												<input name="DISK[]" onblur="hitung()"  value="{{$detail->DISK}}" id="DISK{{$no}}" type="text" style="text-align: right"  class="form-control DISK" hidden >
												
											</td>
											<td>
												<input name="KET[]" id="KET{{$no}}" type="text" class="form-control KET" value="{{$detail->KET}}"  >
											</td> 
											
											<td>
												<button type='button' id='DELETEX{{$no}}'  class='btn btn-sm btn-circle btn-outline-danger btn-delete' onclick=''> <i class='fa fa-fw fa-trash'></i> </button>
											</td> 

										</tr>
									
																		@endforeach
									</tbody>

									<tfoot>
										<td></td>
										<td {{( $golz =='B') ? '' : 'hidden' }}></td>
										<td {{( $golz =='B') ? '' : 'hidden' }}></td>
										<td {{( $golz =='J' || $golz =='N') ? '' : 'hidden' }}></td>
										<td {{( $golz =='J' || $golz =='N') ? '' : 'hidden' }}></td>
										<td></td>									
										<td></td>
										<td></td>
										<td></td>
										<td></td>
										<td></td>
										<!-- <td><input class="form-control TTOTAL  text-primary" style="text-align: right"  id="TTOTAL" name="TTOTAL" value="{{$header->TOTAL}}" readonly></td> -->
										<td></td>
									</tfoot>
								</table>
							</div>

                            <!-- <div class="col-md-2 row">
                               <a type="button" id='PLUSX' onclick="tambah()" class="fas fa-plus fa-sm md-3" style="font-size: 20px" ></a>
					
							</div>	 -->
							
                        </div> 

                        <hr style="margin-top: 30px; margin-buttom: 30px">
                        
                        <div class="tab-content mt-6">
						
							<div class="form-group row">
							    
                                <!--<div class="col-md-1" align="center">-->
                                <!--	<a type="button" id='PLUSX' onclick="tambah()" class="fas fa-plus fa-sm md-3" style="font-size: 20px" ></a>-->
                                <!--</div>-->
                                
                                <div class="col-md-2" align="right">
                                     <label for="total" class="form-label">Total Qty</label>
                                </div>

                                <div class="col-md-2">
                                    <input type="text"  onclick="select()" onkeyup="hitung()" class="form-control TTOTAL_XQTY" id="TTOTAL_XQTY" name="TTOTAL_XQTY" placeholder="" value="{{$header->TOTAL_XQTY}}" style="text-align: right" readonly>
                                </div>
 
                                 <div class="col-md-2">
                                    <input type="text"  onclick="select()" onkeyup="hitung()" class="form-control TTOTAL_QTY" id="TTOTAL_QTY" name="TTOTAL_QTY" placeholder="" value="{{$header->TOTAL_QTY}}" style="text-align: right" readonly>
                                </div>
                                
                                <div {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} class="col-md-2" align="right">
                                    <label for="TDISK" class="form-label">Diskon</label>
                                </div>
                                <div {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} class="col-md-2">
                                    <input type="text"  onclick="select()" onkeyup="hitung()" class="form-control TDISK" id="TDISK" name="TDISK" placeholder="" value="{{$header->TDISK}}" style="text-align: right" readonly>
                                </div>
							</div>
							
							<div class="form-group row">

                                <div {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} class="col-md-7" align="right">
                                </div>
                                
                                <div {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} class="col-md-2">
                                    <input type="text"  hidden onclick="select()" onkeyup="hitung()" class="form-control TTOTAL" id="TTOTAL" name="TTOTAL" placeholder="TTOTAL" value="{{$header->TOTAL}}" style="text-align: right" readonly>
                                    <input type="text"  onclick="select()" onkeyup="hitung()" class="form-control TDPP" id="TDPP" name="TDPP" placeholder="TDPP" value="{{$header->TDPP}}" style="text-align: right" readonly>
                                </div>
							</div>

                            <div class="form-group row">

								<div class="col-md-1" align="right" hidden >
								</div>

								<div class="col-md-1" align="right">								
									<label for="NOTES2" class="form-label">Notes 2</label>
								</div>
								<div class="col-md-3 input-group" >
									<input type="text" class="form-control uppercase NOTES2" id="NOTES2" name="NOTES2" placeholder=""value="{{$header->NOTES2}}" style="text-align: left" >
								</div>

								<div {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} class="col-md-3" align="right">
                                    <label for="TPPN" class="form-label">Ppn</label>
                                </div>
                                <div {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} class="col-md-2">
                                    <input type="text"  onclick="select()" onkeyup="hitung()" class="form-control TPPN" id="TPPN" name="TPPN" placeholder="" value="{{$header->TPPN}}" style="text-align: right" readonly>
                                </div>
							</div>
							
                            <div {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} class="form-group row">
                                <div class="col-md-7" align="right">
                                    <label for="NETT" class="form-label">Nett</label>
                                </div>
                                <div class="col-md-2">
                                    <input type="text"  onclick="select()" onkeyup="hitung()" class="form-control NETT" id="NETT" name="NETT" placeholder="" value="{{$header->NETT}}" style="text-align: right" readonly>
                                </div>
							</div>
							
						</div>
						
						   
						<div class="mt-3 col-md-12 form-group row">
							<div class="col-md-4">
								<button hidden type="button" id='TOPX'  onclick="location.href='{{url('/beli/edit/?idx=' .$idx. '&tipx=top&flagz='.$flagz.'&golz='.$golz.'' )}}'" class="btn btn-outline-primary">Top</button>
								<button hidden type="button" id='PREVX' onclick="location.href='{{url('/beli/edit/?idx='.$header->NO_ID.'&tipx=prev&flagz='.$flagz.'&golz='.$golz.'&buktix='.$header->NO_BUKTI )}}'" class="btn btn-outline-primary">Prev</button>
								<button hidden type="button" id='NEXTX' onclick="location.href='{{url('/beli/edit/?idx='.$header->NO_ID.'&tipx=next&flagz='.$flagz.'&golz='.$golz.'&buktix='.$header->NO_BUKTI )}}'" class="btn btn-outline-primary">Next</button>
								<button hidden type="button" id='BOTTOMX' onclick="location.href='{{url('/beli/edit/?idx=' .$idx. '&tipx=bottom&flagz='.$flagz.'&golz='.$golz.'' )}}'" class="btn btn-outline-primary">Bottom</button>
							</div>
							<div class="col-md-5">
								<button hidden type="button" id='NEWX' onclick="location.href='{{url('/beli/edit/?idx=0&tipx=new&flagz='.$flagz.'&golz='.$golz.'' )}}'" class="btn btn-warning">New</button>
								<button hidden type="button" id='EDITX' onclick='hidup()' class="btn btn-secondary">Edit</button>                    
								<button hidden type="button" id='UNDOX' onclick="location.href='{{url('/beli/edit/?idx=' .$idx. '&tipx=undo&flagz='.$flagz.'&golz='.$golz.'' )}}'" class="btn btn-info">Undo</button>  
								<button type="button" id='SAVEX' onclick='simpan()'   class="btn btn-success" class="fa fa-save"></i>Save</button>

							</div>
							<div class="col-md-3">
								<button hidden type="button" id='HAPUSX'  onclick="hapusTrans()" class="btn btn-outline-danger">Hapus</button>

								<!-- <button type="button" id='CLOSEX'  onclick="location.href='{{url('/beli?flagz='.$flagz.'&golz='.$golz.'' )}}'" class="btn btn-outline-secondary">Close</button> -->
							
								<!-- tombol close sweet alert -->
								<button type="button" id='CLOSEX' onclick="closeTrans()" class="btn btn-outline-secondary">Close</button></div>   
							</div>
						</div>
						
						
                    </form>
                </div>
            </div>
            </div>
        </div>
        </div>
    </div>


 	<div class="modal fade" id="browsePoModal" tabindex="-1" role="dialog" aria-labelledby="browsePoModalLabel" aria-hidden="true">
	  <div class="modal-dialog modal-xl" role="document">
		<div class="modal-content">
		  <div class="modal-header">
			<h5 class="modal-title" id="browsePoModalLabel">Cari Po</h5>
			<button type="button" class="close" data-dismiss="modal" aria-label="Close">
			  <span aria-hidden="true">&times;</span>
			</button>
		  </div>
		  <div class="modal-body">
			<table class="table table-stripped table-bordered" id="table-bpo">
				<thead>
					<tr>
						<th>PO#</th>
						<th>Suplier</th>
						<th>Nama</th>
						<th>Alamat</th>
						<th>Kota</th>
					</tr>
				</thead>
				<tbody>
				</tbody>
			</table>
		  </div>
		  <div class="modal-footer">
			<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
		  </div>
		</div>
	  </div>
	</div>

	<div class="modal fade" id="browseBeliModal" tabindex="-1" role="dialog" aria-labelledby="browseBeliModalLabel" aria-hidden="true">
	  <div class="modal-dialog modal-xl" role="document">
		<div class="modal-content">
		  <div class="modal-header">
			<h5 class="modal-title" id="browseBeliModalLabel">Cari Pembelian</h5>
			<button type="button" class="close" data-dismiss="modal" aria-label="Close">
			  <span aria-hidden="true">&times;</span>
			</button>
		  </div>
		  <div class="modal-body">
			<table class="table table-stripped table-bordered" id="table-bbeli">
				<thead>
					<tr>
						<th>No Beli</th>
						<th>Suplier</th>
						<th>Nama</th>
						<th>Alamat</th>
						<th>Kota</th>
					</tr>
				</thead>
				<tbody>
				</tbody>
			</table>
		  </div>
		  <div class="modal-footer">
			<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
		  </div>
		</div>
	  </div>
	</div>


	<div class="modal fade" id="browseBarangModal" tabindex="-1" role="dialog" aria-labelledby="browseBarangModalLabel" aria-hidden="true">
	  <div class="modal-dialog modal-xl" role="document">
		<div class="modal-content">
		  <div class="modal-header">
			<h5 class="modal-title" id="browseBarangModalLabel">Cari Item</h5>
			<button type="button" class="close" data-dismiss="modal" aria-label="Close">
			  <span aria-hidden="true">&times;</span>
			</button>
		  </div>
		  <div class="modal-body">
			<table class="table table-stripped table-bordered" id="table-bbarang">
				<thead>
					<tr>
						<th>Item#</th>
						<th>Nama</th>
						<th>Satuan</th>
						<th>Qty</th>
						<th>Kirim</th>
						<th>Sisa</th>
						<th>Harga</th>	
							
					</tr>
				</thead>
				<tbody>
				</tbody>
			</table>
		  </div>
		  <div class="modal-footer">
			<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
		  </div>
		</div>
	  </div>
	</div>


	<div class="modal fade" id="browseBahanModal" tabindex="-1" role="dialog" aria-labelledby="browseBahanModalLabel" aria-hidden="true">
	  <div class="modal-dialog modal-xl" role="document">
		<div class="modal-content">
		  <div class="modal-header">
			<h5 class="modal-title" id="browseBahanModalLabel">Cari Item</h5>
			<button type="button" class="close" data-dismiss="modal" aria-label="Close">
			  <span aria-hidden="true">&times;</span>
			</button>
		  </div>
		  <div class="modal-body">
			<table class="table table-stripped table-bordered" id="table-bbahan">
				<thead>
					<tr>
						<th>Item#</th>
						<th>Nama</th>
						<th>Satuan</th>
						<th>Qty</th>
						<th>Kirim</th>
						<th>Sisa</th>
						<th>Harga</th>	
						
					</tr>
				</thead>
				<tbody>
				</tbody>
			</table>
		  </div>
		  <div class="modal-footer">
			<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
		  </div>
		</div>
	  </div>
	</div>
	
	
	

@endsection

@section('footer-scripts')
<script src="{{ asset('js/autoNumerics/autoNumeric.min.js') }}"></script>
<!-- <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"></script> -->
<script src="{{asset('foxie_js_css/bootstrap.bundle.min.js')}}"></script>

<!-- tambahan untuk sweetalert -->
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<!-- tutupannya -->

<script>
	var idrow = 1;
	var baris = 1;

	function numberWithCommas(x) {
		return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
	}
	
    $(document).ready(function () {

		setTimeout(function(){

		$("#LOADX").hide();

		},500);

    idrow=1;
    baris=1;

		$('body').on('keydown', 'input, select', function(e) {
			if (e.key === "Enter") {
				var self = $(this), form = self.parents('form:eq(0)'), focusable, next;
				focusable = form.find('input,select,textarea').filter(':visible');
				next = focusable.eq(focusable.index(this)+1);
				console.log(next);
				if (next.length) {
					next.focus().select();
				} else {
					tambah();
					// var nomer = idrow-1;
					// console.log("REC"+nomor);
					// document.getElementById("REC"+nomor).focus();
					// form.submit();
				}
				return false;
			}
		});


		$tipx = $('#tipx').val();
		$searchx = $('#CARI').val();
		
		
        if ( $tipx == 'new' )
		{
			 baru();
            //  tambah();				 
		}

        if ( $tipx != 'new' )
		{
			 ganti();			
		}    

		$("#TTOTAL_XQTY").autoNumeric('init', {aSign: '',vMin: '-999999999.99'});
		
		$("#TTOTAL_QTY").autoNumeric('init', {aSign: '',vMin: '-999999999.99'});
		$("#TTOTAL").autoNumeric('init', {aSign: '',vMin: '-999999999.99'});
		$("#TDISK").autoNumeric('init', {aSign: '',vMin: '-999999999.99'});
		$("#TPPN").autoNumeric('init', {aSign: '',vMin: '-999999999.99'});
		$("#TDPP").autoNumeric('init', {aSign: '',vMin: '-999999999.99'});
		$("#NETT").autoNumeric('init', {aSign: '',vMin: '-999999999.99'});



		jumlahdata = 100;
		for (i = 0; i <= jumlahdata; i++) {
			$("#QTY_PO" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
			$("#SISA" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
			$("#HARGA" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
			$("#PPNX" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
			$("#DPP" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
			$("#PDISK" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
			$("#DISK" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
			$("#XQTY" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
			
			$("#TOTAL" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
			$("#KALI" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
			$("#QTY" + i.toString()).autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
		}	


		
        $('body').on('click', '.btn-delete', function() {
			var val = $(this).parents("tr").remove();
			baris--;
			hitung();
			nomor();
			
		});

		$('.date').datepicker({  
            dateFormat: 'dd-mm-yy'
		});
		
		
 	
		
//		CHOOSE Po
 		var dTableBPo;
		loadDataBPo = function(){
		
			$.ajax(
			{
				type: 'GET', 		
				url: '{{url('po/browse')}}',
				data: {
					'GOL': "{{$golz}}",
					// 'KODES' : $("#KODES").val(),
				},

				beforeSend: function(){
					$("#LOADX").show();
				},

				success: function( response )
				{
					$("#LOADX").hide();

					resp = response;
					if(dTableBPo){
						dTableBPo.clear();
					}
					for(i=0; i<resp.length; i++){
						
						dTableBPo.row.add([
							'<a href="javascript:void(0);" onclick="choosePo(\''+resp[i].NO_BUKTI+'\' ,\''+resp[i].KODES+'\',  \''+resp[i].NAMAS+'\', \''+resp[i].ALAMAT+'\',  \''+resp[i].KOTA+'\',  \''+resp[i].PKP+'\',  \''+resp[i].GUDANG+'\',  \''+resp[i].JTEMPO+'\',  \''+resp[i].NOTES+'\')">'+resp[i].NO_BUKTI+'</a>',
							resp[i].KODES,
							resp[i].NAMAS,
							resp[i].ALAMAT,
							resp[i].KOTA,
						]);
					}
					dTableBPo.draw();
				}
			});
		}
		
		dTableBPo = $("#table-bpo").DataTable({
			
		});
		
		browsePo = function(){
			loadDataBPo();
			$("#browsePoModal").modal("show");

		}
		
		choosePo = function( NO_BUKTI,KODES,NAMAS, ALAMAT, KOTA, PKP, GUDANG, JTEMPO, NOTES){

			$("#NO_PO").val(NO_BUKTI);
			$("#KODES").val(KODES);
			$("#NAMAS").val(NAMAS);
			$("#ALAMAT").val(ALAMAT);
			$("#KOTA").val(KOTA);			
			$("#PKP").val(PKP);			
			$("#GUDANG").val(GUDANG);			
			$("#JTEMPO").val(JTEMPO);			
			$("#NOTES").val(NOTES);			
			
			
				if ( $("#PKP").val() == '1' )
        		{

                     document.getElementById("PKP").checked = true;
                    	
        		}
        
                else
                {
                     document.getElementById("PKP").checked = false;
                    
                }
			
			
			
			$("#browsePoModal").modal("hide");
			
			getPod(NO_BUKTI);
		}
		
		$("#NO_PO").keypress(function(e){

			if(e.keyCode == 46){
				 e.preventDefault();
				 browsePo();
			}
		}); 

////////////////////////////////////////////////////////////////////

//////////////////////////////////////////////////////////////////

	function getPod(bukti)
	{
		
		var mulai = (idrow==baris) ? idrow-1 : idrow;

		$.ajax(
			{
				type: 'GET',    
				url: "{{url('po/browse_pod')}}",
				data: {
					nobukti: bukti,
					'GOL': "{{$golz}}",
				},
				success: function( resp )
				{
					var html = '';
					for(i=0; i<resp.length; i++){
						html+=`<tr>
                                    <td><input name='REC[]' id='REC${i}' value=${resp[i].REC+1} type='text' class='REC form-control' onkeypress='return tabE(this,event)' readonly></td>
                                    

									<td {{( $golz =='J' || $golz =='N') ? '' : 'hidden' }} >
										<input name='KD_BRG[]' id='KD_BRG${i}' value="${resp[i].KD_BRG}" type='text' class='form-control KD_BRG' readonly>
						            </td>
						            <td {{( $golz =='J' || $golz =='N') ? '' : 'hidden' }} >
						 			    <input name='NA_BRG[]' id='NA_BRG${i}' value="${resp[i].NA_BRG}" type='text' class='form-control  NA_BRG' readonly>
						            </td>
									
									<td><input name='SATUAN_PO[]' id='SATUAN_PO${i}' value="${resp[i].SATUAN_PO}" type='text' class='form-control  SATUAN_PO' readonly></td>
                                    <td>
										<input name='XQTY[]' onclick='select()' onblur='hitung()' id='XQTY${i}' value="${resp[i].XQTY}" type='text' style='text-align: right' class='form-control XQTY text-primary' >
									</td>
									<td>
										<input name='KALI[]' onclick='select()' onblur='hitung()' id='KALI${i}' value="${resp[i].KALI}" type='text' style='text-align: right' class='form-control KALI text-primary' >
									</td>
									<td>
										<input name='QTY_PO[]' onclick='select()' onblur='hitung()' id='QTY_PO${i}' value="${resp[i].SISA}" type='text' style='text-align: right' class='form-control QTY_PO text-primary' readonly>
										<input hidden name='SISA[]' onclick='select()' onblur='hitung()' id='SISA{i}' value="${resp[i].SISA}" type='text' style='text-align: right' class='form-control SISA text-primary' readonly>
									</td>
									<td>
										<input name='SATUAN[]' id='SATUAN${i}' value="${resp[i].SATUAN}" type='text' class='form-control  SATUAN' readonly>
									</td>
                                    <td>
										<input name='QTY[]' onclick='select()' onblur='hitung()' id='QTY${i}' value="${resp[i].QTY}" type='text' style='text-align: right' class='form-control QTY text-primary' readonly >
									</td>
									<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
										<input name='HARGA[]' onclick='select()' onblur='hitung()' id='HARGA${i}' value="${resp[i].HARGA}" type='text' style='text-align: right' class='form-control HARGA text-primary' readonly >
									</td>
									<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
										<input name='TOTAL[]' onclick='select()' onblur='hitung()' id='TOTAL${i}' value="${resp[i].TOTAL}" type='text' style='text-align: right' class='form-control TOTAL text-primary' readonly >
									</td>
									<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
										<input name='PPNX[]' onclick='select()' onblur='hitung()' id='PPNX${i}' value="${resp[i].PPN}" type='text' style='text-align: right' class='form-control PPNX text-primary' readonly >
									</td>
									<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
										<input name='DPP[]' onclick='select()' onblur='hitung()' id='DPP${i}' value="${resp[i].DPP}" type='text' style='text-align: right' class='form-control DPP text-primary' readonly >
									</td>
									<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }}>
										<input name='PDISK[]' onclick='select()' onblur='hitung()' id='PDISK${i}' value="${resp[i].PDISK}" type='text' style='text-align: right' class='form-control PDISK text-primary' >

										<input name='DISK[]' onclick='select()' onblur='hitung()' id='DISK${i}' value="${resp[i].DISK}" type='text' style='text-align: right' class='form-control DISK text-primary' hidden >
										
									</td>
									<td><input name='KET[]' id='KET${i}' value="" type='text' class='form-control  KET'></td>
                                    

									<td><button type='button' class='btn btn-sm btn-circle btn-outline-danger btn-delete' onclick=''> <i class='fa fa-fw fa-trash'></i> </button></td>
                                </tr>`;
					}
					$('#detailPod').html(html);

					$(".XQTY").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".XQTY").autoNumeric('update');
					
					$(".QTY_PO").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".QTY_PO").autoNumeric('update');

					$(".QTY").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".QTY").autoNumeric('update');
					
					$(".HARGA").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".HARGA").autoNumeric('update');
					
					$(".KALI").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".KALI").autoNumeric('update');
					
					$(".TOTAL").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".TOTAL").autoNumeric('update');
					
					$(".PPNX").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".PPNX").autoNumeric('update');
					
					$(".DPP").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".DPP").autoNumeric('update');

					$(".PDISK").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".PDISK").autoNumeric('update');
					
					$(".DISK").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".DISK").autoNumeric('update');


					idrow=resp.length;
					baris=resp.length;

					nomor();
					hitung();
				}
			});
	}

//////////////////////////////////////////////////////////////////

//		CHOOSE Beli
		var dTableBBeli;
		loadDataBBeli = function(){
		
			$.ajax(
			{
				type: 'GET', 		
				url: '{{url('beli/browse')}}',
				data: {
					'GOL': "{{$golz}}",
				},

				beforeSend: function(){
					$("#LOADX").show();
				},

				success: function( response )
				{
					$("#LOADX").hide();

					resp = response;
					if(dTableBBeli){
						dTableBBeli.clear();
					}
					for(i=0; i<resp.length; i++){
						
						dTableBBeli.row.add([
							'<a href="javascript:void(0);" onclick="chooseBeli(\''+resp[i].NO_BUKTI+'\', \''+resp[i].NO_PO+'\' ,\''+resp[i].KODES+'\',  \''+resp[i].NAMAS+'\', \''+resp[i].ALAMAT+'\',  \''+resp[i].KOTA+'\',  \''+resp[i].PKP+'\',  \''+resp[i].GUDANG+'\')">'+resp[i].NO_BUKTI+'</a>',
							resp[i].KODES,
							resp[i].NAMAS,
							resp[i].ALAMAT,
							resp[i].KOTA,
						]);
					}
					dTableBBeli.draw();
				}
			});
		}
		
		dTableBBeli = $("#table-bbeli").DataTable({
			
		});
		
		browseBeli = function(){
			loadDataBBeli();
			$("#browseBeliModal").modal("show");
		}
		
		chooseBeli = function( NO_BUKTI, NO_PO , KODES,NAMAS, ALAMAT, KOTA, PKP, GUDANG){

			$("#NO_BELI").val(NO_BUKTI);
			$("#NO_PO").val(NO_PO);
			$("#KODES").val(KODES);
			$("#NAMAS").val(NAMAS);
			$("#ALAMAT").val(ALAMAT);
			$("#KOTA").val(KOTA);			
			$("#PKP").val(PKP);			
			$("#GUDANG").val(GUDANG);			
			$("#browseBeliModal").modal("hide");
			
			if ( $("#PKP").val() == '1' )
			{

				document.getElementById("PKP").checked = true;
					
			}
	
			else
			{
				document.getElementById("PKP").checked = false;
				
			}

			getBelid(NO_BUKTI);
		}
		
		$("#NO_BELI").keypress(function(e){

			if(e.keyCode == 46){
				 e.preventDefault();
				 browseBeli();
			}
		}); 

//////////////////////////////////////////////////////////////////////

//////////////////////////////////////////////////////////////////

	function getBelid(bukti)
	{
		
		var mulai = (idrow==baris) ? idrow-1 : idrow;

		$.ajax(
			{
				type: 'GET',    
				url: "{{url('beli/browse_belid')}}",
				data: {
					NO_BUKTI: bukti,
				},
				success: function( resp )
				{
					var html = '';
					for(i=0; i<resp.length; i++){
						html+=`<tr>
                                    <td><input name='REC[]' id='REC${i}' value=${resp[i].REC+1} type='text' class='REC form-control' onkeypress='return tabE(this,event)' readonly></td>
                                    

									<td {{( $golz =='J' || $golz =='N') ? '' : 'hidden' }} >
										<input name='KD_BRG[]' id='KD_BRG${i}' value="${resp[i].KD_BRG}" type='text' class='form-control KD_BRG' readonly>
						            </td>
						            <td {{( $golz =='J' || $golz =='N') ? '' : 'hidden' }} >
						 			    <input name='NA_BRG[]' id='NA_BRG${i}' value="${resp[i].NA_BRG}" type='text' class='form-control  NA_BRG' readonly>
						            </td>
									
									<td><input name='SATUAN_PO[]' id='SATUAN_PO${i}' value="${resp[i].SATUAN_PO}" type='text' class='form-control  SATUAN_PO' readonly></td>
                                    <td>
										<input name='XQTY[]' onclick='select()' onblur='hitung()' id='XQTY${i}' value="${resp[i].XQTY}" type='text' style='text-align: right' class='form-control XQTY text-primary' >
									</td>
									<td>
										<input name='KALI[]' onclick='select()' onblur='hitung()' id='KALI${i}' value="${resp[i].KALI}" type='text' style='text-align: right' class='form-control KALI text-primary' >
									</td>
									<td>
										<input name='QTY_PO[]' onclick='select()' onblur='hitung()' id='QTY_PO${i}' value="${resp[i].SISA}" type='text' style='text-align: right' class='form-control QTY_PO text-primary' readonly>
										<input hidden name='SISA[]' onclick='select()' onblur='hitung()' id='SISA{i}' value="${resp[i].SISA}" type='text' style='text-align: right' class='form-control SISA text-primary' readonly>
									</td>
									<td>
										<input name='SATUAN[]' id='SATUAN${i}' value="${resp[i].SATUAN}" type='text' class='form-control  SATUAN' readonly>
									</td>
                                    <td>
										<input name='QTY[]' onclick='select()' onblur='hitung()' id='QTY${i}' value="${resp[i].QTY}" type='text' style='text-align: right' class='form-control QTY text-primary' readonly >
									</td>
									<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
										<input name='HARGA[]' onclick='select()' onblur='hitung()' id='HARGA${i}' value="${resp[i].HARGA}" type='text' style='text-align: right' class='form-control HARGA text-primary' readonly >
									</td>
									<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
										<input name='TOTAL[]' onclick='select()' onblur='hitung()' id='TOTAL${i}' value="${resp[i].TOTAL}" type='text' style='text-align: right' class='form-control TOTAL text-primary' readonly >
									</td>
									<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
										<input name='PPNX[]' onclick='select()' onblur='hitung()' id='PPNX${i}' value="${resp[i].PPN}" type='text' style='text-align: right' class='form-control PPNX text-primary' readonly >
									</td>
									<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }} >
										<input name='DPP[]' onclick='select()' onblur='hitung()' id='DPP${i}' value="${resp[i].DPP}" type='text' style='text-align: right' class='form-control DPP text-primary' readonly >
									</td>
									<td {{( Auth::user()->divisi=='gudang' ) ? 'hidden' : '' }}>
										<input name='PDISK[]' onclick='select()' onblur='hitung()' id='PDISK${i}' value="${resp[i].PDISK}" type='text' style='text-align: right' class='form-control PDISK text-primary'  >
										<input hidden name='DISK[]' onclick='select()' onblur='hitung()' id='DISK${i}' value="${resp[i].DISK}" type='text' style='text-align: right' class='form-control DISK text-primary'  >
										
									</td>
									<td><input name='KET[]' id='KET${i}' value="" type='text' class='form-control  KET'></td>
                                    

									<td><button type='button' class='btn btn-sm btn-circle btn-outline-danger btn-delete' onclick=''> <i class='fa fa-fw fa-trash'></i> </button></td>
                                </tr>`;
					}
					$('#detailPod').html(html);

					$(".XQTY").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".XQTY").autoNumeric('update');
					
					$(".QTY_PO").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".QTY_PO").autoNumeric('update');

					$(".QTY").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".QTY").autoNumeric('update');
					
					$(".HARGA").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".HARGA").autoNumeric('update');
					
					$(".KALI").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".KALI").autoNumeric('update');
					
					$(".TOTAL").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".TOTAL").autoNumeric('update');
					
					$(".PPNX").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".PPNX").autoNumeric('update');
					
					$(".DPP").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".DPP").autoNumeric('update');

					$(".PDISK").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});

					$(".PDISK").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".PDISK").autoNumeric('update');

					
					$(".DISK").autoNumeric('init', {aSign: '', vMin: '-999999999.99'});
					$(".DISK").autoNumeric('update');


					idrow=resp.length;
					baris=resp.length;

					nomor();
					hitung();
				}
			});
	}

//////////////////////////////////////////////////////////////////

		var dTableBBarang;
		var rowidBarang;
		loadDataBBarang = function(){
			$.ajax(
			{
				type: 'GET',    
				url: "{{url('po/browse_detail2')}}",
				data: 
				{
                    KD_BRG : $("#KD_BRG"+rowidBarang).val(),
                    NO_PO : $("#NO_PO").val(), 					
				},				
				
				success: function( response )
				{
					resp = response;
					if(dTableBBarang){
						dTableBBarang.clear();
					}
					for(i=0; i<resp.length; i++){
						
						dTableBBarang.row.add([
							'<a href="javascript:void(0);" onclick="chooseBarang(\''+resp[i].KD_BRG+'\',\''+resp[i].NA_BRG+'\', \''+resp[i].SATUAN_PO+'\' , \''+resp[i].QTY_PO+'\' , \''+resp[i].KIRIM+'\' , \''+resp[i].SISA+'\' , \''+resp[i].HARGA+'\', \''+resp[i].SATUAN+'\', \''+resp[i].QTY+'\', \''+resp[i].KALI+'\'  )">'+resp[i].KD_BRG+'</a>',
							resp[i].NA_BRG,
							resp[i].SATUAN_PO,
							resp[i].QTY_PO,
							resp[i].KIRIM,
							resp[i].SISA,
							resp[i].HARGA,							
						]);
					}
					dTableBBarang.draw();
				}
			});
		}
		
		dTableBBarang = $("#table-bbarang").DataTable({
			
		});
		
		browseBarang = function(rid){
			rowidBarang = rid;
			loadDataBBarang();
			$("#browseBarangModal").modal("show");
		}
		
		chooseBarang = function(KD_BRG, NA_BRG, SATUAN_PO, QTY_PO, KIRIM, SISA, HARGA, SATUAN, QTY, KALI ){
			$("#KD_BRG"+rowidBarang).val(KD_BRG);
			$("#NA_BRG"+rowidBarang).val(NA_BRG);
			$("#SATUAN_PO"+rowidBarang).val(SATUAN_PO);
			$("#QTY_PO"+rowidBarang).val(SISA);
			$("#HARGA"+rowidBarang).val(HARGA);
			$("#SATUAN"+rowidBarang).val(SATUAN);			
			$("#QTY"+rowidBarang).val(QTY);			
			$("#KALI"+rowidBarang).val(KALI);			
			$("#browseBarangModal").modal("hide");
			hitung();
		}
		
		
		$("#KD_BRG0").keypress(function(e){
			if(e.keyCode == 46){
				e.preventDefault();
				browseBarang(0);
			}
		}); 

	});


///////////////////////////////////////		
    

    function cekDetail(){
		var cekBarang = '';
		$(".KD_BRG").each(function() {
			
			let z = $(this).closest('tr');
			var KD_BRGX = z.find('.KD_BRG').val();
			var QTY_POX = parseFloat(z.find('.QTY_PO').val().replace(/,/g, ''));
			var SISAX = parseFloat(z.find('.SISA').val().replace(/,/g, ''));

			// alert(QTYX);
			// alert(SEDIAX);
			
			if( KD_BRGX =="" )
			{
					cekBarang = '1';
					
			}	

			if( QTY_POX > SISAX )
			{
					cekBarang = '1';
					
			}	
		});
		
		return cekBarang;
	}
	

 	function simpan() {
		hitung();
		
		var tgl = $('#TGL').val();
		var bulanPer = {{session()->get('periode')['bulan']}};
		var tahunPer = {{session()->get('periode')['tahun']}};
		
        var check = '0';

			if (cekDetail())
    		{	
    			check = '1';
    
    			Swal.fire({
    				icon: 'warning',
    				title: 'Warning',
    				text: '#Periksa Barang dan QTY PO, QTY PO tidak boleh melebihi SISA PO'
    			});
    			return;
    		}
			
			if ( $('#KODES').val()=='' ) 
            {				
			    check = '1';
				Swal.fire({
					icon: 'warning',
					title: 'Warning',
					text: 'Suplier# Harus Diisi.'
				});
				return; // Stop function execution
			}


////////////////////////////////////////////////////////////////////////////////////////
		$tipx = $('#tipx').val();
		
        if ( $tipx != 'new' )
		{
		    
		    $pkp00 = $('#PKP').val();
		    $pkp11 = $('#ZPKP').val();
		    
		    
		    
			if ( $pkp00 != $pkp11   ) 
            {
               
                check = '1';
				Swal.fire({
					icon: 'warning',
					title: 'Warning',
					text: 'Type PKP beda dengan Type PKP awal.'
				});
				return;
                
            }			 
		}



////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////

			if ( tgl.substring(3,5) != bulanPer ) 
			{
				check = '1';
				Swal.fire({
					icon: 'warning',
					title: 'Warning',
					text: 'Bulan tidak sama dengan Periode'
				});
				return; // Stop function execution
			}	
			

			if ( tgl.substring(tgl.length-4) != tahunPer )
			{
				check = '1';
				Swal.fire({
					icon: 'warning',
					title: 'Warning',
					text: 'Tahun tidak sama dengan Periode'
				});
				return; // Stop function execution
		    }	 
			
			if (baris==0)
			{
				check = '1';
				Swal.fire({
					icon: 'warning',
					title: 'Warning',
					text: 'Data detail kosong (Tambahkan 1 baris kosong jika ingin mengosongi detail)'
				});
				return;
			}

			if (check == '0') {
				Swal.fire({
					title: 'Are you sure?',
					text: 'Are you sure you want to save?',
					icon: 'question',
					showCancelButton: true,
					confirmButtonText: 'Yes, save it!',
					cancelButtonText: 'No, cancel',
				}).then((result) => {
					if (result.isConfirmed) {
						document.getElementById("entri").submit();
					} else {
						Swal.fire({
							icon: 'info',
							title: 'Cancelled',
							text: 'Your data was not saved'
						});
					}
				});
			} else {
				Swal.fire({
					icon: 'error',
					title: 'Error',
					text: 'Masih ada kesalahan'
				});
			}

		// tutupannya
			
			$("#LOADX").hide();
	}
		
    function nomor() {
		var i = 1;
		$(".REC").each(function() {
			$(this).val(i++);
		});
		
	//	hitung();
	
	}

   function hitung() {
       
		var TTOTAL_QTY = 0;
		var TTOTAL_XQTY = 0;
		var TTOTAL = 0;
		var TDISK = 0;
		var TDPPX = 0;
		var TPPNX = 0;
		var NETTX = 0;

		
		$(".QTY_PO").each(function() {
			
			let z = $(this).closest('tr');
			var QTY_POX = parseFloat(z.find('.QTY_PO').val().replace(/,/g, ''));
			var XQTYX = parseFloat(z.find('.XQTY').val().replace(/,/g, ''));
			var XX = parseFloat(z.find('.KALI').val().replace(/,/g, ''));
			var HARGAX = parseFloat(z.find('.HARGA').val().replace(/,/g, ''));
			var PPN = parseFloat(z.find('.PPNX').val().replace(/,/g, ''));
			var PDISKX = parseFloat(z.find('.PDISK').val().replace(/,/g, ''));
			var DISKX = parseFloat(z.find('.DISK').val().replace(/,/g, ''));
			
			var PKPX  = $('#PKP').val();

			var FLAGZ = $('#flagz').val();
	

			var QTYX  = ( XQTYX * XX );
			z.find('.QTY').val(QTYX);

		    z.find('.KALI').autoNumeric('update');	
		    z.find('.QTY').autoNumeric('update');	

            if ( PDISKX <= 100 )
            {
                 DISKX =  ( XQTYX * HARGAX ) * PDISKX /100 ;
            
            }
            else
            {
                
                 DISKX = PDISKX ;
                 
            }
            
			z.find('.DISK').val(DISKX);
			
            
            var TOTALX  =  ( XQTYX * HARGAX ) - DISKX;
            
			z.find('.TOTAL').val(TOTALX);


			var DPPX = 0 ;
			var PPNX = 0;
			
            DPPX = TOTALX;
	     	z.find('.DPP').val(DPPX);

			if (PKPX == '0' ) {
			    PPNX = 0;
			    
			} 

	     		
			if (PKPX == '1' ) {
			    DPPX = TOTALX * 100/111;
			    PPNX = TOTALX - DPPX;
	     	    z.find('.DPP').val(DPPX);
	     	
			} 


            
			z.find('.PPNX').val(PPNX);	

		    z.find('.HARGA').autoNumeric('update');			
		    z.find('.QTY').autoNumeric('update');	
		    z.find('.XQTY').autoNumeric('update');	
		    z.find('.TOTAL').autoNumeric('update');				
		    z.find('.DPP').autoNumeric('update');			
		    z.find('.DISK').autoNumeric('update');			
		    z.find('.PPNX').autoNumeric('update');		

            TTOTAL_QTY +=QTYX;		
            TTOTAL_XQTY +=XQTYX;	
            TTOTAL +=TOTALX;				
            TPPNX +=PPNX;
            TDPPX +=DPPX;
            
            TDISK +=DISKX;				
		
		});

		
		NETTX = TTOTAL ;

		
		if(isNaN(TTOTAL_XQTY)) TTOTAL_XQTY = 0;

		$('#TTOTAL_XQTY').val(numberWithCommas(TTOTAL_XQTY));		
		$("#TTOTAL_XQTY").autoNumeric('update');
		
		if(isNaN(TTOTAL_QTY)) TTOTAL_QTY = 0;

		$('#TTOTAL_QTY').val(numberWithCommas(TTOTAL_QTY));		
		$("#TTOTAL_QTY").autoNumeric('update');
		
		
		if(isNaN(TTOTAL)) TTOTAL = 0;

		$('#TTOTAL').val(numberWithCommas(TTOTAL));		
		$("#TTOTAL").autoNumeric('update');

		$('#TDISK').val(numberWithCommas(TDISK));		
		$("#TDISK").autoNumeric('update');


		$('#TDPP').val(numberWithCommas(TDPPX));		
		$("#TDPP").autoNumeric('update');
		
		$('#TPPN').val(numberWithCommas(TPPNX));		
		$("#TPPN").autoNumeric('update');

		$('#NETT').val(numberWithCommas(NETTX));		
		$("#NETT").autoNumeric('update');

		
	}
	

	
  
	function baru() {
		
		 kosong();
		 hidup();
	
	}
	
	function ganti() {
		
// 		 mati();
		 hidup();
	
	}
	
	function batal() {
		
		// alert($header[0]->NO_BUKTI);
		
		 //$('#NO_BUKTI').val($header[0]->NO_BUKTI);	
		 mati();
	
	}
	
 

	
	
	function hidup() {

		
		$("#TOPX").attr("disabled", true);
	    $("#PREVX").attr("disabled", true);
	    $("#NEXTX").attr("disabled", true);
	    $("#BOTTOMX").attr("disabled", true);

	    $("#NEWX").attr("disabled", true);
	    $("#EDITX").attr("disabled", true);
	    $("#UNDOX").attr("disabled", false);
	    $("#SAVEX").attr("disabled", false);
		
	    $("#HAPUSX").attr("disabled", true);
	    $("#CLOSEX").attr("disabled", false);

		$("#CARI").attr("readonly", true);	
	    $("#SEARCHX").attr("disabled", true);
		
	    $("#PLUSX").attr("hidden", false)
		   
			$("#NO_BUKTI").attr("readonly", true);		   
			$("#TGL").attr("readonly", false);
			$("#KODES").attr("readonly", true);
			$("#NAMAS").attr("readonly", true);			
			$("#ALAMAT").attr("readonly", true);
			$("#KOTA").attr("readonly", true);
			
			$("#NO_FAKTUR").attr("readonly", false);
			$("#TGL_FAKTUR").attr("readonly", false);
			$("#JTEMPO").attr("readonly", true);
			
			$("#NOTES").attr("readonly", false);
			$("#TYPE").attr("readonly", false);
	        $("#PKP").attr("disabled", true);

			$("#TDPP").attr("readonly", true);			
			$("#TPPN").attr("readonly", true);
			$("#NETT").attr("readonly", true);	
			$("#TTOTAL").attr("readonly", true);	

		jumlahdata = 100;
		for (i = 0; i <= jumlahdata; i++) {
			$("#REC" + i.toString()).attr("readonly", true);
			$("#KD_BRG" + i.toString()).attr("readonly", false);
			$("#NA_BRG" + i.toString()).attr("readonly", true);
			$("#SATUAN_PO" + i.toString()).attr("readonly", true);
			$("#XQTY" + i.toString()).attr("readonly", false );
			$("#QTY_PO" + i.toString()).attr("readonly", true );
			$("#KALI" + i.toString()).attr("readonly", false );
			$("#SATUAN" + i.toString()).attr("readonly", true);
			$("#QTY" + i.toString()).attr("readonly", true);
			$("#HARGA" + i.toString()).attr("readonly", true);
			$("#TOTAL" + i.toString()).attr("readonly", true);
			$("#DPP" + i.toString()).attr("readonly", true);
			$("#PPN" + i.toString()).attr("readonly", true);
			$("#PDISK" + i.toString()).attr("readonly", false);
			$("#DISK" + i.toString()).attr("readonly", true);
			$("#KET" + i.toString()).attr("readonly", false);
			$("#DELETEX" + i.toString()).attr("hidden", false);

			$tipx = $('#tipx').val();
		
			
			if ( $tipx != 'new' )
			{
				$("#KD_BRG" + i.toString()).attr("readonly", true);	
				$("#KD_BRG" + i.toString()).removeAttr('onblur');
			}
		}

		
	}


	function mati() {

		
	    $("#TOPX").attr("disabled", false);
	    $("#PREVX").attr("disabled", false);
	    $("#NEXTX").attr("disabled", false);
	    $("#BOTTOMX").attr("disabled", false);


	    $("#NEWX").attr("disabled", false);
	    $("#EDITX").attr("disabled", false);
	    $("#UNDOX").attr("disabled", true);
	    $("#SAVEX").attr("disabled", true);
	    $("#HAPUSX").attr("disabled", false);
	    $("#CLOSEX").attr("disabled", false);

		$("#CARI").attr("readonly", false);	
	    $("#SEARCHX").attr("disabled", false);
		
		
	    $("#PLUSX").attr("hidden", true)
		
	    $(".NO_BUKTI").attr("readonly", true);	
		
		$("#TGL").attr("readonly", true);
		$("#KODES").attr("readonly", true);
		$("#NAMAS").attr("readonly", true);
		$("#ALAMAT").attr("readonly", true);
		$("#KOTA").attr("readonly", true);
	    $("#PKP").attr("disabled", true);

			$("#NO_FAKTUR").attr("readonly", true);
			$("#TGL_FAKTUR").attr("readonly", true);
			$("#JTEMPO").attr("readonly", true);
			$("#TYPE").attr("readonly", true);

		$("#TDPP").attr("readonly", true);			
		$("#TPPN").attr("readonly", true);
		$("#NETT").attr("readonly", true);		
		$("#TTOTAL").attr("readonly", true);		
		
		$("#NOTES").attr("readonly", true);

		
		jumlahdata = 100;
		for (i = 0; i <= jumlahdata; i++) {
			$("#REC" + i.toString()).attr("readonly", true);
			$("#KD_BRG" + i.toString()).attr("readonly", true);
			$("#NA_BRG" + i.toString()).attr("readonly", true);
			$("#SATUAN_PO" + i.toString()).attr("readonly", true);
			$("#XQTY" + i.toString()).attr("readonly", true);
			$("#QTY_PO" + i.toString()).attr("readonly", true);
			$("#KALI" + i.toString()).attr("readonly", true);
			$("#SATUAN" + i.toString()).attr("readonly", true);
			$("#QTY" + i.toString()).attr("readonly", true);
			$("#HARGA" + i.toString()).attr("readonly", true);
			$("#TOTAL" + i.toString()).attr("readonly", true);
			$("#DPP" + i.toString()).attr("readonly", true);
			$("#PPN" + i.toString()).attr("readonly", true);
			$("#PDISK" + i.toString()).attr("readonly", true);
			$("#DISK" + i.toString()).attr("readonly", true);
			$("#KET" + i.toString()).attr("readonly", true);

			$("#DELETEX" + i.toString()).attr("hidden", true);
		}


		
	}


	function kosong() {
				
		 $('#NO_BUKTI').val("+");		
		 $('#KODES').val("");	
		 $('#NAMAS').val("");	
		 $('#ALAMAT').val("");	
		 $('#KOTA').val("");	
		 $('#NOTES').val("");	
		 $('#NO_PO').val("");
		 $('#PPN').val("0.00");
		 $('#NETT').val("0.00");
		 $('#DPP').val("0.00");
		 $('#PPNX').val("0.00");		 

		 $('#TTOTAL_XQTY').val("0.00");
		 
		 $('#TTOTAL_QTY').val("0.00");
		 $('#TTOTAL').val("0.00");		 
		 $('#TDISK').val("0.00");	
		 $('#TDPP').val("0.00");	
		 
		var html = '';
		$('#detailx').html(html);	
		
	}
	
	function hapusTrans() {
		let text = "Hapus Transaksi "+$('#NO_BUKTI').val()+"?";
		if (confirm(text) == true) 
		{
			window.location ="{{url('/beli/delete/'.$header->NO_ID .'/?flagz='.$flagz.'&golz=' .$golz.'' )}}";
			//return true;
		} 
		return false;
	}

	// sweetalert untuk tombol hapus dan close
	
	function hapusTrans() {
		let text = "Hapus Transaksi "+$('#NO_BUKTI').val()+"?";

		var loc ='';
		var flagz = "{{ $flagz }}";
		var golz = "{{ $golz }}";
		
		Swal.fire({
			title: 'Are you sure?',
			text: text,
			icon: 'warning',
			showCancelButton: true,
			confirmButtonColor: '#3085d6',
			cancelButtonColor: '#d33',
			confirmButtonText: 'Yes, delete it!',
			cancelButtonText: 'Cancel'
		}).then((result) => {
			if (result.isConfirmed) {
				// Show a success message before redirecting to delete the data
				Swal.fire({
					title: 'Deleted!',
					text: 'Data has been deleted.',
					icon: 'success',
					confirmButtonText: 'OK'
				}).then(() => {
					// Redirect to delete the data after user confirms the success message
	            	loc = "{{ url('/beli/delete/'.$header->NO_ID) }}" + '?flagz=' + encodeURIComponent(flagz) + 
						  '&golz=' + encodeURIComponent(golz) ;

		            // alert(loc);
	            	window.location = loc;
		
				});
			}
		});
	}
	
	function closeTrans() {
		var loc ='';
		var flagz = "{{ $flagz }}";
		var golz = "{{ $golz }}";
		
		Swal.fire({
			title: 'Are you sure?',
			text: 'Do you really want to close this page? Unsaved changes will be lost.',
			icon: 'warning',
			showCancelButton: true,
			confirmButtonText: 'Yes, close it',
			cancelButtonText: 'No, stay here'
		}).then((result) => {
			if (result.isConfirmed) {
	        	loc = "{{ url('/beli/') }}" + '?flagz=' + encodeURIComponent(flagz) + '&golz=' + encodeURIComponent(golz) ;
				window.location = loc ;
			} else {
				Swal.fire({
					icon: 'info',
					title: 'Cancelled',
					text: 'You stayed on the page'
				});
			}
		});
	}

	// tutupannya
	

	function CariBukti() {
		
		var flagz = "{{ $flagz }}";
		var golz = "{{ $golz }}";
		var cari = $("#CARI").val();
		var loc = "{{ url('/beli/edit/') }}" + '?idx={{ $header->NO_ID}}&tipx=search&flagz=' + encodeURIComponent(flagz) + '&golz=' + encodeURIComponent(golz) + '&buktix=' +encodeURIComponent(cari);
		window.location = loc;
		
	}


    // function tambah() {

    //     var x = document.getElementById('datatable').insertRow(baris + 1);
 
	// 	html=`<tr>

    //             <td>
 	// 				<input name='NO_ID[]' id='NO_ID${idrow}' type='hidden' class='form-control NO_ID' value='new' readonly> 
	// 				<input name='REC[]' id='REC${idrow}' type='text' class='REC form-control' onkeypress='return tabE(this,event)' readonly>
	//             </td>
				
	// 				<td {{( $golz =='J') ? '' : 'hidden' }} >
	// 			    <input name='KD_BRG[]' data-rowid=${idrow} onblur='browseBarang(${idrow})' id='KD_BRG${idrow}' type='text' class='form-control  KD_BRG' >
    //             </td>
    //             <td {{( $golz =='J') ? '' : 'hidden' }} >
	// 			    <input name='NA_BRG[]'   id='NA_BRG${idrow}' type='text' class='form-control  NA_BRG' required readonly>
    //             </td>


    //             <td>
	// 			    <input name='SATUAN_PO[]'   id='SATUAN_PO${idrow}' type='text' class='form-control  SATUAN_PO' readonly>
    //             </td>
				
	// 			<td>
	// 	            <input name='QTY_PO[]' onclick ='select()' onblur='hitung()' value='0' id='QTY_PO${idrow}' type='text' style='text-align: right' class='form-control QTY_PO text-primary' >
    //             </td>

	// 			<td>
	// 			    <input name='KALI[]' onclick ='select()' value='0' onblur='hitung()'  id='KALI${idrow}' type='text' class='form-control  KALI'>
    //             </td>
				
    //             <td>
	// 			    <input name='SATUAN[]' id='SATUAN${idrow}' type='text' class='form-control  SATUAN' readonly>
    //             </td>
				
	// 			<td>
	// 	            <input name='QTY[]' onclick ='select()' onblur='hitung()' value='0' id='QTY${idrow}' type='text' style='text-align: right' class='form-control QTY text-primary' readonly >
    //             </td>

	// 			<td>
	// 	            <input name='HARGA[]' onclick ='select()' onblur='hitung()' value='0' id='HARGA${idrow}' type='text' style='text-align: right' class='form-control HARGA text-primary' required >
    //             </td>

	// 			<td>
	// 	            <input name='TOTAL[]'  onblur='hitung()' value='0' id='TOTAL${idrow}' type='text' style='text-align: right' class='form-control TOTAL text-primary' readonly required >
    //             </td>

	// 			<td>
	// 	            <input name='PPNX[]'  onblur='hitung()' value='0' id='PPNX${idrow}' type='text' style='text-align: right' class='form-control PPNX text-primary' readonly required >
    //             </td>

	// 			<td>
	// 				<input name='DPP[]'  onblur='hitung()' value='0' id='DPP${idrow}' type='text' style='text-align: right' class='form-control DPP text-primary' readonly required >
	// 			</td>					
							
    //             <td>
	// 			    <input name='KET[]'   id='KET${idrow}' type='text' class='form-control  KET' required>
    //             </td>
				
    //             <td>
	// 				<button type='button' id='DELETEX${idrow}'  class='btn btn-sm btn-circle btn-outline-danger btn-delete' onclick=''> <i class='fa fa-fw fa-trash'></i> </button>
    //             </td>				
    //      </tr>`;
				
    //     x.innerHTML = html;
    //     var html='';
		
		
		
	// 	jumlahdata = 100;
	// 	for (i = 0; i <= jumlahdata; i++) {
	// 		$("#QTY_PO" + i.toString()).autoNumeric('init', {
	// 			aSign: '',
	// 			vMin: '-999999999.99'
	// 		});

	// 		$("#HARGA" + i.toString()).autoNumeric('init', {
	// 			aSign: '',
	// 			vMin: '-999999999.99'
	// 		});

			
	// 		$("#TOTAL" + i.toString()).autoNumeric('init', {
	// 			aSign: '',
	// 			vMin: '-999999999.99'
	// 		});
			
			
	// 		$("#KALI" + i.toString()).autoNumeric('init', {
	// 			aSign: '',
	// 			vMin: '-999999999.99'
	// 		});
			
	// 		$("#QTY" + i.toString()).autoNumeric('init', {
	// 			aSign: '',
	// 			vMin: '-999999999.99'
	// 		});
			
	// 		$("#DPP" + i.toString()).autoNumeric('init', {
	// 			aSign: '',
	// 			vMin: '-999999999.99'
	// 		});
			
	// 		$("#PPNX" + i.toString()).autoNumeric('init', {
	// 			aSign: '',
	// 			vMin: '-999999999.99'
	// 		});


			
	// 	}



    //     idrow++;
    //     baris++;
    //     nomor();
		
	// 	$(".ronly").on('keydown paste', function(e) {
    //          e.preventDefault();
    //          e.currentTarget.blur();
    //      });
    //  }
</script>

<script src="autonumeric.min.js" type="text/javascript"></script>
<script src="https://cdn.jsdelivr.net/npm/autonumeric@4.5.4"></script>
<script src="https://unpkg.com/autonumeric"></script>
@endsection