@extends('layouts.app')
@section('content')
<div class="main-header">
    <div class="admin-header">
        <div class="uk-grid">
            <div class="uk-width-auto">
                <h1 class="uk-margin-small-top main-heading">{{$title}} ({{'#S'.$sellerRequest->id}})</h1>
            </div>
            <div class="uk-width-expand uk-text-right">
                <a class="uk-button uk-button-default" href="{{url('admin/seller-request')}}"> Back</a>
            </div>
        </div>
    </div>
</div>
@php
    $amenities    = json_decode($sellerRequest->amenities);
    $amenities    = implode(", ",$amenities);
            
    $heatingFuels = json_decode($sellerRequest->heating_fuel);
    $heatingFuels = implode(", ",$heatingFuels);
    
    $parkings     = json_decode($sellerRequest->parking);
    $parkings     = implode(", ",$parkings);
    
    $propertyType     = json_decode($sellerRequest->type_of_house);
    $propertyType     = implode(", ",$propertyType);
@endphp
<div class="uk-margin uk-width-1-1 uk-margin-auto uk-card uk-card-default uk-card-body small-padding">
    <div uk-grid>
        <div class="uk-width-1-1@m uk-text-right">
            <a class="uk-label" href="{{ url('admin/edit-seller-request/'.$sellerRequest->id) }}">Edit Details</a>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Name:</b> <br>{{$sellerRequest->users ? $sellerRequest->users->name : ''}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Province:</b> <br>{{$sellerRequest->province}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Region:</b> <br>{{$sellerRequest->region}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>City:</b> <br>{{$sellerRequest->city}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Sell Price:</b> <br>${{$sellerRequest->sell_price}}{{ $sellerRequest->sell_price_tag}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Bedrooms:</b> <br>{{$sellerRequest->bedrooms}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Bathrooms:</b> <br>{{$sellerRequest->bathrooms}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Type of house:</b> <br>{{$propertyType}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Heating and Cooling:</b> <br>{{$heatingFuels}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Other Feauters:</b> <br>{{$amenities}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Age Property:</b> <br>{{$sellerRequest->age_property}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Building Area:</b> <br>{{$sellerRequest->sqft_property}} {{$sellerRequest->building_area_tag}}</span>
        </div>
        <div class="uk-width-1-5@s">
            <span><b>Parking:</b> <br>{{$parkings}}</span>
        </div>
        <div class="uk-width-1-5@s">
            @if($sellerRequest->senior_community)
            <span><b>Senior Community:</b> <br>Yes</span>
            @else
            <span><b>Senior Community:</b> <br>No</span>
            @endif
        </div>
        <div class="uk-width-1-1@s">
            <hr>
        </div>
        <div class="uk-width-1-2@s">
            @if($sellerRequest->suite == 1)
            <div class="uk-text-break"><b>Is there suit in your home?</b> <br>Yes ({{$sellerRequest->suite_option}})</div>
            @else
            <div class="uk-text-break"><b>Is there suit in your home?</b> <br>No</div>
            @endif
        </div>
        <div class="uk-width-1-2@s">
            @if($sellerRequest->buying_new_home == 1)
            <div class="uk-text-break"><b>Will you also be buying a new home?</b> <br>Yes</div>
            @else
            <div class="uk-text-break"><b>Will you also be buying a new home?</b> <br>No</div>
            @endif
        </div>
        <div class="uk-width-1-2@s">
            @if($sellerRequest->already_buy_request == 1)
            <div class="uk-text-break"><b>Is your home currently listed for sale with another realtor?</b> <br>Yes</div>
            @else
            <div class="uk-text-break"><b>Is your home currently listed for sale with another realtor?</b> <br>No</div>
            @endif
        </div>
        <div class="uk-width-1-2@s">
            @if($sellerRequest->currently_listed_realtor == 1)
            <div class="uk-text-break"><b>Have you added a buy request to Listing Llama already?</b> <br>Yes</div>
            @else
            <div class="uk-text-break"><b>Have you added a buy request to Listing Llama already?</b> <br>No</div>
            @endif
        </div>
        <div class="uk-width-1-1@s">
            <hr>
        </div>
        <div class="uk-width-1-2@s">
            <div class="uk-text-break"><b>Preferred Neighbourhoods:</b> <br>{!! nl2br($sellerRequest->preferred_neighbourhoods) !!}</div>
        </div>
        <div class="uk-width-1-2@s">
            <div class="uk-text-break"><b>Other Information / Features Required:</b> <br>{!! nl2br($sellerRequest->other_request) !!}</div>
        </div>
        <div class="uk-width-1-1@s">
            <hr>
            <span><b>Images:</b></span>
            <div class="uk-margin">
                <div class="uk-position-relative uk-visible-toggle uk-light" tabindex="-1" uk-slider="autoplay: true">
                    <ul class="uk-slider-items uk-child-width-1-1 uk-child-width-1-6@m uk-grid">
                        @if($sellerImages->count() > 0)
                        @foreach($sellerImages as $sellerImage)
                            <li>
                                <div class="uk-panel" uk-grid uk-lightbox="animation: scale">
                                    <a class="uk-inline" data-id="{{ $sellerImage->id }}" href="{{url('storage/request_images/'.$sellerRequest->user_id.'/'.$sellerImage->request_id.'/'.$sellerImage->filename)}}">
                                        <img class="slides-image" src="{{url('storage/request_images/'.$sellerRequest->user_id.'/'.$sellerImage->request_id.'/'.$sellerImage->filename)}}" alt="">
                                    </a>
                                </div>
                                <div class="uk-margin-small-top uk-margin-small-bottom uk-text-center">
                                    <a href="javascript:void(0)" class="uk-label uk-label-danger remove-image" data-id="{{ $sellerImage->id }}" data-request="{{ $sellerImage->request_id }}" data-user="{{ $sellerRequest->user_id }}">Remove</a>
                                </div>
                            </li>
                        @endforeach
                        @else
                        <div class="uk-width-1-1@m">
                            <div class="uk-alert-primary uk-text-center" uk-alert>
                                <a class="uk-alert-close" uk-close></a>
                                <p>No image found.</p>
                            </div>
                        </div>
                        @endif
                    </ul>
                    <a class="uk-position-center-left uk-position-small uk-hidden-hover" href="#" uk-slidenav-previous uk-slider-item="previous"></a>
                    <a class="uk-position-center-right uk-position-small uk-hidden-hover" href="#" uk-slidenav-next uk-slider-item="next"></a>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('footer-script')
<script>

    $(document).on('click','.remove-image',function(){
        var id        = $(this).data('id');
        var userId    = $(this).data('user');
        var requestId = $(this).data('request');
        var clst      = $(this).closest('li');
        UIkit.modal.confirm('Are you sure you want to remove this image?').then(function() {
            $.ajax(
            {
                url: url + "/admin/remove-seller-image", 
                type: 'POST',
                dataType: "JSON",
                data:{
                    'id'         :id,
                    'user_id'    : userId,
                    'request_id' : requestId
                }, 
                success: function (res)
                {
                    if(res.success == 1){
                        UIkit.modal.alert('Image successfully remove.');
                        clst.remove();    
                    }
                }
            });
        }, function () {
        });
    });
    
</script>
@endsection