@extends('layouts.app')

@section('title', 'Transaksi Kas Musholla KPP Pratama Solok')

@push('style')
    <!-- CSS Libraries -->
    <link rel="stylesheet" href="{{ asset('library/bootstrap-daterangepicker/daterangepicker.css') }}">
    <link rel="stylesheet" href="{{ asset('library/bootstrap-colorpicker/dist/css/bootstrap-colorpicker.min.css') }}">
    <link rel="stylesheet" href="{{ asset('library/select2/dist/css/select2.min.css') }}">
    <link rel="stylesheet" href="{{ asset('library/selectric/public/selectric.css') }}">
    <link rel="stylesheet" href="{{ asset('library/bootstrap-timepicker/css/bootstrap-timepicker.min.css') }}">
    <link rel="stylesheet" href="{{ asset('library/bootstrap-tagsinput/dist/bootstrap-tagsinput.css') }}">
    <link rel="stylesheet" href="https://cdn.datatables.net/2.0.8/css/dataTables.dataTables.css">
    <link rel="stylesheet" href="https://cdn.datatables.net/buttons/3.0.2/css/buttons.dataTables.css">
@endpush

@section('main')
    @php
        $monthsId = [
            1 => 'Januari',
            2 => 'Februari',
            3 => 'Maret',
            4 => 'April',
            5 => 'Mei',
            6 => 'Juni',
            7 => 'Juli',
            8 => 'Agustus',
            9 => 'September',
            10 => 'Oktober',
            11 => 'November',
            12 => 'Desember'
        ];
    @endphp
    <div class="main-content">
        <section class="section">
            <div class="section-header">
                <h1>Kas Musholla KPP Pratama Solok</h1>
            </div>

            <div class="section-body">
                <h2 class="section-title">Laporan Bulanan</h2>
                <div class="row">
                    <div class="col-12 col-md-12 col-lg-12">
                        <div class="card">
                            <div class="card-header">
                                <h4>Laporan Tahun {{ $tahun }} Bulan {{ $monthsId[$bulan] }}</h4>
                            </div>
                            <div class="card-body">
                                <div class="row" >
                                    <div class="col-md-8" style="background-color: #0b97c4 !important;">
                                        <form action="#" method="POST">
                                            <div class="row">
                                                <div class="col-md-2 form-group">
                                                    <label for="year">Pilih Tahun</label>
                                                    <select class="form-control" id="year" name="year">
                                                        @for ($year = now()->year; $year >= now()->year - 3; $year--)
                                                            <option value="{{ $year }}" @if($year == $tahun) selected @endif>{{ $year }}</option>
                                                        @endfor
                                                    </select>
                                                </div>
                                                <div class="col-md-2 form-group">
                                                    <label for="month">Pilih Bulan</label>
                                                    <select class="form-control" id="month" name="month">
                                                        @for ($month = 1; $month <= 12; $month++)
                                                            <option value="{{ $month }}" @if($month == $bulan) selected @endif>{{ $monthsId[$month] }}</option>
                                                        @endfor
                                                    </select>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-8 pb-3" style="background-color: #0b97c4 !important;">
                                        <a href="{{ url(route('kas-musholla.laporan.cetak', [date('Y'),date('n')])) }}" class="btn btn-success btn-lg">
                                            Cetak Laporan
                                        </a>
                                    </div>
                                </div>
                                <div class="row" >
                                    <div class="col-md-8" style="background-color: #0b97c4 !important;">
                                        <table class="table table-striped table-light">
                                            <thead>
                                                <tr>
                                                    <th scope="col">Tanggal</th>
                                                    <th scope="col">Keterangan</th>
                                                    <th scope="col"></th>
                                                    <th scope="col"></th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td>1/{{$bulan}}/{{$tahun}}</td>
                                                    <td>
                                                        @php
                                                            $currentDate = new DateTime("$tahun-$bulan-01");
                                                            $currentDate->sub(new DateInterval('P1M'));
                                                            $previousMonth = $currentDate->format('n');
                                                            $previousYear = $currentDate->format('Y');
                                                        @endphp
                                                        Saldo Kas {{ $monthsId[$previousMonth] }} {{ $previousYear }}
                                                    </td>
                                                    <td></td>
                                                    <td style="border-bottom: 1px solid black; text-align: right;"><b>{{ 'Rp ' . number_format($awal, 2, ',', '.') }}</b></td>
                                                </tr>
                                                <tr>
                                                    <td></td>
                                                    <td><b>Pemasukan</b></td>
                                                    <td></td>
                                                    <td></td>
                                                </tr>
                                                @php
                                                    $totalPemasukan = 0;
                                                    $totalPengeluaran = 0;
                                                @endphp
                                            @foreach($pemasukan as $val)
                                                @php
                                                    $date = new DateTime($val->tanggal);
                                                    $formattedDate = $date->format('d/m/Y');

                                                    $totalPemasukan += $val->nominal_debet;
                                                @endphp
                                                <tr>
                                                    <td>{{ $formattedDate }}</td>
                                                    <td>{{ $val->keterangan }}</td>
                                                    <td></td>
                                                    @if($loop->last)
                                                        <td style="text-align: right;border-bottom: 1px solid black;">{{ 'Rp ' . number_format($val->nominal_debet, 2, ',', '.') }}</td>
                                                    @else
                                                        <td style="text-align: right;">{{ 'Rp ' . number_format($val->nominal_debet, 2, ',', '.') }}</td>
                                                    @endif
                                                </tr>
                                            @endforeach
                                                <tr>
                                                    <td></td>
                                                    <td></td>
                                                    <td></td>
                                                    <td style=" text-align: right;border-top: 1px solid black;"><b>{{ 'Rp ' . number_format($totalPemasukan, 2, ',', '.') }}</b></td>
                                                </tr>
                                                <tr>
                                                    <td></td>
                                                    <td><b>Pengeluaran</b></td>
                                                    <td></td>
                                                    <td></td>
                                                </tr>
                                            @foreach($pengeluaran as $val)
                                                @php
                                                    $date = new DateTime($val->tanggal);
                                                    $formattedDate = $date->format('d/m/Y');

                                                    $totalPengeluaran += $val->nominal_kredit;
                                                @endphp
                                                <tr>
                                                    <td>{{ $formattedDate }}</td>
                                                    <td>{{ $val->keterangan }}</td>
                                                    @if($loop->last)
                                                        <td style="text-align: right;border-bottom: 1px solid black;">{{ 'Rp ' . number_format($val->nominal_kredit, 2, ',', '.') }}</td>
                                                    @else
                                                        <td style="text-align: right;">{{ 'Rp ' . number_format($val->nominal_kredit, 2, ',', '.') }}</td>
                                                    @endif
                                                    <td></td>
                                                </tr>
                                            @endforeach
                                                <tr>
                                                    <td></td>
                                                    <td></td>
                                                    <td style=" text-align: right;border-top: 1px solid black;"><b>{{ 'Rp ' . number_format($totalPengeluaran, 2, ',', '.') }}</b></td>
                                                    <td></td>
                                                </tr>
                                                <tr>
                                                    @php
                                                        $date = new DateTime("$tahun-$bulan-01");
                                                        $date->modify('last day of this month');
                                                        $lastDayOfMonth = $date->format('d');
                                                    @endphp
                                                    <td colspan="2"><b>Saldo kas musholla per {{ $lastDayOfMonth.' '.$monthsId[$bulan].' '.$tahun}} Maret 2024</b></td>
                                                    <td></td>
                                                    <td style=" text-align: right;"><b>
                                                        {{ 'Rp ' . number_format(($awal+$totalPemasukan-$totalPengeluaran), 2, ',', '.') }}</b>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
@endsection


@push('scripts')
    <!-- JS Libraies -->
    <script src="{{ asset('library/cleave.js/dist/cleave.min.js') }}"></script>
    <script src="{{ asset('library/cleave.js/dist/addons/cleave-phone.us.js') }}"></script>
    <script src="{{ asset('library/bootstrap-daterangepicker/daterangepicker.js') }}"></script>
    <script src="{{ asset('library/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.min.js') }}"></script>
    <script src="{{ asset('library/bootstrap-timepicker/js/bootstrap-timepicker.min.js') }}"></script>
    <script src="{{ asset('library/bootstrap-tagsinput/dist/bootstrap-tagsinput.min.js') }}"></script>
    <script src="{{ asset('library/select2/dist/js/select2.full.min.js') }}"></script>
    <script src="{{ asset('library/selectric/public/jquery.selectric.min.js') }}"></script>
    <script src="https://cdn.datatables.net/2.0.8/js/dataTables.js"></script>
    <script src="https://cdn.datatables.net/buttons/3.0.2/js/dataTables.buttons.js"></script>
    <script src="https://cdn.datatables.net/buttons/3.0.2/js/buttons.dataTables.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.js"></script>
    <script src="https://cdn.datatables.net/buttons/3.0.2/js/buttons.html5.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/3.0.2/js/buttons.print.min.js"></script>

    <!-- JS Libraies -->

    <!-- Page Specific JS File -->
    <script src="{{ asset('js/page/forms-advanced-forms.js') }}"></script>
    <script src="{{ asset('js/page/modules-datatables.js') }}"></script>
    <script>
        // Use jQuery to get the year and month dropdown elements
        var yearDropdown = $('#year');
        var monthDropdown = $('#month');

        // Add event listeners for the 'change' event
        yearDropdown.on('change', redirectToPageWithParams);
        monthDropdown.on('change', redirectToPageWithParams);

        function redirectToPageWithParams() {
            // Get the selected year and month
            var year = yearDropdown.val();
            var month = monthDropdown.val();

            // Construct the new URL with the selected year and month as GET parameters
            // Redirect to the new URL
            window.location.href = "{{ route('kas-musholla.laporan', ['yearPlaceholder', 'monthPlaceholder']) }}"
                .replace('yearPlaceholder', year)
                .replace('monthPlaceholder', month);
        }
    </script>

@endpush