@extends('layouts.master')

@section('content')
<div class="row">
    <div class="col-md-12">
        <div class="card">
            <div class="card-header">
                <h5>Transactions History</h5>
                <div class="card-header-right">
                    <form action="{{ route('tech-support.transactions') }}" method="GET" class="d-inline-flex">
                        <select name="status" class="form-select form-select-sm me-2" onchange="this.form.submit()">
                            <option value="">All Statuses</option>
                            <option value="completed" {{ request('status') == 'completed' ? 'selected' : '' }}>Completed</option>
                            <option value="pending" {{ request('status') == 'pending' ? 'selected' : '' }}>Pending</option>
                            <option value="failed" {{ request('status') == 'failed' ? 'selected' : '' }}>Failed</option>
                        </select>
                    </form>
                </div>
            </div>
            <div class="card-body table-border-style">
                <div class="table-responsive">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>Card</th>
                                <th>Brand</th>
                                <th>Original Amount</th>
                                <th>Discount</th>
                                <th>Paid Amount</th>
                                <th>Status</th>
                                <th>Date & Time</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($transactions as $transaction)
                            <tr>
                                <td>{{ $transaction->card_usage_history_id }}</td>
                                <td>
                                    @if($transaction->card)
                                        {{ $transaction->card->card_no ?? $transaction->card->mobile_number }}
                                    @else
                                        <span class="text-muted">N/A</span>
                                    @endif
                                </td>
                                <td>{{ $transaction->brand->brand_name_en ?? 'N/A' }}</td>
                                <td>{{ number_format($transaction->transaction_value ?? 0, 2) }}</td>
                                <td>{{ number_format($transaction->discount_percentage ?? 0, 1) }}%</td>
                                <td><strong>{{ number_format($transaction->amount_to_be_paid ?? 0, 2) }}</strong></td>
                                <td>
                                    <span class="badge bg-{{ ($transaction->status == 'completed' || $transaction->status == 'approved') ? 'success' : ($transaction->status == 'pending' ? 'warning' : 'danger') }}">
                                        {{ ucfirst($transaction->status) }}
                                    </span>
                                </td>
                                <td>
                                    <span class="text-muted" title="{{ $transaction->created_at }}">
                                        {{ $transaction->created_at ? \Carbon\Carbon::parse($transaction->created_at)->format('Y-m-d h:i A') : 'N/A' }}
                                    </span>
                                </td>
                            </tr>
                            @empty
                            <tr>
                                <td colspan="8" class="text-center">No transactions found.</td>
                            </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
                <div class="mt-3">
                    {{ $transactions->withQueryString()->links() }}
                </div>
            </div>
        </div>
    </div>
</div>
@endsection