@extends('template.app')



@section('meta')

@endsection



@section('title')

Vendor Master

@endsection



@section('styles')

<style>

     .highlight {

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

    }

</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">Qutation List</a></li>

                        <li class="breadcrumb-item text-muted active" aria-current="page">Quatation 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.quatation') }}">Add Quatation</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">

                     <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>Remark_1</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": '',

                                // "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: '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: 'branch',

                                        name: 'branch'

                                    }, {

                                        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');

                            }

                        }

                    });

                }

            }

</script>

@endsection