@extends('layout.member_app')
@section('content')
<!-- <section class="inner-banner container-fluid">
	<div class="row">
		<img src="{{url('theme_member/img/inner-banner-03.png')}}" class="img-fluid" alt="Inner Banner"/>
	</div>
</section> -->
<div class="main-content container-fluid">
  	<div class="row">
		<section class="profile-page container-fluid partner-page mt-80">
			<div class="container">
				<div class="row profile-top mt-15">
					<div class="col-12 d-flex mb-20 member-highlights">
						<div class="profile-img mr-30">
							<span>
							<img src="{{Storage::disk('public')->url($partner->photo_url)}}" alt="Profile"/>
							</span>
						</div>

						<div class="col profile-desc">
							<h4 class="text-uppercase mb-5">{{$partner->name}}<span class="verified-sign text-normal ml-5"><i class="icon"></i> Verified</span></h4>
							<span class="text-uppercase">{{$partner->designation? $partner->designation->name: " "}}</span><br>
							<span>{{$partner->residence_address}}</span><br>
							<!-- Actions -->
							<div class="d-flex mt-15 partner-btn-holder">
								@if($partner->package()->exists())
									<span class="account-type"><i class="icon"></i> Premium Member</span>
								@endif

								@if($partner->has_received_interest)
								<button class="btn btn-green btn-sm mr-10" style="background: white !important; color:green"><i class="fa fa-check"></i>&nbsp; You've Already Sent Interest</button> 
								@else
								<button class="btn btn-green btn-sm mr-10 " onclick="return sendInterest('{!!$partner->reg_no!!}', this);">SEND INTEREST</button>
								@endif

								<button class="btn btn-warning btn-sm mr-10 " onclick="return isEligibleToviewContactDetails('{!!$partner->reg_no!!}');"><i class="fa fa-phone fa-rotate-90"></i> 
									<span>CONTACT NOW </span><br>
									<!-- <span>You've viewed her number</span> -->
								</button>

							   <!--  <button class="btn btn-red btn-sm mr-10">CONTACT</button> -->
							    <div class="btn-right-align">
							    	@if($partner->has_shortlisted)
								    <button class="btn btn-normal btn-sm mr-10 unlist" style="background: white; color:#ff0080" onclick="return shortList('{!!$partner->reg_no!!}', this);"> <i class='fas fa-heart-broken' style='font-size:13px;color:#ff0080'></i> &nbsp;Remove from Shortlist</button>
								    @else
								    <button class="btn btn-normal btn-sm mr-10 shortlist" style="background: #ff0080; color:white" onclick="return shortList('{!!$partner->reg_no!!}', this);" ><i class='fa fa-heart' style='font-size:13px;color:white'></i> &nbsp; SHORTLIST</button>
								    @endif
								<div class="dropdown dropleft">
									    {{-- <button class="btn dots btn-sm" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
									      <span></span>
									      <span></span>
									      <span></span>
                                        </button> --}}

                                        <div class="btn-right-align">
                                            @if($partner->has_blocklisted)
                                            <button class="btn btn-block btn-sm mr-10 unblock" style="background: white; color:#0a5066" onclick="return blockList('{!!$partner->reg_no!!}', this);"><i class="fa fa-eye" style='font-size:13px;color:#0a5066'></i> &nbsp; Unblock this Person</span></button>
                                            @else
                                            <button class="btn btn-block btn-sm mr-10 blocklist" style="background: #0a5066; color:white" onclick="return blockList('{!!$partner->reg_no!!}', this);"> <i class="fa fa-eye-slash" style='font-size:13px;color:white'></i> &nbsp;Block this Person</button>
                                            @endif
                                        </div>

									    {{-- <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
									      <a class="dropdown-item" href="#">Block</a>
									    </div> --}}
								  	</div>
							  	</div>
							</div>
							<!-- Actions End -->
						</div>
					</div>
				</div>
				<div class="row profile-tab mt-35">
					<div class="col">
					  	<ul class="nav nav-tabs tab-normal member-content">
						    <li class="nav-item about">
						      <a class="nav-link active" data-toggle="tab" href="#about"><i class="icon"></i> ABOUT</a>
						    </li>
						    <li class="nav-item photos">
						      <a class="nav-link" data-toggle="tab" href="#photos"><i class="icon"></i> PHOTOS</a>
						    </li>
						    <li class="member-id">MEMBER ID :  {{$partner->reg_no}}</li>
					  	</ul>
					   <!-- Tab panes -->
					  	<div class="tab-content pt-30 pb-30">
						    @include('member.partner_acc_about_tab')
							<!--  -->
							@include('member.partner_acc_photos_tab')
					</div>
				</div>
			</div>
		</section>
	</div>
</div>
<!-- Credit Warning Modal -->
<div class="modal fade" id="creditWarning" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title text-secondary" id="exampleModalLongTitle"></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
       <h3 class="modal-description text-secondary"></h3>
       <button type="button" class="btn btn-warning w-100 text-white" onclick="viewContactDetails('{!!$partner->reg_no!!}')"><i class="fa fa-phone fa-rotate-90"></i> VIEW MOBILE NUMBER</button>
      </div>

      <div class="modal-footer">
      <!--   <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> -->
       <!--  <button type="button" class="btn btn-primary">Save changes</button> -->
       <p class="modal-footer-description text-success"></p>
      </div>
    </div>
  </div>
</div>
<!-- Conatact Details Modal -->
<div class="modal fade" id="contactDetailsModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title text-secondary"></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
  		<table class="table table-hover table-striped">
  			<tbody>
	  			<tr>
	  				<th class="text-secondary"><i class="fa fa-phone fa-rotate-90"></i>&nbsp;Mobile Number</th>
	  				<td class="font-weight-bold text-secondary" id="mobileNumberContact"></td>
	  			</tr>
	  			<tr>
	  				<th class="text-secondary"> <i class="fa fa-address-card"></i>&nbsp;Address</th>
	  				<td class="font-weight-bold text-secondary" id="addressContact"></td>
	  			</tr>
	  			<tr>
	  				<th class="text-secondary"> <i class="fa fa-envelope"></i>&nbsp;Email</th>
	  				<td class="font-weight-bold text-secondary" id="emailContact"></td>
	  			</tr>
  			</tbody>
  		</table>
      </div>
      <div class="modal-footer">
       <p class="modal-footer-description text-success"></p>
      </div>
    </div>
  </div>
</div>
@endsection
@section('js_assets')
 <script>

$.ajaxSetup({
      headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') 
      }
    }); 
  // Member Photos
  var owl = $('#MemberPhotos');
  owl.owlCarousel({
  loop:true,
  nav:true,
  margin:25,
  responsive:{
  0:{
  items:2
  },
  1000:{
  items:3
  },
  1300:{
  items:4
  }
  }
  });

//Is eligible to View Contact details
function isEligibleToviewContactDetails(regNo){
		$.ajax({

	        url: '{!!url('/partner/profile/check')!!}',

	        type: 'POST',

	        data: {

	        	reg_no: regNo
	        },

	        success: function (response) {

	        	if(response.status == 'success'){
	        		$('#creditWarning').modal('show');
	        		$('#creditWarning .modal-title').text(response.title);
	        		$('#creditWarning .modal-body .modal-description').text('Would you like to view '+response.subject+' contact details?');
	        		$('#creditWarning .modal-footer .modal-footer-description').text("You've "+response.credits_left+" credits available.");

	        	}else if(response.status == 'unlocked'){
	        			openContactDetailsModal(response);
	        	}else{
	        		swal({
					  title: "Upgrade to Premium",
					  text: response.message,
					  icon: "warning",
					  buttons: {
					    cancel: "Ok,Later",
					    catch: {
					      text: "Upgrade now",
					      value: "upgrade",
					    }
					  }
					}).then((value) => {

					  switch (value) {

					    case "upgrade":
					      window.location = '{!!url("/packages")!!}';
					      break;

					    default:
					      swal.close();
					  }
					});
	        	}
	        },

	        dataType: "json",

	    })

	    .fail(function() {

	            alert( "error" );

	    });
	}


//View Contact details
function viewContactDetails(regNo){
	$.ajax({

        url: '{!!url('/partner/profile/unlock')!!}',

        type: 'POST',

        data: {

        	reg_no: regNo
        },

        success: function (response) {

        	if(response.status == 'success'){
        		$('#creditWarning').modal('hide');
        		openContactDetailsModal(response);

        	}else if(response.status == 'unlocked'){
        		$('#creditWarning').modal('hide');
    			openContactDetailsModal(response);
        	}else{
        		swal({
				  title: "Upgrade to Premium",
				  text: response.message,
				  icon: "warning",
				  buttons: {
				    cancel: "Ok,Later",
				    catch: {
				      text: "Upgrade now",
				      value: "upgrade",
				    }
				  }
				}).then((value) => {

				  switch (value) {

				    case "upgrade":
				      window.location = "packages";
				      break;

				    default:
				      swal.close();
				  }
				});
        	}
        },

        dataType: "json",

    })

    .fail(function() {

            alert( "error" );

    });
}

//Open modal contact details modal
function openContactDetailsModal(response){
	$('#contactDetailsModal').modal('show');
	$('#contactDetailsModal .modal-title').text(response.title);
	$('#mobileNumberContact').text(': '+response.contact_info);
	$('#addressContact').text(': '+response.address);
	$('#emailContact').text(': '+response.email);
	$('#contactDetailsModal .modal-footer .modal-footer-description').text("You've "+response.credits_left+" credits remaining.");
}
//Send interest
  function sendInterest(regNo, clickedElement){
		$.ajax({

	        url: '{!!url('/partner/send-interest')!!}',

	        type: 'POST',

	        data: {

	        	reg_no: regNo
	        },

	        success: function (response) {
	        	const Toast = Swal.mixin({
			      toast: true,
			      position: 'top-end',
			      showConfirmButton: false,
			      timer: 6000
			    });

	        	if(response.status == 'success'){
	        		//console.log(response);
	        		//Alert sent interest
	        		Toast.fire({
					        icon: 'success',
					        title: '\xa0\xa0\xa0\xa0\xa0' +'Interest sent'
				    })
	        		$(clickedElement).text(" You've Already Sent Interest").css('background', 'white').css('color','green').prepend("<i class='fa fa-check'> </i> ");

	        	}else{
	        		//Alert warning
	        		Toast.fire({
					        icon: 'error',
					        title: '\xa0\xa0\xa0\xa0\xa0' +'Couldnot sent interest.'
				    })
	        	}
	        },

	        dataType: "json",

	    })

	    .fail(function() {

	            alert( "error" );

	    });
	}

	function shortList(regNo, clickedElement){
		$.ajax({

	        url: '{!!url('/partner/shortlist')!!}',

	        type: 'POST',

	        data: {

	        	reg_no: regNo
	        },

	        success: function (response) {

	        	const Toast = Swal.mixin({
			      toast: true,
			      position: 'top-end',
			      showConfirmButton: false,
			      timer: 6000
			    });

	        	if(response.status == 'success'){
	        		//console.log(response.status);
	        		//TODO::Alert sent interest
	        		if ($(clickedElement).hasClass('shortlist')) {

	        			Toast.fire({
					        icon: 'success',
					        title: '\xa0\xa0\xa0\xa0\xa0' +'Added to Shortlist'
					    })

	        			$(clickedElement).addClass('unlist').removeClass('shortlist').text(' Remove from Shortlist').css('background', 'white').css('color','#ff0080').prepend('<i class="fas fa-heart-broken" style="font-size:12px;color:#ff0080"></i>');
	        		}else{

	        			Toast.fire({
					        icon: 'error',
					        title: '\xa0\xa0\xa0\xa0\xa0' +'Removed from Shortlist'
					    })

	        			$(clickedElement).addClass('shortlist').removeClass('unlist').text(' SHORTLIST').css('background', '#ff0080').css('color','white').prepend('<i class="fa fa-heart" style="font-size:12px;color:white"></i>'); 
	        		}


	        	}else{
	        		//TODO::Alert warning
	        	}
	        },

	        dataType: "json",

	    })

	    .fail(function() {

	            alert( "error" );

	    });
    }

    function blockList(regNo, clickedElement){
		$.ajax({

	        url: '{!!url('/partner/blocklist')!!}',

	        type: 'POST',

	        data: {

	        	reg_no: regNo
	        },

	        success: function (response) {

	        	const Toast = Swal.mixin({
			      toast: true,
			      position: 'top-end',
			      showConfirmButton: false,
			      timer: 6000
			    });

	        	if(response.status == 'success'){
	        		//console.log(response.status);
	        		//TODO::Alert sent interest
	        		if ($(clickedElement).hasClass('blocklist')) {

	        			Toast.fire({
					        icon: 'success',
					        title: '\xa0\xa0\xa0\xa0\xa0' +'Blocked'
					    })
						
	        			$(clickedElement).addClass('unblock').removeClass('blocklist').text(' Unblock this Person ').css('background', 'white').css('color','#0a5066').prepend('<i class="fa fa-eye" style="font-size:12px;color:#0a5066"></i> ');
	        		}else{

	        			Toast.fire({
					        icon: 'error',
					        title: '\xa0\xa0\xa0\xa0\xa0' +'Unblocked'
					    })

	        			$(clickedElement).addClass('blocklist').removeClass('unblock').text(' Block this Person ').css('background', '#0a5066').css('color','white').prepend('<i class="fa fa-eye-slash" style="font-size:12px;color:white"></i> ');
	        		}


	        	}else{
	        		//TODO::Alert warning
	        	}
	        },

	        dataType: "json",

	    })

	    .fail(function() {

	            alert( "error" );

	    });
	}

  </script>
@endsection