@extends('layouts.crud')
@section('title', 'Data de Cronograma - Cadastrar Novo')
@section('content')

	<div class="card">
	    <div class="card-header d-flex justify-content-between align-items-end">
			<h3>Cadastrar Nova Data de Cronograma</h3>

			<div id="divVoltar" class='pb-1 mr-3'>
				<a href="{{ route('datacronograma', []) }}" class="text-white">
					<i class="fas fa-reply"></i>
				</a>
			</div>
	    </div>

        <div class="card-body">
    		@if($errors->any())
    			<div class="alert alert-danger alert-dismissible fade show" role="alert">
    				@foreach($errors->all() as $error)
    			  		<li>{{ $error }}</li>
    				@endforeach
    			  	<button type="button" class="close" data-dismiss="alert" aria-label="Close">
    				    <span aria-hidden="true">&times;</span>
    			  	</button>
    			</div>
    		@endif

			<div class="alert alert-secondary alert-dismissible fade show" role="alert">
                <strong> 
					Cadastre uma data (um dia) em que o cronograma estará aberto para ser feito. 
					Após isso, informe uma data inicial e uma data final, que serão quais dias o associado poderá marcar.<br>
				</strong><br>
				Exemplo: <br>
				Data de Abertura do Cronograma: '10/10/2030'<br>
				Periodo Inicial: '01/11/2030'<br>
				Periodo Final: '31/11/2030'<br>
				<br>
				Dessa forma no dia 10/10 o associado poderá realizar o cronograma do mês de novembro
            </div>

			{!! Form::open(['route'=>'datacronograma.store']) !!}
				<div class='form-row'>
					<div class="form-group col-md-4">
						{!! Form::label('data', 'Data de Abertura do Cronograma:') !!}
		    	        {!! Form::date('data', null, ['class'=>'form-control', 'required', 'max'=>'2999-01-01']) !!}
					</div>
					<div class="form-group col-md-4">
						{!! Form::label('periodo_inicial', 'Periodo Inicial:') !!}
		    	        {!! Form::date('periodo_inicial', null, ['class'=>'form-control', 'required', 'max'=>'2999-01-01']) !!}
					</div>
					<div class="form-group col-md-4">
						{!! Form::label('periodo_final', 'Periodo Final:') !!}
		    	        {!! Form::date('periodo_final', null, ['class'=>'form-control', 'required', 'max'=>'2999-01-01', 'onchange'=>'setPeriodoFinal()']) !!}
					</div>
                </div>
    			<div class='form-row'>
    				<div class="form-group col-md-6">
    				{!! Form::reset('Limpar', ['class'=>'btn btn-default']) !!}
    				{!! Form::submit('Cadastrar', ['class'=>'btn btn-primary']) !!}
    			</div>
    		{!! Form::close() !!}
	    </div>
	</div>
@stop 

@section('js')
	<script>
		function setPeriodoFinal() {
			const periodoInicial = $('#periodo_inicial').val()
			const periodoFinal = $('#periodo_final').val()
			if (periodoInicial >  periodoFinal) {
				toastr['error']("A data do periodo final deve ser posterior ao inicial", "ATENÇÃO");
			}
		}
		
	</script>
@stop

@section('table-delete')
"data_cronogramas"
@stop