@extends('layouts.app2')

@section('content')

<form name="form-audiencia" id="" class="form-horizontal needs-validation"  action="{{route('solicitud.audiencia.store')}}" method="POST">
	@csrf
		
	<h2 class="destacado mb-5">Formulario para solicitar una audiencia de lobby (Ley N°20.730)</h2>

	<fieldset>
		<h2 class="line">1. Receptor de la Solicitud</h2>
			<p class="destacado-descripcion">¿Con qué autoridad o funcionario desea tener audiencia?<a class="help-marker pull-right" data-bs-toggle="popover" data-placement="top" data-container="body"  data-trigger="hover"></a></p>

		<div class="form-group">
		 	<div class="col-lg-10">
				<div class="input-group">
					<label for="" class="col-lg-2 control-label label-right">Institución</label>
					<input type="text" class="form-control mb-2" name="institution_name" readonly value="{{ $institucion->nombre }}" />
					<input type="hidden" class="form-control" name="institucion_id" value="{{ $institucion->id }}" />
		 		</div>
			</div>
		</div>

		<div class="form-group" >
			<div class="col-lg-10">
				<div class="input-group">
					<label for="cargo" class="col-lg-2 control-label label-right">Cargo <span class="text-red">*</span></label>
					
					<select class="form-control mb-2" name="cargo" id="cargo" required>
						<option value="">Seleccione uno</option>
						@if($institucion->institucion_padre_id == 408 && !is_null($cargos_alcalde))
							@foreach ($cargos_alcalde as $cargo)
								<option value="{{ $cargo->id }}">{{ $cargo->cargo }} - {{ ucwords(strtolower($cargo->usuario?->nombres ?? '')) }} {{ ucwords(strtolower($cargo->usuario?->apellidos ?? '')) }}</option>
							@endforeach
						@endif

						@foreach ($cargos as $cargo)
							@if(!is_null($cargo->usuario))
								<option value="{{ $cargo->id }}">{{ $cargo->cargo }} - {{ ucwords(strtolower($cargo->usuario?->nombres ?? '')) }} {{ ucwords(strtolower($cargo->usuario?->apellidos ?? '')) }}</option>
							@endif
						@endforeach
					</select>
					@error('cargo')
						<span class="text-danger">{{ $message }}</span>
					@enderror
				</div>
			</div>
		</div>
	</fieldset>

	<fieldset>
		<h2 class="line">2. Individualización del Solicitante</h2>
		
		<p class="destacado-descripcion">¿Cuáles son sus datos personales? Debe proporcionar su nombre completo</p>

		<div class="input-group col-lg-10">
			<div class="col-12 col-lg-5">
				<div class="input-group">
					<label for="nombres" class="col-lg-4 control-label label-right">Nombres <span class="text-red">*</span></label>
					<input id="nombres" class="form-control mb-2" name="nombres" placeholder="Nombres" type="text" data-sanitize="true">
				</div>
				@error('nombres')
					<span class="text-danger">{{ $message }}</span>
				@enderror
			</div>
			<div class="col-12 col-lg-5">
				<div class="input-group">
					<label for="apellidos" class="col-lg-4 control-label label-right">Apellidos <span class="text-red">*</span></label>
					<input id="apellidos" class="form-control mb-2" name="apellidos" placeholder="Apellidos" type="text" data-sanitize="true">
				</div>
				@error('apellidos')
					<span class="text-danger">{{ $message }}</span>
				@enderror
			</div>
		</div>

		<div class="input-group col-lg-10">
			<div class="col-lg-5">
				<div class="input-group">
					<label for="" class="col-lg-4 control-label label-right">País Emisor <span class="text-red">*</span></label>
					<select name="paisEmisor" class="form-control mb-2" id="select">
					@foreach ($paises as $pais)
						<option value="{{ $pais->id }}">{{ $pais->nombre }}</option>
					@endforeach
					</select>

					@error('paisEmisor')
						<span class="text-danger">{{ $message }}</span>
					@enderror
				</div>
			</div>
		
			<div class="col-12 col-lg-5">
				<div class="input-group">
					<label for="pasaporte" class="col-lg-4 control-label label-right">RUT/Pasaporte <span class="text-red">*</span></label>
					<div id="pass" class="col-8">
						<input id="pasaporte" class="form-control mb-2" name="pasaporte" placeholder="RUT/Pasaporte" type="text" required>
					</div>
					@error('pasaporte')
						<span class="text-danger">{{ $message }}</span>
					@enderror
				</div>
			</div>
			
		</div>

		<div class="input-group col-lg-10">
			<div class="col-12 col-lg-5">
				<div class="input-group">
					<label for="medio" class="col-lg-4 control-label label-right">Medio de contacto <span class="text-red">*</span></label>
					<select id="medio" class="form-control mb-2" name="medio" required>
						<option value="">Seleccione uno</option>
						<option value="telefono">Teléfono</option>
						<option value="email">E-Mail</option>
					</select>

					@error('medio')
						<span class="text-danger">{{ $message }}</span>
					@enderror
				</div>
			</div>
			
			<div class="col-12 col-lg-5">
				<div id="telefonoDiv" class="form-group d-none">
					<div class="col-lg-10">
						<div class="input-group">
							<label for="mediotelefono" class="col-lg-2 control-label  label-right">Teléfono</label>
							<input type="tel" id="mediotelefono" name="mediotelefono" class="form-control mb-2" inputmode="tel" autocomplete="tel" data-sanitize="tel" >
						</div>
					</div>
					@error('mediotelefono')
						<span class="text-danger">{{ $message }}</span>
					@enderror
				</div>

				<div id="emailDiv" class="form-group d-none">
					<div class="col-lg-10">
						<div class="input-group">
							<label for="medioemail" class="col-lg-2 control-label label-right">E-Mail</label>
							<input type="email" id="medioemail" name="medioemail" class="form-control mb-2" inputmode="email" autocomplete="email" data-sanitize="email">
						</div>
					</div>
					@error('medioemail')
						<span class="text-danger">{{ $message }}</span>
					@enderror
				</div>
			</div>
		</div>
		<div class="input-group col-lg-10">
			
			<div class="col-12 col-lg-5">
				<div class="input-group">
					<label for="genero" class="col-lg-4 control-label label-right">Género <span class="text-red">*</span></label>
					<select name="genero" class="form-control mb-2" id="genero">
						<option value="">Seleccione uno</option>
						<option value="masculino">Masculino</option>
						<option value="femenino">Femenino</option>
						<option value="otro">Otro</option>
						<option value="prefiero no decir">Prefiero no decir</option>
					</select>
				</div>
				@error('genero')
					<span class="text-danger">{{ $message }}</span>
				@enderror
			</div>
		</div>

		<div class="form-group">
			<div class="col-lg-10">
				<div class="input-group">
					<br/>
					<label id="errorAsistenteText" for="" class="col-lg-2 control-label  label-right">¿Asistirá Ud. a la audiencia?</label>
					<div class="col-lg-1">
						<input type="radio" name="asistente" onchange="asistenteChange('1')" required /> Si 
					</div>
					<div class="col-lg-1">
						<input type="radio" name="asistente" onchange="asistenteChange('0')" required /> No
					</div>
				</div>
				@error('asistente')
					<span class="text-danger">{{ $message }}</span>
				@enderror
			</div>
		</div>
	</fieldset>

	<fieldset class="table_movil">
		<h2 class="line" id="errorInvitados">3. Individualización de los Asistentes a la audiencia o reunión</h2>
		
		<table class="table mt-5" >
			<thead class="table-dark">
				<tr>
					<th>Nombre</th>
					<th>RUT</th>
					<th>Calidad</th>
					<th>Representado</th>
					<th>Acciones</th>
				</tr>
			</thead>

			<tbody id="tbodyInvitados">
			</tbody>
		</table>

		<input class="hide" type="number" name="invitados" min="1">

		@if(!$preview)
			<div class="form-group">
				<p><span id="cargoActivoError" class="text-danger d-none">Debe asistir al menos un cargo activo</span></p>
				<br/>
				<a type="button" class="btn btn-link" onclick="openModal()"><i class="bi bi-plus-lg"></i> Agregar otro asistente</a>
			</div>
		@endif
	</fieldset>

	<fieldset {{ $preview ? 'disabled' : '' }}>
		<h2 class="line" id="errorMaterias">4. Materia específica a tratar en la audiencia o reunión.</h2>
		<p class="destacado-descripcion">Destinada a obtener que se adopten, o que no se adopten, las siguiente decisiones y actividades (artículo 5° ley N°20.730)</p>

		<div class="form-group" >
			<div class="col-lg-10 offset-1">
				@php
					$materiasSeleccionadas = ($solicitud ?? null)?->materias?->toArray() ?? [];
				@endphp

				@foreach($materias as $i => $materia)
					@if($materia->id != 99 || (($solicitud ?? false) && in_array('99', Arr::flatten($solicitud->materias?->toArray() ?? []))))
						<div class="form-check solicitud-checkbox-row">
							<label class="form-check-label solicitud-checkbox-label">
							<input class="form-check-input solicitud-checkbox-input" type="checkbox" onchange="changeMateria({{ $materia->id }})" value="{{ $materia->id }}" {{ in_array($materia->id, $materiasSeleccionadas) ? 'checked' : '' }}> {{$materia->nombre}}
								@if($i == 0)
									<span class="d-inline-block" tabindex="0"  >
										<i class="bi bi-question-circle" data-bs-toggle="tooltip" title="Se está discutiendo un proyecto de construcción de una carretera en su región, y usted como representante de una ONG ambiental quiere presentar un estudio de impacto ambiental a la Dirección de Vialidad del Ministerio de Obras Públicas para que sea considerado."></i>
									</span>
									@elseif($i == 1)
										<span class="d-inline-block" tabindex="0"  >
											<i class="bi bi-question-circle" data-bs-toggle="tooltip" title="Se está discutiendo un proyecto de ley en la Comisión Especial del Senado que lo revisa, usted quiere reunirse con uno de los Senadores integrantes para poder entregarle su punto de vista o de la asociación que representa para que sea considerado en la modificación, aprobación o rechazo del mismo."></i>
										</span>
									@elseif($i == 2)
										<span class="d-inline-block" tabindex="0"  >
											<i class="bi bi-question-circle" data-bs-toggle="tooltip" title="Si usted quiere reunirse con la autoridad para enterarse de los programas que va a desarrollar una institución pública determinada, y usted quiere ofrecer un servicio relacionado con estos (por ejemplo: sistemas informáticos, software, sistemas de vigilancia, etc.)"></i>
										</span>
									@elseif($i == 3)
										<span class="d-inline-block" tabindex="0"  >
											<i class="bi bi-question-circle" data-bs-toggle="tooltip" title="Se está discutiendo el plan regulador de la comuna donde usted vive y quiere plantearle a la autoridad relevante su punto de vista o la de su junta de vecinos sobre temas que esa autoridad debiese considerar."></i>
										</span>
								@endif
							</label>
						</div>
					@endif
				@endforeach
			</div>
		</div>
	</fieldset>

	<fieldset {{ $preview ? 'disabled' : ''}}>
		<h2 class="line">5. Especifique las materias que desea abordar en la Audiencia</h2>

		<div class="form-group">
			<div class="input-group">
				<label for="inputEmail" class="col-lg-12 "></label>
				<div class="col-12 col-lg-12">
					<textarea id="errorReferencia" class="form-control print-hide" rows="5" name="referencia" required data-sanitize="true"></textarea>
					<p class="visible-print-block text-justify">{{ $solicitud->referencia ?? '' }}</p>
				</div>
				@error('referencia')
					<span class="text-danger">{{ $message }}</span>
				@enderror
			</div>
		</div>
	</fieldset>


	<fieldset {{ $preview ? 'disabled' : '' }}>
		<h2 class="line">6. Agregue la información adicional que desee</strong><a class="help-marker pull-right" data-bs-toggle="popover" data-placement="top" data-container="body" data-content="" data-trigger="hover"></a></h2>
		<div class="form-group">
			<div class="col-lg-12">
				<textarea class="form-control print-hide" rows="5" name="observaciones" id="textArea" data-sanitize="true"></textarea>
				<p class="visible-print-block text-justify">{{ $solicitud->folio->observaciones ?? '' }}</p>
			</div>
		</div>
	</fieldset>


	<div id="errorValidacionContainer" class="form-group text-danger" class="d-none">
		<div class="col-lg-12 text-center">
			<p id="errorValidacion"></p>
		</div>
	</div>
	
	<br>
	
	<div class="form-group">
		@if(!$edit)
			<div class="col-lg-12 text-center">
				<fieldset>
					<div class="form-group mb-4">
						<label class="d-inline-flex align-items-center gap-2 solicitud-checkbox-label">
							<input id="politicasCheckbox" class="form-check-input solicitud-checkbox-input" type="checkbox" name="politicasCheckbox">
							<a href="{{ asset('files/buenas_practicas_lobby.pdf') }}" target="_blank">Declaro tener conocimiento del código de buenas prácticas para lobbistas</a>
						</label>
						<div id="mensajePolitica" class="d-none">
							<p class="text-danger">Debe confirmar tener conocimientos del código de buenas prácticas para lobbistas.</p>
						</div>
					</div>
				</fieldset>

				<button type="submit" class="btn btn-lobby btn-lg" id="solicitar-audiencia">Solicitar</button>
				
				<button class="btn btn-default btn-lg border" onclick="window.history.back()">Cancelar</button>
			</div>
		@else

			
		@endif
	</div>

</form>

@endsection

@include ('admin.solicitudes._invitados')

@section('js')

<script type="text/javascript">
	let inviteModalInstance = null;
	let modalSubmitted = false;
	let submitted = false;
	validPoliticas = false;
	itemSelectedempleador = false;
	let materias = [];
	let asistenteIndex = 0;
	let edit =