@extends('frontend.layout.master')

@section('title')
FSBM | {{ucfirst($slug->title)}}
@endsection

@section('keyword')
{!!strip_tags($slug->meta_keyword)!!}
@endsection

@section('description')
{!!strip_tags($slug->meta_desc)!!}
@endsection

@section('content')
<div id="uploadimageModal" class="modal" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Upload & Crop Image</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12 text-center">
                        <div id="image_demo" style="width:350px; margin-top:30px"></div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button class="btn btn-success crop_image">Crop & Upload Image</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

<!--User Profile-->
<section class="sptb">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="card">
<div class="card-body">
<div class="wideget-user">
<div class="row">
	<div class="col-lg-6 col-md-12">
		<div class="wideget-user-desc">
			<div class="wideget-user-img">
				@if(Auth::user()->image == NULL || Auth::user()->image == '')
					<img class="brround" src="{{asset('upload/profile/index.png')}}" alt="img">
				@else
					<img class="brround" src="{{asset('upload/profile/'.Auth::user()->image)}}" alt="img">
				@endif
			</div>
			<div class="user-wrap wideget-user-info">
				<a href="#" class="text-dark"><h4 class="font-weight-semibold">{{Auth::user()->name}}</h4></a>
				<h6 class="text-muted mb-3"><span class="text-dark"></span> 
					@if(Auth::user()->role_id == 2)
						Client
					@else
						Bidder
					@endif
				</h6>
			</div>
		</div>
	</div>
	
</div>
</div>
</div>
<div class="card-footer">
<div class="wideget-user-tab">
<div class="tab-menu-heading">
	<div class="tabs-menu1">
		<ul class="nav">
			@if(Auth::user()->role_id==2)
			<li><a href="#tab-7" data-toggle="tab" class="active">My Listings <span class="badge badge-primary badge-pill"></span></a></li>
			@else
			<li><a href="#tab-8" data-toggle="tab" class="active">My Bidding List <span class="badge badge-primary badge-pill"></span></a></li>
			@endif
			<li class=""><a href="#tab-5" data-toggle="tab">Profile</a></li>
			<li><a href="#tab-6" data-toggle="tab" class="">Edit Profile</a></li>
		</ul>
	</div>
</div>
</div>
</div>
</div>

<div class="card mb-0">
<div class="card-body">
<div class="border-0">
<div class="tab-content">

	@if(Session::has('success'))

	<div class="alert alert-primary">
		<p>{{ Session::get('success') }}</p>
	</div>

	@endif

	@if(Session::has('errors'))

	<div class="alert alert-danger">
		<p>{{ Session::get('errors') }}</p>
	</div>

	@endif
	<div class="tab-pane userprof-tab @if(Auth::user()->role_id==2) active @endif" id="tab-7">
		<!-- @if(Auth::user()->role_id == 2)
					 
		<div class=" mb-2 float-right">
			 <a class="ml-auto btn btn-primary" href="{{route('front.addMotgage')}}">Add New</a> 
		</div>
					
			@endif -->
		<div class="table-responsive border-top">
			
			<table class="table table-bordered table-hover mb-0 text-nowrap">
			<thead>
				<tr>
					<th>Name</th>
					<th>Category</th>
					<th>Price</th>
					<th>Status</th>
					<th>Action</th>
				</tr>
			</thead>
			<tbody>
				@foreach($selfMotgage as $val)
				<tr>
					
					<td>
						<div class="media mt-0 mb-0">
							<div class="card-aside-img">
								<a href="{{route('front.detail', base64_encode($val->id))}}"></a>
								<img src="{{asset('upload/property/thumb400/'.$val->picture)}}" alt="img">
							</div>
							<div class="media-body">
								<div class="card-item-desc ml-4 p-0 mt-2">
									<a href="{{route('front.detail', base64_encode($val->id))}}" class="text-dark"><h4 class="font-weight-semibold">{{$val->prop_name}}</h4></a>
									<i class="fa fa-clock-o mr-1"></i> 
									@if($val->endDate == '')
										Open
									@else
										{{date('d-M-Y', strtotime($val->endDate))}}, {{$val->endTime}}
									@endif<br>
									
								</div>
							</div>
						</div>
					</td>
					<td>{{$val->parent->cat_name}}</td>
					<td class="font-weight-semibold fs-16">@if($val->prop_price == NULL)
						{{$val->currency['curr_code']}} - Offers Invited
					@else
						{{$val->currency['curr_code']}} {{$val->prop_price}}
					@endif
					</td>

					<td>
						@if($val->status==0)
							Disable
						@elseif($val->status==2)
							Expired
						@else
							Active
						@endif
					</td>
					
					<td>

						<a class="btn btn-primary btn-sm text-white" data-toggle="tooltip" data-original-title="View" href="{{route('front.detail', base64_encode($val->id))}}"><i class="fa fa-eye"></i></a>
						<!-- @if($val->status!=2) -->
						<!-- <a class="btn btn-success btn-sm text-white" data-toggle="tooltip" data-original-title="Edit" href="{{route('front.propedit', base64_encode($val->id))}}"><i class="fa fa-pencil"></i></a>

						<a class="btn btn-warning btn-sm text-white" data-toggle="tooltip" data-original-title="Gallery" href="{{route('front.propGalleryList', base64_encode($val->id))}}"><i class="fa fa-camera"></i></a>  -->
						<!-- @endif -->

						<a class="btn btn-info btn-sm text-white" data-toggle="tooltip" data-original-title="Bidders" href="{{route('front.bidDetails', base64_encode($val->id))}}"><i class="fa fa-gavel"></i>
						</a>

						@if($val->status!=2)
						@if($val->status==0)
							<a class="icon" href="javascript:void(0)"></a>
							<a href="{{route('front.active', base64_encode($val->id))}}" data-toggle="tooltip" data-original-title="Enable" class="btn btn-secondary btn-sm text-white"><i class="fa fa-check"></i></a>
						@else
							<a class="icon" href="javascript:void(0)"></a>
							<a href="{{route('front.active', base64_encode($val->id))}}" data-toggle="tooltip" data-original-title="Disable" class="btn btn-dark btn-sm text-white"><i class="fa fa-window-close"></i></a>
						@endif
						@endif

						<!-- <a class="btn btn-danger btn-sm text-white Delete" data-toggle="modal" data-original-title="Delete" href="#deleteModal{{$val->id}}" title="Delete"><i class="fa fa-trash-o"></i></a> -->

						<!-- <span data-toggle="modal" data-target="#deleteModal{{$val->id}}">
							<a class="btn btn-danger btn-sm text-white Delete" data-toggle="tooltip" data-placement="top" data-original-title="Delete" title="Delete"><i class="fa fa-trash-o"></i></a>
						</span> -->
						
						@include('frontend.partial.prod_del_modal')
					</td>
				</tr>
				@endforeach
				
			</tbody>
		</table>

		</div>
		<div class="pagination pull-right" style="margin-top: 20px;">
		{{ $selfMotgage->links() }}
		</div>
	</div>
	<div class="tab-pane" id="tab-5">
		<div class="profile-log-switch">
			<div class="media-heading">
				<h3 class="card-title mb-3 font-weight-bold">Personal Details</h3>
			</div>
			<ul class="usertab-list mb-0">
				<li><a href="#" class="text-dark"><span class="font-weight-semibold">Full Name :</span> {{Auth::user()->name}}</a></li>
				@if(Auth::user())
				@if(Auth::user()->role_id == 2)
				<li><a href="#" class="text-dark"><span class="font-weight-semibold">Company Name :</span> 
					@if($userinfo->company_name == NULL)
						N/A
					@else
						{{$userinfo->company_name}}
					@endif</a>
				</li>
				@endif
				@endif
				<li><a href="#" class="text-dark"><span class="font-weight-semibold">Location :</span> 
					@if($userinfo->city == '')
						N/A
					@else
						{{$userinfo->city}}
					@endif</a></li>
				
				
				<li><a href="#" class="text-dark"><span class="font-weight-semibold">Email :</span> {{Auth::user()->email}}</a></li>
				<li><a href="#" class="text-dark"><span class="font-weight-semibold">Phone :</span>
					@if($userinfo->cont_number == '')
						N/A
					@else
						{{$userinfo->cont_number}}
					@endif</a></li>
			</ul>
			
		</div>
	</div>
	<div class="tab-pane" id="tab-6">
		<form method="post" action="{{route('front.profileupdate', base64_encode(Auth::user()->id))}}" enctype="multipart/form-data" onsubmit="return clientProfile()">
		<div class="row">
		  
		  	@csrf
		  	@if(Auth::user()->role_id == 2)
		  	<div class="col-sm-6 col-md-6">
				<div class="form-group">
					<label class="form-label">Company Name*</label>
					<p id="ccnamecheck" style="color: red; display: none;">  </p></span>
					<!-- <input type="text" class="form-control" value="{{$userinfo->company_name}}" name="cname" id="ccname"> -->
					<select class="form-control" name="cname" id="ccname">
																
						@foreach($company as $val)
						<option value="{{$val->id}}" {{ $user->company_id == $val->id ? 'selected' : '' }}>{{$val->company_name}}
						</option>
						@endforeach
																	
					</select>
					<input type="hidden" name="role_id" value="{{Auth::user()->role_id}}" id="role_id">
				</div>
			</div>
			@endif

			<div class="col-sm-6 col-md-6">
				<div class="form-group">
					<label class="form-label"> Name*</label>
					<p id="cfnamecheck" style="color: red; display: none;">  </p></span>
					<input type="text" class="form-control" value="{{Auth::user()->name}}" name="fname" id="cfname">
				</div>
			</div>

			
			<div class="col-sm-6 col-md-6">
				<div class="form-group">
					<label class="form-label">Email address*</label>
					<p id="cemailcheck" style="color: red; display: none;">  </p></span>
					<input type="email" class="form-control" name="email" value="{{Auth::user()->email}}" readonly id="cemail">
				</div>
			</div>

			<div class="col-sm-6 col-md-6">
				<div class="form-group">
					<label class="form-label">Phone Number*</label>
					<p id="cpnocheck" style="color: red; display: none;">  </p></span>
					<input type="number" class="form-control" name="pno" value="{{$userinfo->cont_number}}" id="cpno">
				</div>
			</div>

			<div class="col-md-12">
				<div class="form-group">
					<label class="form-label">Address*</label>
					<p id="caddrcheck" style="color: red; display: none;">  </p></span>
					<input type="text" class="form-control" name="addr" value="{{$userinfo->address}}" id="caddr">
				</div>
			</div>

			<div class="col-sm-6 col-md-6">
				<div class="form-group">
					<label class="form-label">City*</label>
					<p id="ccitycheck" style="color: red; display: none;">  </p></span>
					<input type="text" class="form-control" name="city" value="{{$userinfo->city}}" id="ccity">
				</div>
			</div>

			<div class="col-sm-6 col-md-6">
				<div class="form-group">
					<label class="form-label">State</label>
					<p id="cstatecheck" style="color: red; display: none;">  </p></span>
					<input type="text" class="form-control" name="state" value="{{$userinfo->state}}" id="cstate">
				</div>
			</div>

			<div class="col-sm-6 col-md-4">
				<div class="form-group">
					<label class="form-label">Country*</label>
					<p id="ccountrycheck" style="color: red; display: none;">  </p></span>
					<select class="form-control" data-placeholder="Select" id="ccountry"  name="country">
							@foreach($country as $val)
							<option value="{{$val->id}}" {{ $userinfo->country_id == $val->id ? 'selected' : '' }}>{{$val->country_name}}</option>
							@endforeach
							
						
					</select>
				</div>
			</div>

			<div class="col-sm-6 col-md-4">
				<div class="form-group">
					<label class="form-label">Postal Code</label>
					<p id="czipcheck" style="color: red; display: none;">  </p></span>
					<input type="number" class="form-control" name="zip" value="{{$userinfo->postal_code}}" id="czip">
				</div>
			</div>
			
			<div class="col-sm-6 col-md-4">
				<div class="form-group">
					<label class="form-label">Profile Picture Upload</label>
					<p id="cimagecheck" style="color: red; display: none;">  </p></span>
					<div class="custom-file">
						<input type="file" class="custom-file-input" name="img1" id="cimg">
						<label class="custom-file-label">Choose file</label>
						<textarea name="img"  id="gallery" style="display: none;" ></textarea>
					</div>
				</div>
			</div>
			<div id="uploaded_image"></div>
			<div class="col-md-12">
				
				<button type="submit" class="btn btn-primary">Update Profile</button>
				
			</div>
		
		</div>
		</form>
	</div>
	
	<div class="tab-pane userprof-tab @if(Auth::user()->role_id==3) active @endif" id="tab-8">
		
		<div class="table-responsive border-top">
			<table class="table table-bordered table-hover mb-0 text-nowrap">
				<thead>
					<tr>
						<th>Listing Name</th>
						<th>Category</th>
						<th>Min Bid Price</th>
						<th>Bid Price</th>
						<th>Bid Date</th>
						<th></th>
						
					</tr>
				</thead>
				<tbody>
					@if(!$Motgage->isEmpty())
					@foreach($Motgage as $val)
					<tr>
						<td>
							<div class="media mt-0 mb-0">
								<div class="card-aside-img">
									@if($val->property['status'] == 1)
									<a href="{{route('front.detail', base64_encode($val->prop_id))}}"></a>
									@endif
									<img src="{{asset('upload/property/thumb400/'.$val->property['picture'])}}" alt="img">
								</div>
								<div class="media-body">
									<div class="card-item-desc ml-4 p-0 mt-2">
										@if($val->property['status'] == 1)
										<a href="{{route('front.detail', base64_encode($val->prop_id))}}" class="text-dark"><h4 class="font-weight-semibold">{{$val->property['prop_name']}}</h4></a>	
										@else
										<a href="javascript:void(0)" class="text-dark"><h4 class="font-weight-semibold">{{$val->property['prop_name']}}</h4></a>
										@endif	
									</div>
								</div>
							</div>
						</td>
						<td>{{$val->category['cat_name']}}</td>
						<td class="font-weight-semibold fs-16">
							@if($val->property['prop_price'] == '')
								 {{$val->currency['curr_code']}} - Offers Invited
							@else
								{{$val->currency['curr_code']}} {{$val->property['prop_price']}}
								@endif
						</td>
						<td class="font-weight-semibold fs-16">{{$val->currency['curr_code']}} {{$val->bid_price}}
						
						</td>
						<td>
							<a href="#" class="badge badge-primary">{{date('d-M-y H:m', strtotime($val->updated_at))}}</a>
						</td>
						<td>
							
							@if($val->property['status'] == 1)
							<a class="btn btn-warning btn-sm text-white"  data-original-title="Listing Details" href="{{route('front.detail', base64_encode($val->prop_id))}}"><i class="fa fa-eye"></i></a>
							@endif

							<a class="btn btn-danger btn-sm text-white" data-toggle="modal" data-original-title="Delete" href="#deleteBiddingModal{{$val->id}}"><i class="fa fa-trash-o"></i></a>
							@include('frontend.partial.bidding_del_modal')
						</td>
					</tr>
					@endforeach
					@endif
					

				</tbody>
			</table>
		</div>
	</div>

</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
@endsection

@section('scripts')
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.Delete').mouseover(function(){

jQuery(this).data('toggle', 'tooltip');
setTimeout(() => {
jQuery(this).tooltip();
}, 500);

});

// $('[rel="tooltip"]').tooltip({trigger: "hover"});
});
function clientProfile() {

var fname   = $('#cfname').val();
var id      = $('#role_id').val();
var cname   = $('#ccname').val();
var pno     = $('#cpno').val();
var addr    = $('#caddr').val();
var city    = $('#ccity').val();
var zipcode = $('#czip').val();
var country = $('#ccountry').val();



// alert(link);
if(cname == '' && id == 2)
{
$('#ccnamecheck').show();
$('#ccnamecheck').html('** Please Fill This Field');
setTimeout(function(){
$('#ccnamecheck').hide();
}, 2000);

return false;
}


else if(fname == '')
{
$('#cfnamecheck').show();
$('#cfnamecheck').html('** Please Fill This Field');
setTimeout(function(){
$('#cfnamecheck').hide();
}, 2000);

return false;
}


else if(pno == '')
{
$('#cpnocheck').show();
$('#cpnocheck').html('** Please Fill This Field');
setTimeout(function(){
$('#cpnocheck').hide();
}, 2000);

return false;
}

else if(isNaN(pno))
{
$('#cpnocheck').show();
$('#cpnocheck').html('** Please Enter Digits Only');
setTimeout(function(){
$('#cpnocheck').hide();
}, 2000);

return false;
}

else if(addr == '')
{
$('#caddrcheck').show();
$('#caddrcheck').html('** Please Fill This Field');
setTimeout(function(){
$('#caddrcheck').hide();
}, 2000);

return false;
}
else if(city == 'NULL')
{
$('#ccitycheck').show();
$('#ccitycheck').html('** Please Fill This Field');
setTimeout(function(){
$('#ccitycheck').hide();
}, 2000);

return false;
}

else if(country == 'NULL')
{
$('#ccountrycheck').show();
$('#ccountrycheck').html('** Please Select Country From List');
setTimeout(function(){
$('#ccountrycheck').hide();
}, 2000);

return false;
}


else
{

return true;
}


}

</script>

<script>
    $(document).ready(function () {

     var image_crop = $('#image_demo').croppie({
            enableExif: true,
            viewport: {
                width: 400,
                height: 400,
                type: 'square' //circle
            },
            boundary: {
                width: 300,
                height: 300
            }
        });

        $('#cimg').on('change', function () {
            var reader = new FileReader();
            reader.onload = function (event) {
                image_crop.croppie('bind', {
                    url: event.target.result
                }).then(function () {
                    console.log('jQuery bind complete');
                });
            }
            console.log(this.files[0]);
            reader.readAsDataURL(this.files[0]);
            $('#uploadimageModal').modal('show');
        });

        $('.crop_image').click(function (event) {
            image_crop.croppie('result', {
                type: 'canvas',
                size: 'viewport'
            }).then(function (response) {
            	$('#gallery').html(response);
            	$('#uploadimageModal').modal('hide');
                // alert(response);
                
        });
    });

});





                            
</script>
@endsection