@extends('layouts.master')

@section('title', __('Earning Turnover Report'))

@push('styles')
    <style>
        .table tfoot tr {
            background-color: #9B8B75 !important;
            color: #ffffff;
            font-weight: bold;
        }
    </style>
@endpush
@section('content')
    <section class="main_section">
        <div class="row">

            <div class="col-lg-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="m-0">{{__('Filter')}}</h3>
                    </div>
                    <form action="javascript:void(0)" method="get">
                        <div class="card-body">
                            <div class="row">
                                <div class="col-12 col-md-4 col-sm-12">
                                    <div class="relative z-0 w-full mb-1 group">
                                        <input type="text" id="date" class="form-control rounded-lg p-2.5 w-full text-sm text-gray-900 bg-transparent border-gray-300 appearance-none focus:outline-none border-2 focus:ring-1 peer pl-15 h-11">
                                        <label for="date" class="form-label left-0 ml-2 p-2 py-0 peer-focus:font-medium absolute text-sm text-gray-600 duration-300 transform -translate-y-6 scale-75 top-3 origin-[0] peer-focus:start-0 rtl:peer-focus:translate-x-1/4 peer-focus:text-indigo-400 peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6 bg-white peer-focus:z-10">Start Date</label>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                    <div class="card-footer">
                        <div class="col-md-12 d-flex justify-content-start">
                            <button class="btn btn-save btn-primary btn-save-record btn-modal" onclick="earningTurnoverReportTableRefresh()" type="button">{!! renderIconHtml('search') !!}{{ __('Search') }}</button>
                        </div>
                    </div>
                </div>
                <div class="card mt-2">
                    <div class="card-body">
                        <table class="table table-bordered table-striped" id="bstable" data-unique-id="counter" table-for="earning_turnover_report"
                               data-toolbar="false" data-toggle="bstable" data-show-export="false"
                               data-show-button-text="false" data-show-columns="false" data-show-toggle="false"
                               data-show-columns-toggle-all="false" data-ajax="getAllData" data-side-pagination="server"
                               data-pagination="true" data-total-field="count" data-sortable="true" data-data-field="items"
                               data-filter-control="true" data-icons="icons" data-icons-prefix="bi"
                               data-show-search-clear-button="false" data-loading-template="DataTaleLoadingTemplate" data-page-size="25" data-search-on-enter-key="true">
                            <thead>
                            <tr>
                                <th data-width-unit="px" data-field="week"> {{ __('Week') }} </th>
                                <th data-width-unit="px" data-field="turnover"> {{ __('Turnover Redeem') }} </th>
                                <th data-width-unit="px" data-field="uni_level_commission"> {{ __('Uni Level Commission') }} </th>
                                <th data-width-unit="px" data-field="matching_bonus"> {{ __('Matching Bonus') }} </th>
                                <th data-width-unit="px" data-field="infinity_star_bonus"> {{ __('Infinity Star Bonus') }} </th>
                                <th data-width-unit="px" data-field="customer_acquisition_bounce"> {{ __('Customer Acquisition Bounce') }} </th>
                                <th data-width-unit="px" data-field="total_payout"> {{ __('Total Payout') }} </th>
                                <th data-width-unit="px" data-field="infinity_star_bonus_percentage"> {{ __('Infinity Star Bonus (%)') }} </th>
                                <th data-width-unit="px" data-field="customer_acquisition_bounce_percentage"> {{ __('Customer Acquisition Bounce (%)') }} </th>
                                <th data-width-unit="px" data-field="total_payout_percentage"> {{ __('Total Payout (%)') }} </th>
                            </tr>
                            </thead>
                        </table>

                    </div>
                </div>
            </div>

        </div>
    </section>
@endsection

@push('scripts')
    <script src="{{ asset('backend/js/pages-js/reports/earningturnover-report.js') }}"></script>
@endpush