{% extends 'wfbo/_layout.html.twig' %}

{% block wfbo_title %}Correct Result{% endblock %}

{% block wfbo_content %}

    {% for flash in app.flashes('error') %}
        <div class="alert alert-danger mb-4" role="alert" data-testid="flash-error">{{ flash }}</div>
    {% endfor %}

    <div class="mb-4">
        <a href="{{ path('app_wfbo_event_race_show', {id: race.id}) }}" class="btn btn-sm btn-outline-secondary">← Back to race</a>
    </div>

    <div class="card mb-4">
        <div class="card-body">
            <h2 class="wfbo-card-title">Race {{ race.raceNumber }} — {{ race.event.management.name }} · {{ race.event.eventDate|date('Y-m-d') }}</h2>
            <p class="form-hint mb-3">
                Fix the winning combinations below and preview. Only tickets whose outcome or payout changes are
                touched: wrong payouts are taken back from the player (the wallet can go negative), commission paid
                on tickets that now win is taken back from the agents, and the correct winners are paid.
                Applying re-grades the affected tickets automatically — you don't need to settle the race again.
            </p>
            {% if dividendRows is not empty %}
                <div class="detail-label">Currently saved</div>
                <div class="detail-value" data-testid="correct-current-dividends">
                    {% for row in dividendRows %}
                        <div>
                            <strong>{{ row.label }}</strong>:
                            {% if row.refund %}Refunded{% endif %}
                            {% for c in row.combinations %}
                                {{ not loop.first ? ' · ' : (row.refund ? ' · ' : '') }}{% if c.selection %}{{ c.selection|capitalize }}{% else %}{{ c.numbers|join('-') }}{% endif %} : {{ c.dividend }}
                            {% else %}
                                {% if not row.refund %}—{% endif %}
                            {% endfor %}
                        </div>
                    {% endfor %}
                </div>
            {% endif %}
        </div>
    </div>

    {% if applying %}
        <div class="card mb-4" data-testid="correct-progress"
             data-controller="live-racing-correction"
             data-live-racing-correction-url-value="{{ path('app_wfbo_event_race_correct_result_batch', {id: race.id}) }}"
             data-live-racing-correction-token-value="{{ csrf_token('wfbo_event_race_correct_result_' ~ race.id) }}"
             data-live-racing-correction-reason-value="{{ reason }}"
             data-live-racing-correction-types-value="{{ changedTypeIds|join(',') }}"
             data-correction-state="running">
            <div class="card-body">
                <p class="mb-3" data-live-racing-correction-target="text" data-testid="correct-progress-text">
                    New result saved for {{ changedLabels|join(', ') }}. Re-grading tickets… keep this page open until it finishes.
                </p>
                <a href="{{ path('app_wfbo_event_race_show', {id: race.id}) }}" class="btn btn-sm btn-outline-secondary">Back to race</a>
            </div>
        </div>
    {% else %}
    {% embed 'wfbo/event-races/_result_form.html.twig' with {
        formAction: path('app_wfbo_event_race_correct_result', {id: race.id}),
        csrfToken:  csrf_token('wfbo_event_race_correct_result_' ~ race.id),
        formTestid: 'correct-result-form',
    } %}
        {% block actions %}
            {% if preview is not null %}
                <div class="card mb-3" data-testid="correct-preview">
                    <div class="card-body">
                        <h3 class="wfbo-card-title" style="font-size: 14px;">
                            Preview — {{ preview.changeCount }} ticket{{ preview.changeCount == 1 ? '' : 's' }} will change
                        </h3>
                        <p class="form-hint mb-3" data-testid="correct-preview-types">
                            Only {{ changedLabels|join(', ') }} tickets are affected — every other bet type on this race keeps its settlement.
                        </p>
                        <div class="d-flex flex-wrap gap-4 mb-3" data-testid="correct-preview-totals">
                            <div><div class="detail-label">Taken back from players</div><div class="detail-value" style="color:#dc2626;" data-testid="correct-clawback">₱{{ preview.clawback|number_format(2) }}</div></div>
                            <div><div class="detail-label">Commission taken back</div><div class="detail-value" style="color:#dc2626;" data-testid="correct-commission">₱{{ preview.commissionReversed|number_format(2) }}</div></div>
                            <div><div class="detail-label">Paid to players</div><div class="detail-value" style="color:#16a34a;" data-testid="correct-new-payouts">₱{{ preview.newPayouts|number_format(2) }}</div></div>
                        </div>

                        {% if preview.changes is empty %}
                            <p class="form-hint mb-0" data-testid="correct-preview-empty">No settled ticket changes with these combinations.</p>
                        {% else %}
                            <div class="table-scroll mb-3">
                                <table class="table data-table" style="margin:0; --bs-table-color:#000; --bs-table-bg:#fff;" data-testid="correct-preview-table">
                                    <thead>
                                        <tr>
                                            <th>Ticket</th>
                                            <th>Player</th>
                                            <th>Bet type</th>
                                            <th>Picks</th>
                                            <th>Was</th>
                                            <th>Becomes</th>
                                            <th class="text-end">Wallet change</th>
                                            <th class="text-end">Commission back</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for c in preview.changes %}
                                            <tr data-testid="correct-preview-row-{{ c.betId }}">
                                                <td>{{ c.reference }}</td>
                                                <td>{{ c.player }}</td>
                                                <td>{{ c.betType|replace({'_': ' '})|title }}</td>
                                                <td>{{ c.picks }}</td>
                                                <td>{{ c.oldStatus|capitalize }}{% if c.oldStatus == 'won' %} ₱{{ c.oldPayout|number_format(2) }}{% endif %}</td>
                                                <td>{{ c.newStatus|capitalize }}{% if c.newStatus == 'won' %} ₱{{ c.newPayout|number_format(2) }}{% endif %}</td>
                                                <td class="text-end" style="color: {{ c.walletDelta < 0 ? '#dc2626' : '#16a34a' }};">{{ c.walletDelta < 0 ? '-' : '+' }}₱{{ c.walletDelta|abs|number_format(2) }}</td>
                                                <td class="text-end">{{ c.commissionReversed > 0 ? '₱' ~ c.commissionReversed|number_format(2) : '—' }}</td>
                                            </tr>
                                        {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                            {% if preview.changeCount > preview.changes|length %}
                                <p class="form-hint" data-testid="correct-preview-more">+ {{ preview.changeCount - preview.changes|length }} more ticket(s) not listed (included in the totals).</p>
                            {% endif %}
                        {% endif %}

                        {% if preview.negativeUsers is not empty %}
                            <div class="alert alert-warning" data-testid="correct-negative-users">
                                These players' wallets will go negative (they can't bet or withdraw until topped up):
                                {% for u in preview.negativeUsers %}
                                    {{ not loop.first ? ', ' : '' }}{{ u.player }} (₱{{ u.balanceAfter|number_format(2) }})
                                {% endfor %}
                            </div>
                        {% endif %}

                        <label class="form-label fw-semibold" for="correct-reason">Reason for the correction</label>
                        <textarea id="correct-reason" name="reason" class="form-control mb-3" rows="2" maxlength="500" required
                                  placeholder="e.g. Daily Double declared 9-2, actual winner 9-1"
                                  data-testid="input-correct-reason">{{ reason }}</textarea>

                        <div class="d-flex flex-wrap gap-2">
                            <button type="submit" name="step" value="apply" formaction="{{ path('app_wfbo_event_race_correct_result', {id: race.id, step: 'apply'}) }}" class="btn btn-danger"
                                    onclick="return confirm('Apply this correction? Wallets will be debited/credited immediately.');"
                                    data-testid="btn-apply-correction">Apply correction</button>
                            <button type="submit" name="step" value="preview" formaction="{{ path('app_wfbo_event_race_correct_result', {id: race.id, step: 'preview'}) }}" formnovalidate class="btn btn-outline-secondary"
                                    data-testid="btn-preview-correction">Preview again</button>
                        </div>
                    </div>
                </div>
            {% else %}
                <button type="submit" name="step" value="preview" formaction="{{ path('app_wfbo_event_race_correct_result', {id: race.id, step: 'preview'}) }}" class="btn btn-admin-save"
                        data-testid="btn-preview-correction">Preview changes</button>
            {% endif %}
        {% endblock %}
    {% endembed %}
    {% endif %}

{% endblock %}