@extends('common.dashboard')

@section('title','Blood donor list')
@section('content')
<div class="row">
    <div class="col-xl-12">
        <div class="card">
            <div class="card-header">@include('common.blood.search_form')</div>
            <div class="card-body">
                <h4 class="card-title">Doctor-categories table <a class="float-right text-primary btn btn-sm text-info" href="/common/create-blood-donor" style="border:1px solid silver"><i class="fas fa-plus-circle"></i> Add New?</a></h4>
                <div class="table-responsive">
                    <table class="table mb-0 table-bordered table-hover" style="font-size:12px">
                        <thead>
                            <tr>
                                <th>#</th><th>Photo</th> <th>Donor Name</th>
                                <th>Mobile No</th><th>Group</th><th>Address</th><th>Status</th>
                                <th class="text-right">Modify</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($donors as $key=>$donor)
                            <tr>
                                <th scope="row">{{$key+1}}</th>
                                <td>
                                    <div class="media">
                                        <div class="media-body">
                                            <img class="d-flex ml-3 rounded-circle" src="{{asset($donor->thumbs)}}" height="30">
                                        </div>
                                    </div>
                                </td>
                                <td>{{$donor->fname}} {{$donor->lname}}</td>
                                <td>{{$donor->phone}}</td>
                                <td>{{$donor->blood_group}}</td>
                                <td>
                                    {{$donor->location}}
                                    @if($donor->division_id !=null)
                                    {{$donor->division->name}}
                                    @endif
                                </td>
                                <td>
                                	@if($donor->is_active==1) <span class="badge badge-success">Active</span>
                                	@else <span class="badge badge-danger">Inactive</span> @endif
                                </td>
                                <td class="text-right">
                                    <div class="btn-group dropleft">
                                        <button type="button" class="btn btn-sm btn-info dropdown-toggle waves-effect waves-light" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                            <i class="mdi mdi-chevron-left"></i>
                                        </button>
                                        <div class="dropdown-menu" x-placement="left-start">
                                            <a class="dropdown-item" href="/common/edit-blood-donor/{{$donor->id}}">
                                                Edit blood donor
                                            </a>

                                            <a class="dropdown-item show-donor" data-toggle="modal" data-target=".openModal" href="javascript:void(0);" data-id="{{$donor->id}}">
                                                <i class="fas fa-eye text-primary"></i> View More
                                            </a>

                                            <a class="dropdown-item text-danger" href="#" onclick="return confirm('Are you sure to remove the record??? No undo option available!!');">
                                                Delete blood donor
                                            </a>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div> <br><br>
                <div class="row">{{$donors->links()}}</div>

            </div>
        </div>
    </div>
</div>


<div class="modal fade openModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
        <div class="modal-header">
            <h5 class="modal-title h4" id="myLargeModalLabel">BLood donor Details</h5>
            <button type="button" class="close waves-effect waves-light" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="modal-body">
            <div class="fetch_result"></div>
        </div>
    </div>
  </div>
</div>


<script src="{{asset('back/assets/js/jquery.min.js')}}"></script>
<script type="text/javascript">
  $(function(){
    var url = $('#base_url').val();
    $('.show-donor').on('click',function(){
      var id = $(this).data('id');
      $.ajax({
        url:url + "/common/show-blood-donor/"+id,
        type: "get",
        success:function(data){
          $('.fetch_result').html(data);
        }
      });
    });
  })
</script>

@endsection