<?php
use Illuminate\Support\Facades\Auth;
?>
<x-app-layout>
    <div class="container-xxl flex-grow-1 p-0">
        <div class="row justify-content-center mt-5">
            <div class="col-lg-10 col-xl-8">
                <div class="row mb-4">
                    <div class="col-md-12 text-center">
                        <img src="{{ asset('assets/img/logo_segresta_orizzontale.png') }}" alt="SegrestaFix" class="img-fluid w-25 mb-4">
                    </div>
                </div>
                
                <div class="card shadow-sm">
                    <div class="card-header border-bottom ">
                        <div class="d-flex align-items-center">
                            <div class="avatar flex-shrink-0 me-3">
                                <div class="avatar-initial bg-primary rounded">
                                    <i class="bx bx-edit-alt fs-4"></i>
                                </div>
                            </div>
                            <div>
                                <h4 class="card-title mb-0 text-primary">
                                    Modifica Reparto
                                </h4>
                                <p class="text-muted mb-0 small">Aggiorna le informazioni del reparto</p>
                            </div>
                        </div>
                    </div>
                    
                    @if(session('success'))
                        <div class="m-4 alert alert-success alert-dismissible fade show" role="alert">
                            <i class="bx bx-check-circle me-2"></i>
                            {{ session('success') }}
                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                        </div>
                    @endif
                    @if(session('error'))
                        <div class="m-4 alert alert-danger alert-dismissible fade show" role="alert">
                            <i class="bx bx-error-circle me-2"></i>
                            {{ session('error') }}
                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                        </div>
                    @endif
                    
                    <div class="card-body p-4">
                        @if($errors->any())
                            <div class="alert alert-danger alert-dismissible fade show mb-4" role="alert">
                                <i class="bx bx-error-circle me-2"></i>
                                <ul class="mb-0">
                                    @foreach($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                            </div>
                        @endif

                        <form id="formEditReparto" action="{{ route('reparto.update') }}" method="POST">
                            @csrf
                            <input type="hidden" name="action" value="edit">
                            <input type="hidden" name="reparto_id" id="reparto_id" value="{{ $reparto->id }}">
                            
                            <!-- Informazioni Base -->
                            <div class="row g-3 mb-4">
                                <div class="col-12">
                                    <div class="card shadow-none  h-100">
                                        <div class="card-body">
                                            <label for="label" class="form-label text-primary fw-semibold">
                                                <i class="bx bx-building me-1"></i>Nome Reparto <span class="text-danger">*</span>
                                            </label>
                                            <div class="input-group input-group-merge">
                                                <span class="input-group-text">
                                                    <i class="bx bx-building"></i>
                                                </span>
                                                <input type="text" class="form-control" id="label" name="label" required placeholder="Inserisci il nome del reparto" value="{{ old('label', $reparto->label) }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Descrizione e Istruzioni -->
                            <div class="row g-3 mb-4">
                                <div class="col-md-6">
                                    <div class="card shadow-none h-100">
                                        <div class="card-body">
                                            <label for="descrizione" class="form-label text-info fw-semibold">
                                                <i class="bx bx-file-blank me-1"></i>Descrizione
                                            </label>
                                            <textarea class="form-control" id="descrizione" name="descrizione" rows="5" placeholder="Inserisci una descrizione del reparto...">{{ old('descrizione', $reparto->descrizione) }}</textarea>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="card shadow-none h-100">
                                        <div class="card-body">
                                            <label for="istruzioni" class="form-label text-warning fw-semibold">
                                                <i class="bx bx-info-circle me-1"></i>Istruzioni
                                            </label>
                                            <textarea class="form-control" id="istruzioni" name="istruzioni" rows="5" placeholder="Inserisci le istruzioni per questo reparto...">{{ old('istruzioni', $reparto->istruzioni) }}</textarea>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Contatti -->
                            <div class="row g-3 mb-4">
                                <div class="col-md-6">
                                    <div class="card shadow-none h-100">
                                        <div class="card-body">
                                            <label for="email" class="form-label text-success fw-semibold">
                                                <i class="bx bx-envelope me-1"></i>Email <span class="text-danger">*</span>
                                            </label>
                                            <div class="input-group input-group-merge">
                                                <span class="input-group-text">
                                                    <i class="bx bx-envelope"></i>
                                                </span>
                                                <input type="email" class="form-control" id="email" name="email" required placeholder="email@esempio.it" value="{{ old('email', $reparto->email) }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-6">
                                    <div class="card shadow-none  h-100">
                                        <div class="card-body">
                                            <label for="telefono" class="form-label text-secondary fw-semibold">
                                                <i class="bx bx-phone me-1"></i>Telefono
                                            </label>
                                            <div class="input-group input-group-merge">
                                                <span class="input-group-text">
                                                    <i class="bx bx-phone"></i>
                                                </span>
                                                <input type="text" class="form-control" id="telefono" name="telefono" placeholder="Inserisci il numero di telefono" value="{{ old('telefono', $reparto->telefono) }}">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Bottoni -->
                            <div class="row mt-4">
                                <div class="col-12">
                                    <div class="d-flex justify-content-end gap-2">
                                        <a href="{{ route('reparto.dashboard') }}" class="btn btn-label-secondary">
                                            <i class="bx bx-x me-2"></i>Annulla
                                        </a>
                                        <button type="submit" class="btn btn-primary">
                                            <i class="bx bx-check me-2"></i>Aggiorna Reparto
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</x-app-layout>

@section('page-script')
<script>
$(document).ready(function() {
    var $ = window.jQuery;
    if (!$) {
        console.error('jQuery non è disponibile');
        return;
    }

    // Gestione submit form - formatta i dati per DataTableEditor
    $('#formEditReparto').on('submit', function(e) {
        e.preventDefault();
        alert('submit');
        $.ajax({
            url: "{{ route('reparto.update') }}",
            type: 'POST',
            headers: {
                'X-CSRF-TOKEN': '{{csrf_token()}}'
            },
            data: {
                action: 'edit',
                id: $('#reparto_id').val(),
                label: $('#label').val(),
                descrizione: $('#descrizione').val(),
                istruzioni: $('#istruzioni').val(),
                email: $('#email').val(),
                telefono: $('#telefono').val()
            }
            success: function(response) {
                    window.location.href = "{{ route('reparto.dashboard') }}";
            }
            error: function(xhr) {
                console.log(xhr.responseJSON);
            }

        });
    });
});
</script>
@endsection