@extends('front.layoutwithout')

@section('title','Planes de estudios')
@section('sub-title')

@section('content')

	<div class="tab-content">
		<div class="row">
			<div class="col-xl-6">

				<form action="{{route('career_plans.store')}}" method="post">
					@csrf
					<div class="row">
						<div class="col-lg-9 col-md-9 col-sm-9 col-xs-9 col-7">
							<div class="form-group">
								<label>Plan</label>
								<input type="text" name="name" class="form-control input1" required>
							</div>
						</div>
						<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 col-5">
							<button type="submit" class="btn btn-md disable btn-block btn-top submit1" disabled>Crear</button>
						</div>
					</div>
				</form>

				<table class="table table-bordered plans">
					<thead>
						<tr>
							<th>Plan de estudio</th>
							<th style="width: 4em;"></th>
						</tr>
					</thead>
					<tbody>
						@if($data['plans']->isNotEmpty())
							@foreach($data['plans'] as $plan)
								<tr>
									<td>{{$plan->name}}</td>
									<td style="text-align: center;">
										<form action="{{route('career_plans.destroy',$plan->id)}}" method="post" id="plan-{{$plan->id}}">
											@csrf
											<input type="hidden" name="_method" value="delete" />
											<a data-id="{{$plan->id}}" data-name="{{$plan->name}}" class="swalPlan">
												<i class="fas fa-trash-alt"></i>
											</a>
										</form>
									</td>
								</tr>
							@endforeach
						@else
							<tr>
								<td colspan="2" class="text-center">
									No hay planes de estudio.
								</td>
							</tr>
						@endif
					</tbody>
				</table>

			</div>
			<div class="col-xl-6">

				<form action="{{route('career_specialities.store')}}" method="post">
					@csrf
					<div class="row">
						<div class="col-lg-9 col-md-9 col-sm-9 col-xs-9 col-7">
							<div class="form-group">
								<label>Especialidad</label>
								<input type="text" name="name" class="form-control input2 @error('name') no-valid @enderror" required>
								<small>{{ $errors->first('name') }}</small>
							</div>
						</div>
						<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 col-5">
							<button type="submit" class="btn btn-md disable btn-block btn-top submit2" disabled>Crear</button>
						</div>
					</div>
				</form>

				<table class="table table-bordered plans">
					<thead>
						<tr>
							<th>Especialidades</th>
							<th style="width: 4em;"></th>
						</tr>
					</thead>
					<tbody>
						@if($data['specialities']->isNotEmpty())
							@foreach($data['specialities'] as $specia)
								<tr>
									<td>{{$specia->name}}</td>
									<td style="text-align: center;">
										<form action="{{route('career_specialities.destroy',$specia->id)}}" method="post" id="specia-{{$specia->id}}">
											@csrf
											<input type="hidden" name="_method" value="delete" />
											<a data-id="{{$specia->id}}" data-name="{{$specia->name}}" class="swalEspecialidad">
												<i class="fas fa-trash-alt"></i>
											</a>
										</form>
									</td>
								</tr>
							@endforeach
						@else
							<tr>
								<td colspan="2" class="text-center">
									No hay especialidades.
								</td>
							</tr>
						@endif
					</tbody>
				</table>

			</div>
		</div>
	</div>

@endsection

@push('css')
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/8.11.8/sweetalert2.min.css">
@endpush

@push('js')
	<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/8.11.8/sweetalert2.all.min.js"></script>
	<script>

		$(document).ready(function(){

			//Activamos botones de crear
			$('.input1').on('keyup', function(){
				$('.submit1').prop('disabled',false);
				$('.submit1').removeClass('disable');
				$('.submit1').addClass('btn-primary');
			});

			$('.input2').on('keyup', function(){
				$('.submit2').prop('disabled',false);
				$('.submit2').removeClass('disable');
				$('.submit2').addClass('btn-primary');
			});

			$(function() {

			    $('.swalPlan').click(function(e) {
			    	e.preventDefault();
			    	//Obtenemos id
			    	var id = $(this).data('id');
			    	var name = $(this).data('name');

			    	Swal.fire({
					  title: 'Eliminar Plan de Estudio',
					  text: "Estás seguro que quieres eliminar el"+' '+'Plan '+name,
					  icon: 'warning',
					  showCancelButton: true,
					  confirmButtonColor: '#DC0000',
					  cancelButtonColor: 'transparent',
					  confirmButtonText: 'Eliminar'
					}).then((result) => {
					  if (result.value) {
					  	$('#plan-'+id).submit();
					  }
					});
			    });

			    $('.swalEspecialidad').click(function(e) {
			    	e.preventDefault();
			    	//Obtenemos id
			    	var id = $(this).data('id');
			    	var name = $(this).data('name');

			    	Swal.fire({
					  title: 'Eliminar Especialidad',
					  text: "Estás seguro que quieres eliminar la"+' '+'Especialidad '+name,
					  icon: 'warning',
					  showCancelButton: true,
					  confirmButtonColor: '#DC0000',
					  cancelButtonColor: 'transparent',
					  confirmButtonText: 'Eliminar'
					}).then((result) => {
					  if (result.value) {
					  	$('#specia-'+id).submit();
					  }
					});
			    });

			});

		});
	</script>
@endpush