Files
opensem/resources/views/shop/admin/Sections/site/recherche.blade.php
2020-03-30 00:48:17 +02:00

110 lines
3.4 KiB
PHP

<section style="padding-top: 20px;">
<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
<div class="container-fluid position-absolute" style="z-index: 5; padding-top: 40px;">
<div class="row justify-content-md-center">
<div class="col-sm-8">
<div class="widget padding-lg bg-dark">
<h1 class="text-center text-light wow rubberBand">Recherchez un lot</h1>
<form action="{{ route('Hestimmo.Lots.disponibles') }}" method="GET" class="form-inline">
<div class="row">
<div class="col-md-3">
<label for="">Type de logement</label>
<select name="type_lot_id" class="form-control">
<option>Type de lots</option>
@foreach($type_lots as $key => $type_lot)
<option value="{{$key}}">{{$type_lot}}</option>
@endforeach
</select>
</div>
<div class="col-md-3">
<label for="">Ville</label>
<select name="ville" id="ville" class="form-control" placeholder="Ville"></select>
<div class="form-group">
<input type="number" style="width: 100%;" id="distance" name="distance" data-provide="slider" data-slider-min="0" data-slider-max="40" data-slider-step="5" >
</div>
<div class="form-group">
Distance : <span id="distanceSliderVal">5</span> km
</div>
</div>
<div class="col-md-3 text-center">
<label class="col-sm-12">Budget</label>
<div class="form-group">
<input type="number" style="width: 100%;" id="budget" name="budget" data-provide="slider" data-slider-min="50000" data-slider-max="600000" data-slider-step="10000" >
</div>
<h3><span id="budgetSliderVal">50 000,00 </span></h3>
<div class="w-100">+/- 5000 </div>
</div>
<div class="col-md-2">
<label for=""></label>
<button class="btn btn-primary btn-block">Rechercher</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="/storage/images/site/slide01.jpg" class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<img src="/storage/images/site/slide02.jpg" class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<img src="/storage/images/site/slide03.jpg" class="d-block w-100" alt="...">
</div>
</div>
</div>
</section>
@include('boilerplate::load.select2')
@push('js')
<script src="/js/bootstrap-slider.min.js"></script>
<script>
$(function () {
var mySlider = $("input.slider").slider();
$("#budget").on("slide", function(slideEvt) {
value = new Intl.NumberFormat('fr-FR', { style: 'currency', currency: 'EUR' }).format(slideEvt.value);
$("#budgetSliderVal").text(value);
});
$("#distance").on("slide", function(slideEvt) {
$("#distanceSliderVal").text(slideEvt.value);
});
$('#ville').select2({
ajax: {
url: "{{ route('Villes.autocomplete') }}",
data: function (params) {
var query = {
search: params.term
}
// Query parameters will be ?search=[term]
return query;
}
}
});
var wew = new Wew({
target: '.wow',
keyword: 'wow',
});
wew.init();
});
</script>
@endpush
@push('css')
<link rel="stylesheet" href="/css/bootstrap-slider.min.css">
@endpush