@extends('admin.layouts.masterlayout')

@section('title')
    View Referral Reward
@endsection

@section('head_title')
    Referral Reward
@endsection

@section('content')
    <div class="dashboard-body-content">
        <div class="dashboard-breadcrumb-section">
            <h2>Referral Reward Details</h2>
            <p><a href="{{ route('admin.referral-reward.index') }}">Referral Reward List</a> / Referral Reward Details </p>
        </div>
        <div class="row">
            <div class="col-lg-4">
                <div class="post-image-container h-auto mb-4">
                    <div class="post-image-title">
                        <h2>Referral Reward Details</h2>
                    </div>
                    <div class="post-image-body">
                        <div class="post-image-flex mb-3">
                            <h2>Shop:</h2>
                            <p>{{ $referralReward->shop->shop_name ?? 'NA' }}</p>
                        </div>
                        <div class="post-image-flex mb-3">
                            <h2>Refer Code:</h2>
                            <p>{{ $referralReward->refer_code ?? 'NA' }}</p>
                        </div>
                        <div class="post-image-flex mb-3">
                            <h2>Refer Type:</h2>
                            <p>{{ $referralReward->refer_type == 0 ? 'Percentage' : 'Fixed' }}</p>
                        </div>
                        <div class="post-image-flex mb-3">
                            <h2>Eligibility:</h2>
                            <p>{{ $referralReward->eligibility == 0 ? 'Existing Users' : 'New Users' }}</p>
                        </div>
                        <div class="post-image-flex mb-3">
                            <h2>Reward Earned:</h2>
                            <p>{{ $referralReward->reward_earned ?? 'NA' }}</p>
                        </div>
                        <div class="post-image-flex mb-3">
                            <h2>Referral Limit:</h2>
                            <p>{{ $referralReward->referral_limit ?? 'NA' }}</p>
                        </div>
                        <div class="post-image-flex mb-3">
                            <h2>Expiry Date:</h2>
                            <p>{{ \Carbon\Carbon::parse($referralReward->expiry_date)->format('F d, Y') ?? 'NA' }}</p>
                        </div>
                        <div class="post-image-flex mb-3">
                            <h2>Extra Notes:</h2>
                            <p>{{ $referralReward->extra_notes ?? 'NA' }}</p>
                        </div>
                        <div class="post-image-flex mb-3">
                            <h2>Show To Users:</h2>
                            <p>{{ $referralReward->show_to_users == 1 ? 'Yes' : 'No' }}</p>
                        </div>
                        <div class="col-lg-12">
                            <div class="post-image-flex mb-3 align-items-center">
                                <h2>Status</h2>
                                @php
                                    $status = $referralReward->status ?? 'inactive';
                                    $statusClass = $status === 'active' ? 'active' : 'inactive';
                                    $statusText = ucfirst($statusClass);
                                @endphp
                                <div class="table-badge {{ $statusClass }}">{{ $statusText }}</div>
                            </div>
                        </div>
                        <div class="col-lg-12">
                            <div class="post-image-flex mb-3 align-items-center">
                                <h2>Is Expired</h2>
                                @php
                                    $isExpired = $referralReward->is_expired ?? 'inactive';
                                    $isExpiredClass = $isExpired === 'active' ? 'active' : 'inactive';
                                    $isExpiredText = $referralReward->is_expired == 0 ? 'No' : 'Yes';
                                @endphp
                                <div class="table-badge {{ $isExpiredClass }}">{{ $isExpiredText }}</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-8">
            <div class="post-image-container h-auto mb-4">
                <div class="post-image-title">
                    <h2>Referral Usages History</h2>
                </div>
                <div class="post-image-body px-1 pt-3 promo-usages-history">

                    <div class="tab-content">
                        <div id="artist_data">
                            <div class="ct-dashboard-table-container">
                                <div class="card p-0 border-0 shadow-none">
                                    <div class="table-responsive">
                                        <table class="table mb-0" id="referralUsage_Table">
                                            <thead>
                                                <tr>
                                                    <th>#</th>
                                                    <th>Customer Name</th>
                                                    <th>Email</th>
                                                    <th>Shop</th>
                                                    <th>Used Date</th>
                                                    <th>Promo</th>
                                                    <th>Value</th>
                                                </tr>
                                            </thead>
                                            <tbody> </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>

        </div>
        </div>
    </div>
@endsection
@section('script')
<script src="{{ asset('assets/js/dataTables.js') }}"></script>
<script>
    $(document).ready(function() {
        // === REQUESTED DATATABLE ===
        const referralUsage_Table = $('#referralUsage_Table').DataTable({
            dom: '<<"table-responsive"t><"pagination-container"<i><p>>>',
            processing: true,
            serverSide: true,
            ajax: "{{route('admin.getReferralrewardUsageList')}}",
            order: [],
             columns: [
                { data: 'DT_RowIndex', name: 'DT_RowIndex',orderable: false, searchable: false  },
                { data: 'customer_name', name: 'customer_name',orderable: false, searchable: false  },
                { data: 'customer_email', name: 'customer_email',orderable: false, searchable: false  },
                { data: 'shop_name', name: 'shop_name',orderable: false, searchable: false  },
                { data: 'used_date', name: 'used_date',orderable: false, searchable: false  },
                { data: 'refer_code', name: 'refer_code',orderable: false, searchable: false  },
                { data: 'reward_earned', name: 'reward_earned',orderable: false, searchable: false  },
            ]
        });


    });
</script>
@endsection