@extends('admin.layouts.master')

@section('title')
    Expense Tracker
@endsection



@section('content')
    <div class="container-fluid">

        <!-- start page title -->
        <div class="row">
            <div class="col-12">
                <div class="page-title-box d-sm-flex align-items-center justify-content-between">
                    <h4 class="mb-sm-0">Expense Tracker</h4>
                </div>
            </div>
        </div>

        @php
            $source_of_funds = \App\Models\SourceOfFund::pluck('source', 'id');
        @endphp


        {{-- @include('admin.pages.accounting.annual-summary') --}}


        <div class="card">
            <div class="card-header">
                <ul class="nav nav-tabs nav-border-top nav-border-top-primary mb-3" role="tablist">

                    @foreach ($grouped_by_month_and_procurement_type as $month => $procurement_type)
                        <li class="nav-item" role="presentation">
                            <a class="nav-link {{ $month == date('m') ? 'active' : '' }}" data-bs-toggle="tab"
                                href="#month_{{ $month }}" role="tab" aria-selected="true">
                                {{ months($month) }}
                            </a>
                        </li>
                    @endforeach

                </ul>


                <div class="tab-content text-muted">
                    @foreach ($grouped_by_month_and_procurement_type as $month => $procurement_type)
                        <div class="tab-pane  {{ $month == date('m') ? 'active' : '' }}" id="month_{{ $month }}"
                            role="tabpanel">
                            <div class="table-responsive">
                                <!-- Small Tables -->
                                <table class="table table-sm table-nowrap">

                                    @foreach ($grouped_by_source_of_fund[$month] as $source_of_fund => $memos)
                                        <thead>
                                            <tr>
                                                <th colspan="5" class="bg-dark text-white">
                                                    {{ $source_of_funds[$source_of_fund] }}
                                                </th>
                                            </tr>
                                            <tr>
                                                <th scope="col" class="text-center">#</th>
                                                <th scope="col">MEMO</th>
                                                <th scope="col">TYPE</th>
                                                <th scope="col">PV NUMBER</th>
                                                <th scope="col" class="text-end mr-5">TOTAL AMOUNT</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach ($memos as $row => $memo)
                                                <tr>
                                                    <th scope="row" class="text-center">{{ $row + 1 }}.
                                                    </th>
                                                    <td>{{ $memo->subject }}</td>
                                                    <td>{{ $memo->procurement_type }}</td>
                                                    <td>{{ $memo->pv_number }}</td>
                                                    <td class="text-end mr-5">{{ $memo->currency }}
                                                        {{ $memo->total_amount }}</td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    @endforeach
                                </table>
                            </div>
                        </div>
                    @endforeach

                </div>
            </div><!-- end card-body -->
        </div>




        {{-- <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header border-0">
                        <div class="d-lg-flex align-items-center">
                            <div class="flex-grow-1">
                                <h5 class="card-title mb-0">Live Auction</h5>
                            </div>
                            <div class="flex-shrink-0 mt-4 mt-lg-0">
                                <ul class="nav nav-pills filter-btns" role="tablist">
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link fw-medium" type="button" data-filter="all">All
                                            Items</button>
                                    </li>
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link fw-medium" type="button" data-filter="upto-15">Up to
                                            15%</button>
                                    </li>
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link fw-medium" type="button" data-filter="upto-30">Up to
                                            30%</button>
                                    </li>
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link fw-medium active" type="button" data-filter="upto-40">Up
                                            to
                                            40%</button>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div> --}}


    </div>
@endsection