176 lines
12 KiB
PHP
176 lines
12 KiB
PHP
@extends('Shared.Layouts.BilettmLayout',['folder' => 'mobile'])
|
|
@section('content')
|
|
<section style="margin-bottom: 80px">
|
|
<div class="container">
|
|
<a class="mobile_pt_30 mobile_pb0 collapsed d-flex justify-content-between g-color-main g-text-underline--none--hover g-brd-bottom g-brd-gray-light-v4 g-pa-15-0" href="#accordion-10-body-02" data-toggle="collapse" data-parent="#accordion-10" aria-expanded="false" aria-controls="accordion-10-body-02">
|
|
<span class="d-flex">
|
|
<h2 class="mobile_header_tab">{{__('ClientSide.seats')}}</h2>
|
|
</span>
|
|
</a>
|
|
<div class="row">
|
|
<div class="pills-struct mt-5 w-100">
|
|
<ul role="tablist" class="nav nav-pills m-auto w-auto justify-content-center" id="choose_seats">
|
|
@foreach($tickets as $ticket)
|
|
<li class="active mb-5" role="presentation" style="display: inline-block;">
|
|
<a aria-expanded="true" data-toggle="tab" class="@if ($loop->first)active @endif show"
|
|
role="tab" id="home_tab_{{$ticket->id}}" href="#home_{{$ticket->id}}" aria-selected="true">
|
|
{{$ticket->title}} - {{$ticket->price}} TMT.
|
|
|
|
</a>
|
|
</li>
|
|
@endforeach
|
|
</ul>
|
|
<div class="row my-5">
|
|
<span class="text-center" style="width: fit-content; margin: 0 15px; font-size: 18px"><i class="fa fa-circle" style="color: #ebeced; font-size: 13px"></i> {{__('ClientSide.available')}}</span>
|
|
<span class="text-center" style="width: fit-content; margin: 0 15px; font-size: 18px"><i class="fa fa-circle" style="color: #06b84d; font-size: 13px"></i> {{__('ClientSide.booked')}}</span>
|
|
<span class="text-center" style="width: fit-content; margin: 0 15px; font-size: 18px"><i class="fa fa-circle" style="color: #4e5ced; font-size: 13px"></i> {{__('ClientSide.reserved')}}</span>
|
|
<span class="text-center" style="width: fit-content; margin: 0 15px; font-size: 18px"><i class="fa fa-circle" style="color: #ff4159; font-size: 13px"></i> {{__('ClientSide.selection')}}</span>
|
|
</div>
|
|
<!-- Button trigger modal -->
|
|
<button type="button" class="btn btn-primary seats-map" data-toggle="modal" data-target="#exampleModal"
|
|
style="background-color: #ffffff; color: #d43d34; border: 1px solid #d43d34; display: block; margin: auto; margin-bottom: 20px; padding: 10px 50px">
|
|
@lang("Public_ViewEvent.seats_map")
|
|
</button>
|
|
|
|
<!-- Modal -->
|
|
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog" role="document" style="max-width: 800px">
|
|
<div class="modal-content" style="background-color: unset; border: none; ">
|
|
<div class="modal-header" style="border-bottom: none">
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close"
|
|
style="border: 2px solid #ffffff; border-radius: 100px; padding: 0; opacity: 1">
|
|
<span aria-hidden="true"
|
|
style="color: #ffffff; opacity: 1; text-shadow: none; font-weight: lighter; font-size: 35px; padding: 0px !important; width: 30px; height: 30px; display: block; line-height: 31px;">×</span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<img class="img-responsive" src="{{asset('user_content/'.$event->venue->seats_image)}}" style="width: 100%">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<form id="seats-form" class="ajax" action="{{route('postValidateTickets',['event_id'=>$event->id])}}" method="post">
|
|
@csrf
|
|
<div class="tab-content" id="choose_seats_content">
|
|
@foreach($tickets as $ticket)
|
|
<div id="home_{{$ticket->id}}" class="tab-pane fade in @if ($loop->first) active show @endif " role="tabpanel">
|
|
<meta property="priceCurrency"
|
|
content="TMT">
|
|
<meta property="price"
|
|
content="{{ number_format($ticket->price, 2, '.', '') }}">
|
|
{{--<div class="row justify-content-center">--}}
|
|
{{--<img style="max-width: 60%;" class="img-responsive" alt="{{$event->venue->venue_name}} - {{$ticket->section->section_no}}"--}}
|
|
{{--src="{{asset('user_content/'.$ticket->section->section_image)}}" >--}}
|
|
{{--</div>--}}
|
|
@if($ticket->is_paused)
|
|
<h1 class="text-danger">@lang("Public_ViewEvent.currently_not_on_sale")</h1>
|
|
@else
|
|
@if($ticket->sale_status === config('attendize.ticket_status_sold_out'))
|
|
<span class="text-danger" property="availability"content="http://schema.org/SoldOut">
|
|
@lang("Public_ViewEvent.sold_out")
|
|
</span>
|
|
@elseif($ticket->sale_status === config('attendize.ticket_status_after_sale_date'))
|
|
<span class="text-danger">@lang("Public_ViewEvent.sales_have_ended")</span>
|
|
@else
|
|
<meta property="availability" content="http://schema.org/InStock">
|
|
<div class="standard-box" style="position: relative; padding: 20px 0; user-select: none;">
|
|
<h5 style="font-size: 24px;" class="text-center font-weight-bold">{{$ticket->section->section_no}} <small>{{$ticket->section->description}}</small></h5>
|
|
|
|
<table data-id="{{$ticket->id}}" style="text-align: center; margin: auto;display: block;overflow-x: scroll" id="seats"
|
|
data-content='{!! zanitlananlar($ticket)!!}'>
|
|
<tbody data-num="{{$ticket->price}}" data-max="{{$ticket->max_per_person}}">
|
|
@foreach($ticket->section->seats as $row)
|
|
<tr>
|
|
<td>{{$row['row']}}</td>
|
|
<td></td>
|
|
<td></td>
|
|
@for($i = $row['start_no'];$i<=$row['end_no'];$i++)
|
|
<td>
|
|
<input type="checkbox" class="seat_check"
|
|
id="seat{{$ticket->id.'-'.$row['row'].'-'.$i}}"
|
|
name="seats[{{$ticket->id}}][]"
|
|
value="{{$row['row'].'-'.$i}}">
|
|
<label for="seat{{$ticket->id.'-'.$row['row'].'-'.$i}}">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="26" height="25" viewBox="0 0 26 25">
|
|
<path id="Rectangle_3" data-name="Rectangle 3" d="M8,0H18a8,8,0,0,1,8,8V25a0,0,0,0,1,0,0H0a0,0,0,0,1,0,0V8A8,8,0,0,1,8,0Z"></path>
|
|
</svg>
|
|
<span style="position:relative;top: -28px">{{$i}}</span>
|
|
</label>
|
|
</td>
|
|
@endfor
|
|
<td></td>
|
|
</tr>
|
|
@endforeach
|
|
</tbody></table>
|
|
<!--<div class="seats-top-overlay" style="width: 70%"></div>-->
|
|
</div>
|
|
|
|
@endif
|
|
@endif
|
|
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
<div class="checked-seats" style="padding: 50px 0; text-align: center">
|
|
<h5 class="text-center">{{__("ClientSide.yourSeats")}}:</h5>
|
|
<div class="your-selected-seats" style="width: fit-content; text-align: center; margin: auto; margin-bottom: 50px">
|
|
</div>
|
|
{!!Form::submit(trans("ClientSide.confirm-seats"), ['id' => 'confirm-seats', 'style' => 'margin-top: 20px'])!!}
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
@endsection
|
|
@section('after_scripts')
|
|
<script>
|
|
$(':checkbox').change(function() {
|
|
var table = $(this).closest('tbody');
|
|
var max_seats = table.data('max');
|
|
var checkedCount = table.find('input:checkbox:checked').length;
|
|
|
|
if(checkedCount>max_seats){
|
|
$(this).prop("checked",false)
|
|
showMessage("You have excidid maximum ticket count: "+max_seats)
|
|
return;
|
|
}
|
|
|
|
if(this.checked) {
|
|
var ticket = "<span aria-label='"+this.id+"'>"+this.value+"</span>"
|
|
$('.your-selected-seats').append(ticket);
|
|
|
|
}
|
|
else{
|
|
$('.your-selected-seats').find("[aria-label='"+this.id+"']").remove();
|
|
}
|
|
|
|
});
|
|
|
|
$(document).ready(function () {
|
|
$('table').each(function (index,table) {
|
|
disable_rb(table);
|
|
});
|
|
});
|
|
function disable_rb(table) {
|
|
//alert(reserved[0]);
|
|
var disable_list = $(table).data('content');
|
|
// console.warn(JSON.parse(disable_list));
|
|
var table_id = $(table).data('id');
|
|
for(var i=0; i<disable_list.length; i++){
|
|
|
|
var objkey = Object.keys(disable_list[i]);
|
|
// console.warn(objkey);
|
|
var obValue = Object.values(disable_list[i])
|
|
// console.log($('#seat'+table_id+'-'+objkey).val());
|
|
$('#seat'+table_id+'-'+objkey).addClass('input-'+obValue);
|
|
$('#seat'+table_id+'-'+objkey).attr("disabled", true);
|
|
}
|
|
}
|
|
|
|
</script>
|
|
@include("Shared.Partials.LangScript")
|
|
{!!HTML::script(config('attendize.cdn_url_static_assets').'/assets/javascript/frontend.js')!!}
|
|
@endsection
|