@extends(branchMenu())
@section('content')
    @php
        $date = @$_GET['date'];
        $customer = @$_GET['customer'] ;
        $status = @$_GET['status'] ;
    @endphp
    <?php Fun::lang()?>
    <div class="container-fluid">
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                {!! Form::open(['route' => 'pos-branch.index', 'method' => 'get']) !!}
                <div class="col-sm-3 col-md-3">
                    <div class="col-sm-3 col-md-3" style="margin-top: 5px">
                        {{__('administrator.customer')}}
                    </div>
                    <div class="form-group col-sm-9 col-md-9">
                        {!! Form::select('customer', getCustomerByAgent(Auth::user()->id) , $customer , ['placeholder'=>__('administrator.please_select'),'class' => 'form-control select2']) !!}
                    </div>
                </div>
                <div class="col-sm-3 col-md-3">
                    <div class="col-sm-3 col-md-3" style="margin-top: 5px">
                        {{__('administrator.status')}}
                    </div>
                    <div class="form-group col-sm-9 col-md-9">
                        {!! Form::select('status', getPaymentStatus(), null, ['placeholder'=>__('administrator.please_select'),'class' => 'form-control status select2']) !!}
                    </div>
                </div>
                <div class="col-sm-3 col-md-3">
                    <div class="col-sm-3 col-md-3" style="margin-top: 5px">
                        {{__('administrator.date')}}
                    </div>
                    <div class="form-group col-sm-9 col-md-9">
                        <input type="text" class="form-control date_picker" name="date" value="{{$date?$date:''}}">
                    </div>
                </div>
                <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 form-group">
                    <div class="col-sm-12">
                        <button type="submit" class="button_info">{{__('administrator.search')}}</button>
                    </div>
                </div>
                {!! Form::close() !!}
            </div>
        </div>
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <div class="row">
                    <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
                        <h3>{{__('administrator.pos')}}</h3>
                    </div>
                    <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-right">
                    @can('POS Retail Create')
                        <a href="{{ route('pos-branch.create') }}">
                            <button type="button" class="button_info"><i class="fa fa-pencil"></i> {{__('administrator.create')}}</button>
                        </a>
                    @endcan
                    </div>
                </div>
                <div class="container-fluid" style="background: white; padding:10px">
                    <div class="table-responsive">
                        <table id="customer" class="table">
                            <thead>
                                <tr>
                                    <th width="5%">#</th>
                                    <th>{{__('administrator.date')}}</th>
                                    <th>{{__('administrator.invoice_number')}}</th>
                                    <th>{{__('administrator.customer')}}</th>
                                    <th>{{__('administrator.phone')}}</th>
                                    <th>{{__('administrator.discount')}} (%)</th>
                                    <th>{{__('administrator.paid')}} ($)</th>
                                    <th>{{__('administrator.total')}} ($)</th>
                                    <th>{{__('administrator.payment_status')}}</th>
                                    <th>{{__('administrator.action')}}</th>
                                </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('script')
    <script type="text/javascript">
        $(document).ready(function () {
            $(document).on('click','.show_invoice',function () {
                var id = $(this).data('id');
                if(id){
                    $.ajax({
                        url: '{!! url("get-invoice/'+id+'") !!}',
                        success: function (data) {
                            var content_ = (data);
                            $.confirm({
                                title: '',
                                content: content_,
                                boxWidth: '20%',
                                useBootstrap: false,
                                buttons: {
                                    close: {
                                        text: '{{__('administrator.close')}}',
                                        btnClass: 'button_warning',
                                        keys: ['esc'],
                                        action: function () {

                                        }
                                    },
                                    print: {
                                        text: '{{__('administrator.print')}}',
                                        btnClass: 'button_info',
                                        keys: ['enter'],
                                        action: function () {
                                            $('.invoice-box').printThis({
                                                loadCSS: "{{asset('assets/css/pos-invoice.css')}}",
                                                afterPrint: function () {
                                                    window.location.reload();
                                                }
                                            });
                                        }
                                    },
                                }
                            });
                            $('.loading_btn').hide();
                            $('input[type=submit]').show();
                            $('button[type=submit]').show();
                        }
                    });
                }
            });
        });
        $('#customer').DataTable({
            ordering: false,
            processing: false,
            serverSide: true,
            lengthMenu: [[20, 30, 50, 100, 200, 500, 1000], [20, 30, 50, 100, 200, 500, 1000]],
            ajax: {
                url: "{{ route('pos-branch.index') }}?customer={{$customer}}&date={{$date}}&status={{$status}}",
            },
            columns:
                [
                    {data: 'DT_RowIndex', 'searchable': false},
                    {data: 'sale_date'},
                    {data: 'invoice_number'},
                    {data: 'customer_id'},
                    {data: 'customer_phone'},
                    {data: 'discount'},
                    {data: 'paid_amount_kh'},
                    {data: 'total'},
                    {data: 'payment_status'},
                    {data: 'action'},
                ],


            "initComplete": function (settings, json) {
            }

        });
    </script>
@endsection