@extends('layouts.master')
@section('page_title', 'Over Due Fees')
@section('content')
    <div class="card">
        <div class="card-body">

        <div class="row pt-2 pb-2">

            <div class="col col-md-2">
                <label for="school_year">School Year</label>
                <select name="school_year" class="form-control">
                  <option value=""></option>
                </select>
            </div>

            <div class="col col-md-3">
                <label for="class_id">Class</label>
                <select name="class_id" class="form-control">
                  <option value=""></option>
                </select>
            </div>

            <div class="col col-md-3">
                <label for="section_id">Section</label>
                <select name="section_id" class="form-control">
                  <option value=""></option>
                </select>
            </div>

            
        </div>

        <div class="row">
             <div class="col col-md-3">
                <label for="start_date">Start Date</label>
                <input type="date" name="start_date" class="form-control" />
            </div>

            <div class="col col-md-2">
                <label for="end_date">End Date</label>
                <input type="date" name="end_date" class="form-control" />
            </div>

            <div class="col col-md-2 mt-4">
                <button wire:click="searchRecords" class="btn btn-dark ">
                        Filter  <span wire:loading wire:target="searchRecords"> <x-loading-spinner size="20px" color="#fff" borderWidth="3px" /></span>
                </button>
            </div>
            
        </div>

        </div>
    </div>
@endsection