iao_team/resources/views/livewire/azienda.blade.php

<div>

    <div class="col-md-12">
        <div class="card">
            <div class="card-body">
                @if (session()->has('message'))
                    <div class="alert alert-success" role="alert">
                        {{ session()->get('message') }}
                    </div>
                @endif

                @if (session()->has('error'))
                    <div class="alert alert-danger" role="alert">
                        {{ session()->get('error') }}
                    </div>
                @endif

                <div class="tab-content">
                    <form wire:submit.prevent="save">
                        <div class="row mb-4">
                            <div class="col-md-4">
                                <div class="logo-container mb-3 d-flex align-items-center">
                                    {{-- Display current logo from Wasabi --}}
                                    @if($this->hasLogo && $this->logoUrl)
                                        <div class="me-3 position-relative">
                                            <img src="{{ $this->logoUrl }}" alt="Logo"
                                                style="height: 200px; width: 200px; border-radius: 10px; object-fit: cover;">
                                            {{-- Remove logo button --}}
                                            <button type="button"
                                                class="btn btn-sm btn-danger position-absolute top-0 end-0 m-1"
                                                wire:click="removeLogo"
                                                style="border-radius: 50%; width: 30px; height: 30px; padding: 0;"
                                                title="Rimuovi logo">
                                                <i class="fas fa-times"></i>
                                            </button>
                                        </div>
                                    @endif

                                    <div class="me-3 flex-grow-1 d-flex flex-column justify-content-center">
                                        <div class="mt-2">
                                            <label class="form-label">Logo</label>
                                        </div>
                                        <input type="file"
                                            class="form-control form-control-lg @error('temp_logo') is-invalid @enderror"
                                            wire:model="temp_logo" style="width: 300px;"
                                            accept="image/jpeg,image/png,image/jpg,image/gif,image/webp">

                                        @error('temp_logo')
                                            <span class="text-danger">{{ $message }}</span>
                                        @enderror

                                        {{-- Preview new logo before upload --}}
                                        @if ($temp_logo)
                                            <div class="mt-2">
                                                <p class="text-muted small">Anteprima nuovo logo:</p>
                                                <img src="{{ $temp_logo->temporaryUrl() }}" class="mt-2"
                                                    style="max-width: 200px; max-height: 200px; border-radius: 10px; object-fit: cover;">
                                            </div>
                                        @endif

                                        {{-- Loading indicator --}}
                                        <div wire:loading wire:target="temp_logo" class="mt-2">
                                            <div class="spinner-border spinner-border-sm text-primary" role="status">
                                                <span class="visually-hidden">Caricamento...</span>
                                            </div>
                                            <span class="text-primary ms-2">Caricamento logo...</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="mb-4">
                            <h5 class="mb-3 blu-text">Anagrafica società</h5>
                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label class="form-label">Ragione sociale*</label>
                                    <input type="text"
                                        class="form-control form-control-lg @error('ragione_sociale') is-invalid @enderror"
                                        wire:model="ragione_sociale">
                                    @error('ragione_sociale') <span class="text-danger">{{ $message }}</span> @enderror
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label class="form-label">Nome associazione/società</label>
                                    <input type="text" class="form-control form-control-lg"
                                        wire:model="nome_associazione">
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label class="form-label">Tipologia* (ASD/SSD/Polisportiva ecc.)</label>
                                    <input type="text" class="form-control form-control-lg" wire:model="tipologia">
                                </div>
                                <div class="col-md-6  mb-3">
                                    <label class="form-label">Discipline</label>
                                    <div wire:ignore>
                                        <select class="form-select discipline-select" style="border-radius: 20px;"
                                            multiple wire:model="selectedDisciplines">
                                            @forelse($discipline as $disciplineScelte)
                                                <option value="{{ $disciplineScelte->id }}">
                                                    {{ $disciplineScelte->name }}
                                                </option>
                                            @empty
                                                <option disabled>Nessuna disciplina trovata</option>
                                            @endforelse
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <h5 class="mb-3 blu-text">Sede legale</h5>
                        <div class="row">
                            <div class="col-md-3 mb-3">
                                <label class="form-label">Nazione</label>
                                <input type="text" class="form-control" wire:model="sede_legale_nazione">
                            </div>
                            <div class="col-md-3 mb-3">
                                <label class="form-label">Provincia</label>
                                <input type="text" class="form-control" wire:model="sede_legale_provincia">
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Comune</label>
                                <input type="text" class="form-control" wire:model="sede_legale_comune">
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Indirizzo</label>
                                <input type="text" class="form-control" wire:model="sede_legale_indirizzo">
                            </div>
                            <div class="col-md-3 mb-3">
                                <label class="form-label">CAP</label>
                                <input type="text" class="form-control" wire:model="sede_legale_cap">
                            </div>
                        </div>

                        <div class="form-check mb-3">
                            <input class="form-check-input mt-1" type="checkbox" wire:model="same_address"
                                id="sameAddress">
                            <label class="form-check-label" style="font-size: medium" for="sameAddress">
                                Sede operativa uguale a sede legale
                            </label>
                        </div>

                        @if(!$same_address)
                            <h5 class="mb-3 blu-text">Sede operativa</h5>
                            <div class="row">
                                <div class="col-md-3 mb-3">
                                    <label class="form-label">Nazione</label>
                                    <input type="text" class="form-control" wire:model="sede_operativa_nazione">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label">Provincia</label>
                                    <input type="text" class="form-control" wire:model="sede_operativa_provincia">
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label class="form-label">Comune</label>
                                    <input type="text" class="form-control" wire:model="sede_operativa_comune">
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label class="form-label">Indirizzo</label>
                                    <input type="text" class="form-control" wire:model="sede_operativa_indirizzo">
                                </div>
                                <div class="col-md-3 mb-3">
                                    <label class="form-label">CAP</label>
                                    <input type="text" class="form-control" wire:model="sede_operativa_cap">
                                </div>
                            </div>
                        @endif

                        <h5 class="mb-3 blu-text">Contatti</h5>
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Email*</label>
                                <input type="email" class="form-control @error('email') is-invalid @enderror"
                                    wire:model="email">
                                @error('email') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Pec*</label>
                                <input type="email" class="form-control @error('pec') is-invalid @enderror"
                                    wire:model="pec">
                                @error('pec') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Telefono</label>
                                <input type="text" class="form-control" wire:model="telefono">
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">Cellulare*</label>
                                <input type="text" class="form-control @error('cellulare') is-invalid @enderror"
                                    wire:model="cellulare">
                                @error('cellulare') <span class="text-danger">{{ $message }}</span> @enderror
                            </div>
                        </div>

                        <h5 class="mb-3  blu-text">Dati fiscali</h5>
                        <div class="row">
                            <div class="col-md-3 mb-3">
                                <label class="form-label">Partita IVA</label>
                                <input type="text" class="form-control " wire:model="partita_iva">
                            </div>
                            <div class="col-md-3 mb-3">
                                <label class="form-label">Codice fiscale</label>
                                <input type="text" class="form-control " wire:model="codice_fiscale">
                            </div>
                            <div class="col-md-3 mb-3">
                                <label class="form-label">Codice SDI</label>
                                <input type="text" class="form-control " wire:model="codice_sdi">
                            </div>
                        </div>

                        <div class="mt-4 d-flex justify-content-start">
                            <button type="button" class="btn--ui lightGrey" onclick="annulla()">Annulla</button>
                            <button type="submit" class="btn text-light"
                                style="background-color:#0C6197;margin-left:15px; ">Salva</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<style>
    /* Custom CSS for rounded multi-select */

    /* If using Choices.js */
    .discipline-select+.choices {
        border-radius: 20px !important;
    }

    .discipline-select+.choices .choices__inner {
        border-radius: 20px !important;
    }

    .discipline-select+.choices .choices__list--dropdown {
        border-radius: 15px !important;
    }

    .blu-text {
        color: #0C6197 !important;
    }
</style>
@push('scripts')
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
    <script>
        $(document).ready(function () {
            $('.discipline-select').select2({
                placeholder: 'Seleziona discipline',
                allowClear: true
            });

            $('.discipline-select').on('change', function (e) {
                var data = $(this).select2("val");
                @this.set('selectedDisciplines', data);
            });
        });

        function annulla() {
            window.onbeforeunload = null;
            document.location.href = '/dashboard';
        }
    </script>
@endpush