@extends('layouts.admin')
@section('title', 'Preview Pembayaran Hauling')
@section('page_title', 'Preview Pembayaran Hauling')
@section('breadcrumb')
    <li><a href="{{ route('admin.closing.index') }}">Closing</a></li>
    <li class="active">Preview #{{ $hauling->id_hauling }}</li>
@endsection
@section('content')

<style>
    .preview-box {
        border: 1px solid #ddd;
        border-radius: 6px;
        margin-bottom: 16px;
    }
    .preview-header {
        padding: 10px 16px;
        font-size: 13px;
        font-weight: 600;
    }
    .preview-body {
        padding: 14px 16px;
        background: #fff;
    }
    .section-hauling { border-left: 3px solid #3498db; }
    .section-hauling .preview-header { background: #f0f7ff; color: #2471a3; }
    .section-supir { border-left: 3px solid #27ae60; }
    .section-supir .preview-header { background: #f0fff5; color: #1e8449; }
    .section-fuel { border-left: 3px solid #e67e22; }
    .section-fuel .preview-header { background: #fff8f0; color: #d35400; }
    .total-box {
        background: #1c2b3a;
        color: #fff;
        border-radius: 6px;
        padding: 20px 24px;
        text-align: center;
    }
    .total-amount { font-size: 34px; font-weight: 800; }
    .tbl-sm td, .tbl-sm th { font-size: 13px; padding: 5px 10px; vertical-align: middle; }
    .text-danger { color: #e74c3c !important; }
    .badge { display: inline-block; padding: 3px 7px; font-size: 11px; font-weight: 600; border-radius: 4px; }
    .badge-warning { background: #f0ad4e; color: #fff; }
    .badge-primary { background: #3498db; color: #fff; }
    .badge-secondary { background: #95a5a6; color: #fff; }
</style>

{{-- RINGKASAN TRIP --}}
<div class="row mb-3">
    <div class="col-md-12">
        <div style="background:#f8f9fa; border:1px solid #dee2e6; border-radius:6px; padding:12px 16px;">
            <div style="display:flex; gap:24px; font-size:13px;">
                <div>
                    <span style="color:#888;">Unit</span>
                    <br>
                    <strong>{{ $hauling->checkout->kendaraan->no_lambung ?? '—' }}</strong>
                </div>
                <div>
                    <span style="color:#888;">Plat</span>
                    <br>
                    <strong>{{ $hauling->checkout->kendaraan->plat_nomor ?? '—' }}</strong>
                </div>
                <div>
                    <span style="color:#888;">Tonase</span>
                    <br>
                    <strong>{{ number_format($hauling->net_weight, 2, ',', '.') }} ton</strong>
                </div>
                <div>
                    <span style="color:#888;">Lokasi</span>
                    <br>
                    @if($hauling->lokasi_muat)
                        <span class="badge badge-info">{{ $hauling->lokasi_muat }}</span>
                    @else
                        <span class="text-muted">—</span>
                    @endif
                </div>
                <div>
                    <span style="color:#888;">Tipe</span>
                    <br>
                    <strong>{{ $hauling->checkout->kendaraan->jenisKendaraan->nama_jenis_kendaraan ?? '—' }}</strong>
                </div>
            </div>
            <hr>
            <div>
                <span style="color:#888;">Hauling Kiba</span> :
                <code>{{ $hauling->nomor_hauling_kiba ?? $hauling->hauling_number ?? '—' }}</code>
            </div>
            <div>
                <span style="color:#888;">Hauling Mitra</span> :
                <code>{{ $hauling->hauling_recapnum ?? $hauling->hauling_number ?? '—' }}</code>
            </div>
            <div class="mt-1">
                <span style="color:#888;">Supir</span> :
                <strong>{{ $hauling->checkout->supir->nama_supir ?? '—' }}</strong>
            </div>
            <div class="mt-1">
                <span style="color:#888;">Checkout</span>
                 {{ $hauling->checkout->checkoutAt?->format('d/m/Y') }}
            </div>
        </div>
    </div>
</div>

{{-- DETAIL PENGISIAN FUEL --}}
@php
    $fuelFills = $hauling->pengisiaanFuel;
    $hargaFuelStd = (float) ($hauling->harga_fuel ?? 0);
    $totalFuelLiter = $fuelFills->sum('jumlah_liter');
    $totalFuelRupiah = $fuelFills->sum(fn($f) => (
        (float) $f->jumlah_liter * (
            !$f->is_rest_area && $f->harga_per_liter !== null
                ? (float) $f->harga_per_liter
                : $hargaFuelStd
        )
    ));
@endphp
@if($fuelFills->count() > 0)
<div class="row mb-3">
    <div class="col-md-12">
        <div class="preview-box section-fuel">
            <div class="preview-header">
                <i class="fa fa-tint"></i> Detail Pengisian Fuel
                <span class="badge badge-warning" style="float:right; font-size:11px;">{{ $fuelFills->count() }}x Pengisian</span>
            </div>
            <div class="preview-body" style="padding:0;">
                <div class="table-responsive">
                    <table class="table table-sm tbl-sm mb-0">
                        <thead style="background:#fff8f0;">
                            <tr>
                                <th class="text-center" style="width:40px;">#</th>
                                <th>Tanggal</th>
                                <th>Jam</th>
                                <th class="text-right">Liter</th>
                                <th class="text-right">Harga/L</th>
                                <th class="text-right">Total (Rp)</th>
                                <th>Tempat</th>
                                <th>Lokasi</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($fuelFills as $i => $f)
                            <tr>
                                <td class="text-center text-muted">{{ $i + 1 }}</td>
                                <td>{{ $f->tanggal_isi?->format('d/m/Y') ?? '-' }}</td>
                                <td>{{ $f->jam_isi?->format('H:i') ?? '-' }}</td>
                                <td class="text-right"><strong>{{ number_format((float)$f->jumlah_liter, 2, ',', '.') }} L</strong></td>
                                <td class="text-right">Rp {{ number_format((float)($f->is_rest_area ? $hargaFuelStd : ($f->harga_per_liter ?? $hargaFuelStd)), 0, ',', '.') }}</td>
                                <td class="text-right">Rp {{ number_format((float)$f->jumlah_liter * ($f->is_rest_area ? $hargaFuelStd : ($f->harga_per_liter ?? $hargaFuelStd)), 0, ',', '.') }}</td>
                                <td>
                                    @if($f->is_rest_area)
                                        <span class="badge badge-primary" style="font-size:10px;">Rest Area</span>
                                    @else
                                        <span class="badge badge-secondary" style="font-size:10px;">Luar</span>
                                    @endif
                                </td>
                                <td>
                                    @if($f->lokasi)
                                        <strong>{{ $f->lokasi->nama }}</strong>
                                        <br><small class="text-muted">{{ $f->lokasi->alamat }}</small>
                                    @else
                                        <span class="text-muted">—</span>
                                    @endif
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                        <tfoot style="background:#fef3e2; font-weight:700;">
                            <tr>
                                <td colspan="3" class="text-right">TOTAL</td>
                                <td class="text-right text-danger">{{ number_format($totalFuelLiter, 2, ',', '.') }} L</td>
                                <td colspan="2" class="text-right text-danger">
                                    Rp {{ number_format($totalFuelRupiah, 0, ',', '.') }}
                                </td>
                                <td></td>
                                <td></td>
                            </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endif

<div class="row">
    {{-- ONGKOS SOPIR --}}
    <div class="col-md-6">
        <div class="preview-box section-supir">
            <div class="preview-header"><i class="fa fa-money"></i> Ongkos Supir</div>
            <div class="preview-body">
                <table class="tbl-sm w-100 mb-0">
                    <tr>
                        <td style="width:55%;">Total Tonase</td>
                        <td class="text-right"><strong>{{ number_format($hauling->net_weight, 2, ',', '.') }} ton</strong></td>
                    </tr>
                    @if(($calc['bonus_per_ton'] ?? 0) > 0)
                    <tr>
                        <td>Minimum Muatan</td>
                        <td class="text-right">{{ number_format($calc['minimum_muatan'], 2, ',', '.') }} ton</td>
                    </tr>
                    <tr>
                        <td>Kurang/Lebih Tonase</td>
                        <td class="text-right text-{{ ($calc['kurang_lebih_ton'] ?? 0) >= 0 ? 'success' : 'danger' }}">
                            <strong>{{ ($calc['kurang_lebih_ton'] ?? 0) >= 0 ? '+' : '' }}{{ number_format($calc['kurang_lebih_ton'], 2, ',', '.') }} ton</strong>
                        </td>
                    </tr>
                    @endif
                    <tr>
                        <td>Rate per Ton</td>
                        <td class="text-right">Rp {{ number_format($calc['rate_per_ton'], 0, ',', '.') }}/ton</td>
                    </tr>
                    @if(($calc['bonus_per_ton'] ?? 0) > 0)
                    <tr>
                        <td>Bonus/Lebih Tonase</td>
                        <td class="text-right text-{{ ($calc['kurang_lebih_rupiah'] ?? 0) >= 0 ? 'success' : 'danger' }}">
                            <strong>
                                {{ ($calc['kurang_lebih_rupiah'] ?? 0) >= 0 ? '+' : '' }}Rp {{ number_format($calc['kurang_lebih_rupiah'], 0, ',', '.') }}
                            </strong>
                            @if(($calc['kurang_lebih_ton'] ?? 0) >= 0)
                                <span class="badge badge-success" style="font-size:10px;">BONUS</span>
                            @else
                                <span class="badge badge-danger" style="font-size:10px;">POTONGAN</span>
                            @endif
                        </td>
                    </tr>
                    @endif
                    <tr style="background:#e8f8f0; font-weight:700;">
                        <td>Total Ongkos Supir</td>
                        <td class="text-right" style="font-size:18px; color:#1e8449;">
                            Rp {{ number_format($calc['total_ongkos'], 0, ',', '.') }}
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>

    {{-- UANG FUEL --}}
    <div class="col-md-6">
        <div class="preview-box section-fuel">
            <div class="preview-header"><i class="fa fa-tint"></i> Uang Fuel</div>
            <div class="preview-body">
                <table class="tbl-sm w-100 mb-0">
                    <tr>
                        <td style="width:55%;">Jatah Fuel</td>
                        <td class="text-right">{{ number_format($calc['jatah_fuel'] ?? 0, 2, ',', '.') }} L</td>
                    </tr>
                    <tr>
                        <td>Jatah Fuel (Rupiah)</td>
                        <td class="text-right">Rp {{ number_format($calc['jatah_fuel_rp'] ?? 0, 0, ',', '.') }}</td>
                    </tr>
                    <tr>
                        <td>Pengisian Aktual</td>
                        <td class="text-right">{{ number_format($calc['actual_fuel_liter'] ?? 0, 2, ',', '.') }} L</td>
                    </tr>
                    <tr>
                        <td>Pengisian Aktual (Rupiah)</td>
                        <td class="text-right">Rp {{ number_format($calc['actual_fuel_rp'] ?? 0, 0, ',', '.') }}</td>
                    </tr>
                    <tr>
                        <td>Selisih Liter</td>
                        <td class="text-right text-{{ ($calc['bonus_fuel'] ?? 0) >= 0 ? 'success' : 'danger' }}">
                            {{ number_format($calc['bonus_fuel'] ?? 0, 2, ',', '.') }} L
                        </td>
                    </tr>
                    <tr>
                        <td>Harga Fuel Standar</td>
                        <td class="text-right">Rp {{ number_format($hargaFuelStd, 0, ',', '.') }}/L</td>
                    </tr>
                    <tr style="background:#f4ecf7; font-weight:700;">
                        @if(($calc['bonus_fuel_rp'] ?? 0) >= 0)
                            <td>Bonus Fuel</td>
                        @else
                            <td>Potongan Fuel</td>
                        @endif
                        <td class="text-right" style="font-size:18px; color:#7d3c98;">
                            {{ ($calc['bonus_fuel_rp'] ?? 0) >= 0 ? '+' : '-' }}
                            Rp {{ number_format(abs($calc['bonus_fuel_rp'] ?? 0), 0, ',', '.') }}
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</div>

{{-- TOTAL --}}
<div class="row mt-2">
    <div class="col-12">
        <div class="total-box">
            <div style="font-size:14px; text-transform:uppercase; letter-spacing:0.5px; opacity:0.8;">Total Yang Dibayarkan</div>
            <div class="mt-1" style="font-size:14px; opacity:0.85;">
                Ongkos Supir <strong>Rp {{ number_format($calc['total_ongkos'], 0, ',', '.') }}</strong>
                @if(($calc['bonus_fuel_rp'] ?? 0) != 0)
                    &nbsp;+&nbsp;
                    @if(($calc['bonus_fuel_rp'] ?? 0) >= 0)
                        <span style="color:#58d68d;">Bonus Fuel</span>
                    @else
                        <span style="color:#f1948a;">Potongan Fuel</span>
                    @endif
                    <strong>Rp {{ number_format(abs($calc['bonus_fuel_rp'] ?? 0), 0, ',', '.') }}</strong>
                @endif
            </div>
            <div class="total-amount mt-2">
                Rp {{ number_format($calc['total_dibayar'], 0, ',', '.') }}
            </div>
        </div>
    </div>
</div>

{{-- ACTIONS --}}
<div class="row mt-3">
    <div class="col-12 text-center">
        <a href="{{ route('admin.closing.print-hauling-slip', $hauling) }}" target="_blank"
           class="btn btn-outline-dark btn-lg" style="display:inline-block; margin-right:8px;">
            <i class="fa fa-print"></i> Lihat Struk
        </a>
        <form method="POST" action="{{ route('admin.closing.pay-hauling', $hauling) }}" id="form_bayar" style="display:inline-block;">
            @csrf
            <button type="button" class="btn btn-success btn-lg" id="btn_bayar">
                <i class="fa fa-check-circle"></i> Konfirmasi Bayar
            </button>
        </form>
        <a href="{{ route('admin.closing.index') }}" class="btn btn-secondary btn-lg ml-2">
            <i class="fa fa-arrow-left"></i> Kembali
        </a>
    </div>
</div>

@endsection

@push('js')
<script>
$(function() {
    $('#btn_bayar').on('click', function() {
        var totalBayar = '{{ number_format($calc['total_dibayar'], 0, ',', '.') }}';
        var supir = '{{ $hauling->checkout->supir->nama_supir ?? "—" }}';
        var kendaraan = '{{ $hauling->checkout->kendaraan->plat_nomor ?? "—" }}';

        Swal.fire({
            title: 'Konfirmasi Pembayaran?',
            html: '<strong>Supir:</strong> ' + supir + '<br>' +
                  '<strong>Kendaraan:</strong> ' + kendaraan + '<br>' +
                  '<strong>Total Bayar:</strong> Rp ' + totalBayar,
            icon: 'question',
            showCancelButton: true,
            confirmButtonText: 'Ya, Bayar',
            cancelButtonText: 'Batal',
            confirmButtonColor: '#28a745',
            cancelButtonColor: '#6c757d',
            reverseButtons: true
        }).then(function(result) {
            if (result.isConfirmed) {
                $('#form_bayar').submit();
            }
        });
    });
});
</script>
@endpush