@include('admin.dash.layout.header')
<div class="nk-content ">
    <div class="container-fluid">
        <div class="nk-content-inner">
            <div class="nk-content-body">
                <div class="components-preview wide-md mx-auto">
                    <div class="nk-block nk-block-lg">
                        <div class="nk-block-head">
                            <div class="nk-block-head-content">
                                <h4 class="nk-block-title">Transactions</h4>
                                <div class="nk-block-des">
                                    <p>Here, you can see all the <code class="code-class">transactions</code> available on Stizee.</p>
                                </div>
                            </div>
                        </div>

                        <!-- Search and Filter Section -->
                        <div class="card mb-4">
                            <div class="card-inner">
                                <form method="GET" action="{{ url()->current() }}">
                                    <div class="row g-3">
                                        <!-- Search Input -->
                                        <div class="col-md-4">
                                            <div class="form-group">
                                                <label class="form-label">Search</label>
                                                <input type="text" class="form-control" name="search" 
                                                       value="{{ request('search') }}" 
                                                       placeholder="Search by user, transaction ID, or amount...">
                                            </div>
                                        </div>
                                        
                                        <!-- Type Filter -->
                                        <div class="col-md-2">
                                            <div class="form-group">
                                                <label class="form-label">Type</label>
                                                <select class="form-select" name="type">
                                                    <option value="all">All Types</option>
                                                    @foreach($types as $type)
                                                        <option value="{{ $type }}" 
                                                                {{ request('type') == $type ? 'selected' : '' }}>
                                                            {{ ucfirst($type) }}
                                                        </option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                        
                                        <!-- Status Filter -->
                                        <div class="col-md-2">
                                            <div class="form-group">
                                                <label class="form-label">Status</label>
                                                <select class="form-select" name="status">
                                                    <option value="all">All Status</option>
                                                    @foreach($statuses as $status)
                                                        <option value="{{ $status }}" 
                                                                {{ request('status') == $status ? 'selected' : '' }}>
                                                            {{ ucfirst($status) }}
                                                        </option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                        
                                        <!-- Date From -->
                                        <div class="col-md-2">
                                            <div class="form-group">
                                                <label class="form-label">Date From</label>
                                                <input type="date" class="form-control" name="date_from" 
                                                       value="{{ request('date_from') }}">
                                            </div>
                                        </div>
                                        
                                        <!-- Date To -->
                                        <div class="col-md-2">
                                            <div class="form-group">
                                                <label class="form-label">Date To</label>
                                                <input type="date" class="form-control" name="date_to" 
                                                       value="{{ request('date_to') }}">
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <div class="row g-3 mt-2">
                                        <!-- Amount Min -->
                                        <div class="col-md-2">
                                            <div class="form-group">
                                                <label class="form-label">Min Amount</label>
                                                <input type="number" class="form-control" name="amount_min" 
                                                       value="{{ request('amount_min') }}" 
                                                       placeholder="0" step="0.01">
                                            </div>
                                        </div>
                                        
                                        <!-- Amount Max -->
                                        <div class="col-md-2">
                                            <div class="form-group">
                                                <label class="form-label">Max Amount</label>
                                                <input type="number" class="form-control" name="amount_max" 
                                                       value="{{ request('amount_max') }}" 
                                                       placeholder="999999" step="0.01">
                                            </div>
                                        </div>
                                        
                                        <!-- Action Buttons -->
                                        <div class="col-md-8 d-flex align-items-end">
                                            <div class="form-group">
                                                <button type="submit" class="btn btn-primary me-2">
                                                    <em class="icon ni ni-search"></em> Filter
                                                </button>
                                                <a href="{{ url()->current() }}" class="btn btn-outline-secondary">
                                                    <em class="icon ni ni-reload"></em> Reset
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <!-- Preserve sort parameters -->
                                    @if(request('sort'))
                                        <input type="hidden" name="sort" value="{{ request('sort') }}">
                                    @endif
                                    @if(request('order'))
                                        <input type="hidden" name="order" value="{{ request('order') }}">
                                    @endif
                                </form>
                            </div>
                        </div>

                        <!-- Transaction Stats -->
                        <div class="row g-gs mb-4">
                            @php
                                $totalTransactions = $trans->count();
                                $totalAmount = $trans->sum('amount');
                                $todayTransactions = $trans->where('created_at', '>=', now()->startOfDay())->count();
                                $todayAmount = $trans->where('created_at', '>=', now()->startOfDay())->sum('amount');
                                $successfulTransactions = $trans->where('status', 'success')->count();
                                $pendingTransactions = $trans->where('status', 'pending')->count();
                            @endphp

                            <div class="col-xxl-3 col-sm-6">
                                <div class="card">
                                    <div class="nk-ecwg nk-ecwg6">
                                        <div class="card-inner">
                                            <div class="card-title-group">
                                                <div class="card-title">
                                                    <h6 class="title">Total Transactions</h6>
                                                </div>
                                            </div>
                                            <div class="data">
                                                <div class="amount">{{ number_format($totalTransactions) }}</div>
                                                <div class="info">+{{ $todayTransactions }} today</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xxl-3 col-sm-6">
                                <div class="card">
                                    <div class="nk-ecwg nk-ecwg6">
                                        <div class="card-inner">
                                            <div class="card-title-group">
                                                <div class="card-title">
                                                    <h6 class="title">Total Revenue</h6>
                                                </div>
                                            </div>
                                            <div class="data">
                                                <div class="amount">₦{{ number_format($totalAmount, 2) }}</div>
                                                <div class="info">₦{{ number_format($todayAmount, 2) }} today</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xxl-3 col-sm-6">
                                <div class="card">
                                    <div class="nk-ecwg nk-ecwg6">
                                        <div class="card-inner">
                                            <div class="card-title-group">
                                                <div class="card-title">
                                                    <h6 class="title">Successful</h6>
                                                </div>
                                            </div>
                                            <div class="data">
                                                <div class="amount">{{ number_format($successfulTransactions) }}</div>
                                                <div class="info">{{ $totalTransactions > 0 ? round(($successfulTransactions / $totalTransactions) * 100, 1) : 0 }}% success rate</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xxl-3 col-sm-6">
                                <div class="card">
                                    <div class="nk-ecwg nk-ecwg6">
                                        <div class="card-inner">
                                            <div class="card-title-group">
                                                <div class="card-title">
                                                    <h6 class="title">Pending</h6>
                                                </div>
                                            </div>
                                            <div class="data">
                                                <div class="amount">{{ number_format($pendingTransactions) }}</div>
                                                <div class="info">{{ $totalTransactions > 0 ? round(($pendingTransactions / $totalTransactions) * 100, 1) : 0 }}% pending</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Transactions Table -->
                        <table class="datatable-init-export nowrap nk-tb-list is-separate" data-auto-responsive="false" data-order="5">
                            @php
                                $currentSort = request('sort', 'id');
                                $currentOrder = request('order', 'DESC');
                                $newOrder = ($currentOrder === 'ASC') ? 'DESC' : 'ASC';
                                
                                // Build query string for sort links
                                $queryParams = request()->query();
                                $buildSortUrl = function($sortField) use ($currentSort, $newOrder, $queryParams) {
                                    $params = $queryParams;
                                    $params['sort'] = $sortField;
                                    $params['order'] = $currentSort === $sortField ? $newOrder : 'ASC';
                                    return '?' . http_build_query($params);
                                };
                            @endphp

                            <thead>
                                <tr class="nk-tb-item nk-tb-head">
                                    <th class="nk-tb-col tb-col-sm">
                                        <a href="{{ $buildSortUrl('user_name') }}" class="text-decoration-none">
                                            <span>User</span>
                                            @if($currentSort === 'user_name')
                                                <em class="icon ni ni-{{ $currentOrder === 'ASC' ? 'arrow-up' : 'arrow-down' }}"></em>
                                            @endif
                                        </a>
                                    </th>
                                    <th class="nk-tb-col tb-col-sm">
                                        <a href="{{ $buildSortUrl('type') }}" class="text-decoration-none">
                                            <span>Type</span>
                                            @if($currentSort === 'type')
                                                <em class="icon ni ni-{{ $currentOrder === 'ASC' ? 'arrow-up' : 'arrow-down' }}"></em>
                                            @endif
                                        </a>
                                    </th>
                                    <th class="nk-tb-col">
                                        <a href="{{ $buildSortUrl('transaction_id') }}" class="text-decoration-none">
                                            <span>Tnx ID</span>
                                            @if($currentSort === 'transaction_id')
                                                <em class="icon ni ni-{{ $currentOrder === 'ASC' ? 'arrow-up' : 'arrow-down' }}"></em>
                                            @endif
                                        </a>
                                    </th>
                                    <th class="nk-tb-col">
                                        <a href="{{ $buildSortUrl('amount') }}" class="text-decoration-none">
                                            <span>Amount</span>
                                            @if($currentSort === 'amount')
                                                <em class="icon ni ni-{{ $currentOrder === 'ASC' ? 'arrow-up' : 'arrow-down' }}"></em>
                                            @endif
                                        </a>
                                    </th>
                                    <th class="nk-tb-col">
                                        <a href="{{ $buildSortUrl('status') }}" class="text-decoration-none">
                                            <span>Status</span>
                                            @if($currentSort === 'status')
                                                <em class="icon ni ni-{{ $currentOrder === 'ASC' ? 'arrow-up' : 'arrow-down' }}"></em>
                                            @endif
                                        </a>
                                    </th>
                                    <th class="nk-tb-col">
                                        <a href="{{ $buildSortUrl('date') }}" class="text-decoration-none">
                                            <span>Date</span>
                                            @if($currentSort === 'date')
                                                <em class="icon ni ni-{{ $currentOrder === 'ASC' ? 'arrow-up' : 'arrow-down' }}"></em>
                                            @endif
                                        </a>
                                    </th>
                                    <th class="nk-tb-col nk-tb-col-tools">
                                        <ul class="nk-tb-actions gx-1 my-n1">
                                        </ul>
                                    </th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($trans as $d)
                                <tr class="nk-tb-item">
                                    <td class="nk-tb-col tb-col-sm">
                                        <span class="tb-product"> 
                                            <span class="title">{{ $d->user_name ?? 'Unknown User' }}</span>
                                        </span>
                                    </td>
                                    
                                    <td class="nk-tb-col tb-col-sm">
                                        @php
                                            $typeColors = [
                                                'deposit' => 'success',
                                                'withdrawal' => 'danger', 
                                                'earning' => 'success',
                                                'order' => 'primary',
                                                'refund' => 'warning',
                                                'subscription' => 'info'
                                            ];
                                            $typeColor = $typeColors[strtolower($d->type ?? 'default')] ?? 'secondary';
                                        @endphp
                                        <span class="badge bg-{{ $typeColor }}">{{ ucfirst($d->type ?? 'Unknown') }}</span>
                                    </td>
                                    
                                    <td class="nk-tb-col tb-col-md">
                                        <span class="tb-sub">{{ $d->tnx_id ?? $d->id }}</span>
                                    </td>

                                    <td class="nk-tb-col tb-col-md">
                                        <span class="tb-amount">₦{{ number_format($d->amount ?? 0, 2) }}</span>
                                    </td>

                                    <td class="nk-tb-col tb-col-md">
                                        @php
                                            $statusColors = [
                                                'success' => 'success',
                                                'completed' => 'success',
                                                'pending' => 'warning',
                                                'failed' => 'danger',
                                                'cancelled' => 'danger'
                                            ];
                                            $statusColor = $statusColors[$d->status ?? 'pending'] ?? 'secondary';
                                        @endphp
                                        <span class="badge bg-dot bg-{{ $statusColor }}">{{ ucfirst($d->status ?? 'Pending') }}</span>
                                    </td>
                                   
                                    <td class="nk-tb-col tb-col-md">
                                        <span class="tb-sub">{{ \Carbon\Carbon::parse($d->created_at)->format('M d, Y') }}</span>
                                        <span class="tb-sub d-block">{{ \Carbon\Carbon::parse($d->created_at)->format('h:i A') }}</span>
                                    </td>
                                   
                                    <td class="nk-tb-col nk-tb-col-tools">
                                        <ul class="nk-tb-actions gx-1 my-n1">
                                            <li class="nk-tb-action-hidden">
                                                <a href="/admin/user/{{ $d->userid }}" class="btn btn-trigger btn-icon" data-toggle="tooltip" data-placement="top" title="View User"><em class="icon ni ni-eye"></em></a>
                                            </li>
                                        </ul>
                                    </td>
                                </tr>
                               @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@include('admin.dash.layout.footer')