{% extends 'layouts/admin.twig' %}

{% block content %}

<ul class="breadcrumbs el">
    <li><a href="/admin/">Admin</a> /</li>
    <li><a href="/admin/referrals">Referral Program</a> /</li>
    <li class="end">{{ page_title }}</li>
</ul>

<h1>Referral #{{ referral.id }}</h1>

<a href="/admin/referrals" class="btn btn-grey smaller">&laquo; Back to Dashboard</a>

{% if success_message %}
    <div class="msg">{{ success_message }}</div>
{% endif %}
{% if error_message %}
    <div class="msg error">{{ error_message }}</div>
{% endif %}

{% set tag_color = {
    pending: 'tag-yellow',
    signed_up: 'tag-blue',
    shipped: 'tag-blue',
    rewarded: 'tag-green',
    expired: 'tag-grey',
    cancelled: 'tag-red'
} %}

<div class="style el">
    <h4>Referral Information</h4>
    <table class="detailsTable">
        <tr class="firstRow">
            <td class="fieldName">Status</td>
            <td class="fieldValue">
                <span class="tag {{ tag_color[referral.status] ?? 'tag-grey' }}">
                    {{ referral.status|replace({'_': ' '})|capitalize }}
                </span>
            </td>
        </tr>
        <tr>
            <td class="fieldName">Channel</td>
            <td class="fieldValue">{{ referral.channel }}</td>
        </tr>
        <tr>
            <td class="fieldName">Referral Code</td>
            <td class="fieldValue"><code>{{ referral.referral_code }}</code></td>
        </tr>
        <tr>
            <td class="fieldName">Created</td>
            <td class="fieldValue">{{ referral.created_at|date('d M Y H:i') }}</td>
        </tr>
        <tr>
            <td class="fieldName">Expires</td>
            <td class="fieldValue">{{ referral.expires_at ? referral.expires_at|date('d M Y') : 'N/A' }}</td>
        </tr>
        {% if referral.qualifying_order_id %}
        <tr>
            <td class="fieldName">Qualifying Order</td>
            <td class="fieldValue">#{{ referral.qualifying_order_id }}</td>
        </tr>
        {% endif %}
    </table>
</div>

<div class="cols2 el">
    <div class="style">
        <h4>Referrer</h4>
        {% if referral.referrer %}
            <p><strong>{{ referral.referrer.fullname ?? 'N/A' }}</strong></p>
            <p>{{ referral.referrer.email }}</p>
            <p>ID: {{ referral.referrer.id }}</p>
        {% else %}
            <p>N/A</p>
        {% endif %}
    </div>
    <div class="style">
        <h4>Referee</h4>
        {% if referral.referee %}
            <p><strong>{{ referral.referee.fullname ?? 'N/A' }}</strong></p>
            <p>{{ referral.referee.email }}</p>
            <p>ID: {{ referral.referee.id }}</p>
        {% else %}
            <p>{{ referral.referee_email }} (not yet registered)</p>
        {% endif %}
    </div>
</div>

{% if referral.rewards|length > 0 %}
    <div class="style el">
        <h4>Rewards</h4>
        <table class="tabular">
            <thead>
                <tr>
                    <th>Type</th>
                    <th>Member</th>
                    <th>Coupon Code</th>
                    <th>Amount</th>
                    <th>Status</th>
                    <th>Issued</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                {% set reward_tag_color = {
                    pending: 'tag-yellow',
                    issued: 'tag-blue',
                    redeemed: 'tag-green',
                    revoked: 'tag-red',
                    expired: 'tag-grey'
                } %}
                {% for reward in referral.rewards %}
                    <tr>
                        <td>{{ reward.type|capitalize }}</td>
                        <td>{{ reward.member_id }}</td>
                        <td><code>{{ reward.coupon_code ?? 'N/A' }}</code></td>
                        <td>{{ reward.amount|currency_format }}</td>
                        <td>
                            <span class="tag {{ reward_tag_color[reward.status] ?? 'tag-grey' }}">
                                {{ reward.status|capitalize }}
                            </span>
                        </td>
                        <td>{{ reward.issued_at ? reward.issued_at|date('d M Y') : 'Pending' }}</td>
                        <td>
                            {% if reward.status == 'issued' %}
                                <form method="post" action="/admin/referrals/revoke/{{ reward.id }}" style="display:inline;">
                                    <input type="text" name="reason" placeholder="Reason" required class="short">
                                    <button type="submit" class="btn btn-delete smaller"
                                            onclick="return confirm('Revoke this reward?')">
                                        Revoke
                                    </button>
                                </form>
                            {% elseif reward.status == 'revoked' %}
                                <small>{{ reward.revoke_reason }}</small>
                            {% endif %}
                        </td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
{% endif %}

<div class="style el">
    <h4>Activity Log</h4>
    <table class="tabular">
        <thead>
            <tr>
                <th>Date</th>
                <th>Action</th>
                <th>Member</th>
            </tr>
        </thead>
        <tbody>
            {% for log in referral.activityLog %}
                <tr>
                    <td>{{ log.created_at|date('d M Y H:i:s') }}</td>
                    <td>{{ log.action|replace({'_': ' '})|capitalize }}</td>
                    <td>{% if log.member_id %}#{{ log.member_id }}{% endif %}</td>
                </tr>
            {% else %}
                <tr>
                    <td colspan="3">No activity recorded.</td>
                </tr>
            {% endfor %}
        </tbody>
    </table>
</div>

{% endblock %}
