@extends('layouts.app')

@section('content')
    <div class="p-4 bg-white rounded-lg shadow-md">
        <div class="flex justify-between items-center mb-3">
            <h1 class="text-xl font-bold text-gray-800">
                @if($isBranchAdmin)
                    Branch Statement Report - {{ auth()->user()->branch->name ?? 'Your Branch' }}
                @else
                    Branch Statement Report
                @endif
            </h1>
            <a href="{{ route('reports.print-branch-statement', request()->query()) }}" target="_blank" 
            class="bg-blue-600 hover:bg-blue-800 text-white font-semibold py-1.5 px-3 rounded-md shadow-md transition duration-200 text-sm">
                🖨️ Print View
            </a>
        </div>
    <!-- Filters Form -->
    <form method="GET" action="{{ route('reports.branch-statement') }}" class="mb-4 bg-gray-50 p-2 rounded-lg border border-gray-200">
        <div class="grid grid-cols-2 md:grid-cols-{{ $isBranchAdmin ? 3 : 5 }} gap-2">
            <div class="flex flex-col">
                <label class="block text-xs font-medium text-gray-700">Date From</label>
                <input type="date" name="date_from" value="{{ $dateFrom->format('Y-m-d') }}" onchange="this.form.submit()" class="mt-1 block w-full rounded border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-xs h-8">
            </div>
            <div class="flex flex-col">
                <label class="block text-xs font-medium text-gray-700">Date To</label>
                <input type="date" name="date_to" value="{{ $dateTo->format('Y-m-d') }}" onchange="this.form.submit()" class="mt-1 block w-full rounded border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-xs h-8">
            </div>
            @if(!$isBranchAdmin)
            <div class="flex flex-col">
                <label class="block text-xs font-medium text-gray-700">Branch</label>
                <select name="branch_id" onchange="this.form.submit()" class="mt-1 block w-full rounded border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-xs h-8">
                    <option value="">All Branches</option>
                    @foreach($branches as $branch)
                        <option value="{{ $branch->id }}" {{ request('branch_id') == $branch->id ? 'selected' : '' }}>{{ $branch->name }}</option>
                    @endforeach
                </select>
            </div>
            @endif
            <div class="flex flex-col">
                <label class="block text-xs font-medium text-gray-700">Service</label>
                <select name="service_id" onchange="this.form.submit()" class="mt-1 block w-full rounded border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-xs h-8">
                    <option value="">All Services</option>
                    @foreach($services as $service)
                        <option value="{{ $service->id }}" {{ request('service_id') == $service->id ? 'selected' : '' }}>{{ $service->name }}</option>
                    @endforeach
                </select>
            </div>
            @if(!$isBranchAdmin)
            <div class="flex flex-col">
                <label class="block text-xs font-medium text-gray-700">Agent</label>
                <select name="agent_id" onchange="this.form.submit()" class="mt-1 block w-full rounded border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-xs h-8">
                    <option value="">All Agents</option>
                    @foreach($agents as $agent)
                        <option value="{{ $agent->id }}" {{ request('agent_id') == $agent->id ? 'selected' : '' }}>{{ $agent->name }}</option>
                    @endforeach
                </select>
            </div>
            @endif
        </div>
    </form>

    <!-- Period Totals -->
    <div class="mb-4 grid grid-cols-2 md:grid-cols-{{ $isBranchAdmin ? 7 : 8 }} gap-2 bg-gradient-to-r from-green-50 to-blue-50 p-3 rounded-lg border border-green-200">
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Total Sales</div>
            <div class="text-lg font-bold text-green-600">{{ number_format($totalSales, 2) }}</div>
        </div>
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Total Cash (SR)</div>
            <div class="text-lg font-bold text-blue-600">{{ number_format($totalCash, 2) }}</div>
        </div>
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Total Bank (SR)</div>
            <div class="text-lg font-bold text-indigo-600">{{ number_format($totalBankSR, 2) }}</div>
        </div>
        <!-- <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Total Bank (BDT)</div>
            <div class="text-lg font-bold text-indigo-600">{{ number_format($totalBankBDT, 2) }}</div>
        </div> -->
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Total Due</div>
            <div class="text-lg font-bold text-red-600">{{ number_format($totalDue, 2) }}</div>
        </div>
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Total Due Collection</div>
            <div class="text-lg font-bold text-purple-600">{{ number_format($totalDueCollection, 2) }}</div>
        </div>
        @if(!$isBranchAdmin)
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Total Agent Commission</div>
            <div class="text-lg font-bold text-orange-600">{{ number_format($totalAgentCommission, 2) }}</div>
        </div>
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Total Profit</div>
            <div class="text-lg font-bold text-emerald-600">{{ number_format($totalProfit, 2) }}</div>
        </div>
        @endif
        
    </div>

    <!-- Today Totals -->
    <div class="mb-4 grid grid-cols-2 md:grid-cols-{{ $isBranchAdmin ? 7 : 8 }} gap-2 bg-gradient-to-r from-yellow-50 to-pink-50 p-3 rounded-lg border border-yellow-200">
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Today Sales</div>
            <div class="text-lg font-bold text-green-600">{{ number_format($todaySales, 2) }}</div>
        </div>
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Today Cash (SR)</div>
            <div class="text-lg font-bold text-blue-600">{{ number_format($todayCash, 2) }}</div>
        </div>
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Today Bank (SR)</div>
            <div class="text-lg font-bold text-indigo-600">{{ number_format($todayBankSR, 2) }}</div>
        </div>
        <!-- <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Today Bank (BDT)</div>
            <div class="text-lg font-bold text-indigo-600">{{ number_format($todayBankBDT, 2) }}</div>
        </div> -->
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Today Due</div>
            <div class="text-lg font-bold text-red-600">{{ number_format($todayDue, 2) }}</div>
        </div>
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Today Due Collection</div>
            <div class="text-lg font-bold text-purple-600">{{ number_format($todayDueCollection, 2) }}</div>
        </div>
        @if(!$isBranchAdmin)
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Today Agent Commission</div>
            <div class="text-lg font-bold text-orange-600">{{ number_format($todayAgentCommission, 2) }}</div>
        </div>
        <div class="text-center bg-white p-2 rounded-md shadow-sm">
            <div class="text-xs text-gray-500 uppercase tracking-wide">Today Profit</div>
            <div class="text-lg font-bold text-emerald-600">{{ number_format($todayProfit, 2) }}</div>
        </div>
        @endif        
    </div>

    <!-- Table -->
    <div class="overflow-x-auto bg-white rounded-lg shadow-sm border border-gray-200">
        <table class="min-w-full divide-y divide-gray-200">
            <thead class="bg-gradient-to-r from-blue-500 to-indigo-600 text-white">
                <tr>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Create Date</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Delivery Date</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Invoice No</th>
                    @if(!$isBranchAdmin)
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Branch Name</th>
                    @endif
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Customer Name</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Identity No</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Service Name</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Service Rate</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Cash (SR)</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Bank (SR)</th>
                    <!-- <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Bank (BDT)</th> -->
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Tax ID</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Due</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Due Collection</th>
                    @if(!$isBranchAdmin)
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Agent Name</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Agent Commission</th>
                    <th class="px-3 py-2 text-left text-xs font-medium uppercase tracking-wider">Profit</th>
                    @endif
                </tr>
            </thead>
            <tbody class="bg-white divide-y divide-gray-200">
                @forelse($records as $record)
                    <tr class="hover:bg-gray-50 transition-colors duration-200">
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-gray-900 font-medium">{{ \Carbon\Carbon::parse($record->create_date)->format('Y-m-d H:i') }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-gray-900">{{ $record->delivery_date ? \Carbon\Carbon::parse($record->delivery_date)->format('Y-m-d') : 'N/A' }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs font-semibold text-blue-600">{{ $record->invoice_no }}</td>
                        @if(!$isBranchAdmin)
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-gray-900">{{ $record->branch_name }}</td>
                        @endif
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-gray-900">{{ $record->customer_name }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-gray-700">{{ $record->customer_id }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-indigo-600 font-medium">{{ $record->service_name }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-green-600 font-bold">{{ number_format($record->service_rate, 2) }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-blue-600 font-semibold">{{ number_format($record->cash, 2) }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-indigo-600 font-semibold">{{ number_format($record->bank_sr, 2) }}</td>
                        <!-- <td class="px-3 py-3 whitespace-nowrap text-xs text-indigo-600 font-semibold">{{ number_format($record->bank_bdt, 2) }}</td> -->
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-gray-700">{{ $record->tax_id ?? 'N/A' }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-red-600 font-bold">{{ number_format($record->due, 2) }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-purple-600 font-semibold">{{ number_format($record->due_collection, 2) }}</td>
                        @if(!$isBranchAdmin)
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-gray-900">{{ $record->agent_name ?? 'N/A' }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs text-orange-600 font-medium">{{ number_format($record->agent_commission, 2) }}</td>
                        <td class="px-3 py-3 whitespace-nowrap text-xs font-bold text-emerald-600">{{ number_format($record->profit, 2) }}</td>
                        @endif                        
                    </tr>
                @empty
                    <tr>
                        <td colspan="{{ $isBranchAdmin ? 14 : 17 }}" class="px-3 py-8 text-center text-xs text-gray-500 bg-gray-50">No records found.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>
@endsection