@extends('layouts.app')

@section('content')
<div class="container mt-5">
    <h1>Editar Compañía</h1>

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

    <form method="POST" action="{{ route('companies.update', $company->id) }}">
        @csrf
        @method('PUT')

        <div class="row">
            <div class="col-md-6 mb-3">
                <label for="name" class="form-label">Nombre</label>
                <input type="text" class="form-control" id="name" name="name"
                    value="{{ old('name', $company->name) }}" required>
            </div>
            <div class="col-md-6 mb-3">
                <label for="business_name" class="form-label">Razón Social</label>
                <input type="text" class="form-control" id="business_name" name="business_name"
                    value="{{ old('business_name', $company->business_name) }}">
            </div>
        </div>

        <div class="row">
            <div class="col-md-4 mb-3">
                <label for="nit" class="form-label">NIT</label>
                <input type="text" class="form-control" id="nit" name="nit"
                    value="{{ old('nit', $company->nit) }}" required>
            </div>
            <div class="col-md-2 mb-3">
                <label for="verification_digit" class="form-label">Dígito Verificación</label>
                <input type="text" class="form-control" id="verification_digit" name="verification_digit"
                    value="{{ old('verification_digit', $company->verification_digit) }}">
            </div>
            <div class="col-md-6 mb-3">
                <label for="address" class="form-label">Dirección</label>
                <input type="text" class="form-control" id="address" name="address"
                    value="{{ old('address', $company->address) }}">
            </div>
        </div>

        <div class="row">
            <div class="col-md-4 mb-3">
                <label for="phone" class="form-label">Teléfono</label>
                <input type="text" class="form-control" id="phone" name="phone"
                    value="{{ old('phone', $company->phone) }}">
            </div>
            <div class="col-md-4 mb-3">
                <label for="mobile" class="form-label">Móvil</label>
                <input type="text" class="form-control" id="mobile" name="mobile"
                    value="{{ old('mobile', $company->mobile) }}">
            </div>
            <div class="col-md-4 mb-3">
                <label for="email" class="form-label">Correo</label>
                <input type="email" class="form-control" id="email" name="email"
                    value="{{ old('email', $company->email) }}">
            </div>
        </div>

        <div class="row">
            <div class="col-md-4 mb-3">
                <label for="department_id" class="form-label">Departamento</label>
                <select class="form-select" id="department_id">
                    <option value="">Seleccione un departamento</option>
                    @foreach($departments as $department)
                    <option value="{{ $department->id }}"
                        {{ $department->id == $company->city->department_id ? 'selected' : '' }}>
                        {{ $department->name }}
                    </option>
                    @endforeach
                </select>
            </div>

            <div class="col-md-4 mb-3">
                <label for="city_id" class="form-label">Ciudad</label>
                <select class="form-select" id="city_id" name="city_id" required>
                    <option value="">Seleccione una ciudad</option>
                    @foreach($cities as $city)
                    <option value="{{ $city->id }}"
                        {{ $city->id == $company->city_id ? 'selected' : '' }}>
                        {{ $city->name }}
                    </option>
                    @endforeach
                </select>
            </div>

            <div class="col-md-4 mb-3">
                <label for="company_id" class="form-label">Compañía Padre</label>
                <select class="form-select" id="company_id" name="company_id">
                    <option value="">Seleccione una compañía</option>
                    @foreach($companies as $parent)
                    <option value="{{ $parent->id }}"
                        {{ $parent->id == $company->company_id ? 'selected' : '' }}>
                        {{ $parent->name }}
                    </option>
                    @endforeach
                </select>
            </div>
        </div>

        <div class="row">
            <div class="col-md-4 mb-3">
                <label for="status_id" class="form-label">Estado</label>
                <select class="form-select" id="status_id" name="status_id" required>
                    @foreach($statuses as $status)
                    <option value="{{ $status->id }}"
                        {{ $status->id == $company->status_id ? 'selected' : '' }}>
                        {{ $status->description }}
                    </option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-4 mb-3">
                <label for="external_id" class="form-label">ID Externo</label>
                <input type="text" class="form-control" id="external_id" name="external_id"
                    value="{{ old('external_id', $company->external_id) }}">
            </div>
            <div class="col-md-4 mb-3">
                <label for="external_model" class="form-label">Modelo Externo</label>
                <input type="text" class="form-control" id="external_model" name="external_model"
                    value="{{ old('external_model', $company->external_model) }}">
            </div>
        </div>

        <div class="mt-3">
            <button type="submit" class="btn btn-success">Actualizar</button>
            <a href="{{ route('companies.index') }}" class="btn btn-secondary">Volver</a>
        </div>
    </form>
</div>
@endsection
@section('scripts')
<script>
    document.addEventListener('DOMContentLoaded', function() {
        const departmentSelect = document.getElementById('department_id');
        const citySelect = document.getElementById('city_id');
        const selectedCity = "{{ $company->city_id }}";

        departmentSelect.addEventListener('change', function() {
            const departmentId = this.value;
            citySelect.innerHTML = '<option value="">Seleccione una ciudad</option>';

            if (departmentId) {
                fetch(`/departments/${departmentId}/cities`)
                    .then(response => response.json())
                    .then(data => {
                        data.forEach(city => {
                            let selected = city.id == selectedCity ? 'selected' : '';
                            citySelect.innerHTML += `<option value="${city.id}" ${selected}>${city.name}</option>`;
                        });
                    });
            }
        });
        if (departmentSelect.value) {
            departmentSelect.dispatchEvent(new Event('change'));
        }
    });
</script>
@endsection