@extends('layouts.master')

@section('content')
    <div class="main-content app-content mt-0">
        <div class="side-app">

            <!-- CONTAINER -->
            <div class="main-container container-fluid">

                <!-- PAGE-HEADER -->
                <div class="page-header">
                    <h1 class="page-title">{{__('common.plan')}} {{__('common.buyer')}}</h1>
                    <div>
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="javascript:void(0)">{{__('common.tables')}}</a></li>
                            <li class="breadcrumb-item active" aria-current="page">{{__('common.plan')}} {{__('common.buyer')}}</li>
                        </ol>
                    </div>

                </div>

                <div class="row row-sm">
                    <div class="col-lg-12">
                        <div class="card">
                            <div class="card-header">
                                <h3 class="card-title">{{__('common.plan')}} {{__('common.buyer')}} {{__('common.details')}}</h3>
                            </div>
                            <div class="card-body">
                                <div >
                                    <table class="table table-bordered text-nowrap border-bottom dt-responsive" id="responsive-datatable-company" style="width:100%"
                                        id="responsive-datatable-company">
                                        <thead>
                                            <tr>
                                                <th class="wd-15p border-bottom-0">S.no</th>
                                                <th class="wd-15p border-bottom-0">{{__('common.user')}} {{__('common.name')}}</th>
                                                <th class="wd-15p border-bottom-0">{{__('common.plan')}} {{__('common.name')}}</th>
                                                <th class="wd-20p border-bottom-0">{{__('common.start')}} {{__('common.date')}}</th>
                                                <th class="wd-20p border-bottom-0">{{__('common.end')}} {{__('common.date')}}</th>
                                                <th class="wd-10p border-bottom-0">{{__('common.status')}}</th>
                                                <th class="wd-25p border-bottom-0">{{__('common.tags')}}</th>
                                                <th class="wd-25p border-bottom-0">{{__('common.used_tags')}}</th>
                                                <th class="wd-25p border-bottom-0">{{__('common.payment_at')}}</th>
                                            </tr>
                                        </thead>

                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('bottom_script')
    <script>
        $(function() {
            $('#responsive-datatable-company').DataTable({
                processing: true,
                serverSide: true,
                responsive: true,
                ajax: '{{ route('admin-get-purchase-history') }}',
                columns: [
                    {
                        data: null,
                        name: 'index',
                        orderable: false,
                        searchable: false,
                        render: function (data, type, row, meta) {
                            return meta.row + meta.settings._iDisplayStart + 1;
                        }
                    },
                     {
                        data: 'user_name'
                    },
                   
                    {
                        data: 'plan_name'
                    },
                    
                    {
                        data: 'start_date'
                    },
                    {
                        data: 'end_date'
                    },
                    {
                        data: 'status'
                    },
                    {
                        data: 'tags'
                    },
                    {
                        data:'used_tags'
                    },
                    {
                        data: 'payment_at'
                    },
                   
                ],
                columnDefs: [
                    { targets: '_all', className: 'dt-responsive' }
                ],
                language: {
                info: "{{ __('pagination.showing_entries') }}",
                lengthMenu: "{{ __('pagination.length_menu') }}",
                zeroRecords: "{{ __('pagination.zero_records') }}",
                infoEmpty: "{{ __('pagination.info_empty') }}",
                infoFiltered: "{{ __('pagination.info_filtered') }}",
                search: "{{ __('pagination.search') }}",
                paginate: {
                    first: "{{ __('pagination.first') }}",
                    last: "{{ __('pagination.last') }}",
                    next: "{{ __('pagination.next') }}",
                    previous: "{{ __('pagination.previous') }}"
                }
            }
            });
        });
    </script>
    <script>
        @if(session('success'))
            toastr.success("{{ session('success') }}");
        @endif
    
        @if(session('error'))
            toastr.error("{{ session('error') }}");
        @endif
    </script>


     <script src="{{ asset('panel/assets/plugins/datatable/js/jquery.dataTables.min.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/js/dataTables.bootstrap5.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/js/dataTables.buttons.min.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/js/buttons.bootstrap5.min.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/js/jszip.min.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/pdfmake/pdfmake.min.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/pdfmake/vfs_fonts.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/js/buttons.html5.min.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/js/buttons.print.min.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/js/buttons.colVis.min.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/dataTables.responsive.min.js') }}"></script>
     <script src="{{ asset('panel/assets/plugins/datatable/responsive.bootstrap5.min.js') }}"></script>
     <script src="{{ asset('panel/assets/js/table-data.js') }}"></script>
@endsection