@php
$configData = Helper::appClasses();
@endphp

@extends('layouts/layoutMaster')

@section('title', 'Editar restaurante')

@section('content')
<div class="d-flex flex-wrap justify-content-between align-items-center mb-3">
  <h4 class="mb-0">Editar restaurante</h4>
  <a class="btn btn-outline-secondary" href="{{ route('admin.restaurants.index') }}">Volver</a>
</div>

@if ($errors->any())
  <div class="alert alert-danger">
    <ul class="mb-0">
      @foreach ($errors->all() as $error)
        <li>{{ $error }}</li>
      @endforeach
    </ul>
  </div>
@endif

<div class="card">
  <div class="card-body">
    <form method="POST" action="{{ route('admin.restaurants.update', $restaurant) }}">
      @csrf
      @method('PUT')
      <div class="row g-3">
        <div class="col-md-6">
          <label class="form-label">Nombre</label>
          <input class="form-control" name="name" value="{{ old('name', $restaurant->name) }}" required />
        </div>
        <div class="col-md-6">
          <label class="form-label">Zona</label>
          <select class="form-select" name="zone_id">
            <option value="">Sin zona</option>
            @foreach ($zones as $zone)
              <option value="{{ $zone->id }}" @selected(old('zone_id', $restaurant->zone_id) == $zone->id)>{{ $zone->name }}</option>
            @endforeach
          </select>
        </div>
        <div class="col-md-6">
          <label class="form-label">Contacto</label>
          <input class="form-control" name="contact_name" value="{{ old('contact_name', $restaurant->contact_name) }}" />
        </div>
        <div class="col-md-6">
          <label class="form-label">Teléfono</label>
          <input class="form-control" name="phone" value="{{ old('phone', $restaurant->phone) }}" />
        </div>
        <div class="col-md-6">
          <label class="form-label">Email</label>
          <input class="form-control" name="email" value="{{ old('email', $restaurant->email) }}" />
        </div>
        <div class="col-md-6">
          <label class="form-label">Dirección</label>
          <input class="form-control" id="restaurant-address" name="address" value="{{ old('address', $restaurant->address) }}"
            placeholder="Escribe la dirección del restaurante" />
          <input type="hidden" id="restaurant-lat" name="lat" value="{{ old('lat', $restaurant->lat) }}" />
          <input type="hidden" id="restaurant-lng" name="lng" value="{{ old('lng', $restaurant->lng) }}" />
        </div>
        <div class="col-12">
          <label class="form-label">Notas</label>
          <textarea class="form-control" name="notes" rows="3">{{ old('notes', $restaurant->notes) }}</textarea>
        </div>
        <div class="col-md-6">
          <label class="form-label">Costo por entrega (€)</label>
          <input class="form-control" name="delivery_fee" type="number" step="0.01" min="0" value="{{ old('delivery_fee', $restaurant->delivery_fee) }}" />
        </div>
        <div class="col-12">
          <hr class="my-2" />
          <h6 class="mb-2">Acceso del restaurante</h6>
        </div>
        <div class="col-md-6">
          <label class="form-label">Email de acceso</label>
          <input class="form-control" name="login_email" value="{{ old('login_email', $restaurantUser?->email) }}"
            placeholder="login@restaurante.com" />
          <div class="form-text">Deja en blanco si no quieres cambiarlo.</div>
        </div>
        <div class="col-md-6">
          <label class="form-label">Nueva contraseña</label>
          <input class="form-control" type="password" name="login_password" placeholder="Mínimo 6 caracteres" />
          <div class="form-text">Solo se actualiza si escribes una nueva.</div>
        </div>
        <div class="col-12">
          <div class="form-check">
            <input class="form-check-input" type="checkbox" name="is_active" id="is_active" value="1" @checked(old('is_active', $restaurant->is_active)) />
            <label class="form-check-label" for="is_active">Activo</label>
          </div>
        </div>
      </div>
      <div class="mt-3">
        <button class="btn btn-primary" type="submit">Guardar cambios</button>
      </div>
    </form>
  </div>
</div>
@endsection

@section('page-script')
  <script>
    window.initRestaurantMap = function initRestaurantMap() {
      const addressInput = document.getElementById('restaurant-address');
      const latInput = document.getElementById('restaurant-lat');
      const lngInput = document.getElementById('restaurant-lng');

      if (!addressInput) {
        return;
      }

      const autocomplete = new google.maps.places.Autocomplete(addressInput, {
        fields: ['formatted_address', 'geometry'],
      });

      autocomplete.addListener('place_changed', () => {
        const place = autocomplete.getPlace();
        if (!place.geometry || !place.geometry.location) {
          return;
        }

        const location = place.geometry.location;
        latInput.value = location.lat();
        lngInput.value = location.lng();
        addressInput.value = place.formatted_address || addressInput.value;
      });
    };

    (function loadRestaurantMapsScript() {
      if (window.google && window.google.maps) {
        return;
      }

      const script = document.createElement('script');
      script.src = 'https://maps.googleapis.com/maps/api/js?key={{ config('services.google.maps_key') ?: env('GOOGLE_MAPS_API_KEY') }}&libraries=places&loading=async&callback=initRestaurantMap';
      script.async = true;
      script.defer = true;
      document.head.appendChild(script);
    })();
  </script>
@endsection