@extends('layouts.app')
@section('title', 'Perhitungan & Pembagian SHU')

@section('content')
<div class="row mb-4">
    <div class="col-12">
        <div class="card shadow border-0">
            <div class="card-header bg-primary text-white fw-bold">
                <i class="bi bi-calculator"></i> Parameter Pengalokasian SHU Koperasi
            </div>
            <div class="card-body">
                <form method="GET" action="{{ url('admin/shu') }}" class="row g-3 align-items-end">
                    <div class="col-md-3">
                        <label class="form-label fw-semibold">Tahun Buku</label>
                        <select name="tahun" class="form-select">
                            @for($y = date('Y'); $y >= date('Y') - 5; $y--)
                                <option value="{{ $y }}" {{ $tahun == $y ? 'selected' : '' }}>Tahun {{ $y }}</option>
                            @endfor
                        </select>
                    </div>
                    <div class="col-md-3">
                        <label class="form-label fw-semibold">Total SHU Dibagikan (Rp)</label>
                        <input type="number" name="total_shu" class="form-control" value="{{ $totalShu }}" min="0" step="100000" required>
                    </div>
                    <div class="col-md-2">
                        <label class="form-label fw-semibold">Jasa Simpanan (%)</label>
                        <input type="number" name="persen_simpanan" class="form-control" value="{{ $persenSimpanan }}" min="0" max="100" required>
                    </div>
                    <div class="col-md-2">
                        <label class="form-label fw-semibold">Jasa Pinjaman (%)</label>
                        <input type="number" name="persen_pinjaman" class="form-control" value="{{ $persenPinjaman }}" min="0" max="100" required>
                    </div>
                    <div class="col-md-2">
                        <button type="submit" class="btn btn-success w-100"><i class="bi bi-cpu"></i> Hitung SHU</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- Summary Card Pool -->
<div class="row g-3 mb-4">
    <div class="col-md-4">
        <div class="card border-0 shadow-sm bg-primary text-white">
            <div class="card-body">
                <div class="small opacity-75">Pool SHU Jasa Simpanan ({{ $persenSimpanan }}%)</div>
                <h4 class="fw-bold mb-0">Rp {{ number_format($alokasiShuSimpanan, 0, ',', '.') }}</h4>
                <div class="small opacity-75 mt-1">Total Simpanan: Rp {{ number_format($grandTotalSimpanan, 0, ',', '.') }}</div>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="card border-0 shadow-sm bg-success text-white">
            <div class="card-body">
                <div class="small opacity-75">Pool SHU Jasa Pinjaman ({{ $persenPinjaman }}%)</div>
                <h4 class="fw-bold mb-0">Rp {{ number_format($alokasiShuPinjaman, 0, ',', '.') }}</h4>
                <div class="small opacity-75 mt-1">Total Bunga Masuk: Rp {{ number_format($grandTotalBunga, 0, ',', '.') }}</div>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="card border-0 shadow-sm bg-dark text-white">
            <div class="card-body">
                <div class="small opacity-75">Total SHU Tahun {{ $tahun }}</div>
                <h4 class="fw-bold mb-0">Rp {{ number_format($totalShu, 0, ',', '.') }}</h4>
                <div class="small opacity-75 mt-1">Dibagikan ke {{ count($shuData) }} Anggota</div>
            </div>
        </div>
    </div>
</div>

<!-- Table Output -->
<div class="card shadow border-0">
    <div class="card-header bg-white fw-bold d-flex justify-content-between align-items-center">
        <span><i class="bi bi-people me-1"></i> Rincian Pembagian SHU Anggota</span>
        <a href="{{ url('admin/shu/cetak-pdf?tahun='.$tahun.'&total_shu='.$totalShu.'&persen_simpanan='.$persenSimpanan.'&persen_pinjaman='.$persenPinjaman) }}" target="_blank" class="btn btn-outline-danger btn-sm no-print"><i class="bi bi-file-earmark-pdf-fill"></i> Cetak PDF</a>
    </div>
    <div class="card-body">
        <div class="table-responsive">
            <table class="table table-hover align-middle data-table" id="shuTable" style="width: 100%;">
                <thead class="table-light">
                    <tr>
                        <th style="width: 5%;">No</th>
                        <th style="width: 25%;">Anggota</th>
                        <th class="text-end" style="width: 14%;">Simpanan (Rp)</th>
                        <th class="text-end" style="width: 14%;">SHU Simpanan</th>
                        <th class="text-end" style="width: 14%;">Bunga Dibayar</th>
                        <th class="text-end" style="width: 14%;">SHU Pinjaman</th>
                        <th class="text-end fw-bold" style="width: 14%;">Total SHU Diterima</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($shuData as $idx => $d)
                    <tr>
                        <td>{{ $idx + 1 }}</td>
                        <td>
                            <div class="fw-bold">{{ $d['anggota']->nama }}</div>
                            <small class="text-muted">{{ $d['anggota']->no_anggota }}</small>
                        </td>
                        <td class="text-end">Rp {{ number_format($d['simpanan'], 0, ',', '.') }}</td>
                        <td class="text-end text-primary fw-semibold">Rp {{ number_format($d['shu_simpanan'], 0, ',', '.') }}</td>
                        <td class="text-end">Rp {{ number_format($d['bunga'], 0, ',', '.') }}</td>
                        <td class="text-end text-success fw-semibold">Rp {{ number_format($d['shu_pinjaman'], 0, ',', '.') }}</td>
                        <td class="text-end fw-bold text-dark bg-light">Rp {{ number_format($d['total_shu'], 0, ',', '.') }}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
    $(document).ready(function() {
        if (!$.fn.DataTable.isDataTable('#shuTable')) {
            $('#shuTable').DataTable({
                ordering: false,
                language: {
                    url: '//cdn.datatables.net/plug-ins/1.13.7/i18n/id.json'
                }
            });
        }
    });
</script>
@endpush