<?php echo View::make('/../include/header'); ?>

<!-- <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.css" rel="stylesheet"> -->
<link href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css" rel="stylesheet">
<head>
    <title>Datatables Server Side Processing in Laravel</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
    <script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>       
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" />
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>


    <section id="main-content">
      <section class="wrapper">
      <div class="row">
          <div class="col-lg-12 main-chart">
            <!--CUSTOM CHART START -->
            <div class="border-head">
              <h3>Update Product</h3>
            </div>

    <div align="right">
        <button type="button" name="add" id="add_data" class="btn btn-success btn-sm">Add Product</button>
    </div>
    <br />
    <table id="student_table" class="table table-bordered" style="width:100%">
        <thead>
            <tr>
                <th>Product Name</th>
                <th>Code</th>
                <th>Sell Price</th>
                <th>Cost</th>
                <th>Stock</th>
                <th>Action</th>
            </tr>
        </thead>
    </table>


<div id="studentModal" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <form method="post" id="student_form">
                <div class="modal-header">
                   <button type="button" class="close" data-dismiss="modal">&times;</button>
                   <h4 class="modal-title">Add Product</h4>
                </div>
                <div class="modal-body">
                    <?php echo e(csrf_field()); ?>

                    <span id="form_output"></span>
                    <div class="form-group">
                        <label>Product Name</label>
                        <input type="text" name="name" id="name" class="form-control" />
                    </div>
                    <div class="form-group">
                        <label>Product Code</label>
                        <input type="text" name="item_code" id="item_code" class="form-control" />
                    </div>
                    <div class="form-group">
                        <label>Sell Price</label>
                        <input type="number" name="sell_price" id="sell_price" class="form-control" />
                    </div>
                    <div class="form-group">
                        <label>Cost</label>
                        <input type="number" name="cost_price" id="cost_price" class="form-control" />
                    </div>
                    <div class="form-group">
                        <label>Stock</label>
                        <input type="number" name="stock" id="stock" class="form-control" />
                    </div>
                </div>
                <div class="modal-footer">
                     <input type="hidden" name="id" id="id" value="" />
                    <input type="hidden" name="button_action" id="button_action" value="insert" />
                    <input type="submit" name="submit" id="action" value="Add" class="btn btn-info" />
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </form>
        </div>
    </div>
</div>


        </div>
        </div>
      </section>
    </section>

<?php echo View::make('/../include/footer'); ?>

<script>
$(document).ready(function() {
    $('#example').DataTable();
} );
</script>
<script type="text/javascript">
$(document).ready(function() {
     $('#student_table').DataTable({
        "processing": true,
        "serverSide": true,
        "ajax": "<?php echo e(route('ajaxdata.getdata')); ?>",
        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
        "columns":[
            { "data": "name" },
            { "data": "item_code" },
            { "data": "sell_price" },
            { "data": "cost_price" },
            { "data": "stock" },
            { "data": "action", orderable:false, searchable: false}
        ]
     });

    $('#add_data').click(function(){
        $('#studentModal').modal('show');
        $('#student_form')[0].reset();
        $('#form_output').html('');
        $('#button_action').val('insert');
        $('#action').val('Add');
        $('.modal-title').text('Add Product');
    });

    $('#student_form').on('submit', function(event){
        event.preventDefault();
        var form_data = $(this).serialize();
        $.ajax({
            url:"<?php echo e(route('ajaxdata.postdata')); ?>",
            method:"POST",
            data:form_data,
            dataType:"json",
            success:function(data)
            {
                if(data.error.length > 0)
                {
                    var error_html = '';
                    for(var count = 0; count < data.error.length; count++)
                    {
                        error_html += '<div class="alert alert-danger">'+data.error[count]+'</div>';
                    }
                    $('#form_output').html(error_html);
                }
                else
                {
                    $('#form_output').html(data.success);
                    $('#student_form')[0].reset();
                    $('#action').val('Add');
                    $('.modal-title').text('Add Data');
                    $('#button_action').val('insert');
                    $('#student_table').DataTable().ajax.reload();
                }
            }
        })
    });

    $(document).on('click', '.edit', function(){
        var id = $(this).attr("id");
        $('#form_output').html('');
        $.ajax({
            url:"<?php echo e(route('ajaxdata.fetchdata')); ?>",
            method:'get',
            data:{id:id},
            dataType:'json',
            success:function(data)
            {
                $('#item_code').val(data.item_code);
                $('#name').val(data.name);
                $('#sell_price').val(data.sell_price);
                $('#cost_price').val(data.cost_price);
                $('#stock').val(data.stock);
                $('#id').val(id);
                $('#studentModal').modal('show');
                $('#action').val('Edit');
                $('.modal-title').text('Edit Data');
                $('#button_action').val('update');
            }
        })
    });

});
</script>
<script>
$(document).on('click', '.btn-danger', function (e) {
    e.preventDefault();
    var id = $(this).data('id');
    let ele = this;
    console.log(id);

                swal({
                title: "Are you sure?",
                text: "Are you Sure to Remove Product",
                icon: "warning",
                showCancelButton: true,
    confirmButtonColor: '#3085d6',
    cancelButtonColor: '#d33',
    confirmButtonText: 'Yes, delete it!',
                dangerMode: true,
            }).then(function(isConfirm) {
                
                if (isConfirm.value===true) {

                        $.ajax({
                            url: "<?php echo e(url('/deleteproduct')); ?>/"+id ,
                            method: "POST",
                            headers: {
                                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                            },
                            cache: false,
                            contentType: false,
                            processData: false,
                            dataType: 'JSON',
                            data:{
                                "id":id
                            },
                            success: function (result, code, ex) {
                                swal("Done!", "It was successfully deleted!", "success");
                                $(ele).closest('tr').hide();
                                // $("#here").load(location.href + " #here");
                            },
                            error: function (jqXHR, textStatus, errorThrown) {
                                swal("Warning", "Unable to Process your request", "error");
                            },
                        });

                } else {
                    swal("Cancelled", "No Product Removed", "error");
                }
            })
});
</script>
