<!DOCTYPE html>
<html>
<head>
    <style>
        #product th { height:0px; }      
        
        #___product td { height:50px; }
        #___product tr { border-bottom:1px gray solid; }     
        
        
    </style>
</head>    
@extends('layouts.formorder')

<body>
    
<div class="container-fluid" style="width:100%;">
    
@section('header')
@endsection

@section('isi')   

<div class="row" style="margin-top:-210px; margin-left:-23px; margin-right:-23px;">
  <div class="col-xs-0 col-sm-0 col-md-3"></div>  
    <div class="col-sm-12 col-md-6 col-xs-12">
        
      <div class="card" style="width:100% height:auto;  margin: 1px 2px 5px 2px; padding: 15px 10px;">
        <div class="card-block">
            
        <div class="text-right" style="margin-top:-10px;">
            <a href="{{ route('home') }}" class="btn_close" style="background-color:transparent; color:black;"><i class="fa fa-times"></i></a> 
    	</div>              
    	
    	<h5 class="text-left" style="margin-top:-10px; margin-left:10px;">Master Product</h5>

<table "table table-responsive" id="product" width="100%">
  <thead>
    <tr>
        <th width="100%"></th>
    </tr>
  </thead>
  <tbody></tbody>
</table>

       </div>
	 </div>
  </div>
</div>	
@endsection

@section('footer')
@endsection

</div>

@section('script')

<script type="text/javascript">

showData();

function showData(){
    $(function(){
    	$.fn.dataTable.ext.errMode = 'throw';
    	table = $('#product').DataTable({
    		 "paging": true,
    		 "iDisplayLength": 1000,
         	 "processing" : true,
    		 "destroy": true,
    		 "sort": false,
    		 "dom" : "bft",
    		 "ajax" : {
    			"url" : "{{ DIR_APP }}product/masterproduct",
    			"type" : "GET"
    		}
    	}); 
    });
}

/*
$(document).ready(function() {
	var table = $('#product').DataTable ({
        "processing": true,
        "serverSide": true,
    	"iDisplayLength": 10000,
        "dom": "bft",
        "ajax": "{{ route('product.getdata') }}",
        "columns":[
            { "data": "nama_brg" },
            { 
                "data": "cat_name",
                "sClass": "text",
                "orderable":true,
                "searchable":false
            },
            {
              "data": "deskripsi",
              "width": "0%",
              "visible": false,
              "searchable": true
            },
            { "data" : "harga_retail" },
			{
                "data": "id",
                "sClass": "text-center",
                "orderable": false,
                "mRender": function (data) {
                           return '<a onclick="tampilImage('+data+')" class="btn btn-flat btn-md"><i class="fa fa-picture-o fa-2x"></i></a>';
                         }
            }

            ], "columnDefs": [
              {
                  "targets": 3,
                  "data": "Action_Link",
                  "orderable": false,
                  "className": "text-right",
                  "render": function (data, type, full, meta) {
                    return formatAngka(data);
                  }
              }                
            ]

     });
});
*/


function formatAngka(x) {
    x = x.toString();
    var pattern = /(-?\d+)(\d{3})/;
    while (pattern.test(x))
        x = x.replace(pattern, "$1,$2");
    return x;
}

function removeImage(id){
	
	$.ajax({
		url : "{{ DIR_APP }}product/"+id+"/removeimage",
		type : "GET",
		dataType : "JSON",
		success : function(data){    
			tbldetail.ajax.reload();
			}
		});		

}

</script>

@endsection

</body>

</html>