@extends('layout.backend')
@section('styles')
    @parent
@endsection
@section('scripts')
    @parent
    <script src="{{ asset('/js/plugins/jquery.mask.min.js') }}"></script>
	<script src="{{ mix('/js/create-regions.js') }}"></script>
@endsection
@section('content')
<div class="card shadow mb-4">
    <div class="card-header py-3">
        <h6 class="m-0 font-weight-bold text-primary">{{$region->id ? "Editar" : "Nova"}} Região</h6>
    </div>

	<div class="card-body">

		{{-- ALERTAS --}}
		@include('components.widget.alerts')

        {!! Form::open(['id' => 'form-edit-region', 
            'url' => $region->id ? route('regions.update', ['region' => $region->id]) : route('regions.store'), 
            'autocomplete' => 'off',
            'files' => true ]) !!}
        @if($region->id)
            @method('PUT')
        @endif

        <div class="row">
            <div class="col-sm-8 col-md-9 mt-3">
                <label for="" class="col-12 col-6 p-0">Nome da Região</label>
                <div class="col-12 col-6 p-0">
                    {!! Form::text("name", $region->name, ['class' => "form-control"]) !!}
                    {!! Form::hidden("id", $region->id, ['id' => 'idregion']) !!}
                </div>
			</div>
            <div class="col-sm-4 col-md-3 mt-3">
                <label for="" class="col-12 col-6 p-0">Cor no mapa</label>
                <div class="col-12 col-6 p-0">
                    {!! Form::input("color","color", $region->color, [
                        'class' => "form-control",
                    ]) !!}
                </div>
            </div>

			<div class="col-md-12 col-lg-6 mt-3">
                <label for="" class="col-12 col-6 p-0">Descrição</label>
                <div class="col-12 col-6 p-0">
                    {!! Form::text("description", $region->description, ['class' => "form-control"]) !!}
                </div>
            </div>
			<div class="col-md-12 col-lg-6 mt-3">
                <label for="" class="col-12 col-6 p-0">Endereço para cartão de visitas</label>
                <div class="col-12 col-6 p-0">
                    {!! Form::textarea("address", $region->address, ['class' => "form-control", 'rows' => 3, 'cols' => 54]) !!}
                </div>
            </div>
            <div class="col-sm-6 col-md-6 col-lg-3 mt-3">
				<label for="" class="col-12 col-6 p-0">Telefone Colih região</label>
				<div class="col-12 col-6 p-0">
						{!! Form::text("hlc_phone", $region->hlc_phone, ['class' => "form-control"]) !!}
				</div>
				
            </div>
            <div class="col-sm-6 col-md-6 col-lg-3 mt-3">
                    <label for="" class="col-12 col-6 p-0">Telefone GVP região</label>
                    <div class="col-12 col-6 p-0">
                            {!! Form::text("pvg_phone", $region->pvg_phone, ['class' => "form-control"]) !!}
                    </div>
                    
            </div>
			<div class="col-sm-12 col-lg-6 small mt-1 mt-lg-4 mt-xl-5">
				Se informados, os números regionais serão exibidos no plantão ao invés do número geral. Se estiverem em branco aqui e no número geral, será usado o número pessoal do membro.
			</div>

			<div class="col-sm-9 col-md-8 col-lg mt-3">
                <label for="" class="col-12 col-6 p-0">E-mail da região</label>
                <div class="col-12 col-6 p-0">
                    {!! Form::email("email", $region->email, ['class' => "form-control"]) !!}
                </div>
            </div>
			<div class="col-sm-3 col-md-4 col-lg-2 mt-3">
                    <label for="" class="col-12 col-6 p-0">Tem Plantão ?</label>
                    <div class="col-12 col-6 p-0">
                            {!! Form::select("oncall", [0 => 'Não', 1 => 'Sim'], $region->oncall, ['class' => 'form-control', 'id' => 'oncall']) !!}
                    </div>
            </div>
			<div id="divOncall" class="col-12 col-lg-6 {{ $region->oncall ? '' : 'd-none' }} ">
				<div class="row">
					<div class="col-6 mt-3">
						<label for="" class="col-12 p-0">Qtd. plantonistas GVP</label>
						<div class="col-12 p-0">
							{!! Form::select("pvg_qty", $qtyOncallSelect, $region->pvg_qty, ['class' => 'form-control']) !!}
						</div>
					</div>
					<div class="col-6 mt-3">
						<label for="" class="col-12 p-0">Qtd. plantonistas Colih</label>
						<div class="col-12 p-0">
							{!! Form::select("hlc_qty", $qtyOncallSelect, $region->hlc_qty, ['class' => 'form-control']) !!}
						</div>
					</div>
				</div>
			</div>
		</div>

		@if($region->id) {{-- se edição --}}
			<x-form.control-group class="col px-3 py-2 mx-0 mt-4 mb-1">
				<div class="col-12 font-weight-bold">Mapa personalizado</div>

				@if($isMultiRegionCity)
					<div class="col-sm-12 col-md-12 col-lg-12 mt-3 ">
						<div id="divMap" class="col-12 {{ !$region->kml ? 'd-none' : '' }}">
							<label for="" class="col-12 col-6 p-0">Território da região</label>
							<style type="text/css">
								#map {
									width: 50%;
									height: 400px;
								}
							</style>        
							@if($region->kml)
								<div id="map" 
									data-appname='{{ $map['appname'] }}'
									data-mapkey='{{ $map['mapkey'] }}'
									data-mapid='{{ $map['mapid'] }}'
									data-lat='{{ $map['lat'] }}'
									data-lon='{{ $map['lon'] }}'>
								</div>
							@endif

							<div id="divDestroyKml" class="{{ !$region->kml ? 'd-none' : '' }} my-3">
								<span id="destroyKml" data-url="{{ route('regions.destroyKml', ['id' => $region->id]) }}" class="btn btn-info">Excluir arquivo KML enviado</span>
							</div>
						</div>                        
						<div id="divKml" class="col-12 {{ $region->kml ? 'd-none' : '' }}">
							<x-form.file-import 
								no-form="true" 
								title="Este recurso é util para Colihs metropolitanas que dividem um único município em mais de uma região."
								file-type=".kml,.kmz"
								:route="route('congregations.importcreate')">
								
								Antes de usar este recurso, gere um arquivo KML com os limites da região.<br/>
								Um passo a passo para criar o arquivo KML está <a href="https://www.youtube.com/watch?v=n2TZf13OEU0" target="_blank">aqui</a>.
								<div class="w-100 mt-2"></div>
								Após gerar o arquivo, clique em <em>Selecione o arquivo</em> abaixo e aponte para onde o 
								arquivo foi gravado, daí clique em <strong>Salvar</strong>.
							</x-form.file-import>
							<div class="w-100 pt-3"></div>
						</div>
					</div>
				@else
					<div class="col-12 my-2 mx-2">
						<i class="fas fa-exclamation-triangle"></i> 
						Não é possível definir um mapa personalizado para esta região, porque nenhuma cidade aparece em mais de uma região. <br/>
						<em>Exemplo: Se a cidade de São Paulo consta da região Norte e Sul, é possível possível definir um mapa personalizado para cada região</em>
					</div>
				@endif
			</x-form.control-group>
		@endif

		<div class="col-12 mt-4 pl-0">
			{!! Form::submit('SALVAR', ['class' => 'btn btn-primary']) !!}
		</div>
        {!! Form::close() !!}
    </div>
</div>

@if($region->id)
	<div class="card shadow mb-4">
		<div class="card-header py-3">
			<h6 class="m-0 font-weight-bold text-primary">Cidades da Região</h6>
		</div>

		<div class="card-body pt-1">
			<div class="row">
				<div class="col-sm-5 col-md-4 col-lg-5 col-xl-3 mt-2">
					<label for="" class="col-12 col-6 p-0">Estado</label>
					<div class="col-12 col-6 p-0">
						{!! Form::select("state_id", $states, $state, ['class' => "form-control", 'id' => 'choose-states']) !!}
					</div>
				</div>

				<div class="col-sm-7 col-md col-lg-4 col-xl-4 mt-2">
					<label for="" class="col-12 col-6 p-0">Cidade</label>
					<div class="col-12 col-6 p-0">
						{!! Form::select("city_id", $cities, null, ['class' => "form-control", 'id' => 'cities']) !!}
					</div>
				</div>

				<div class="col-sm-12 col-md-auto px-md-0 mt-md-3">
					{!! Form::button('ADICIONAR', ['class' => 'btn btn-info mt-3 mt-md-4', 'id' => 'add-city-region']) !!}
				</div>
				<div class='w-100'></div>
				<div class="table-responsive">
					@if(isset($region->cities) && $region->cities->count() > 0)
					<table class="table w-100 mt-4" id="list-cities">
						<thead>
							<tr>
								<th style="border-top: none;">Estado</th>
								<th style="border-top: none;">Cidade</th>
								<th class="d-none d-md-table-cell" width="20%" style="border-top: none;"></th>
								<th class="d-none d-lg-table-cell" width="25%" style="border-top: none;"></th>
							</tr>
						</thead>
						<tbody>
							@foreach($region->cities as $regioncity)
							<tr id="tr{!! $regioncity->city_id !!}">
								<td>{!! $regioncity->state->state !!}</td>
								<td>{!! $regioncity->city->city !!}</td>
								<td >
									<a href="#deleteCityRegionModal" class="delete-city-region city-exists" data-regioncity-id="{!! $regioncity->id !!}" data-city-id="{!! $regioncity->city_id !!}" data-bs-toggle="modal">
										<i class="fa fa-trash" style="color:red;"></i>
									</a>
								</td>
							</tr>
							@endforeach
						</tbody>
					</table>
					@else 
					<table class="table w-100 mt-4 d-none" id="list-cities">
						<thead>
							<tr>
								<th width="20%">Estado</th>
								<th width="20%">Cidade</th>
							</tr>
						</thead>
						<tbody></tbody>
					</table>
					@endif
				</div>
			</div>
		</div>
	</div>        
@endif
	
@include('components.delete.city-region')
@endsection