Working on tipp4 layout
This commit is contained in:
parent
f9ba0b970a
commit
f6a5934439
2 changed files with 255 additions and 72 deletions
|
|
@ -1,100 +1,111 @@
|
||||||
@extends('layouts.layout')
|
@extends('layouts.layout')
|
||||||
|
|
||||||
@section('content')
|
@section('content')
|
||||||
<div class="container">
|
<style>
|
||||||
|
|
||||||
<h4 style="display:flex;">{{$round->name}}</h4>
|
.centered-header {
|
||||||
|
width:50%;
|
||||||
|
|
||||||
<div >
|
margin:auto;
|
||||||
<form method="POST" action="/tipps/store4">
|
margin-bottom: 25px;
|
||||||
{{ csrf_field() }}
|
}
|
||||||
<!-- 1 -->
|
|
||||||
<div>
|
|
||||||
<h5>
|
|
||||||
<div style="display:flex;">
|
|
||||||
<span>{{ $game1->team1 }}</span> <span>:</span> <span>{{ $game1->team2 }}</span>
|
|
||||||
|
|
||||||
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score1_1" value="{{ $tipp1->score1==-1? '': $tipp1->score1 }}" required>
|
.page-container {
|
||||||
|
width: 800px;
|
||||||
|
height: 80vh;
|
||||||
|
/*
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid-container {
|
||||||
|
width:780px;
|
||||||
|
display: grid;
|
||||||
|
margin: auto;
|
||||||
|
|
||||||
|
height: 100vh;
|
||||||
|
grid-template-columns: 125px 5px 125px 25px 5px 25px 75px 15px 0;
|
||||||
|
grid-template-rows: 50px 50px 50px 50px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
<p style="float:left; width:25px;"> : </p>
|
<div class="page-container">
|
||||||
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score2_1" value="{{ $tipp1->score2==-1? '': $tipp1->score2 }}" required>
|
|
||||||
<label class="lead" style="float:left; width:50px;"> Joker </label>
|
|
||||||
</div>
|
|
||||||
</h5>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<span >
|
<h2 class="centered-header">{{$round->name}}</h2>
|
||||||
<input type="checkbox" name="joker_1" id="joker_1" @if($tipp1->joker===1) checked @endif>
|
|
||||||
</span>
|
|
||||||
<input type="hidden" name="tipp_id_1" value="{{ $tipp1->id }}">
|
|
||||||
<input type="hidden" name="game_id_1" value="{{ $game1->id }}">
|
|
||||||
<!-- round_id is the same for all 4 games. -->
|
|
||||||
<input type="hidden" name="round_id" value="{{ $game1->round_id }}">
|
|
||||||
|
|
||||||
|
<form class="grid-container" method="POST" action="/tipps/store4">
|
||||||
|
{{ csrf_field() }}
|
||||||
|
<!-- 1 -->
|
||||||
|
<div>{{ $game1->team1 }}</div>
|
||||||
|
<span>:</span>
|
||||||
|
<span>{{ $game1->team2 }}</span>
|
||||||
|
|
||||||
|
<input type="text" class="lead" name="score1_1" value="{{ $tipp1->score1==-1? '': $tipp1->score1 }}" required>
|
||||||
|
<span>:</span>
|
||||||
|
<input type="text" class="lead" name="score2_1" value="{{ $tipp1->score2==-1? '': $tipp1->score2 }}" required>
|
||||||
|
<label style="padding:5px;justify-content: center;">Joker</label>
|
||||||
|
<input type="checkbox" name="joker_1" id="joker_1" @if($tipp1->joker===1) checked @endif>
|
||||||
|
|
||||||
<!-- 2 -->
|
<span>
|
||||||
|
<input type="hidden" name="tipp_id_1" value="{{ $tipp1->id }}">
|
||||||
|
<input type="hidden" name="game_id_1" value="{{ $game1->id }}">
|
||||||
|
<!-- round_id is the same for all 4 games. -->
|
||||||
|
<input type="hidden" name="round_id" value="{{ $game1->round_id }}">
|
||||||
|
</span>
|
||||||
|
|
||||||
<h1> </h1>
|
<!-- 2 -->
|
||||||
<div>
|
<div>{{ $game2->team1 }}</div>
|
||||||
<h3>
|
<span>:</span>
|
||||||
<span style="float:left; width:200px;">{{ $game2->team1 }} : </span>
|
<span>{{ $game2->team2 }}</span>
|
||||||
<span style="float:left; width:200px;">{{ $game2->team2 }}</span>
|
|
||||||
|
|
||||||
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score1_2" value="{{ $tipp2->score1==-1? '': $tipp2->score1 }}" required>
|
<input type="text" class="lead" id="" name="score1_2" value="{{ $tipp2->score1==-1? '': $tipp2->score1 }}" required>
|
||||||
<p style="float:left; width:25px;"> : </p>
|
|
||||||
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score2_2" value="{{ $tipp2->score2==-1? '': $tipp2->score2 }}" required>
|
|
||||||
<label class="lead" style="float:left; width:50px;"> Joker </label>
|
|
||||||
</h3>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<span >
|
<span>:</span>
|
||||||
<input type="checkbox" name="joker_2" id="joker_2" @if($tipp2->joker===1) checked @endif>
|
<input type="text" class="lead" id="" name="score2_2" value="{{ $tipp2->score2==-1? '': $tipp2->score2 }}" required>
|
||||||
</span>
|
<label>Joker</label>
|
||||||
|
<input type="checkbox" name="joker_2" id="joker_2" @if($tipp2->joker===1) checked @endif>
|
||||||
|
|
||||||
|
<span>
|
||||||
<input type="hidden" name="tipp_id_2" value="{{ $tipp2->id }}">
|
<input type="hidden" name="tipp_id_2" value="{{ $tipp2->id }}">
|
||||||
<input type="hidden" name="game_id_2" value="{{ $game2->id }}">
|
<input type="hidden" name="game_id_2" value="{{ $game2->id }}">
|
||||||
|
</span>
|
||||||
|
|
||||||
<!-- 3 -->
|
<!-- 3 -->
|
||||||
<h1> </h1>
|
<div>{{ $game3->team1 }}</div>
|
||||||
<div>
|
<span>:</span>
|
||||||
<h3>
|
<span>{{ $game3->team2 }}</span>
|
||||||
<span style="float:left; width:200px;">{{ $game3->team1 }} : </span>
|
|
||||||
<span style="float:left; width:200px;">{{ $game3->team2 }}</span>
|
|
||||||
|
|
||||||
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score1_3" value="{{ $tipp3->score1==-1? '': $tipp3->score1 }}" required>
|
<input type="text" class="lead" id="" name="score1_3" value="{{ $tipp3->score1==-1? '': $tipp3->score1 }}" required>
|
||||||
<p style="float:left; width:25px;"> : </p>
|
|
||||||
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score2_3" value="{{ $tipp3->score2==-1? '': $tipp3->score2 }}" required>
|
|
||||||
<label class="lead" style="float:left; width:50px;"> Joker </label>
|
|
||||||
</h3>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<span >
|
<span>:</span>
|
||||||
<input type="checkbox" name="joker_3" id="joker_3" @if($tipp3->joker===1) checked @endif>
|
<input type="text" class="lead" id="" name="score2_3" value="{{ $tipp3->score2==-1? '': $tipp3->score2 }}" required>
|
||||||
</span>
|
<label>Joker</label>
|
||||||
<input type="hidden" name="tipp_id_3" value="{{ $tipp3->id }}">
|
<input type="checkbox" name="joker_3" id="joker_3" @if($tipp3->joker===1) checked @endif>
|
||||||
<input type="hidden" name="game_id_3" value="{{ $game3->id }}">
|
|
||||||
|
<span>
|
||||||
|
<input type="hidden" name="tipp_id_2" value="{{ $tipp3->id }}">
|
||||||
|
<input type="hidden" name="game_id_2" value="{{ $game3->id }}">
|
||||||
|
</span>
|
||||||
|
|
||||||
<!-- 4 -->
|
<!-- 4 -->
|
||||||
<h1> </h1>
|
<div>{{ $game4->team1 }}</div>
|
||||||
<div>
|
<span>:</span>
|
||||||
<h3>
|
<span>{{ $game4->team2 }}</span>
|
||||||
<span style="float:left; width:200px;">{{ $game4->team1 }} : </span>
|
|
||||||
<span style="float:left; width:200px;">{{ $game4->team2 }}</span>
|
|
||||||
|
|
||||||
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score1_4" value="{{ $tipp4->score1==-1? '': $tipp4->score1 }}" required>
|
<input type="text" class="lead" id="" name="score1_4" value="{{ $tipp4->score1==-1? '': $tipp4->score1 }}" required>
|
||||||
<p style="float:left; width:25px;"> : </p>
|
|
||||||
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score2_4" value="{{ $tipp4->score2==-1? '': $tipp4->score2 }}" required>
|
|
||||||
<label class="lead" style="float:left; width:50px;"> Joker </label>
|
|
||||||
</h3>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<span >
|
<span>:</span>
|
||||||
<input type="checkbox" name="joker_4" id="joker_4" @if($tipp4->joker===1) checked @endif>
|
<input type="text" class="lead" id="" name="score2_4" value="{{ $tipp4->score2==-1? '': $tipp4->score2 }}" required>
|
||||||
</span>
|
<label>Joker</label>
|
||||||
|
<input type="checkbox" name="joker_4" id="joker_4" @if($tipp4->joker===1) checked @endif>
|
||||||
|
|
||||||
|
<span>
|
||||||
<input type="hidden" name="tipp_id_4" value="{{ $tipp4->id }}">
|
<input type="hidden" name="tipp_id_4" value="{{ $tipp4->id }}">
|
||||||
<input type="hidden" name="game_id_4" value="{{ $game4->id }}">
|
<input type="hidden" name="game_id_4" value="{{ $game4->id }}">
|
||||||
|
</span>
|
||||||
|
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<p> </p>
|
<p> </p>
|
||||||
|
|
@ -102,10 +113,9 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
let checkbox1=document.getElementById('joker_1')
|
let checkbox1=document.getElementById('joker_1')
|
||||||
|
|
|
||||||
173
pfosten/resources/views/tipps/edit4_backup.blade.php
Normal file
173
pfosten/resources/views/tipps/edit4_backup.blade.php
Normal file
|
|
@ -0,0 +1,173 @@
|
||||||
|
@extends('layouts.layout')
|
||||||
|
|
||||||
|
@section('content')
|
||||||
|
<div class="container">
|
||||||
|
|
||||||
|
<h4 style="display:flex;">{{$round->name}}</h4>
|
||||||
|
|
||||||
|
<div >
|
||||||
|
<form method="POST" action="/tipps/store4">
|
||||||
|
{{ csrf_field() }}
|
||||||
|
<!-- 1 -->
|
||||||
|
<div>
|
||||||
|
<h5>
|
||||||
|
<div style="display:flex;">
|
||||||
|
<span>{{ $game1->team1 }}</span> <span>:</span> <span>{{ $game1->team2 }}</span>
|
||||||
|
|
||||||
|
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score1_1" value="{{ $tipp1->score1==-1? '': $tipp1->score1 }}" required>
|
||||||
|
|
||||||
|
|
||||||
|
<p style="float:left; width:25px;"> : </p>
|
||||||
|
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score2_1" value="{{ $tipp1->score2==-1? '': $tipp1->score2 }}" required>
|
||||||
|
<label class="lead" style="float:left; width:50px;"> Joker </label>
|
||||||
|
</div>
|
||||||
|
</h5>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<span >
|
||||||
|
<input type="checkbox" name="joker_1" id="joker_1" @if($tipp1->joker===1) checked @endif>
|
||||||
|
</span>
|
||||||
|
<input type="hidden" name="tipp_id_1" value="{{ $tipp1->id }}">
|
||||||
|
<input type="hidden" name="game_id_1" value="{{ $game1->id }}">
|
||||||
|
<!-- round_id is the same for all 4 games. -->
|
||||||
|
<input type="hidden" name="round_id" value="{{ $game1->round_id }}">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- 2 -->
|
||||||
|
|
||||||
|
<h1> </h1>
|
||||||
|
<div>
|
||||||
|
<h3>
|
||||||
|
<span style="float:left; width:200px;">{{ $game2->team1 }} : </span>
|
||||||
|
<span style="float:left; width:200px;">{{ $game2->team2 }}</span>
|
||||||
|
|
||||||
|
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score1_2" value="{{ $tipp2->score1==-1? '': $tipp2->score1 }}" required>
|
||||||
|
<p style="float:left; width:25px;"> : </p>
|
||||||
|
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score2_2" value="{{ $tipp2->score2==-1? '': $tipp2->score2 }}" required>
|
||||||
|
<label class="lead" style="float:left; width:50px;"> Joker </label>
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<span >
|
||||||
|
<input type="checkbox" name="joker_2" id="joker_2" @if($tipp2->joker===1) checked @endif>
|
||||||
|
</span>
|
||||||
|
<input type="hidden" name="tipp_id_2" value="{{ $tipp2->id }}">
|
||||||
|
<input type="hidden" name="game_id_2" value="{{ $game2->id }}">
|
||||||
|
|
||||||
|
|
||||||
|
<!-- 3 -->
|
||||||
|
<h1> </h1>
|
||||||
|
<div>
|
||||||
|
<h3>
|
||||||
|
<span style="float:left; width:200px;">{{ $game3->team1 }} : </span>
|
||||||
|
<span style="float:left; width:200px;">{{ $game3->team2 }}</span>
|
||||||
|
|
||||||
|
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score1_3" value="{{ $tipp3->score1==-1? '': $tipp3->score1 }}" required>
|
||||||
|
<p style="float:left; width:25px;"> : </p>
|
||||||
|
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score2_3" value="{{ $tipp3->score2==-1? '': $tipp3->score2 }}" required>
|
||||||
|
<label class="lead" style="float:left; width:50px;"> Joker </label>
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<span >
|
||||||
|
<input type="checkbox" name="joker_3" id="joker_3" @if($tipp3->joker===1) checked @endif>
|
||||||
|
</span>
|
||||||
|
<input type="hidden" name="tipp_id_3" value="{{ $tipp3->id }}">
|
||||||
|
<input type="hidden" name="game_id_3" value="{{ $game3->id }}">
|
||||||
|
|
||||||
|
<!-- 4 -->
|
||||||
|
<h1> </h1>
|
||||||
|
<div>
|
||||||
|
<h3>
|
||||||
|
<span style="float:left; width:200px;">{{ $game4->team1 }} : </span>
|
||||||
|
<span style="float:left; width:200px;">{{ $game4->team2 }}</span>
|
||||||
|
|
||||||
|
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score1_4" value="{{ $tipp4->score1==-1? '': $tipp4->score1 }}" required>
|
||||||
|
<p style="float:left; width:25px;"> : </p>
|
||||||
|
<input style="float:left; width:50px;" type="text" class="lead" id="" name="score2_4" value="{{ $tipp4->score2==-1? '': $tipp4->score2 }}" required>
|
||||||
|
<label class="lead" style="float:left; width:50px;"> Joker </label>
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<span >
|
||||||
|
<input type="checkbox" name="joker_4" id="joker_4" @if($tipp4->joker===1) checked @endif>
|
||||||
|
</span>
|
||||||
|
<input type="hidden" name="tipp_id_4" value="{{ $tipp4->id }}">
|
||||||
|
<input type="hidden" name="game_id_4" value="{{ $game4->id }}">
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<p> </p>
|
||||||
|
<button type="submit" id="btn_submit" class="btn btn-primary">Ok</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
let checkbox1=document.getElementById('joker_1')
|
||||||
|
let checkbox2=document.getElementById('joker_2')
|
||||||
|
let checkbox3=document.getElementById('joker_3')
|
||||||
|
let checkbox4=document.getElementById('joker_4')
|
||||||
|
let btn_submit=document.getElementById('btn_submit');
|
||||||
|
|
||||||
|
if (checkbox1.checked==0 && checkbox2.checked==0 && checkbox3.checked==0 && checkbox4.checked==0) {
|
||||||
|
btn_submit.disabled=true;
|
||||||
|
}
|
||||||
|
|
||||||
|
checkbox1.addEventListener('change', function() {
|
||||||
|
if (this.checked) {
|
||||||
|
btn_submit.disabled=false;
|
||||||
|
checkbox2.checked=0;
|
||||||
|
checkbox3.checked=0;
|
||||||
|
checkbox4.checked=0;
|
||||||
|
} else {
|
||||||
|
if (checkbox2.checked==0 && checkbox3.checked==0 && checkbox4.checked==0) {
|
||||||
|
checkbox1.checked=1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
checkbox2.addEventListener('change', function() {
|
||||||
|
if (this.checked) {
|
||||||
|
btn_submit.disabled=false;
|
||||||
|
checkbox1.checked=0;
|
||||||
|
checkbox3.checked=0;
|
||||||
|
checkbox4.checked=0;
|
||||||
|
} else {
|
||||||
|
if (checkbox1.checked==0 && checkbox3.checked==0 && checkbox4.checked==0) {
|
||||||
|
checkbox2.checked=1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
checkbox3.addEventListener('change', function() {
|
||||||
|
if (this.checked) {
|
||||||
|
btn_submit.disabled=false;
|
||||||
|
checkbox1.checked=0;
|
||||||
|
checkbox2.checked=0;
|
||||||
|
checkbox4.checked=0;
|
||||||
|
} else {
|
||||||
|
if (checkbox1.checked==0 && checkbox2.checked==0 && checkbox4.checked==0) {
|
||||||
|
checkbox3.checked=1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
checkbox4.addEventListener('change', function() {
|
||||||
|
if (this.checked) {
|
||||||
|
btn_submit.disabled=false;
|
||||||
|
checkbox1.checked=0;
|
||||||
|
checkbox2.checked=0;
|
||||||
|
checkbox3.checked=0;
|
||||||
|
} else {
|
||||||
|
if (checkbox1.checked==0 && checkbox2.checked==0 && checkbox3.checked==0 ) {
|
||||||
|
checkbox4.checked=1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
//console.log("Event Listeners initiated");
|
||||||
|
</script>
|
||||||
|
@endsection
|
||||||
Loading…
Add table
Add a link
Reference in a new issue