@extends('layouts.main')

@section('title', 'Management Fees')

@section('content')

<div class="main-content app-content">
    <div class="container-fluid">

        <div class="d-md-flex d-block align-items-center justify-content-between page-header-breadcrumb mb-4">
            <div>
                <h1 class="page-title text-primary">Management Fees</h1>
            </div>
            <div class="ms-auto">
                <a href="{{ route('management-fees.create') }}" class="btn btn-primary">Add Fee</a>
            </div>
        </div>

        <div class="card mt-3">
            <div class="card-body">

                <table class="table table-bordered">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>Branch</th>
                            <th>Financial Month</th>
                            <th>Total Fee</th>
                            <th>Calculated Date</th>
                            <th>Actions</th>
                        </tr>
                    </thead>

                    <tbody>
                        @foreach($fees as $key => $fee)
                        <tr>
                            <td>{{ $key+1 }}</td>
                            <td>{{ $fee->branch->branch_name ?? '-' }}</td>
                            <td>{{ $fee->financial_month }}</td>
                            <td>{{ $fee->total_fee_amount }}</td>
                            <td>{{ $fee->calculated_date }}</td>
                            <td>
                                <a href="{{ route('management-fees.edit',$fee->id) }}" class="btn btn-warning btn-sm">Edit</a>

                                <form method="POST" action="{{ route('management-fees.destroy',$fee->id) }}" class="d-inline">
                                    @csrf @method('DELETE')
                                    <button class="btn btn-danger btn-sm">Delete</button>
                                </form>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>

            </div>
        </div>

    </div>
</div>

@endsection