@extends('dashboard.layouts.app')

@section('title', __('dashboard.User Earnings'))
@section('page_heading', __('dashboard.User Earnings'))

@section('breadcrumb')
    <li class="breadcrumb-item text-muted">
        <a href="{{ route('dashboard.home') }}" class="text-muted text-hover-primary">{{ __('dashboard.Home') }}</a>
    </li>
    <li class="breadcrumb-item">
        <span class="bullet bg-gray-500 w-5px h-2px"></span>
    </li>
    <li class="breadcrumb-item text-muted">
        <a href="{{ route('dashboard.users.index') }}" class="text-muted text-hover-primary">{{ __('dashboard.Users') }}</a>
    </li>
    <li class="breadcrumb-item">
        <span class="bullet bg-gray-500 w-5px h-2px"></span>
    </li>
    <li class="breadcrumb-item text-muted">
        <a href="{{ route('dashboard.users.show', $user) }}" class="text-muted text-hover-primary">{{ $user->name }}</a>
    </li>
    <li class="breadcrumb-item">
        <span class="bullet bg-gray-500 w-5px h-2px"></span>
    </li>
    <li class="breadcrumb-item text-muted">{{ __('dashboard.Earnings') }}</li>
@endsection

@section('content')
    <div class="card card-flush">
        <div class="card-header">
            <h3 class="card-title">{{ __('dashboard.Earnings for') }} {{ $user->name }}</h3>
        </div>
        <div class="card-body">
            <div class="row mb-4">
                <div class="col-md-6">
                    <h5>{{ __('dashboard.Total Balance') }}: <span class="text-success">{{ $totalBalance }}</span></h5>
                </div>
                <div class="col-md-6">
                    <h5>{{ __('dashboard.Pending Balance') }}: <span class="text-warning">{{ $pendingBalance }}</span></h5>
                </div>
            </div>

            @if($earnings->count() > 0)
                <table class="table table-row-dashed align-middle gs-0 gy-3 my-0">
                    <thead>
                        <tr class="fs-7 fw-bold text-gray-400 border-bottom-0">
                            <th class="p-0 pb-3 min-w-50px text-start">{{ __('dashboard.ID') }}</th>
                            <th class="p-0 pb-3 min-w-100px">{{ __('dashboard.Shipment') }}</th>
                            <th class="p-0 pb-3 min-w-100px">{{ __('dashboard.Order') }}</th>
                            <th class="p-0 pb-3 min-w-100px">{{ __('dashboard.Coupon') }}</th>
                            <th class="p-0 pb-3 min-w-100px">{{ __('dashboard.Amount') }}</th>
                            <th class="p-0 pb-3 min-w-100px">{{ __('dashboard.Commission Percentage') }}</th>
                            <th class="p-0 pb-3 min-w-100px">{{ __('dashboard.Due Date') }}</th>
                            <th class="p-0 pb-3 min-w-100px">{{ __('dashboard.Status') }}</th>
                            <th class="p-0 pb-3 min-w-100px">{{ __('dashboard.Notes') }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($earnings as $earning)
                            <tr>
                                <td>
                                    <span class="text-gray-600 fw-bold fs-6">{{ $earning->id }}</span>
                                </td>
                                <td>
                                    <a href="{{ route('dashboard.orders.shipments.show', [$earning->shipment->order, $earning->shipment]) }}" class="text-gray-800 fw-bold text-hover-primary mb-1 fs-6">#{{ $earning->shipment->id }}</a>
                                </td>
                                <td>
                                     <a href="{{ route('dashboard.orders.show', $earning->shipment->order) }}" class="text-gray-800 fw-bold text-hover-primary mb-1 fs-6">#{{ $earning->shipment->order->id }}</a>
                                </td>
                                <td>
                                    @if($earning->coupon)
                                        <a href="{{ route('dashboard.coupons.show', $earning->coupon) }}" class="text-gray-800 fw-bold text-hover-primary mb-1 fs-6">{{ $earning->coupon->code }}</a>
                                    @else
                                        <span class="text-gray-600 fw-bold fs-6">{{ __('dashboard.N/A') }}</span>
                                    @endif
                                </td>
                                <td>
                                    <span class="text-gray-800 fw-bold fs-6">{{ $earning->amount }}</span>
                                </td>
                                <td>
                                    <span class="text-gray-600 fw-bold fs-6">{{ $earning->commission_percentage }}%</span>
                                </td>
                                <td>
                                    <span class="text-gray-600 fw-bold fs-6">{{ $earning->due_date->format('Y-m-d') }}</span>
                                </td>
                                <td>
                                    @if ($earning->status == 'pending')
                                        <span class="badge badge-light-warning">{{ __('dashboard.Pending') }}</span>
                                    @elseif ($earning->status == 'due')
                                        <span class="badge badge-light-primary">{{ __('dashboard.Due') }}</span>
                                    @elseif ($earning->status == 'paid')
                                        <span class="badge badge-light-success">{{ __('dashboard.Paid') }}</span>
                                    @endif
                                </td>
                                <td>
                                    <span class="text-gray-600 fw-bold fs-6">{{ $earning->notes ?? '---' }}</span>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
                <div class="mt-4">
                    {{ $earnings->links() }}
                </div>
            @else
                <div class="alert alert-warning">
                    {{ __('dashboard.No earnings found for this user.') }}
                </div>
            @endif
        </div>
    </div>
@endsection