{{--
=====================================================
Etebarit - by Gisoo Web Solutions
------------------------------------------------------
Gisoo.net
------------------------------------------------------
Copyright (c) 2026 Gisoo Web Solutions
=====================================================
This code is protected by copyright
=====================================================
File: index.blade.php
------------------------------------------------------
Use: System-wide installments list with filters. Shows
     the plan name and request tracking code only -- never
     a shop or a product.
=====================================================
--}}

@extends('layouts.admin')

@section('title', __('admin.installments.title'))

@section('breadcrumb')
    <x-ui.breadcrumb :items="[
        ['label' => __('admin.breadcrumb.home'), 'url' => route('admin.users.index')],
        ['label' => __('admin.installments.breadcrumb')],
    ]" />
@endsection

@php
    $statusStyles = [
        'upcoming' => 'bg-[#eef2fb] text-[#3b6bd8]',
        'due' => 'bg-[#fff5e6] text-amber-600',
        'overdue' => 'bg-secondary-50 text-secondary-500',
        'paid' => 'bg-[#e7f7ee] text-green-600',
    ];
@endphp

@section('page')
    <div class="mb-5">
        <h1 class="mb-1 text-2xl font-bold tracking-tight">{{ __('admin.installments.title') }}</h1>
        <p class="text-sm text-ink-muted">{{ __('admin.installments.subtitle') }}</p>
    </div>

    <x-ui.info-box class="mb-5">
        {{ __('admin.installments.info') }}
    </x-ui.info-box>

    {{-- Filters --}}
    <form method="GET" action="{{ route('admin.installments.index') }}" class="mb-5 rounded-2xl border border-line bg-white p-5">
        <div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
            <div>
                <label for="f-status" class="mb-1.5 block text-[12.5px] font-bold">{{ __('admin.installments.filters.status') }}</label>
                <select id="f-status" name="status" class="w-full rounded-xl border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3.5 py-2.5 text-[13px] outline-none transition focus:border-primary-600 focus:bg-white">
                    <option value="all" @selected($status === 'all')>{{ __('admin.installments.filters.all') }}</option>
                    @foreach (\App\Models\Installment::STATUSES as $s)
                        <option value="{{ $s }}" @selected($status === $s)>{{ __('admin.installments.statuses.'.$s) }}</option>
                    @endforeach
                </select>
            </div>
            <div>
                <label for="f-collateral" class="mb-1.5 block text-[12.5px] font-bold">{{ __('admin.installments.filters.collateral') }}</label>
                <select id="f-collateral" name="collateral" class="w-full rounded-xl border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3.5 py-2.5 text-[13px] outline-none transition focus:border-primary-600 focus:bg-white">
                    <option value="all" @selected($collateral === 'all')>{{ __('admin.installments.filters.all') }}</option>
                    @foreach (\App\Models\Plan::COLLATERALS as $c)
                        <option value="{{ $c }}" @selected($collateral === $c)>{{ __('front.credit.collaterals.'.$c) }}</option>
                    @endforeach
                </select>
            </div>
            <div>
                <label for="f-q" class="mb-1.5 block text-[12.5px] font-bold">{{ __('admin.installments.columns.user') }}</label>
                <input id="f-q" name="q" value="{{ $search }}" placeholder="{{ __('admin.installments.filters.search_placeholder') }}" class="w-full rounded-xl border-[1.5px] border-[#e3e1ec] bg-[#fbfbfd] px-3.5 py-2.5 text-[13px] outline-none transition focus:border-primary-600 focus:bg-white">
            </div>
            <div>
                <label class="mb-1.5 block text-[12.5px] font-bold">{{ __('admin.installments.filters.due_from') }}</label>
                <x-ui.jalali-date name="due_from" :value="$dueFrom" />
            </div>
            <div>
                <label class="mb-1.5 block text-[12.5px] font-bold">{{ __('admin.installments.filters.due_to') }}</label>
                <x-ui.jalali-date name="due_to" :value="$dueTo" />
            </div>
            <div class="flex items-end gap-2">
                <button type="submit" class="rounded-xl bg-primary-600 px-5 py-2.5 text-[13px] font-bold text-white transition hover:bg-primary-700">{{ __('admin.installments.filters.apply') }}</button>
                <a href="{{ route('admin.installments.index') }}" class="rounded-xl bg-[#f2f0fa] px-4 py-2.5 text-[13px] font-bold text-ink-soft transition hover:bg-[#e8e3f8]">{{ __('admin.installments.filters.reset') }}</a>
            </div>
        </div>
    </form>

    {{-- Table --}}
    <div class="overflow-hidden rounded-2xl border border-line bg-white">
        <div class="overflow-x-auto">
            <table class="w-full min-w-[860px] text-right text-[13.5px]">
                <thead class="bg-[#faf9fd] text-xs text-ink-muted">
                    <tr>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.installments.columns.user') }}</th>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.installments.columns.plan') }}</th>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.installments.columns.collateral') }}</th>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.installments.columns.amount') }}</th>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.installments.columns.penalty') }}</th>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.installments.columns.due_at') }}</th>
                        <th class="px-4.5 py-3.5 font-bold">{{ __('admin.installments.columns.status') }}</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-line">
                    @forelse ($installments as $installment)
                        @php
                            $request = $installment->creditRequest;
                            $collateral = $request?->collateral_type;
                        @endphp
                        <tr class="transition hover:bg-[#faf9fd]">
                            <td class="px-4.5 py-3.5">
                                @if ($installment->user)
                                    <a href="{{ route('admin.users.show', $installment->user) }}" target="_blank" class="font-bold transition hover:text-primary-600">{{ $installment->user->fullName() }}</a>
                                @else
                                    <span class="text-ink-faint">—</span>
                                @endif
                            </td>
                            <td class="px-4.5 py-3.5">
                                <div class="font-bold">{{ $request?->plan?->name ?? '—' }}</div>
                                @if ($request)<div class="text-[11.5px] text-ink-faint" dir="ltr">{{ $request->code }}</div>@endif
                            </td>
                            <td class="px-4.5 py-3.5 text-ink-soft">{{ $collateral ? __('front.credit.collaterals.'.$collateral) : '—' }}</td>
                            <td class="px-4.5 py-3.5 font-bold" dir="ltr">@toman($installment->amount)</td>
                            <td class="px-4.5 py-3.5" dir="ltr">
                                @if ($installment->penalty_amount > 0)
                                    <span class="font-bold text-secondary-500">@toman($installment->penalty_amount)</span>
                                @else
                                    <span class="text-ink-faint">—</span>
                                @endif
                            </td>
                            <td class="px-4.5 py-3.5 text-ink-soft">@jalali($installment->due_at)</td>
                            <td class="px-4.5 py-3.5">
                                <span @class(['rounded-2xl px-2.5 py-1 text-xs font-bold', $statusStyles[$installment->status] ?? 'bg-[#f1f0f5] text-ink-muted'])>
                                    {{ __('admin.installments.statuses.'.$installment->status) }}
                                </span>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="7" class="px-4.5 py-12 text-center text-sm text-ink-muted">{{ __('admin.installments.empty') }}</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        @if ($installments->hasPages())
            <div class="border-t border-line px-5 py-4">{{ $installments->links() }}</div>
        @endif
    </div>
@endsection