@extends('layouts.main_without_top_button')
@section('title')
    {{$vendor->name}} Profile
@stop
@section('priceStructure')
    active
@stop
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
        <li><a href="{{route('vendors.index')}}">Vendors</a> <span class="divider">/</span></li>
        <li><a href="{{route('vendors.show')}}">{{$vendor->name}} Profile</a> <span class="divider">/</span></li>
        <li class="active">Price Structure</li>
    </ul>
@stop

@section('contentinner')
    <style>
        table tbody td .number {
            text-align: right;
        }
        table tbody td .number {
            text-align: right;
        }

        td.details-control {
            background: url('{{ URL::asset('img/details_open.png') }}') no-repeat center center;
            cursor: pointer;
        }

        tr.details td.details-control {
            background: url('{{ URL::asset('img/details_close.png') }}') no-repeat center center;
        }
    </style>

    <div class="tabbable">

        @include('vendors.includes.vendor_profile')
        <div class="row">
            <li class="right btn-group" style="float: right">
                <a class="btn" onclick=createOld("{{ route('vendors.priceStructure.create', $vendor->id) }}")>
                    <span class="iconsweets-create"></span> NEW PRICE STRUCTURE
                </a>
            </li>
        </div>

        <div class="tab-content">
            <div class="tab-pane active">
               
                <table class="table table-bordered" id="vendors-list">
                    <thead>
                    <tr>
                        <th>Sn</th>
                        {{--                            <th style="width: 10% !important;">More</th>--}}
                        {{--                            <th style="width: 20% !important;">Date</th>--}}
                        <th style="width: 30% !important;">Type</th>
                        <th style="width: 30% !important;">Start Date</th>
                        <th style="width: 30% !important;">End Date</th>
                        <th></th>
                    </tr>
                    </thead>
                </table>
            </div><!--tab-pane-->
        </div><!--tabcontent-->
    </div><!--tabbable-->
    <div aria-hidden="false" class="fade hide modal animated" data-backdrop="static" id="payment_modal" tabindex="-1">
        {!! Form::open(array('class' => 'stdform','id'=>'payment_form','route'=>'payments.update')) !!}
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3 id="myModalLabel"><span class="vendors_name"></span></h3>
        </div>
        <div class="modal-body">
            <div id="payment_body"></div>
        </div>
        <div class="modal-footer">
            <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
            <button class="btn btn-success" name="update_vendor" id="update_vendor" type="submit">UPDATE PAYMENT
            </button>
        </div>
        {!! Form::close() !!}
    </div>
    <script type="text/javascript">
        let mainDataTable = jQuery('#vendors-list').DataTable({
            "oLanguage": {
                "sLoadingRecords":startSpinner(),
                "sZeroRecords": "No vendors records to display.",
                "sProcessing": "Please wait - loading records...",
                "sInfoEmpty": "No entries to display."
            },
            "initComplete": function (settings, json) {
                stopSpinner();
            },
            ajax: {
                url: '{{route('vendors.priceStructure.data-table.index')}}',
                data: function (d) {
                    d.vendor_id = {{$vendor->id}};
                },
                error: function (xhr, textStatus, error) {
                    onAjaxError(xhr, textStatus, error);

                    mainDataTable.fnProcessingIndicator(false);
                }
            },
            scrollCollapse: true,
            "sPaginationType": "full_numbers",
            processing: true,
            serverSide: true,
            "columns": [
                {data: 'id'},
                // {data: 'date'},
                {data: 'type'},
                {data: 'start_date'},
                {data: 'end_date'},
                {data: 'action'}
            ],
            "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
                var index = iDisplayIndex +1;
                $('td:eq(0)',nRow).html(index);
                return nRow;
            },
            "bStateSave": true
        });
        function pageInitiation() {}
        function incrementRow(elem) {
            var data;
            data = $('#data').clone();
//            data.find('select').addClass('searchable_select');
            jQuery('.select2s').select2();
            var table = elem.parents('table');
            var tbody = table.find('tbody');
            tbody.prepend(data);
//            onModalShown();
            $('.no-data-found').fadeOut();
        }
        function decrementRow(elem) {
            var tr = elem.parents('tr');
            tr.fadeOut(function() {
                tr.remove();
            });
        }
    </script>
@stop