@extends('hr_main')
@section('title', '| ' . $data['pageTitle'])
@section('content')

<div class="row">

    <div class="col-md-12">

        <div class="" style="">

            <div class="">

                <div class="panel panel-default" style="background-color:#708090;">

                    <div class="panel-heading" style="padding-bottom:0px">

                        <div class="panel-title">
                            <h2>{!! $data['pageTitle'] !!}</h2>
                        </div>

                        <div class="panel-options">
                            <a href="{!! $data['addBtnUrl'] !!}" class="btn btn-info pull-right addViewBtn">
                                <i class="glyphicon glyphicon-plus-sign addIcon"></i>{!! $data['addBtnLabel'] !!}
                            </a>
                        </div>

                    </div>

                    <div class="panel-body panelBodyView">

                        @php
                            $searchElements = [
                                ['element' => 'reporting_boss_config'],
                                ['element' => 'status']
                            ];
                        @endphp
                        
                        @include('partials.searchPanel.main', ['searchElements' => $searchElements])
                        
                        <table class="table table-striped table-bordered table-condensed first-col-dark" id="datatable">
                            <thead>
                                <tr>
                                    <th style="width:4%">SL#</th>
                                    <th style="width:5%">Project</th>
                                    <th style="width:6%">Applicable For</th>
                                    <th style="width:8%">Configuration For</th>
                                    <th style="width:5%">Effect Date</th>
                                    <th style="width:22%">Employee Designation / Name</th>
                                    <th style="width:22%">Boss Designation / Name</th>
                                    <th style="width:5%">Action</th>
                                </tr>
                            </thead>
                        </table>

                    </div>

                </div>

            </div>

        </div>

    </div>

</div>

<script>

    $(document).ready(function() 
    {
        var dataTable = $('#datatable').DataTable({
            "sDom": "ltipr", // For removing default Search bar //
            "processing": true,
            "serverSide": true,
            "ordering": false,
            "language": 
            {
                "processing": $('#loadingModal').show(),
            },
            "ajax": 
            {
                "url": "{{ Request::url() }}",
                "type": "POST",
                "data": function(d)
                {
                    var inputs = {};
                        
                    $.each($('form').serializeArray(), function() 
                    {
                        inputs[this.name] = this.value;
                    });

                    d._token = "{{ csrf_token() }}";
                    d.filter = inputs;
                }
            },

            "columns": [
                {
                    "data": "sl"
                },
                {
                    "data": "project_name"
                },
                {
                    "data": "applicable_for"
                },
                {
                    "data": "configuration_for"
                },
                {
                    "data": "effect_date"
                },
                {
                    "data": "emp_designation_or_name"
                },
                {
                    "data": "boss_designation_or_name"
                },
                {
                    "data": "id"
                }
            ],

            "columnDefs": [
            {
                "targets": -1,
                "data": "id",
                "render": function(data, type, row) 
                {
                    var updateIcon = '<a href="{{ Request::url() }}/edit/' + data + '" class="btn btn-xs btn-info"><i class="fa fa-edit" aria-hidden="true"></i></a>';
                    var deleteIcon = '<a href="#" class="btn btn-xs btn-danger" onclick="deleteRecord('+ data +')"><i class="fa fa-trash"></i></a>';

                    return (updateIcon + deleteIcon);
                }
            }]
        });

        $("#searchForm").submit(function(e) 
        {
            e.preventDefault();
            dataTable.draw();

        });

    });

    function deleteRecord(id)
    {   
        var val = confirm('Are you sure want to delete?');

        if(val == true)
        {   
            $.ajax({
                url: './reporting-boss-config/delete',
                type: 'GET',
                dataType: 'json',
                data: { id: id}
            })
            .done(function(__response) 
            {   
                if(__response.status == true)
                {
                    toastr.success(__response.message);                        
                    setTimeout(function(){ location.reload(); }, 1000);
                }
                else if(__response.status == false)
                {
                    toastr.error(__response.message);               
                }
                else
                {
                    alert("something went wrong");
                }

            })
            .fail(function() 
            {
                $("#add").prop('disabled',false);
                alert("Response error");
            });
        
        }

    }

</script>
@endsection