@extends('layouts.master')
@section('title') Donor Report @endsection
@section('css')
<link rel="stylesheet" type="text/css" href="{{ URL::asset('assets/libs/datatables/datatables.min.css')}}">
<link rel="stylesheet" href="https://cdn.datatables.net/1.12.1/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="{{ URL::asset('assets/libs/sweetalert2/sweetalert2.min.css')}}">

@endsection
@section('content')
@component('common-components.breadcrumb')
@slot('title') Campaign Report @endslot

@endcomponent
<style>
.form-control{
    color: #314667 !important;
}
.filter{
    border-color: #1b2b82;
}
.card {
    margin-left: 3px;

}
</style>
<div class="row">
    <div class="col-12">
        <div class="card">

            <div class="card-body">
                {{-- <input type="filter" class="form-control-sm" placeholder aria-controls="UsersList1"> --}}
                <div class="card float-right">
                <div id="filter1"></div>
                </div>

                    @if ($notification = Session::get('error'))
                        <div class="alert alert-danger alert-block">
                            <button type="button" class="close" data-dismiss="alert">×</button>
                                <strong>{{ $notification }}</strong>
                        </div>
                    @endif
                    @if ($notification = Session::get('success'))
                        <div class="alert alert-success alert-block">
                            <button type="button" class="close" data-dismiss="alert">×</button>
                                <strong>{{ $notification }}</strong>
                        </div>
                    @endif

                <div class="table-responsive">
                    <table id="UsersList1" class="table">
                        <thead class="thead-light">
                            <tr>
                                <th>#</th>
                                <th>Campaign</th>
                                <!-- <th>Platform</th> -->
                                <th>Donation</th>
                        </thead>
                        <tbody>
                        	@php $i  = 1; @endphp
                                    @foreach ($donor as $value )
                                    <tr>
                                    <td>{{$i}}</td>
                                    <td>{{$value['donor']->name }}</td>
                                    <td>
                                        ${{ number_format((float)$value['donotion']['sum'],2) ? : '0.00' }}
                                   </td>

                                    </tr>
                                    @php $i++; @endphp
                                    @endforeach

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div> <!-- end col -->
</div> <!-- end row -->
@endsection
@section('script')
<!-- Plugins js -->
<script src="{{ URL::asset('assets/libs/datatables/datatables.min.js')}}"></script>
<script src="{{ URL::asset('assets/libs/jszip/jszip.min.js')}}"></script>
<script src="{{ URL::asset('assets/libs/pdfmake/pdfmake.min.js')}}"></script>
<!-- Init js-->
<script src="{{ URL::asset('assets/js/pages/datatables.init.js')}}"></script>
<script src="https://cdn.datatables.net/buttons/2.2.3/js/dataTables.buttons.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/2.2.3/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/2.2.3/js/buttons.print.min.js"></script>

<script src="{{ URL::asset('assets/libs/sweetalert2/sweetalert2.min.js')}}"></script>
<script type="text/javascript">
    $(document).ready(function() {
            $('#UsersList1').DataTable({

                dom: 'Bfrtip',
                    buttons: [
                'copy', 'csv', 'excel', 'pdf', 'print'
            ],

                initComplete: function() {
                var column = this.api().column(1);
                var values = [];
                column.data().each(function(d, j) {
                    d.split(",").forEach(function(data) {
                        data = data.trim();
                    if (values.indexOf(data) === -1) {
                        values.push(data);
                    }
                    });
                });
                // $('<select class="filter btn  border-blue"><option value="">All Campaigns</option></select>')
                //     .append(values.sort().map(function(o) {
                //     return '<option value="' + o + '">' + o + '</option>';
                //     }))
                //     .on('change', function() {
                //     column.search(this.value ? '\\b' + this.value + '\\b' : " ", true, false).draw();
                //     })
                //     .appendTo('#filter1');
                 }
            });
        } );
</script>


@endsection