@extends('marketing.main') 

@push('marketing_title') All Paid Users | POLI - Marketing Panel @endpush

@push('page-custom-css')

    <link rel="stylesheet" href="{{ asset('assets/polipop-master/dist/css/polipop.core.min.css')}}"/>
    <link rel="stylesheet" href="{{asset('assets/polipop-master/dist/css/polipop.default.min.css')}}" />
	<style type="text/css">
		.small-class
		{
			font-size: 13px;
			font-family: consolas;
			letter-spacing: 0px;
		}
		.action_panel
		{
			opacity: 0.5;
			pointer-events: none;
		} 
		.active_row
		{
			/* background: #ddd !important;
			   background: repeating-linear-gradient(108deg, #fc99ff, #ffd07a 325px, #b8ffba, #ff7373) !important;*/
			background: repeating-linear-gradient(108deg, #e5e5e5, #bae4ff 325px, #d3f7d4, #ededed) !important;
			font-weight: bold;
		}
		.action_panel_active .btn-outline-success
		{
			background: #198754 !important;
			color: #fff;
		}
		.action_panel_active .btn-outline-primary
		{
			background:#0D6EFD !important;
			color: #fff;
		}

		.action_panel_active .btn:hover
		{
			opacity: 0.8;
			margin-top: -2px;
		}

		.user_data_table .self_assign
		{
			border: 2px solid #71b8f1;
			border-radius: 50%;
		}
		#all_paid_users_length, #all_paid_users_paginate
		{
			display: none;
		}
	</style>
	<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.12.1/css/jquery.dataTables.css">
@endpush

@section('MarketingPanel')


    <div class="content">
    	<div class="container">
		    <div class="row">
		        <div class="col-md-6">
		            <h2 class="page-title">Leads</h2>
		            <div class="page-pretitle"> 
		             	<a href="{{ Request::url() }}">All Paid Users</a>
		            </div>
		        </div>
		        <div class="col-md-3">
		        	<p class="page-title"> {{ Str::of(explode(' ',Auth::guard('marketing')->user()->name)[0])->limit(12,'..') }} </p>
		        	<p class="page-pretitle show_time"> {{ date('D,d M') }} <span></span> </p> 
		        </div>
		    </div>
		</div> 
    		<div class="row">
    			<div class="container" style="overflow-x: auto;">

					<div id="response_results">
						{{-- dd( Auth::guard('marketing') ) --}}						
					</div>

	    			<table id="all_paid_users" class="table">
	    				<thead>
	    					<tr>
	    						<th>ID</th>
	    						<th>Name</th>
	    						<th>Amount</th>
	    						<th>Service</th>
	    						<th>Date</th>
	    						<th>Type</th>
	    						<th>Email</th>
	    						<th>Action</th>
	    					</tr>
	    				</thead>
	    				<tbody>
	    					@forelse($response as $count => $paiduser)
							    <tr id="row_id_{{ $paiduser->user_id }}">
							    	<td>
							    		{{ $paiduser->partner_id }}
							    	</td>
							    	<td>
							    		{{ Str::of($paiduser->name)->limit(20) }}						    		
							    	</td>
							    	<td>
							    		{{ $paiduser->amount }}
							    	</td>
							    	<td> 
							    		{{ $paiduser->service_name ?? 'N/A' }} 
							    	</td>
							    	<td>
							    		<small>{{ date('d/m/y h:i A',strtotime($paiduser->payment_date)) }}</small>
							    	</td>
							    	<td>
	    								{{ Str::of( explode(' ',$paiduser->type)[0] ) == "PLAN" ? "Plan" : "Reg" }}
							    	</td>
							    	<td>
							    		<button onclick="alert('{{ $paiduser->email }}')" class="btn btn-outline-success btn-sm"> email </button>
							    	</td>
							    	<td class="action_panel_">
							    		<button class="btn btn-sm btn-outline-success" onclick="CallPaidUsers(this)" id="call_{{$paiduser->user_id}}"> <i class="fas fa-phone"> </i> </button>
							    		<button hidden class="btn btn-sm btn-outline-primary" onclick="addRemarks(this)" id="addRemarks_{{ $paiduser->user_id }}"> Remarks </button>
							    		<button hidden class="btn btn-sm btn-outline-danger" onclick="ScheduleCall(this)" id="call_back_{{$paiduser->user_id}}"> <i class="fas fa-calendar" aria-hidden="true"></i> </button>
							    	</td>
							    </tr>
							@empty
							    <tr>
							    	<td colspan="100%"> NO DATA FOUND </td>
							    </tr>
							@endforelse
						
	    				</tbody>
	    			</table>
					<div class="pagination">
						{!! $response->links() !!}	
										
					</div>
					
					<p><strong>Showing {{ $response->count() * $response->currentPage() - $response->perPage() }} to {{ $response->count() * $response->currentPage() }}</strong> of {{ $response->total() }}</p>
    			</div>
    		</div>
    	</div>
    </div>



@endsection


@push('marketing-page-js')
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.12.1/js/jquery.dataTables.js"></script>
<script type="text/javascript">

	$((document) => {
		$('#all_paid_users').DataTable({
	    	"pageLength": 50,
	    });
	    // $(".action_panel").remove();
	});


	CallPaidUsers=(e)=>{
		console.log(e);
		$("#"+e.id).attr({'disabled':true}); 

        let dataObj = {id:e.id.split('_')[1], status: 'call_paid', _token:"{{csrf_token()}}"};

        $.ajax({
            url: "{{route('marketing.click.to.call')}}",
            type: "post",
            data: dataObj,
            dataType: "json",
            success:function(response)
            {
                if(response.success){
                    polipop.add({
                      content: "Calling.."+response.message,
                      title: 'Call Initiated',
                      type: 'success',
                   });
                }else{
                    polipop.add({
                      content: "Process unable to complete",
                      title: 'Problem to call',
                      type: 'error',
                   });
                }
            }
        });
	}

</script>
@endpush