@component('components.smart_receipt.popup.template', ['id' => 'popup_reward'])

@once
    @push('script')
        @if($hasScratchReward = config('smart_receipt.settings.has_scratch_reward'))
            <script src="{{ mix('js/main/scratch.js') }}"></script>
        @endif
        <script>
            const hasScratchReward = {{ boolToInt($hasScratchReward) }};
        </script>
    @endpush
@endonce

<!-- Reward Image Title Description -->

<div class="status_item" status_id="default">
    {{-- code needs recheck--}}
    <h5 id="reward-description">{{ __('smart_receipt.titleReward') }}</h5>
    <p>{{ __('smart_receipt.labelRewardDescription', ['num_reward' => 1]) }}</p>
    <div class="row no-gutters voucher_card-scratchcard">
        <div class="scratch-container mx-auto w-100">
            <div class="scratch-result"></div>
            <div id="scratch-result-text-template" class="text-center" style="display:none;">
                <h5 class="title"></h5>
                <input class="reward-code text-center" value="" disabled/>
            </div>
        </div>
    </div>

    <div class="show-on-redeem mt-3">
        <div class="btn-wrap">
            @include('components.smart_receipt.btn-view-receipt')
            @include('components.smart_receipt.btn-receipt-reupload')
            <button id="submit-address" class='btn btn-primary' onclick="loadPopup('popup_completed', 'address');">
                {{ __('label.btn_submit_delivery_address') }}
            </button>
        </div>
    </div>
</div>

@endcomponent