@extends('cleaner.layouts.loggedin')

@section('title', 'Cleaner Earning')
@section('content')

    <div class="mb-4 col-12">
        <h2>Your Earnings</h2>
    </div>
    <div class="row">
        <div class="col-xl-3 col-sm-6 mb-xl-0 mb-4">
            <div class="card">
                <div class="card-body p-3">
                    <div class="row">
                        <div class="col-8">
                            <div class="numbers">
                                <p class="text-sm mb-0 text-uppercase font-weight-bold">All Time</p>
                                <h5 class="font-weight-bolder">
                                   ${{$totalearning}}
                                </h5>

                            </div>
                        </div>
                        <div class="col-4 text-end">
                            <div class="icon icon-shape bg-gradient-success shadow-success text-center rounded-circle">
                                <i class="ni ni-paper-diploma text-lg opacity-10" aria-hidden="true"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-sm-6 mb-xl-0 mb-4">
            <div class="card">
                <div class="card-body p-3">
                    <div class="row">
                        <div class="col-8">
                            <div class="numbers">
                                <p class="text-sm mb-0 text-uppercase font-weight-bold">This Week</p>
                                <h5 class="font-weight-bolder">
                                   ${{$thisweek}}
                                </h5>

                            </div>
                        </div>
                        <div class="col-4 text-end">
                            <div class="icon icon-shape bg-gradient-danger shadow-danger text-center rounded-circle">
                                <i class="ni ni-paper-diploma text-lg opacity-10" aria-hidden="true"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-sm-6 mb-xl-0 mb-4">
            <div class="card">
                <div class="card-body p-3">
                    <div class="row">
                        <div class="col-8">
                            <div class="numbers">
                                <p class="text-sm mb-0 text-uppercase font-weight-bold">Last Week</p>
                                <h5 class="font-weight-bolder">
                                   ${{$earning_last_week}}
                                </h5>

                            </div>
                        </div>
                        <div class="col-4 text-end">
                            <div class="icon icon-shape bg-gradient-danger shadow-danger text-center rounded-circle">
                                <i class="ni ni-paper-diploma text-lg opacity-10" aria-hidden="true"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xl-3 col-sm-6 mb-xl-0 mb-4">
            <div class="card">
                <div class="card-body p-3">
                    <div class="row">
                        <div class="col-8">
                            <div class="numbers">
                                <p class="text-sm mb-0 text-uppercase font-weight-bold">Total Paid</p>
                                <h5 class="font-weight-bolder">
                                    ${{$totalPaid}}
                                </h5>

                            </div>
                        </div>
                        <div class="col-4 text-end">
                            <div class="icon icon-shape bg-gradient-primary shadow-primary text-center rounded-circle">
                                <i class="ni ni-money-coins text-lg opacity-10" aria-hidden="true"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>




    </div>
<hr>
    <ol class="list-group list-group-numbered mt-5">
        @foreach ($earningsData as $data)
            <li class="list-group-item d-flex justify-content-center align-items-start" style="    align-items: center !important;justify-content: center;align-item:center;">
                <div class="ms-2 me-auto">
                    <div class="d-flex" style="justify-content: center;align-item:center;">
                        <img class="text-center mb-1 p-1" style="width: 48px;height: 48px;" src="" />
                        <div class="fw-bold "> <div class="ellipsis">{{ $data->customer_name }}</div>

                            <div class="d-flex">
                                <div style="font-size: 13px;">           #{{ $data->orderId }}</div>
                                {{-- <div style="font-size:12px; ">{{ $data->laundryname }}</div> --}}
                                                                <span class="badge rounded-pill text-bg-secondary ml-2"
                                    style="font-size: 10px !important;margin-left: 6px;">Not-Paid</span>
                                                            </div>
                        </div>


                    </div>

                </div>
                <div class="p-2"><a  class="badge rounded-pill text-white text-bg-primary" href="{{ route('cleaner.earning.invoice', ['orderid' => $data->orderId ]) }}">View Invoice</a></div>
                <div style="text-align: right;" class="d-md-block d-sm-block d-none">
                {{-- <div class="" style="font-size: 13px;">
                   Earning: <span style="font-weight: 600;">${{ number_format($data->weight * $data->rate, 2, '.', '') }}</span>
                </div>
                <div class="" style="font-size: 13px;">
                 Bonus:  <span style="font-weight: 600;">${{ number_format($data->bonus , 2, '.', '') }}</span>
                </div> --}}
                <div class="p-2" style="font-size: 15px;font-weight:600;border-left:1px solid rgb(205, 205, 205);">
                    <span style="font-weight: 800;font-size: 17px;">${{ number_format($data->bonus + $data->weight * $data->rate, 2, '.', '') }}</span>
                </div>
            </div>
            </li>
        @endforeach

    </ol>

@endsection