@extends('admin.admin')
@section('adminContent')



<!-- ============================================================== -->
<!-- Bread crumb and right sidebar toggle -->
<!-- ============================================================== -->
<div class="row page-titles">
    <div class="col-md-5 align-self-center">
        <h3 class="text-themecolor">All Donators</h3>
    </div>
    <!-- <div class="text-right col-md-7" style="line-height: 4.5;">-->
    <!--    <button class=" waves-effect waves-light btn-warning btn" onclick="addBtn()" id="addbtn" >Add Donor</button>-->
    <!--</div>-->
    <div>
        <button class="right-side-toggle waves-effect waves-light btn-inverse btn btn-circle btn-sm pull-right m-l-10"><i class="ti-settings text-white"></i></button>
    </div>
</div>



<!-- Row -->
<div class="row">
    <div class="col-lg-12">

        <div class="card card-default">
            <div class="card-header">
            <form class="form-inline" id="membershipsearch">
    <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search" id="searchdonate">
  </form>                <div class="card-actions">
                    <a class="" data-action="collapse"><i class="ti-minus"></i></a>
                    <a class="btn-minimize" data-action="expand"><i class="mdi mdi-arrow-expand"></i></a>
                    <a class="btn-close" data-action="close"><i class="ti-close"></i></a>
                </div>
            </div>
            <div class="card-body collapse show">
                    <!--@if($message=Session::get('success'))-->
                    <!--<div class="alert alert-success">-->
                    <!--    {{$message}}-->
                    <!--</div>-->
                    <!--@elseif($message=Session::get('error'))-->
                    <!--<div class="text-danger">-->
                    <!--    {{$message}}-->
                    <!--</div>-->
                    <!--@if($errors->any())-->
                    @foreach ($errors->all() as $error)
                    <div class="text-danger">{{ $error }}</div>
                    @endforeach
                    @endif
                    <!--@endif-->
                    <div class="table-responsive">
                        <table class="table product-overview">
                            <thead>
                                <tr>
                                    <th>S.No.</th>
                                    <th>Image</th>
                                    <th>Donation Amount</th>
                                    <th>Donation Type</th>
                                    <th>Name</th>
                                    <th>Email</th>
                                    <th>Number</th>
                                    <th>Donation Date</th>
                                    <th>Order Id</th>
                                    <th class="tdaction">Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                
                            </tbody>
                        </table>
                        
                    </div>
                </div>
        </div>
    </div>
</div>
<!-- Row -->
<!-- ============================================================== -->
<!-- End PAge Content -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- Right sidebar -->
<!-- ============================================================== -->

<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <form action="{{url('admin/editDonator')}}" enctype="multipart/form-data" id="formdata" method="post">
                    @csrf
                    <div class="modal-body">
                        <div class="mb-3">
                            <label for="donation_type" class="col-form-label">Donation Type</label>
                            <select name="donation_type_id" class="form-control" id="donation_type">
                                <option value="">Select Donation Type</option>
                                @foreach ($donationTypes as $donationType)
                                    <option value="{{ $donationType->id }}">{{ $donationType->name }}</option>
                                @endforeach
                            </select>
                            <label for="name" class="col-form-label">Donation amount</label>
                            <input type="text"  class="form-control" name="donation_amount" id="donation_amount">
                            <input type="text" hidden value='' class="form-control" name="id" id="user_id"><br>
                            <label for="name" class="col-form-label">Name</label>
                            <input type="text" class="form-control" name="name" id="name">
                            <label for="name" class="col-form-label">Email</label>
                            <input type="text" class="form-control" name="email" id="email">
                            <label for="name" class="col-form-label">Number</label>
                            <input type="text" class="form-control" name="number" id="number">
                             <label class="control-label">Order Id</label>
                            <input type="text" name="order_id" id="order_id" placeholder="Optional*" class="form-control">
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-close btn-secondary" data-bs-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Update</button>
                    </div>
            </div>
            </form>
        </div>
    </div>
</div>
<!-- ============================================================== -->
<!-- End Container fluid  -->
<!-- ============================================================== -->
<!-- ============================================================== -->


<script>
   function addBtn(){
                      $('#exampleModal').modal('show');
        $('#formdata').attr('action',"{{url('/admin/addDonator')}}")
                    $('#name').val('');
                    $('#email').val('');
                    $('#donation_amount').val('');
                    $('#number').val('');
                     $('#order_id').val('');
    }
    $(document).ready(function() {
     
        $.ajax({
        type:"get",
        url:"/admin/donatorList",
        success:function(data){
            console.log(data);
            // $('#table_data').empty();
            $('tbody').append(data.data);

        },
        error:function(error){
            console.log(error);
        }

     });
     $(document).on('click', '.pagination a', function(event){
  event.preventDefault(); 
  var page = $(this).attr('href').split('page=')[1];
  fetch_data(page);
 });
 function fetch_data(page)
 {
    $.ajax({
            type:'get',
            url:"/admin/donatorList?page="+page,
            success:function(data){
                if (data.data) {
					$("tbody").html(data.data);
				} else {
					$("tbody").html('  <tr><td colspan="16" class="text-center"> No Records Found !</td></tr>');
				}
            },
            error:function(error){
                 console.log(error);
            }

            
           });
   }
 
   
        $('#searchdonate').keyup(function(e){
           e.preventDefault();
           var formData=$('#searchdonate').val();
           $.ajax({
            type:'get',
            url:"/admin/donatorList",
            data:{'search':formData},
            success:function(data){
                if (data.data) {
					$("tbody").html(data.data);
				} else {
					$("tbody").html('  <tr><td colspan="16" class="text-center"> No Records Found !</td></tr>');
				}
            },
            error:function(error){
            }
           });
        });
        $(document).on('click', '.editBtn', function() {
           
            let user_id = $(this).val();
            $('#exampleModal').modal('show');
            $('#formdata').attr('action',"{{url('/admin/editDonator')}}")
            $.ajax({
                type: 'get',
                url: "getDonator/" + user_id,
                success: function(response) {
                    $('#name').val(response.name);
                    $('#email').val(response.email);
                    $('#donation_amount').val(response.donation_amount);
                    $('#number').val(response.number);
                     $('#order_id').val(response.order_id);
                     $('#donation_type').val(response.donation_type_id);
                    if (response.user_verified == '1') {
                    $('#flexSwitchCheckDefault').attr('checked', 'true');
                } else {
                    $('#flexSwitchCheckDefault').removeAttr('checked');
                }
                    $('#user_id').val(response.id);
                }

            });

        })
        $('.btn-close').on('click', function() {
            $('#exampleModal').modal('hide');
        });
    })
 
</script>
<script>
 $(document).ready(function(){
        var img=$('img[data-enlargable]').addClass('img-enlargable');
        $(document.body).on('click','img',function(){
    var src = $(this).attr('src');
    $('<div>').css({
        background: 'RGBA(0,0,0,.5) url('+src+') no-repeat center',
        backgroundSize: 'contain',
        width:'100%', height:'100%',
        position:'fixed',
        zIndex:'10000',
        top:'0', left:'0',
        cursor: 'zoom-out'
    }).click(function(){
        $(this).remove();
    }).appendTo('body');
});
    });
</script>




@stop