Files
bm/public_html/resources/views/book/viewTable.blade.php

388 lines
14 KiB
PHP

@extends('layout')
@section('content')
<link href="{{ asset('css/jquery.seat-charts.css') }}" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<link href="{{ asset('css/custom.css') }}" rel="stylesheet" type="text/css">
<style>
.seatCharts-space {
visibility: hidden;
}
/*.seatCharts-row{
height: 50px !important;
}
div.seatCharts-row
{
width: 16%;
float: left;
}*/
.num
{
float: left;
width: 25px;
margin-top: 13px;
}
.secrow
{
margin-left: 25px;
margin-top: -14px;
}
.seatCharts-space{
display: none;
}
.seatCharts-row{
padding-top: 20px;
}
div.seatCharts-row:nth-child(7){
padding-top: 70px;
}
/*
div.seatCharts-row:nth-child(1){
margin-left: 96px;
}
div.seatCharts-row:nth-child(2){
margin-left: 96px;
}
div.seatCharts-row:nth-child(3){
margin-left: 64px;
}*/
/*SOMMERTHEATERdiv.seatCharts-row:nth-last-child(53){
margin-left: 32%;
}
div.seatCharts-row:nth-last-child(49){
margin-left: 32%;
}
div.seatCharts-row:nth-last-child(45){
margin-left: 16%;
}
div.seatCharts-row:nth-last-child(10){
margin-left: 16%;
}
div.seatCharts-row:nth-last-child(5){
margin-left: 16%;
}*/
/*div.seatCharts-row:nth-child(1){
margin-left: 80%;
}
div.seatCharts-row:nth-child(2){
margin-left: 32%;
}
div.seatCharts-row:nth-last-child(2){
margin-left: 64%;
}*/
</style>
<div class="row">
<div class="col-sm-12">
<div class="ui ordered steps">
<div class="active step">
<div class="content">
<div class="title">Sitzplatz wählen</div>
<div class="description">Sitzplatz und Rabatt wählen</div>
</div>
</div>
@if(!Auth::check())
<div class="step">
<div class="content">
<div class="title">Dateneingabe</div>
<div class="description">Login oder Registrierung</div>
</div>
</div>
@endif
<div class="step">
<div class="content">
<div class="title">Reservierungsbestätigung</div>
<div class="description">Ansehen und Reservierung aufgeben!</div>
</div>
</div>
</div>
</div>
</div>
<br />
@if( strtotime('2025-04-31') >= strtotime('now') && $event->id==1823)
<div class="ui message">
<div class="header">
Frühbucherpreis
</div>
<p>Schnell sein lohnt sich! Bis zum 30. April 2025 ist eine Karte um 25/20 erhältlich (wird im zweiten Schritt automatisch abgezogen). Ab 1. Mai 2025 erhöht sich der Preis auf 29/24 (unsere üblichen Ermäßigungen sind natürlich gültig).</p>
</div>
<br />
@endif
{!! Form::open(['url' => 'book', 'onsubmit="return validateForm()"']) !!}
<div class="row">
<div class="col-sm-12 col-lg-8">
<h1 style="margin-bottom: 50px;">{{$event->title}} <span style="white-space: nowrap;">({{strftime('%d. %m. %Y', strtotime($seat->date))}})</span></h1>
<!--<table id='note-empore' style="width:70px; height: 550px; text-align: center;position: absolute;bottom: 15px;left: 680px;" border="1"><tbody><tr><td>Bühne</td></tr></tbody></table>-->
<!-- SOMMERFEST<table style="width: 600px; text-align: center; position: absolute; top: 40px; height: 50px; border: none;" ><tbody><tr><td>~~~ Wasserpark ~~~</td></tr></tbody></table>-->
<table style="width: 255px; position: absolute; text-align:center; bottom: 340px; height: 30px;" border="1"><tbody><tr><td style="border-right: none;">Bühne</td></tr></tbody></table>
<!--<table style="width: 600px; text-align: left; position: absolute; top: 70px; height: 50px; border: none;" ><tbody><tr><td>Gastronomie</td></tr></tbody></table>-->
<div id="seat-map" style="width: 700px;"></div>
<table style="width: 150px; position: absolute; left: 280px;text-align:center; bottom: 140px; height: 50px;" border="1"><tbody><tr><td style="border-right: none;">Eingang</td></tr></tbody></table>
<table style="width: 100px; text-align: center; position: absolute; right: 50px; bottom: -34px; height: 48px; background-color: white;"><tbody><tr><td></td></tr></tbody></table>
<!--<table style="width: 50px; text-align: center; position: absolute; bottom: -35px; height: 50px;" border="1"><tbody><tr><td>Eingang</td></tr></tbody></table>-->
<br />
</div>
<div class="small-sm-12 col-lg-4">
<br/>
<div class="ui card">
<ul>
<div id="selected-seats"></div>
<h3>Gesamtpreis: <span id="sum_price"> 0.00</span></h3>
Anmerkung: Rabatt wird erst bei Reservierung abgezogen.
</ul>
</div>
</div>
</div>
@if($seat->date=='2020-12-31' or $seat->date=='2021-12-31')
@if (Auth::check() && Auth::user()->isAdmin())
<h2>Sitzplatz bei Tisch mit Buffett</h2>
{!! Form::input('number','amountBuffett', '0', ['id'=>'amountBuffett', 'min' =>'0']) !!} Plätze reservieren
@endif
@endif
<br />
<br />
<span id="hiddenSeats" style="visibility: hidden"></span>
<span id="concessionTemplateFill"></span>
<script>
var concessionTemplate = '<?php echo Form::select('concession[]', $concessions->pluck('name', 'id'))?>';
</script>
{{--<h2>Ermäßigungen</h2>--}}
{{--@foreach($concessions as $concession)--}}
{{--@if($concession->name == 'Vollpreis')--}}
{{--{{ Form::radio('concession', $concession->id, true) }}--}}
{{--@else--}}
{{--{{ Form::radio('concession', $concession->id, false) }}--}}
{{--@endif--}}
{{--{{$concession->name}} ({{$concession->perc}} %) <br/>--}}
{{--@endforeach--}}
@if (Auth::check() && Auth::user()->isAdmin())
<h2>Kunde</h2>
<div class="row">
<div class="col-sm-6">
<select class="js-example-basic-single" name="user" style="width: 100%;">
<option value=""></option>
@foreach($users_identifier->get() as $user)
<option value="{{$user->id}}">{{$user->identifier}}</option>
@endforeach
</select>
{{--<div class="ui fluid search selection dropdown">--}}
{{--<input name="user" type="hidden">--}}
{{--<i class="dropdown icon"></i>--}}
{{--<div class="default text">Kunde</div>--}}
{{--<div class="menu">--}}
{{--<div class="item"></div>--}}
{{--@foreach($users_identifier->get() as $user)--}}
{{--<div class="item" data-value="{{$user->id}}">{{$user->identifier}}</div>--}}
{{--@endforeach--}}
{{--</div>--}}
{{--{{Form::select('user', $users_identifier->pluck('identifier', 'id'))}}--}}
{{--</div>--}}
</div>
<div class="col-sm-6">
<h2>Name des neu einzufügenden Benutzer</h2>
Vorname: {{Form::text('newFirstname')}}<br />
Nachname: {{Form::text('newLastname')}}<br />
Straße + Hausnummer: {{Form::text('newStreet')}}<br />
PLZ + Ort: {{Form::text('newLocation')}}<br />
</div>
</div>
@endif
{!! Form::hidden('event_id', $event->id) !!}
{!! Form::hidden('seat_id', $seat->id) !!}
{!! Form::submit('Reservieren (Sie können die Reservierung noch einmal überprüfen)', ['class' => 'btn btn-primary form-control', 'id' => 'submit', 'disabled' => 'disabled']) !!}
{!! Form::close() !!}
{{--<h1>Ermäßigungen auswählen</h1>--}}
{{--<ul>--}}
{{--@foreach($concessions as $concession)--}}
{{--<li>--}}
{{--{{$concession->name}} {{$concession->perc}} %--}}
{{--</li>--}}
{{--@endforeach--}}
{{--</ul>--}}
@endsection
@section('scripts')
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="{{ URL::asset('js/jquery.seat-charts.min.js') }}"></script>
<script src="{{ URL::asset('res/admin/events.js') }}"></script>
<script src="{{ URL::asset('js/autoNumeric.js') }}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.js"></script>
<script>
function validateForm(){
// var price = $("#sum_price").text();
// if(confirm("Sie haben Karten im Wert von "+price+" in Ihrem Warenkorb. Wollen Sie diese jetzt verbindlich kaufen?")){
return true;
// }else{
// return false;
// }
}
setInterval(function() {
window.location.reload();
}, 300000);
$(document).ready(function () {
//setTimeout(function() {
// $("div[id$='_3']").after('<br /><br /><div class="secrow">');
// $("div[id$='_6']").after('</div>');
//}, 1000);
$('.js-example-basic-single').select2({
minimumInputLength: 3
});
$('#price_cat_a').autoNumeric('init');
$('#price_cat_b').autoNumeric('init');
$('#price_cat_c').autoNumeric('init');
<?php
function js_str($s)
{
return '"' . addcslashes($s, "\0..\37\"\\") . '"';
}
function js_array($array)
{
$temp = array_map('js_str', $array);
return '[' . implode(',', $temp) . ']';
}?>
<?php echo 'var x = ', js_array(explode("\n", $seatMap)), ';';?>
x = x.reverse();
x.shift();
// x = x.reverse();
// console.log(x);
var row = [];
for(var i=0; i<x.length; i++){
row.push(x.length-i+"");
}
var seats = new Array({{$maxX}});
var price = 0;
for (var i = 0; i < seats.length; i++) {
seats[i] = "";
for (var j = 0; j <{{$maxY}}; j++) {
seats[i] = seats[i] + "" + x[i][j];
}
}
console.log(seats);
var priceBuffett = 0;
if(document.getElementById('amountBuffett') != null) {
document.getElementById('amountBuffett').addEventListener('input', function (evt) {
if (this.value < 0) return;
var newPriceBuffett = this.value * 8000;
price += newPriceBuffett - priceBuffett;
$("#selected-seats li:contains('Buffett')").remove();
$("#selected-seats").append("<li>" + this.value + " x Buffett (€ 80)</li>");
$("#sum_price").text("€ " + (price / 100));
$('#submit').prop('disabled', false);
priceBuffett = this.value * 8000;
});
}
if(seats.length <= 16){
$("#note-empore").hide();
}
var sc = $('#seat-map').seatCharts({
map: seats,
seats: {
a: {
price: {{$event->price_cat_a}},
classes: 'a-cat' //your custom CSS class
},
b: {
price: {{$event->price_cat_b}},
classes: 'b-cat' //your custom CSS class
},
c: {
price: {{$event->price_cat_c}},
classes: 'c-cat' //your custom CSS class
},
z: {
classes: 'bought-cat'
}
},
click: function () {
if (this.status() == 'available') {
//$("#selected-seats").append("<li>Tisch "+(56-this.settings.row-1)+", Platz "+(this.settings.column+1)+" (€ " + this.data().price + ") <span class='cancel-cart-item' id='" + this.settings.id + "'><i class=\"remove icon\"></i></span>" + concessionTemplate + "</li>");
$("#selected-seats").append("<li>Reihe "+(this.settings.row+1)+", Platz "+(this.settings.column+1)+" (€ " + this.data().price + ") <span class='cancel-cart-item' id='" + this.settings.id + "'><i class=\"remove icon\"></i></span>" + concessionTemplate + "</li>");
$("#hiddenSeats").append("<input name=\"seat[]\" id=\"" + this.settings.id + "\" type=\"select\" value=\" " + this.settings.id + " \">");
price += this.data().price * 100;
$("#sum_price").text("€ " + (price / 100));
$('#submit').prop('disabled', false);
return 'selected';
} else if (this.status() == 'selected') {
console.log("selected");
$("#selected-seats #" + this.settings.id).parent().remove();
$("#hiddenSeats #" + this.settings.id).remove();
price -= this.data().price * 100;
$("#sum_price").text("€ " + (price / 100));
return 'available';
} else if (this.status() == 'unavailable') {
console.log("unavailable");
//seat has been already booked
return 'unavailable';
} else {
return this.style();
}
},
naming: {
top: false,
getLabel: function (character, row, column) {
return '';
},
rows: row,
},
});
$('#selected-seats').on('click', '.cancel-cart-item', function () {
sc.get($(this).attr("id")).click();
});
sc.find('z.available').status('unavailable');
});
$('.ui.dropdown')
.dropdown({})
;
</script>
@endsection