@extends('layouts.app')

@section('title', 'Dettaglio Ripartizione Spesa')

@section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title">Dettaglio Ripartizione Spesa</h3>
                    <div class="card-tools">
                        @can('update', $ripartizione)
                        <a href="{{ route('admin.ripartizioni-spesa.edit', $ripartizione->id) }}" class="btn btn-primary btn-sm">
                            <i class="fas fa-edit"></i> Modifica
                        </a>
                        @endcan
                        <a href="{{ route('admin.ripartizioni-spesa.index') }}" class="btn btn-default btn-sm">
                            <i class="fas fa-arrow-left"></i> Torna all'elenco
                        </a>
                    </div>
                </div>

                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="info-box">
                                <span class="info-box-icon bg-info"><i class="fas fa-receipt"></i></span>
                                <div class="info-box-content">
                                    <span class="info-box-text">Voce di Spesa</span>
                                    <span class="info-box-number">{{ $ripartizione->voceSpesa->codice }} - {{ $ripartizione->voceSpesa->descrizione }}</span>
                                </div>
                            </div>
                        </div>

                        <div class="col-md-6">
                            <div class="info-box">
                                <span class="info-box-icon bg-success"><i class="fas fa-building"></i></span>
                                <div class="info-box-content">
                                    <span class="info-box-text">Stabile</span>
                                    <span class="info-box-number">{{ $ripartizione->stabile->denominazione }}</span>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-4">
                            <div class="info-box">
                                <span class="info-box-icon bg-warning"><i class="fas fa-table"></i></span>
                                <div class="info-box-content">
                                    <span class="info-box-text">Tabella Millesimale</span>
                                    <span class="info-box-number">{{ $ripartizione->tabellaMillesimale->descrizione }}</span>
                                </div>
                            </div>
                        </div>

                        <div class="col-md-4">
                            <div class="info-box">
                                <span class="info-box-icon bg-primary"><i class="fas fa-euro-sign"></i></span>
                                <div class="info-box-content">
                                    <span class="info-box-text">Importo Totale</span>
                                    <span class="info-box-number">€ {{ number_format($ripartizione->importo_totale, 2, ',', '.') }}</span>
                                </div>
                            </div>
                        </div>

                        <div class="col-md-4">
                            <div class="info-box">
                                <span class="info-box-icon bg-{{ $ripartizione->stato == 'definitiva' ? 'success' : ($ripartizione->stato == 'annullata' ? 'danger' : 'secondary') }}">
                                    <i class="fas fa-{{ $ripartizione->stato == 'definitiva' ? 'check' : ($ripartizione->stato == 'annullata' ? 'times' : 'edit') }}"></i>
                                </span>
                                <div class="info-box-content">
                                    <span class="info-box-text">Stato</span>
                                    <span class="info-box-number">{{ ucfirst($ripartizione->stato) }}</span>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label>Data Ripartizione</label>
                                <p class="form-control-plaintext">{{ $ripartizione->data_ripartizione->format('d/m/Y') }}</p>
                            </div>
                        </div>

                        <div class="col-md-6">
                            <div class="form-group">
                                <label>Anno Competenza</label>
                                <p class="form-control-plaintext">{{ $ripartizione->anno_competenza }}</p>
                            </div>
                        </div>
                    </div>

                    @if($ripartizione->note)
                    <div class="row">
                        <div class="col-12">
                            <div class="form-group">
                                <label>Note</label>
                                <p class="form-control-plaintext">{{ $ripartizione->note }}</p>
                            </div>
                        </div>
                    </div>
                    @endif

                    <div class="row">
                        <div class="col-12">
                            <div class="form-group">
                                <label>Audit</label>
                                <div class="table-responsive">
                                    <table class="table table-sm">
                                        <tr>
                                            <th>Creato il:</th>
                                            <td>{{ $ripartizione->created_at->format('d/m/Y H:i:s') }}</td>
                                        </tr>
                                        <tr>
                                            <th>Ultima modifica:</th>
                                            <td>{{ $ripartizione->updated_at->format('d/m/Y H:i:s') }}</td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Dettagli Ripartizione -->
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title">Dettagli Ripartizione per Unità Immobiliare</h3>
                    <div class="card-tools">
                        @if($ripartizione->stato == 'bozza')
                        <button type="button" class="btn btn-success btn-sm" id="btn-calcola-ripartizione">
                            <i class="fas fa-calculator"></i> Calcola Ripartizione
                        </button>
                        @endif
                        <button type="button" class="btn btn-info btn-sm" data-toggle="modal" data-target="#modal-riepilogo">
                            <i class="fas fa-chart-pie"></i> Riepilogo
                        </button>
                    </div>
                </div>

                <div class="card-body">
                    @if($ripartizione->dettagli->count() > 0)
                    <div class="table-responsive">
                        <table class="table table-bordered table-striped" id="dettagli-table">
                            <thead>
                                <tr>
                                    <th>Unità Immobiliare</th>
                                    <th>Proprietario</th>
                                    <th>Millesimi</th>
                                    <th>Importo</th>
                                    <th>Stato</th>
                                    <th>Pagato</th>
                                    <th>Data Pagamento</th>
                                    <th>Note</th>
                                    <th>Azioni</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($ripartizione->dettagli as $dettaglio)
                                <tr>
                                    <td>{{ $dettaglio->unitaImmobiliare->denominazione }}</td>
                                    <td>{{ $dettaglio->unitaImmobiliare->proprietario ?? 'N/A' }}</td>
                                    <td>{{ $dettaglio->millesimi }}</td>
                                    <td>€ {{ number_format($dettaglio->importo, 2, ',', '.') }}</td>
                                    <td>
                                        <span class="badge badge-{{ $dettaglio->stato == 'pagato' ? 'success' : ($dettaglio->stato == 'sospeso' ? 'warning' : 'info') }}">
                                            {{ ucfirst($dettaglio->stato) }}
                                        </span>
                                    </td>
                                    <td>€ {{ number_format($dettaglio->importo_pagato, 2, ',', '.') }}</td>
                                    <td>{{ $dettaglio->data_pagamento ? $dettaglio->data_pagamento->format('d/m/Y') : '-' }}</td>
                                    <td>{{ $dettaglio->note ?? '-' }}</td>
                                    <td>
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-sm btn-primary" onclick="editDettaglio({{ $dettaglio->id }})">
                                                <i class="fas fa-edit"></i>
                                            </button>
                                            @if($dettaglio->stato != 'pagato')
                                            <button type="button" class="btn btn-sm btn-success" onclick="marcaPagato({{ $dettaglio->id }})">
                                                <i class="fas fa-check"></i>
                                            </button>
                                            @endif
                                        </div>
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                            <tfoot>
                                <tr class="table-info">
                                    <th colspan="2">Totale</th>
                                    <th>{{ $ripartizione->dettagli->sum('millesimi') }}</th>
                                    <th>€ {{ number_format($ripartizione->dettagli->sum('importo'), 2, ',', '.') }}</th>
                                    <th>-</th>
                                    <th>€ {{ number_format($ripartizione->dettagli->sum('importo_pagato'), 2, ',', '.') }}</th>
                                    <th colspan="3">-</th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                    @else
                    <div class="alert alert-info">
                        <i class="fas fa-info-circle"></i> Nessun dettaglio di ripartizione trovato. 
                        @if($ripartizione->stato == 'bozza')
                        Clicca su "Calcola Ripartizione" per generare i dettagli.
                        @endif
                    </div>
                    @endif
                </div>
            </div>
        </div>
    </div>

    <!-- Piani di Rateizzazione -->
    @if($ripartizione->pianiRateizzazione->count() > 0)
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title">Piani di Rateizzazione</h3>
                    <div class="card-tools">
                        <a href="{{ route('admin.piani-rateizzazione.create', ['ripartizione_id' => $ripartizione->id]) }}" class="btn btn-primary btn-sm">
                            <i class="fas fa-plus"></i> Nuovo Piano
                        </a>
                    </div>
                </div>

                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-bordered table-striped">
                            <thead>
                                <tr>
                                    <th>Denominazione</th>
                                    <th>Numero Rate</th>
                                    <th>Importo Totale</th>
                                    <th>Stato</th>
                                    <th>Data Inizio</th>
                                    <th>Azioni</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($ripartizione->pianiRateizzazione as $piano)
                                <tr>
                                    <td>{{ $piano->denominazione }}</td>
                                    <td>{{ $piano->numero_rate }}</td>
                                    <td>€ {{ number_format($piano->importo_totale, 2, ',', '.') }}</td>
                                    <td>
                                        <span class="badge badge-{{ $piano->stato == 'attivo' ? 'success' : ($piano->stato == 'completato' ? 'primary' : 'secondary') }}">
                                            {{ ucfirst($piano->stato) }}
                                        </span>
                                    </td>
                                    <td>{{ $piano->data_inizio->format('d/m/Y') }}</td>
                                    <td>
                                        <div class="btn-group">
                                            <a href="{{ route('admin.piani-rateizzazione.show', $piano->id) }}" class="btn btn-sm btn-info">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                            <a href="{{ route('admin.piani-rateizzazione.edit', $piano->id) }}" class="btn btn-sm btn-primary">
                                                <i class="fas fa-edit"></i>
                                            </a>
                                        </div>
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif
</div>

<!-- Modal Riepilogo -->
<div class="modal fade" id="modal-riepilogo" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Riepilogo Ripartizione</h4>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-6">
                        <canvas id="chart-stati"></canvas>
                    </div>
                    <div class="col-md-6">
                        <canvas id="chart-importi"></canvas>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script>
$(document).ready(function() {
    // Initialize DataTable
    $('#dettagli-table').DataTable({
        responsive: true,
        lengthChange: false,
        autoWidth: false,
        language: {
            url: '//cdn.datatables.net/plug-ins/1.10.25/i18n/Italian.json'
        }
    });

    // Calcola ripartizione
    $('#btn-calcola-ripartizione').click(function() {
        if (confirm('Sei sicuro di voler calcolare la ripartizione? Eventuali dettagli esistenti verranno sovrascritti.')) {
            $.ajax({
                url: '{{ route("admin.ripartizioni-spesa.calcola", $ripartizione->id) }}',
                type: 'POST',
                data: {
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    if (response.success) {
                        location.reload();
                    } else {
                        alert('Errore nel calcolo della ripartizione: ' + response.message);
                    }
                },
                error: function() {
                    alert('Errore nel calcolo della ripartizione');
                }
            });
        }
    });

    // Charts for modal
    $('#modal-riepilogo').on('shown.bs.modal', function() {
        // Chart Stati
        var ctxStati = document.getElementById('chart-stati').getContext('2d');
        new Chart(ctxStati, {
            type: 'doughnut',
            data: {
                labels: ['Da Pagare', 'Pagato', 'Sospeso'],
                datasets: [{
                    data: [
                        {{ $ripartizione->dettagli->where('stato', 'da_pagare')->count() }},
                        {{ $ripartizione->dettagli->where('stato', 'pagato')->count() }},
                        {{ $ripartizione->dettagli->where('stato', 'sospeso')->count() }}
                    ],
                    backgroundColor: ['#17a2b8', '#28a745', '#ffc107']
                }]
            },
            options: {
                responsive: true,
                plugins: {
                    title: {
                        display: true,
                        text: 'Stati Pagamento'
                    }
                }
            }
        });

        // Chart Importi
        var ctxImporti = document.getElementById('chart-importi').getContext('2d');
        new Chart(ctxImporti, {
            type: 'bar',
            data: {
                labels: ['Totale', 'Pagato', 'Residuo'],
                datasets: [{
                    label: 'Importi (€)',
                    data: [
                        {{ $ripartizione->dettagli->sum('importo') }},
                        {{ $ripartizione->dettagli->sum('importo_pagato') }},
                        {{ $ripartizione->dettagli->sum('importo') - $ripartizione->dettagli->sum('importo_pagato') }}
                    ],
                    backgroundColor: ['#007bff', '#28a745', '#dc3545']
                }]
            },
            options: {
                responsive: true,
                plugins: {
                    title: {
                        display: true,
                        text: 'Analisi Importi'
                    }
                }
            }
        });
    });
});

function editDettaglio(id) {
    // Implementa modifica dettaglio
    console.log('Edit dettaglio:', id);
}

function marcaPagato(id) {
    if (confirm('Sei sicuro di voler marcare questo dettaglio come pagato?')) {
        $.ajax({
            url: '{{ route("admin.ripartizioni-spesa.marca-pagato", ":id") }}'.replace(':id', id),
            type: 'POST',
            data: {
                _token: '{{ csrf_token() }}'
            },
            success: function(response) {
                if (response.success) {
                    location.reload();
                } else {
                    alert('Errore: ' + response.message);
                }
            },
            error: function() {
                alert('Errore nella marcatura del pagamento');
            }
        });
    }
}
</script>
@endsection