@extends('layout')


@section('content')

<div class="page-header page-header-default">
	<div class="breadcrumb-line">
		<ul class="breadcrumb">
			<li><a href="index.html"><i class="icon-home2 position-left"></i> Inventori</a></li>
			<li class="active">Persediaan</li>
		</ul>
	</div>
</div>

<div class="content">
	<div class="panel panel-flat">
		<div class="panel-heading">
			<h5 class="panel-title">Detail Persediaan Barang</h5>
			<div class="heading-elements">
				<ul class="icons-list">
		      		<li><a data-action="collapse"></a></li>
		      	</ul>
	       	</div>
	    </div>
	    <div class="panel-body">
	    </div>

	    <table class="table table-stripped" id="tabel_persediaan">
	    	<thead>
				<tr>
					<th>No</th>
					<th>Kode Barang</th>
					<th>Nama Barang</th>
					<th>Gudang</th>
                    <th>Jumlah</th>
				</tr>
			</thead>
			<tbody>

			</tbody>
	    </table>
	</div>
</div>

<script type="text/javascript">
	var tp;
	var id = '{{ $data['id'] }}';

	$(document).ready(function(){
		tp = $("#tabel_persediaan").DataTable();

		tp.on( 'order.dt search.dt', function () {
            tp.column(0, {search:'applied', order:'applied'}).nodes().each( function (cell, i) {
                cell.innerHTML = i+1;
            } );
        } ).draw();
        tp.clear().draw();

        get_data();
        
	})

	function get_data(){
		$.ajax({
			url: '{{ url('persediaan/get_barang') }}',
			type: 'post',
			data: {id : id},
			headers : {
					'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
				},
			success: function(respon){
				tp.clear().draw();
				for(i in respon){
					tp.row.add(['<div><center></center></div>',
						'<div>'+respon[i].kode_barang+'</div>',
						'<div>'+respon[i].nama_barang+'</div>',
						'<div>'+respon[i].nama_gudang+'</div>',
						'<div>'+respon[i].jum_barang+'</div>'
					]).draw(false);
				}
			}
		})
	}
</script>
@endsection