@extends('layouts.app_web')

@section('title', trans('admin.show_qr'))

@section('content')
    <div class="mb-4">
        <a href="{{ route('web.my_rewards', ['_token' => request('_token')]) }}" class="btn btn-label-secondary btn-sm mb-3">
            <i class="ti ti-chevron-left me-1"></i> {{ trans('admin.back') }}
        </a>
    </div>

    <div class="qr-wrapper">
        <div class="mb-4">
            <h4 class="fw-bold mb-1">{{ $reward->name }}</h4>
            <span class="badge bg-label-{{ $userReward->status === 'unused' ? 'success' : ($userReward->status === 'used' ? 'info' : 'danger') }} status-badge mb-3">
                {{ trans('admin.' . $userReward->status) }}
            </span>
            <p class="text-muted small mx-auto" style="max-width: 250px;">
                {{ trans('admin.show_this_qr_to_partner') }}
            </p>
        </div>

        <div class="mb-4">
            <img src="{{ $qrImageBase64 }}" alt="QR Code" class="qr-image">
        </div>

        <div class="bg-light p-3 rounded-3 text-start">
            <div class="d-flex justify-content-between mb-2">
                <span class="text-muted small">{{ trans('admin.partner') }}:</span>
                <span class="fw-bold small">{{ $reward->partner_name ?? '-' }}</span>
            </div>
            <div class="d-flex justify-content-between mb-2">
                <span class="text-muted small">{{ trans('admin.token') }}:</span>
                <code class="small">{{ $userReward->qr_token }}</code>
            </div>
            @if($reward->expiry_date)
            <div class="d-flex justify-content-between">
                <span class="text-muted small">{{ trans('admin.expiry_date') }}:</span>
                <span class="text-danger fw-bold small">{{ $reward->expiry_date->format('Y-m-d') }}</span>
            </div>
            @endif
        </div>
    </div>
@endsection