@extends('layouts.branch')

@section('title', 'IPD Charges Report')
@section('header', 'IPD Charges Report')

@section('content')
<div class="space-y-6">
    @include('partials.branch._breadcrumbs', [
        'breadcrumbs' => [
            ['name' => 'Reports', 'url' => route('branch.reports.index')],
            ['name' => 'IPD Charges Report', 'url' => route('branch.reports.ipd-charges')]
        ]
    ])
    <!-- Filters -->
    <div class="bg-white border border-slate-100 rounded-[2.5rem] p-8 shadow-sm">
        <form method="GET" action="{{ route('branch.reports.ipd-charges') }}" class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-6 gap-6 items-end">
            <div>
                <label class="block text-[10px] font-black text-slate-400 uppercase tracking-widest mb-2 ml-1">From Date</label>
                <input type="date" name="from_date" value="{{ $fromDate }}" class="w-full bg-slate-50 border-slate-100 rounded-2xl px-4 py-3 text-xs font-bold text-slate-700 focus:ring-amber-500 focus:border-amber-500 transition-all">
            </div>
            <div>
                <label class="block text-[10px] font-black text-slate-400 uppercase tracking-widest mb-2 ml-1">To Date</label>
                <input type="date" name="to_date" value="{{ $toDate }}" class="w-full bg-slate-50 border-slate-100 rounded-2xl px-4 py-3 text-xs font-bold text-slate-700 focus:ring-amber-500 focus:border-amber-500 transition-all">
            </div>
            <div>
                <label class="block text-[10px] font-black text-slate-400 uppercase tracking-widest mb-2 ml-1">UHID</label>
                <input type="text" name="uhid" value="{{ $uhid }}" placeholder="Search UHID" class="w-full bg-slate-50 border-slate-100 rounded-2xl px-4 py-3 text-xs font-bold text-slate-700 focus:ring-amber-500 focus:border-amber-500 transition-all">
            </div>
            <div>
                <label class="block text-[10px] font-black text-slate-400 uppercase tracking-widest mb-2 ml-1">Charge Type</label>
                <select name="charge_type_id" class="w-full bg-slate-50 border-slate-100 rounded-2xl px-4 py-3 text-xs font-bold text-slate-700 focus:ring-amber-500 focus:border-amber-500 transition-all appearance-none">
                    <option value="">All Types</option>
                    @foreach($chargeTypes as $type)
                        <option value="{{ $type->id }}" {{ $chargeTypeId == $type->id ? 'selected' : '' }}>{{ $type->name }}</option>
                    @endforeach
                </select>
            </div>
            <div>
                <label class="block text-[10px] font-black text-slate-400 uppercase tracking-widest mb-2 ml-1">Per Page</label>
                <select name="per_page" class="w-full bg-slate-50 border-slate-100 rounded-2xl px-4 py-3 text-xs font-bold text-slate-700 focus:ring-amber-500 focus:border-amber-500 transition-all appearance-none">
                    <option value="50" {{ $perPage == 50 ? 'selected' : '' }}>50 Records</option>
                    <option value="100" {{ $perPage == 100 ? 'selected' : '' }}>100 Records</option>
                    <option value="200" {{ $perPage == 200 ? 'selected' : '' }}>200 Records</option>
                    <option value="all" {{ $perPage == 'all' ? 'selected' : '' }}>All Records</option>
                </select>
            </div>
            <div class="flex gap-4">
                <button type="submit" class="flex-1 bg-slate-900 text-white rounded-2xl px-6 py-3 text-[10px] font-black uppercase tracking-widest hover:bg-amber-600 transition-all shadow-lg shadow-slate-200">
                    Filter
                </button>
                <a href="{{ route('branch.reports.ipd-charges.export-pdf', ['from_date' => $fromDate, 'to_date' => $toDate, 'uhid' => $uhid, 'charge_type_id' => $chargeTypeId]) }}" class="bg-rose-500 text-white rounded-2xl px-6 py-3 text-xs font-black uppercase tracking-widest hover:bg-rose-600 transition-all shadow-lg shadow-rose-200 flex items-center justify-center">
                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg>
                </a>
            </div>
        </form>
    </div>

    <!-- Results -->
    <div class="bg-white border border-slate-100 rounded-[2.5rem] shadow-xl shadow-slate-200/50 overflow-hidden">
        <div class="flex items-center justify-between px-8 pt-8">
            <h2 class="text-[10px] font-black text-slate-400 uppercase tracking-widest">Total IPD Charge Records: <span class="text-amber-600 ml-1">{{ number_format($totalCount) }}</span></h2>
        </div>
        <div class="overflow-x-auto">
            <table class="w-full text-left border-collapse">
                <thead>
                    <tr class="bg-slate-50/50">
                        <th class="px-8 py-5 text-[10px] font-black text-slate-500 uppercase tracking-widest border-b border-slate-100">Date</th>
                        <th class="px-8 py-5 text-[10px] font-black text-slate-500 uppercase tracking-widest border-b border-slate-100">UHID</th>
                        <th class="px-8 py-5 text-[10px] font-black text-slate-500 uppercase tracking-widest border-b border-slate-100">IPD No.</th>
                        <th class="px-8 py-5 text-[10px] font-black text-slate-500 uppercase tracking-widest border-b border-slate-100">Patient</th>
                        <th class="px-8 py-5 text-[10px] font-black text-slate-500 uppercase tracking-widest border-b border-slate-100">Charge Details</th>
                        <th class="px-8 py-5 text-[10px] font-black text-slate-500 uppercase tracking-widest border-b border-slate-100 text-right">Amount</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-50 font-medium">
                    @forelse($charges as $charge)
                        <tr class="group hover:bg-slate-50/50 transition-colors">
                            <td class="px-8 py-6 text-xs text-slate-600 font-bold uppercase tracking-tight">
                                {{ $charge->date->format('d M, y') }}
                            </td>
                            <td class="px-8 py-6">
                                <span class="text-xs font-black text-indigo-600 uppercase tracking-tight bg-indigo-50 px-3 py-1 rounded-lg">
                                    {{ $charge->patient->uhid }}
                                </span>
                            </td>
                            <td class="px-8 py-6">
                                <span class="text-xs font-black text-amber-600 uppercase tracking-tight bg-amber-50 px-3 py-1 rounded-lg">
                                    {{ $charge->ipdRegistration->ipd_number }}
                                </span>
                            </td>
                            <td class="px-8 py-6">
                                <h4 class="text-sm font-black text-slate-800 uppercase tracking-tight">{{ $charge->patient->name }}</h4>
                            </td>
                            <td class="px-8 py-6">
                                <h4 class="text-xs font-black text-slate-700 uppercase tracking-tight">{{ $charge->chargeType->name }}</h4>
                                <p class="text-[10px] text-slate-400 font-bold italic mt-1">{{ $charge->note ?? 'No notes' }}</p>
                            </td>
                            <td class="px-8 py-6 text-right font-black text-indigo-600">
                                {{ number_format($charge->amount, 2) }}
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="6" class="px-8 py-20 text-center">
                                <p class="text-[10px] font-black text-slate-400 uppercase tracking-[0.3em]">No charges found</p>
                            </td>
                        </tr>
                    @endforelse
                </tbody>
                @if($charges->count() > 0)
                <tfoot class="bg-slate-900 text-white font-black italic">
                    <tr>
                        <td colspan="5" class="px-8 py-6 text-right text-[10px] uppercase tracking-[0.2em]">Grand Total IPD Charges</td>
                        <td class="px-8 py-6 text-right text-lg tabular-nums text-amber-400">₹{{ number_format($grandTotal, 2) }}</td>
                    </tr>
                </tfoot>
                @endif
            </table>
        </div>
        @if($charges->hasPages())
            <div class="px-8 py-6 bg-slate-50/50 border-t border-slate-100">
                {{ $charges->appends(request()->query())->links() }}
            </div>
        @endif
    </div>
</div>
@endsection