eOSP2/resources/views/trainingsAddFireFighters.blade.php
2019-12-25 22:35:20 +01:00

171 lines
7.3 KiB
PHP

@extends('layout.app')
<title>Add Edit Delete Table Row Example using JQuery - ItSolutionStuff.com</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<meta name="csrf-token" content="{{ csrf_token() }}" />
@section('left-menu')
@parent
<ul>
<a href="sprzet/add"><li>Dodaj<img src="../img/left_menu_icon/add.png"></li></a>
<li>Edytuj<img src="../img/left_menu_icon/edit.png"></li>
<li>Usuń<img src="../img/left_menu_icon/delete.png"></li>
</ul>
@stop
@section('center-area')
@parent
@if( auth()->check())
@if( auth()->user()->fireStationID == NULL)
Jednostka nie istnieje
@else
<center><h1>{{$training->trainingName}}</h1></center>
<table id="editableTable" class='table table-bordered'>
<thead>
<td>Imię i Nazwisko</td>
<td>Ważne od:</td>
<td>Ważne do:</td>
<td>Akcje</td>
</thead>
<tbody>
@foreach($fireFighters as $fireFighter)
<tr id="{{$fireFighter->userID}}">
<td>{{$fireFighter->name}} {{$fireFighter->surname}}</td>
<td>{{$fireFighter->dateOfComplete}}</td>
<td>{{$fireFighter->dateOfExpiry}}</td>
<td><button class="btn btn-warning" type="submit" style="display:none" id="{{$fireFighter->userID}}" onclick="cancelButton('{{$fireFighter->userID}}')">Anuluj</button> <button class="btn btn-success" type="submit" style="display:none" id="{{$fireFighter->userID}}" onclick="updateButton('{{$fireFighter->userID}}')">Zapisz</button> <button class="btn btn-info" type="submit" id="{{$fireFighter->userID}}" onclick="editButton('{{$fireFighter->userID}}')">Edytuj</button> <button class="btn btn-danger btn-delete" type="submit" id="{{$fireFighter->userID}}">Usuń</button></td>
</tr>
@endforeach
</tbody>
</table>
@endif
@else
Brak autoryzacji
@endif
@stop
<script type="text/javascript">
function editButton(firefighterID){
$('.btn-info', '#'+firefighterID).css('display', 'none');
$('.btn-warning', '#'+firefighterID).css('display', 'inline');
$('.btn-success', '#'+firefighterID).css('display', 'inline');
$('.btn-info', '#'+firefighterID).parents("tr").find("td:eq(1)").html('<input type="date" name="dateOfComplete">');
$('.btn-info', '#'+firefighterID).parents("tr").find("td:eq(2)").html('<input type="date" name="dateOfExpiry">');
}
function cancelButton(firefighterID){
$('.btn-info', '#'+firefighterID).css('display', 'inline');
$('.btn-warning', '#'+firefighterID).css('display', 'none');
$('.btn-success', '#'+firefighterID).css('display', 'none');
$('.btn-info', '#'+firefighterID).parents("tr").find("td:eq(1)").html('{{$fireFighter->dateOfComplete}}');
$('.btn-info', '#'+firefighterID).parents("tr").find("td:eq(2)").html('{{$fireFighter->dateOfExpiry}}');
}
function updateButton(firefighterID){
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax({
type: 'post',
url: '/szkolenia/addTrainingsFireFighters/',
data: {
'firefighterID': firefighterID,
'trainingID': '{{$training->id}}',
'dateOfComplete': $('input[name=dateOfComplete]').val(),
'dateOfExpiry': $('input[name=dateOfExpiry]').val()
},
success: function(data) {
if ((data.errors)) {
$('.error').removeClass('hidden');
$('.error').text(data.errors.name);
} else {
$('.error').remove();
$('.btn-info', '#'+firefighterID).parents("tr").find("td:eq(1)").html($('input[name=dateOfComplete]').val());
$('.btn-info', '#'+firefighterID).parents("tr").find("td:eq(2)").html($('input[name=dateOfExpiry]').val());
}
},
});
$('.btn-info', '#'+firefighterID).css('display', 'inline');
$('.btn-warning', '#'+firefighterID).css('display', 'none');
$('.btn-success', '#'+firefighterID).css('display', 'none');
{{--$('.btn-info', '#'+firefighterID).parents("tr").find("td:eq(1)").html('{{$fireFighter->dateOfComplete}}');--}}
{{--$('.btn-info', '#'+firefighterID).parents("tr").find("td:eq(2)").html('{{$fireFighter->dateOfExpiry}}');--}}
}
// $("form").submit(function(e){
// e.preventDefault();
// var name = $("input[name='name']").val();
// var email = $("input[name='email']").val();
//
// $(".data-table tbody").append("<tr data-name='"+name+"' data-email='"+email+"'><td>"+name+"</td><td>"+email+"</td><td><button class='btn btn-info btn-xs btn-edit'>Edit</button><button class='btn btn-danger btn-xs btn-delete'>Delete</button></td></tr>");
//
// $("input[name='name']").val('');
// $("input[name='email']").val('');
// });
//
// $("body").on("click", ".btn-delete", function(){
// $(this).parents("tr").remove();
// });
//
// $("body").on("click", ".btn-edit", function(){
// var name = $(this).parents("tr").attr('data-name');
// var email = $(this).parents("tr").attr('data-email');
//
// $(this).parents("tr").find("td:eq(0)").html('<input name="edit_name" value="'+name+'">');
// $(this).parents("tr").find("td:eq(1)").html('<input name="edit_email" value="'+email+'">');
//
// $(this).parents("tr").find("td:eq(2)").prepend("<button class='btn btn-info btn-xs btn-update'>Update</button><button class='btn btn-warning btn-xs btn-cancel'>Cancel</button>")
// $(this).hide();
// });
//
// $("body").on("click", ".btn-cancel", function(){
// var name = $(this).parents("tr").attr('data-name');
// var email = $(this).parents("tr").attr('data-email');
//
// $(this).parents("tr").find("td:eq(0)").text(name);
// $(this).parents("tr").find("td:eq(1)").text(email);
//
// $(this).parents("tr").find(".btn-edit").show();
// $(this).parents("tr").find(".btn-update").remove();
// $(this).parents("tr").find(".btn-cancel").remove();
// });
//
// $("body").on("click", ".btn-update", function(){
// var name = $(this).parents("tr").find("input[name='edit_name']").val();
// var email = $(this).parents("tr").find("input[name='edit_email']").val();
//
// $(this).parents("tr").find("td:eq(0)").text(name);
// $(this).parents("tr").find("td:eq(1)").text(email);
//
// $(this).parents("tr").attr('data-name', name);
// $(this).parents("tr").attr('data-email', email);
//
// $(this).parents("tr").find(".btn-edit").show();
// $(this).parents("tr").find(".btn-cancel").remove();
// $(this).parents("tr").find(".btn-update").remove();
// });
</script>