@extends('modules.head') @section('contenido')
<h3><a class="ruta" class="" href="{{url('/sucursals')}}">{{ Lang::get('messages.screen_add_sucursal_tag1')}} </a>
    <span class="separador-ruta">|</span><a class="ruta" class="" href="{{url('/sucursals/add')}}">{{
        Lang::get('messages.screen_add_sucursal_tag2')}} </a> </h3>

<div class="box">
    <div class="box-header with-border">
        <h3 class="box-title">{{ Lang::get('messages.screen_add_sucursal_tag3')}}</h3>


        <!-- /.box-tools -->
    </div>
    <!-- /.box-header -->
    <div class="box-body">
        <form role="form" id="createSucursal" data-toggle="validator">
            <div class="row">
                <div class="col-6 col-md-6">
                    <div class="form-group">
                        <label for="mail">{{ Lang::get('messages.screen_add_sucursal_tag4')}} </label>
                        <input type="email" class="form-control" id="mail" name="mail" placeholder="" required>
                    </div>
                </div>
                <div class="col-3 col-md-3">
                    <div class="form-group">
                        <label for="name">{{ Lang::get('messages.screen_add_sucursal_tag5')}}</label>
                        <input type="text" class="form-control" name="name" placeholder="" required>
                    </div>
                </div>
                <div class="col-3 col-md-3">
                    <div class="form-group">
                        <label for="code">{{ Lang::get('messages.screen_add_sucursal_tag6')}} </label>
                        <input type="text" class="form-control" name="code" placeholder="" required>
                    </div>

                </div>

            </div>
            <div class="row">

                <div class="col-3 col-md-3">
                    <div class="form-group">
                        <label for="phone">{{ Lang::get('messages.screen_add_sucursal_tag7')}} </label>
                        <input type="text" class="form-control" name="phone" placeholder="" required>
                    </div>
                </div>

                <div class="col-3 col-md-3">
                    <div class="form-group">
                        <label for="coverage_id">{{ Lang::get('messages.screen_add_sucursal_tag8')}} </label>
                        <select class="form-control" name="coverage_id" id="select-cobertura" required>
                            <option value=""> Seleccionar </option>
                            @foreach($coverages as $coverage)
                            <option value="{{$coverage->id}}">{{$coverage->name}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="col-3 col-md-3">
                    <div class="form-group">
                        <label for="state_id">{{ Lang::get('messages.screen_add_sucursal_tag9')}} </label>
                        <select class="form-control" name="state_id" id="selectStateId">
                            <option value="">Seleccionar </option>
                            @foreach($states as $state)
                            <option value="{{$state->id}}">{{$state->name}} </option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="col-3 col-md-3">
                    <div class="form-group">
                        <label for="city_id">{{ Lang::get('messages.screen_add_sucursal_tag10')}} </label>
                        <select class="form-control" name="city_id" id="selectCityId" required>
                            <option value="">Seleccionar </option>
                            @foreach($cities as $city)
                            <option value="{{$city->id}}">{{$city->name}} </option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-3">
                    <div class="form-group">
                        <label for="direction">{{ Lang::get('messages.screen_add_sucursal_tag11')}} </label>
                        <input type="text" data-id="" data-lat="" data-long="" id="direction" class="form-control" name="direction"
                            placeholder="" required disabled>
                    </div>
                </div>
                <div class="col-xs-1">
                    <button type="button" class="btn btnBox btnPlusDir pull-left" id="btn-open-modal-direction"
                        data-toggle="modal" data-target="#modal_register_direction">
                        <i class="fa fa-plus"></i>
                    </button>
                </div>
                <div class="col-2 col-md-2">
                    <label for="district">{{ Lang::get('messages.screen_add_sucursal_tag12')}} </label>
                    <div class="form-group">
                        <input type="text" class="form-control" id="district" name="district" placeholder="" maxlength="191">
                    </div>
                </div>
                <div class="col-6 col-md-6">
                    <div class="form-group">
                        <label for="indications">{{ Lang::get('messages.screen_add_sucursal_tag13')}} </label>
                        <textarea class="form-control" id="indications" rows="2" name="indications" placeholder="Enter ..."
                            maxlength="250"></textarea>
                    </div>
                </div>
            </div>

            <div class="row">
              <div class="col-3 col-md-3">
                   <div class="form-group">
                       <label for="image">{{ Lang::get('messages.screen_products_tag24')}} </label>
                       <input type="file" name="image" id="image">
                   </div>
              </div>
            </div>

            <button onClick="createSucursal()" id="btn-create-sucursal" class="btn btnBox pull-right ">{{
                Lang::get('messages.screen_add_sucursal_tag14')}}</button>
            <button type="button" class="btn btn-default pull-right btnCancel">
                <a href="{{url('/sucursals')}}">{{ Lang::get('messages.screen_add_sucursal_tag15')}} </a>
            </button>
            {{ csrf_field() }}
        </form>
    </div>
    <!-- /.box-body -->
</div>
@include('modal_direction')


<script src="{{ asset('js/jQuery/jquery-2.2.3.min.js') }}"></script>
<script src="{{ asset('js/direction.js') . '?v=' . time() }}"></script>
<script src="https://maps.googleapis.com/maps/api/js?key={{ config('googlmapper.key') }}&libraries=places,geometry&loading=async" async defer></script>
<script src="{{ asset('js/sucursales.js') . '?v=' . time() }}"></script>
<script src="{{ asset('js/bootstrap/js/bootstrap.min.js') }}"></script>
<script>
  $(document).ready(function(){
    $("#selectCityId").on("change", function(){
      var coverages = JSON.parse('{{$coverages}}'.replace(/&quot;/g,'"'));
      var city_id = $("#selectCityId").val();
      statusCityInCoverage = false;
      for (var i = 0; i < coverages.length; i++) {
        if(coverages[i].city_id == city_id){
          statusCityInCoverage = true;
        }
      }
      if(!statusCityInCoverage){
        alert('La ciudad seleccionada no esta en las coberturas disponibles');
        $("#selectCityId").val(0);
      }
    });
  });
</script>
@endsection