@extends('template.app')



@section('meta')

@endsection



@section('title')

Vendor Master

@endsection



@section('styles')

<style>

     .highlight {

        background-color: #ffff99; /* Change to desired highlight color */

    }
    #data-table.dataTable tbody td {
        padding: 0px !important;
        height: 20px !important;
        line-height: 35px !important;
        font-size: 15px !important;
        text-align: center;
    }
    #data-table th {
        text-align: center;
    }

</style>

@endsection



@section('content')

<div class="page-breadcrumb">

    <div class="row">

        <div class="col-7 align-self-center">

            <h4 class="page-title text-truncate text-dark font-weight-medium mb-1">Vendor Master</h4>

            <div class="d-flex align-items-center">

                <nav aria-label="breadcrumb">

                    <ol class="breadcrumb m-0 p-0">

                        <li class="breadcrumb-item"><a href="{{ route('dashboard') }}" class="text-muted">Dashboard</a></li>

                        <li class="breadcrumb-item"><a href="{{ route('vendor') }}" class="text-muted">Vendor Master</a></li>

                        <li class="breadcrumb-item text-muted active" aria-current="page">List</li>

                    </ol>

                </nav>

            </div>

        </div>

        <div class="col-5 align-self-center">

            <div class="customize-input float-right">

                <!--@canany(['addvendor-create'])

                    <a class="btn waves-effect waves-light btn-rounded btn-outline-primary pull-right" href="{{ route('vendor.add') }}">Add Vendor</a>

                @endcanany-->

                    

            </div>

        </div>

        <div class="col-sm-8"></div>

    </div>

</div>

<div class="container-fluid">

    <div class="row">

        <div class="col-12">

            <div class="card">

                <div class="card-body table-responsive">

                     <div class="card-body table-responsive" id="datatable">

                    <table class="table table-bordered data-table" id="data-table">

                        <thead>

                            <tr>

                                <th>SR</th>

                                <th>Name of company</th>

                                <th>Vendor Code</th>

                                <th>Tally Heading</th>

                                <th>Description of Goods/Services</th>

                                <th>Location</th>

                                <th>Department</th>

                                  <th>Branch</th>

                                <th>Authoried Peroson</th>

                                <th>Authoried Person Contat Nnumber</th>

                                <th>Vendor List </th>

                                <th>Contact Person </th>

                                <th>Mobile no.</th>

                                <th>E-Mail ID</th>

                                <th>GST No</th>

                                <th>Pan No</th>

                                <th>Address</th>

                                <th>Bank Name</th>

                                <th>Account No</th>

                                <th>IFSC Code</th>

                                <th>Account Holder Name</th>

                                <th>Account Type</th>

                                <th>Distrcit</th>

                                <th>State</th>

                                <th>Mode of Payment</th>

                                <th>Working_year</th>

                                <th>Remark_1</th>

                                <th>Remark_2</th>

                                <th>Status</th>

                                <th>Action</th>
                            </tr>

                        </thead>

                    </table>

                </div>

            </div>

            </div>

        </div>

    </div>

</div>

@endsection



@section('scripts')

<script type="text/javascript">

    var datatable;



    $(document).ready(function() {

                if ($('#data-table').length > 0) {

                    datatable = $('#data-table').DataTable({

                            processing: true,

                            serverSide: true,



                            "pageLength": 25,

                            "iDisplayLength": 25,

                            "responsive": true,

                            "aaSorting": [],

                                // "order": [], //Initial no order.

                                //     "aLengthMenu": [

                                //     [5, 10, 25, 50, 100, -1],

                                //     [5, 10, 25, 50, 100, "All"]

                                // ],



                                "scrollX": true,
                                "scrollY": '450px',

                                // "scrollCollapse": false,

                                // scrollCollapse: true,



                                // lengthChange: false,



                                "ajax": {

                                    "url": "{{ route('vendor') }}",

                                    "type": "POST",

                                    "dataType": "json",

                                    "data": {

                                        _token: "{{csrf_token()}}"

                                    }

                                },

                                "columnDefs": [{

                                    //"targets": [0, 5], //first column / numbering column

                                    "orderable": true, //set not orderable

                                }, ],

                                columns: [{

                                        data: 'DT_RowIndex',

                                        name: 'DT_RowIndex'

                                    },

                                    {

                                        data: 'name_of_company',

                                        name: 'name_of_company'

                                    },

                                    {

                                        data: 'vendor_code',

                                        name: 'vendor_code'

                                    },

                                   {

                                        data: 'tally_heading',

                                        name: 'tally_heading'

                                    },

                                       {

                                        data: 'description_goods',

                                        name: 'description_goods'

                                    },

                                       {

                                        data: 'location',

                                        name: 'location'

                                    },

                                      

                                    {

                                        data: 'department', 

                                        name: 'department'

                                    },

                                     {

                                        data: 'branch', 

                                        name: 'branch'

                                    },

                                       {

                                        data: 'authorised_person',

                                        name: 'authorised_person'

                                    },

                                         {

                                        data: 'person_contactno',

                                        name: 'person_contactno'

                                    },

                                    

                                    

                                       {

                                        data: 'vendor_list',

                                        name: 'vendor_list'

                                    },

                                       {

                                        data: 'contact_person',

                                        name: 'contact_person'

                                    },

                                       {

                                        data: 'contact_number',

                                        name: 'contact_number'

                                    },

                                       {

                                        data: 'email',

                                        name: 'email'

                                    },

                                       {

                                        data: 'gst_no',

                                        name: 'gst_no'

                                    },

                                       {

                                        data: 'pan_no',

                                        name: 'pan_no'

                                    },

                                       {

                                        data: 'address',

                                        name: 'address'

                                    },

                                       {

                                        data: 'bank_name',

                                        name: 'bank_name'

                                    },

                                       {

                                        data: 'account_no',

                                        name: 'account_no'

                                    },

                                       {

                                        data: 'ifsc_code',

                                        name: 'ifsc_code'

                                    },

                                     {

                                        data: 'acc_holder_name',

                                        name: 'acc_holder_name'

                                    },

                                     {

                                        data: 'account_type',

                                        name: 'account_type'

                                    },

                                    {

                                        data: 'district',

                                        name: 'district'

                                    }, {

                                        data: 'state',

                                        name: 'state'

                                    },

                                     {

                                        data: 'payment_mode',

                                        name: 'payment_mode'

                                    },

                                     {

                                        data: 'working_year',

                                        name: 'working_year'

                                    },

                                     {

                                        data: 'remark_1',

                                        name: 'remark_1'

                                    },

                                         {

                                        data: 'remark_2',

                                        name: 'remark_2'

                                    },

                                    {

                                        data: 'status',

                                        name: 'status'

                                    },

                                    {

                                        data: 'action',

                                        name: 'action',

                                        orderable: false,

                                    },


                                ]

                            });

                    }

                    // Highlight row on mouseover

            $('#data-table tbody').on('mouseover', 'tr', function() {

                $(this).addClass('highlight');

            });



            // Remove highlight on mouseout

            $('#data-table tbody').on('mouseout', 'tr', function() {

                $(this).removeClass('highlight');

            });

                });



          function change_status(object) {

                var id = $(object).data("id");

                var status = $(object).data("status");



                if (confirm('Are you sure?')) {

                    $.ajax({

                        "url": "{!! route('vendor.change.status') !!}",

                        "dataType": "json",

                        "type": "POST",

                        "data": {

                            id: id,

                            status: status,

                            _token: "{{ csrf_token() }}"

                        },

                        success: function(response) {

                            if (response.code == 200) {

                                datatable.ajax.reload();

                                toastr.success('Status changed successfully', 'Success');

                            } else {

                                toastr.error('Failed to change status', 'Error');

                            }

                        }

                    });

                }

            }


        function approve_func(id) {



            // alert(id);return false;

            var status = 'Approved';



            if (confirm('Are you sure?')) {

                $.ajax({

                    "url": "{!! route('vendor.approval.status') !!}",

                    "dataType": "json",

                    "type": "POST",

                    "data": {

                        id: id,

                        approval_status: status,

                        _token: "{{ csrf_token() }}"

                    },

                    success: function(response) {

                        if (response.code == 200) {

                            datatable.ajax.reload();

                            toastr.success('Approval Status updated successfully', 'Success');

                        } else {

                            toastr.error('Failed to change status', 'Error');

                        }

                    }

                });
            }

        }


        function reject_func(id) {



            // alert(id);return false;

            var status = 'Rejected';



            if (confirm('Are you sure?')) {

                $.ajax({

                    "url": "{!! route('vendor.rejected.status') !!}",

                    "dataType": "json",

                    "type": "POST",

                    "data": {

                        id: id,

                        rejected_status: status,

                        _token: "{{ csrf_token() }}"

                    },

                    success: function(response) {

                        if (response.code == 200) {

                            datatable.ajax.reload();

                            toastr.success('Rejected Status updated successfully', 'Success');

                        } else {

                            toastr.error('Failed to change status', 'Error');

                        }

                    }

                });
            }

        }




</script>

@endsection