@extends('layouts.master')

@section('title', __('Invoices'))

@push('styles')

@endpush

@section("content")
    <div id="featured-services" class="featured-services main_section">
        <div class="card">
            <div class="card-body">
                <div class="row">
                    <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 gift-code-main">
                        <div class="px-0">
                            <div id="custom_toolbar_user" class="float-right">
                                <div class="dropdown" title="Export data">
                                    <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="bi bi-download"></i> {{ __('Export') }}</button>
                                    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                        <a class="dropdown-item" href="javascript:void(0)" onclick="exportTasks('invoices',['counter','package_date','name','price','tax','value'],'csv')">{{ __('CSV') }}</a>
                                        <a class="dropdown-item" href="javascript:void(0)" onclick="exportTasks('invoices',['counter','package_date','name','price','tax','value'],'zip')">{{ __('ZIP') }}</a>

                                    </div>
                                </div>
                            </div>
                            <table id="bstable" class="table table-striped table-hover" data-icons="icons"
                                   data-icons-prefix="bi" data-show-button-text="true" table-for="invoices"
                                   data-ajax="ajaxRequestGiftCodes" data-side-pagination="server" data-pagination="true"
                                   data-total-field="count" data-data-field="items" data-filter-control="true"
                                   data-show-columns="true" data-show-columns-toggle-all="false" data-toolbar="#custom_toolbar_user"
                                   data-show-search-clear-button="true" data-loading-template="DataTaleLoadingTemplate" data-search-on-enter-key="true">
                                <thead>
                                <tr>
                                    <th data-field="counter" data-sortable="false">{{ __('#') }}</th>
                                    <th data-field="package_date" data-filter-control="input" data-filter-control-placeholder="Purchase Date">{{__('Purchase Date')}}</th>
                                    <th data-field="name" data-sortable="false" data-filter-control="input" data-filter-control="false" data-filter-control-placeholder="Package Name">{{__('Package Name')}}</th>
                                    <th data-field="price" data-filter-control="input" data-filter-control-placeholder="Price">{{__(' Price')}}</th>
                                    <th data-field="tax" data-filter-control="input"  data-filter-control-placeholder="Tax">{{__('Tax')}}</th>
                                    <th data-field="value" data-filter-control="input"  data-filter-control-placeholder="Price">{{__('Total Price')}}</th>
                                    <th data-field="action">{{__('Action')}}</th>
                                </tr>
                                </thead>
                                <tbody></tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection


@push('scripts')
    <script>
        $(document).on("click",".gift_code",function () {
            copyToClipboard($(this).attr('data-clipboard-text'));
        });

        let transactionIdFilter;
        @if(isset($transactionId) && $transactionId)
            transactionIdFilter = "{{$transactionId}}";
        @endif
    </script>
    <script src="{{asset('frontend/js/page-js/invoices.js')}}"></script>
@endpush