@extends('layouts.adminmaster')

@section('title', 'Customer Info')


@section('content')
<link rel="stylesheet" href="{{ URL::asset('form/css/bootstrap.min.css')}}"  />
    <link href="{{ URL::asset('form/css/bootstrap-toggle.min.css')}}" rel="stylesheet">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

    <script src="{{ URL::asset('form/js/bootstrap-toggle.min.js')}}"></script>


    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" ></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css"  />
    <link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet">
    <script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script> -->
<style>

#table-wrapper {
  position:relative;
}
#table-scroll {
  height:500px;
  overflow:auto;  
  margin-top:20px;
}
#table-wrapper table {
  width:100%;

}
</style>
<div class="container">
    <!-- The Modal -->
    <div class="modal fade" 
             id="exampleModal"
             tabindex="-1" 
             role="dialog"
             aria-labelledby="exampleModalLabel" 
             aria-hidden="true">
            <div class="modal-dialog" 
                 role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <!-- w-100 class so that header
                div covers 100% width of parent div -->
                        <h5 class="modal-title w-100" 
                            id="exampleModalLabel">
                        
                      </h5>
                        <button type="button"
                                class="close"
                                data-dismiss="modal" 
                                aria-label="Close">
                            <span aria-hidden="true">
                              ×
                          </span>
                        </button>
                    </div>
  
                    <!--Modal body with image-->
                    <div class="modal-body">
                        <img id="imgview" src="" />
                    </div>
  
                    <div class="modal-footer">
                        <button type="button"
                                class="btn btn-danger" 
                                data-dismiss="modal">
                          Close
                      </button>
                    </div>
                </div>
            </div>
        </div>
        <h4 class="card-title mt-3 text-center"><b>POS Users</b></h4>
        <div id="table-wrapper">
  <div id="table-scroll">
  @php 
$cnt = count($productList);
   @endphp
   @if(!empty($cnt))
<table id="dtHorizontalExample" class="table table-striped table-bordered table-sm" cellspacing="0"
  width="100%" style="overflow: scroll;">
<thead>
<tr>
    <th>Ids</th>
    <th>Name</th>
    <th>DOB</th>
    <th>Gender</th>
    <th>Referral Name</th>
    <th>Referral Mobile</th>
    <th>Profile</th>
    <th>QR Code</th>

    <th>Email</th>
    <!-- <th>Password</th> -->
    <th>Mobile Number</th>
    <th>Alternate Mobile Number</th>
    <th>Address1</th>
    <th>Address2</th>
    <th>Pincode</th>

    <th>Aadhar Card Number</th>
    <th>Pan Card Number</th>
    <th>Aadhar Front Image</th>
    <th>Aadhar Back Image</th>
    <th>Pan Front Image</th>
    <th>Qualification</th>

    <th>Educational Documents</th>
    <th>Bank Name</th>
    <th>Branch Name</th>
    <th>Ifsc Code</th>
    <th>Account Number</th>
    <th>Passbook</th>
    <th>Status</th>
    <th>Created At</th>
    <th>Update Status</th>
</tr>
</thead>
    <tbody>
    @foreach($productList as $stud)
    @php 
if(($stud->status == '0') || ($stud->status == ''))
{
    $displ = 'Inactive';
}
else{

    $displ = 'Active';
}
if($stud->qrcode == '')
{
    $qr = 'Create';
    $createqr = "createqr";
    $download = '';

}
else{
    $qr = 'View';
    $createqr = "viewqr";
    $download = 'Download';
   

                
}
    @endphp
    <tr>
    <td>{{ $stud->id }}</td>
    <td>{{ $stud->first_name }} {{ $stud->last_name }}</td>
    <td>{{ $stud->dob }}</td>
    <td>{{ $stud->gender }}</td>
    <td>{{ $stud->referral_name }}</td>
    <td>{{ $stud->referral_mobile }}</td>
    <td>
    <img  src="{{ URL::to('images/' .$stud->profile) }}" />
            <a href="#" src="{{ URL::to('images/' .$stud->profile) }}" class="popup" data-toggle="modal" 
             data-target="#exampleModal"> view </a>
             
             </td>
             <td>
             @if($stud->qrcode == '')
             <a   data-id="{{$stud->id}}" src="{{ URL::to('images/' .$stud->qrcode.'.png') }}" class="popup btn btn-default {{$createqr}}">{{ $qr }}</a>
             
             
             @else
             
             <a  data-toggle="modal" 
             data-target="#exampleModal"  data-id="{{$stud->id}}" src="{{ URL::to('images/' .$stud->qrcode.'.png') }}" class="popup btn btn-default {{$createqr}}">{{ $qr }}</a>
             

             <a download   data-id="{{$stud->id}}" href="{{ URL::to('images/' .$stud->qrcode.'.png') }}" class="popup btn btn-default {{$createqr}}">{{ $download }}</a>
             
             @endif
          
             </td>
    <td>{{ $stud->email }}</td>
    <!-- <td>{{ $stud->password }}</td> -->
    <td>{{ $stud->mobile }}</td>
    <td>{{ $stud->alternate_mobile }}</td>

    <td>{{ $stud->address1 }}</td>
    <td>{{ $stud->adress2 }}</td>
    <td>{{ $stud->pincode }}</td>
    <td>{{ $stud->aadhar_number }}</td>
    <td>{{ $stud->pan }}</td>


    <td><img  src="{{ URL::to('images/' .$stud->aadhar_front) }}" />
             
             <a href="#" src="{{ URL::to('images/' .$stud->aadhar_front) }}" class="popup" data-toggle="modal" 
             data-target="#exampleModal"> view </a>
             
             </td>
    <td><img src="{{ URL::to('images/' .$stud->aadhar_back) }}" />
             
             
             <a href="#" src="{{ URL::to('images/' .$stud->aadhar_back) }}" class="popup" data-toggle="modal" 
             data-target="#exampleModal"> view </a>
             </td>
    <td><img src="{{ URL::to('images/' .$stud->pan_front) }}" />
             
             
             <a href="#" src="{{ URL::to('images/' .$stud->pan_front) }}" class="popup" data-toggle="modal" 
             data-target="#exampleModal"> view </a>
             </td>
    <td>{{ $stud->qualification }}</td>
    <td><img src="{{ URL::to('images/' .$stud->educational_documents) }}" />
             
             <a href="#" src="{{ URL::to('images/' .$stud->educational_documents) }}" class="popup" data-toggle="modal" 
             data-target="#exampleModal"> view </a>
             </td>

    <td>{{ $stud->bank_name }}</td>
    <td>{{ $stud->branch_name }}</td>
    <td>{{ $stud->ifsc_code }}</td>
    <td>{{ $stud->account_number }}</td>
    <td><img  src="{{ URL::to('images/' .$stud->passbook) }}" />
             
             
             <a href="#" src="{{ URL::to('images/' .$stud->passbook) }}" class="popup" data-toggle="modal" 
             data-target="#exampleModal"> view </a>
             </td>

   
    
    <td class="user_status{{$stud->id}}">{{ $displ }}</td>
    <td>{{ $stud->created_at }}</td>
    <td>
    <input data-id="{{$stud->id}}" class="toggle-class" type="checkbox" data-onstyle="success" data-offstyle="danger" data-toggle="toggle" data-on="Active" data-off="InActive" {{ $stud->status ? 'checked' : '' }}>
                       </td>
    </tr>
    @endforeach
    </tbody>
</table>
</div>
        </div>
        @else
        <h5 class="card-title mt-3 text-center">No Data Found</h5>
    @endif
{{ $productList->links() }}
</div>
<script type="text/javascript">
$(document).ready(function() {
    $(".popup").click(function () {
        var $src = $(this).attr("src");
        $("#imgview").attr("src", $src);
        $('#myModal').show();
    });
    $('.viewqr').click(function() {
        var $src = $(this).attr("src");
        $("#imgview").attr("src", $src);
        $('#myModal').show();
    });
});  

 $('.toggle-class').change(function() {
        var status = $(this).prop('checked') == true ? 1 : 0; 
        var user_id = $(this).data('id'); 
        if(status == '1')
        {
text_status = 'Active';
        }
        else{
text_status = 'Inactve';
        }
        $.ajax({
            type: "GET",
            dataType: "json",
            url: '/userChangeStatus',
            data: {'status': status, 'user_id': user_id},
            success: function(data){
                $('.user_status'+user_id).html(text_status);
             alert("Status updated successfully");
            }
        });
    });

    $('.createqr').click(function() {
        var user_id = $(this).data('id'); 
        $.ajax({
            type: "GET",
            dataType: "json",
            url: '/qrcodecreation',
            data: {'user_id': user_id},
            success: function(data){
               
             alert("QRCode created successfully");
             window.location.reload();
            }
        });
    });

    

</script>
@endsection