Viewing file: multiRestaurant.blade.php (25.39 KB) -rw-r--r-- Select action/file-type: (+) | (+) | (+) | Code (+) | Session (+) | (+) | SDB (+) | (+) | (+) | (+) | (+) | (+) |
@extends('multirestaurant::layouts.master')
@section('title') {{json_decode(get_settings('site_setting'))->name}} - {{trans('multirestaurant::layout.multi_restaurants')}} @endsection
@section('content')
<div class="main-section">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="tab hide-conten" role="tabpanel">
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#Section1" aria-controls="home" role="tab"
data-toggle="tab" class="acor">{{trans('multirestaurant::layout.delivery')}}</a></li>
<li role="presentation"><a href="#Section2" aria-controls="profile" role="tab"
data-toggle="tab" class="acor">{{trans('multirestaurant::layout.pick_up')}}</a></li>
<li role="presentation"><a href="#Section3" aria-controls="messages" role="tab"
data-toggle="tab" class="acor">{{trans('multirestaurant::layout.book_a_table')}}T</a></li>
</ul>
</div>
</div>
</div>
</div>
<ul class="box-flex switcher-delivery fd-row">
<li class="active">
<a href=""class="service-image-par">
<div class="service-image mr-4">
<img src="{{asset('images/istockphoto-1219669445-612x612.jpg')}}" alt="">
</div>
<div class="service-image-text">{{trans('multirestaurant::layout.delivery')}}</div>
</a>
</li>
<li class="actived">
<a href="" class="service-image-par">
<div class="service-image">
<img src="{{asset('images/curbside-pickup.jpg')}}" alt="">
</div>
<div class="service-image-text">{{trans('multirestaurant::layout.pick_up')}}</div>
</a>
</li>
<li class="activeed">
<a href="" class="service-image-par">
<div class="service-image">
<img src="{{asset('images/photo-1565895405140-6b9830a88c19.jpg')}}" alt="">
</div>
<div class="service-image-text">{{trans('multirestaurant::layout.book_a_table')}}</div>
</a>
</li>
</ul>
<div class="form-section sce-section">
<form class="form-location">
<div class="search-address">
<div class="search-input-box">
<input type="text" class="search-form-input" name="" id="pac-input"
placeholder=" Enter your full address" autocomplete="off" value="">
<small class="error-text" id="error"></small>
</div>
<div class="city-par d-none">
<ul class="city-name pt-2 pb-2" id="showCity"></ul>
</div>
</div>
<div class="btn-set">
<div class="dropdown">
<button class="btn-delivery">{{trans('multirestaurant::layout.select_order_type')}}</button>
<div class="dropdown-content">
<a type="btn" class="locationBtn" id="cash_on_delivery_btn" order-type="cash_on_delivery">{{trans('multirestaurant::layout.delivery')}}</a>
<a type="btn" class="locationBtn" id="takeaway_btn" order-type="takeaway">{{trans('multirestaurant::layout.pick_up')}}</a>
</div>
</div>
<span class="btn-separator">or</span>
<button type="button" class="btn-delivery locationBtn" id="table_booking_btn" order-type="table_booking">{{trans('multirestaurant::layout.book_a_table')}}</button>
</div>
</form>
</div>
<div class="container mt-4 d-none">
<div class="row">
<div class="MultiCarousel" data-items="1,2,3,4" data-slide="3" id="MultiCarousel" data-interval="3000">
<div class="MultiCarousel-inner">
<div class="item">
<div class="m-2">
<img src="{{asset('images/College-drvie-through-coronavirus-food-pickup.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/200522-fine-dining-al-0903.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/curbside-pickup.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/download.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/fresh-parsley-vegetables_23-2147694205.webp')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/gettyimages-1081422898-612x612.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/istockphoto-1219669445-612x612.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/istockphoto-1297429465-170667a.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img
src="{{asset('images/leading-lawyer-company-background-business-meeting-business-partners-leading-lawyer_160672-23138.jpg')}}"
alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/pexels-photo-262978.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/photo-1565895405140-6b9830a88c19.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/photo-1590846406792-0adc7f938f1d.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/200522-fine-dining-al-0903.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/curbside-pickup.jpg')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img src="{{asset('images/fresh-parsley-vegetables_23-2147694205.webp')}}" alt="">
</div>
</div>
<div class="item">
<div class="m-2">
<img
src="{{asset('images/leading-lawyer-company-background-business-meeting-business-partners-leading-lawyer_160672-23138.jpg')}}"
alt="">
</div>
</div>
</div>
<button class="btn btn-primary leftLst"><i class="fa fa-arrow-left"></i></button>
<button class="btn btn-primary rightLst"><i class="fa fa-arrow-right"></i></button>
</div>
</div>
</div>
<div class="container mt-4">
<div class="row">
@if(isset($restaurants) && $restaurants)
@foreach($restaurants as $restaurant)
<div class="col-lg-3 col-md-6 mt-4">
<div class="card" restaurant_id="{{$restaurant['id']}}" id="restaurant_id">
<div class="restaurant-card" data-order-url="{{isset($order_type) && $order_type == 'table_booking'?'':$restaurant['route']}}" restaurant_id="{{$restaurant['id']}}">
<div class="image-contain">
<img src="{{$restaurant['image']}}"
class="img-fluid rounded thumbnail">
</div>
<div class="product-detail-container p-2">
<div class="d-flex justify-content-between align-items-center">
<h5 class="rest-name">{{$restaurant['name']}}</h5>
</div>
<div class="d-flex justify-content-between align-items-center pt-1">
<span class="delivery-fee float-right">TK {{ceil($restaurant['distance'])*$restaurant['delivery_fee']}} ({{ceil($restaurant['distance'])}} km) <small>{{trans('multirestaurant::layout.delivery_fee')}}</small></span>
</div>
</div>
</div>
</div>
</div>
@endforeach
@else
<div class="col-lg-12">
<h5 class="card-title pt-3 text-center text-danger" id="multirestaurant-notification">{{trans('multirestaurant::layout.no_restaurant_found')}}</h5>
</div>
@endif
@if(isset($city_restaurants) && $city_restaurants->isNotEmpty())
@foreach($city_restaurants as $city_restaurant)
<div class="col-lg-3 col-md-6 mt-4">
<div class="card" data-id="{{$city_restaurant->id}}" id="city-data-id">
<div class="restaurant-card" data-order-url="{{isset($order_type) && $order_type == 'table_booking'?'': (route('show.restaurant',['slug'=>$city_restaurant->slug,'id'=>$city_restaurant->id]))}}" data-id="{{$city_restaurant->id}}">
<div class="image-contain">
<img src="{{asset('uploads/'.$city_restaurant->cover_image)}}"
class="img-fluid rounded thumbnail">
</div>
<div class="product-detail-container p-2">
<div class="d-flex justify-content-between align-items-center">
<h5 class="rest-name">{{$city_restaurant->name}}</h5>
</div>
</div>
</div>
</div>
</div>
@endforeach
@endif
</div>
</div>
</div>
<div class="table-booking-modal tableBookingModal">
<div class="table-booking-modal-content">
<span class="tableBookingClose close">×</span>
<form action="{{route('multirestaurant::table.booking')}}" method="post">
@csrf
<input type="hidden" id="restaurant_table_id" name="restaurant_table_id">
<div class="container">
<div class="row">
<div class="col-md-6">
<label for="name">{{trans('multirestaurant::layout.name')}}</label>
<input value="{{auth()->check()?auth()->user()->name:''}}" name="name"
type="text" class="form-control" id="name"
placeholder="Ex jone doe"
required="">
</div>
<div class="col-md-6">
<label for="phone_number">{{trans('multirestaurant::layout.phone')}}</label>
<input value="{{auth()->check()?auth()->user()->phone:''}}"
name="phone_number"
type="number" class="form-control" id="phone_number"
placeholder="phone number">
<span id="phone-error" class="small text-danger p-2"></span>
</div>
<div class="col-md-12">
<label for="email">{{trans('multirestaurant::layout.email')}}</label>
<input value="{{auth()->check()?auth()->user()->email:''}}" name="email"
type="email" class="form-control" id="email"
placeholder="Ex example.email.com">
<span id="email-error" class="small text-danger p-2"></span>
</div>
<div class="col-md-6">
<label for="email">{{trans('multirestaurant::layout.time')}}</label>
<input name="time"
type="time" class="form-control">
</div>
<div class="col-md-6">
<label for="email">{{trans('multirestaurant::layout.date')}}</label>
<input name="date"
type="date" class="form-control">
</div>
<div class="col-md-12 col-12 mb-3 ">
<label for="table_id">{{trans('multirestaurant::layout.select_a_table')}}</label>
<select id="restauran_tables" class="form-control" name="table_id"></select>
</div>
<div class="col-md-6 mb-3">
<label for="person">{{trans('multirestaurant::layout.number_of_person')}}</label>
<input name="person"
type="text" class="form-control" placeholder="Ex 4 person">
</div>
<div class="col-md-6 mb-3">
<label for="reference_number">{{trans('multirestaurant::layout.reference_number')}}</label>
<input name="reference_number"
type="text" class="form-control" placeholder="Ex 098xxxx">
</div>
<div class="col-md-12 mb-3">
<label for="reference_name">{{trans('multirestaurant::layout.reference_name')}}</label>
<input name="reference_name"
type="text" class="form-control" placeholder="Ex jone doe">
</div>
<div class="col-md-12 mb-3">
<label for="comment">{{trans('multirestaurant::layout.comment')}}</label>
<input name="comment" type="text" class="form-control" id="comment"
placeholder="Ex. Need extra spoon">
<button type="submit"
class="btn btn-xs btn-primary place-order mt-3">
{{trans('multirestaurant::layout.book')}}
</button>
</div>
</div>
</div>
</form>
</div>
</div>
<div class="location-modal locationModal">
<div class="location-modal-content">
<span class="locationClose close">×</span>
<div id="locationMap"></div>
</div>
<form action="{{route('multirestaurant::find.restaurant')}}" method="GET">
<input type="hidden" id="modal-input" name="restaurant_location">
<input type="hidden" id="input_lat" name="location_lat">
<input type="hidden" id="input_long" name="location_long">
<input type="hidden" id="modal-input-order-type" name="order_type">
<div class="text-center ml-3">
<button type="submit" class="btn process-btn find">{{trans('multirestaurant::layout.find_restaurant')}}</button>
</div>
</form>
</div>
<div id="map"></div>
<div id="infowindow-content">
<span id="place-name"></span><br />
<span id="place-address"></span>
</div>
<input type="hidden" id="lat">
<input type="hidden" id="long">
<input type="hidden" id="address">
<input id="api_key" type="hidden" value="{{isset(json_decode(get_settings('site_setting'))->api_key)?json_decode(get_settings('site_setting'))->api_key:''}}">
@endsection
@section('js')
<script>
$(document).on('click', '.restaurant-card', function (e) {
e.preventDefault();
const restaurant_id = $(this).attr('restaurant_id');
const url=$(this).attr('data-order-url');
if(url){
window.location.href=url;
return;
}
const tables = @json(isset($tables)?$tables:'');
let html_tables = '';
$.each(tables, function(index,value) {
if (value.restaurant_id == restaurant_id){
html_tables += ` <option value='${value.id}'>${value.name} (Sitting capacity ${value.no_of_capacity} and table position ${value.position})</option>`;
}
});
$('#restaurant_table_id').val(restaurant_id);
$('#restauran_tables').html(html_tables);
$(".tableBookingModal").toggle();
})
$(document).on('click','.tableBookingClose', (e)=> {
e.preventDefault();
$(".tableBookingModal").toggle();
});
</script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
<script>
const restaurant_id = $('#restaurant_id').attr('restaurant_id');
const city_restaurant_id = $('#city-data-id').attr('data-id');
if (restaurant_id || city_restaurant_id){
$('#multirestaurant-notification').addClass('d-none');
}
</script>
<script>
$(document).on('click','#cash_on_delivery_btn', (e)=> {
e.preventDefault();
const order_type_cash_on_delivery = $('#cash_on_delivery_btn').attr('order-type');
const lat = $('#lat').val();
const long = $('#long').val();
if (lat || long){
$('#error').addClass('d-none');
const address = $('#address').val();
$('#modal-input-order-type').val(order_type_cash_on_delivery)
$('#modal-input').val(address)
$('#input_lat').val(lat)
$('#input_long').val(long)
let html_location_map =`<iframe width="100%" height="380px" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?q=${address}&layer=tc&t=m&z=18&source=embed&output=svembed"></iframe>`
$('#locationMap').html(html_location_map)
$(".location-modal").toggle();
}else {
@if (env('APP_DEMO'))
$("#error").html('This option is not available in the demo version');
@else
$("#error").html('select a location address form the list');
@endif
}
});
$(document).on('click','#takeaway_btn', (e)=> {
e.preventDefault();
const order_type_takeaway = $('#takeaway_btn').attr('order-type');
const lat = $('#lat').val();
const long = $('#long').val();
if (lat || long){
$('#error').addClass('d-none');
const address = $('#address').val();
$('#modal-input-order-type').val(order_type_takeaway)
$('#modal-input').val(address)
$('#input_lat').val(lat)
$('#input_long').val(long)
let html_location_map =`<iframe width="100%" height="380px" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?q=${address}&layer=tc&t=m&z=18&source=embed&output=svembed"></iframe>`
$('#locationMap').html(html_location_map)
$(".location-modal").toggle();
}else {
@if (env('APP_DEMO'))
$("#error").html('This option is not available in the demo version');
@else
$("#error").html('select a location address form the list');
@endif
}
});
$(document).on('click','#table_booking_btn', (e)=> {
e.preventDefault();
$('.city-par').addClass('d-none');
const order_type_table_booking = $('#table_booking_btn').attr('order-type');
const lat = $('#lat').val();
const long = $('#long').val();
if (lat || long){
$('#error').addClass('d-none');
const address = $('#address').val();
$('#modal-input-order-type').val(order_type_table_booking)
$('#modal-input').val(address)
$('#input_lat').val(lat)
$('#input_long').val(long)
let html_location_map =`<iframe width="100%" height="380px" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?q=${address}&layer=tc&t=m&z=18&source=embed&output=svembed"></iframe>`
$('#locationMap').html(html_location_map)
$(".location-modal").toggle();
}else {
@if (env('APP_DEMO'))
$("#error").html('This option is not available in the demo version');
@else
$("#error").html('select a location address form the list');
@endif
}
});
$(document).on('click','.locationClose', (e)=> {
e.preventDefault();
$(".location-modal").toggle();
location.reload();
});
@if (!env('APP_DEMO'))
$(document).on('keyup or past','#pac-input', function (e) {
e.preventDefault();
const cityname = $(this).val();
const key = $('#api_key').val();
if (key){
const search_string = "https://maps.googleapis.com/maps/api/place/textsearch/json?query=restaurants+in+"+cityname+"&sensor=false&key="+key+"";
$.ajax({
url: search_string
}).done( function ( data ) {
$('.city-par').removeClass('d-none');
let html_city = '';
$.each(data['results'], function(index,value){
html_city+=`<li class="p-1 locationCity" data-lat="${value.geometry.location.lat}" data-long="${value.geometry.location.lng}" data-address="${value.formatted_address}"> ${value.formatted_address}</li>`
});
$("#showCity").html(html_city);
});
}
});
@endif
$(document).on('click','.locationCity', function (e) {
e.preventDefault();
const lat = $(this).attr('data-lat');
const long = $(this).attr('data-long');
const address = $(this).attr('data-address');
$('#lat').val(lat)
$('#long').val(long)
$('#address').val(address)
$('#pac-input').val(address)
$('.city-par').addClass('d-none');
});
</script>
@endsection
|