@extends('admin.master', ['menu' => 'memberShip', 'submenu' => 'payment_history'])
@section('title', isset($title) ? $title : '')
@section('content')

    <div id="table-url" data-url="{{ route('admin.payment-history') }}"></div>
    <div class="row">
        <div class="col-md-12">
            <div class="breadcrumb__content">
                <div class="breadcrumb__content__left">
                    <div class="breadcrumb__title">
                        <h2>{{ __('Payments History') }}</h2>
                    </div>
                </div>
                <div class="breadcrumb__content__right">
                    <nav aria-label="breadcrumb">
                        <ul class="breadcrumb">
                            <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">{{ __('Home') }}</a>
                            </li>
                            <li class="breadcrumb-item active" aria-current="page">{{ __('Admin') }}</li>
                        </ul>
                    </nav>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <div class="customers__area bg-style mb-30">
                <div class='row mb-5 mt-3'>
                    <div class='col-md-12'>
                        <div class="item-top mb-30">
                            <h2>{{ __('Search') }}</h2>
                        </div>
                    </div>
                    <div class="col-md-4 mb-2">
                        <div class="input__group mb-25">
                            <label for="from">{{ __('From:') }}</label>
                            <input type="date" class="searchFrom" id="from" name="from">
                        </div>
                    </div>
                    <div class="col-md-4 mb-2">
                        <div class="input__group mb-25">
                            <label for="to">{{ __('To:') }}</label>
                            <input type="date" class="searchTo" id="to" name="to">
                        </div>
                    </div>
                    <div class="col-md-4 mb-2">
                        <div class="input__group mb-25">
                            <label for="type">{{ __('Membership Type:') }}</label>
                            <select class="form-select rscnMemberLabel type" name="type" id="type">
                                <option value="">{{ __('Select') }}</option>
                                <option value="1">{{ __('Individual Membership') }}</option>
                                <option value="2">{{ __('Employee Membership') }}</option>
                                <option value="3">{{ __('Family Membership') }}</option>
                                <option value="4">{{ __('Corporate Membership') }}</option>
                            </select>
                        </div>
                    </div>
                    <div class="col-md-4 mb-2">
                        <div class="input__group mb-25">
                            <label for="member_id">{{ __('Mamebership Id:') }}</label>
                            <input type="text" class="memberId" id="member_id" name="member_id">
                        </div>
                    </div>
                    <div class="col-md-4 mb-2">
                        <div class="input__group mb-25">
                            <label for="reason">{{ __('Payment Reason:') }}</label>
                            <select class="form-select rscnMemberLabel reason" name="reason" id="reason">
                                <option value="">{{ __('Select') }}</option>
                                <option value="Registration">{{ __('Registration') }}</option>
                                <option value="Renewal">{{ __('Renewal') }}</option>
                            </select>
                        </div>
                    </div>
                    <div class="input__button">
                        <button type="submit" class="btn btn-blue" id="filter">{{ __('Search') }}</button>
                    </div>
                </div>
                <div class="customers__table">
                    <table id="BlogTable" class="row-border data-table-filter table-style">
                        <thead>
                            <tr>
                                <th>{{ __('Membership Type') }}</th>
                                <th>{{ __('English Name') }}</th>
                                <th>{{ __('Arabic Name') }}</th>
                                <th>{{ __('Membership Id') }}</th>
                                <th>{{ __('Reason') }}</th>
                                <th>{{ __('Amont') }}</th>
                                <th>{{ __('Date') }}</th>
                                <th>{{ __('Payment Method') }}</th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <!--Row-->

    <!--  modal -->

    @push('post_scripts')
        <script src="{{ asset('backend/js/admin/datatables/payment_history.js') }}"></script>
        <!-- Page level custom scripts -->
        <link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.0.3/css/buttons.dataTables.min.css">
        <script src="https://cdn.datatables.net/buttons/2.3.5/js/dataTables.buttons.min.js"></script>
        <script src="https://cdn.datatables.net/buttons/2.3.5/js/buttons.colVis.min.js"></script>
        <script src="https://cdn.datatables.net/buttons/2.3.5/js/buttons.print.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
        <script src="https://cdn.datatables.net/buttons/2.3.5/js/buttons.html5.min.js"></script>
    @endpush
@endsection