btcpayserver/BTCPayServer/Views/Wallets/Payouts.cshtml

@using BTCPayServer.Client.Models
@model PayoutsModel

@inject IEnumerable<IPayoutHandler> PayoutHandlers;
@{
    Layout = "../Shared/_NavLayout.cshtml";
    ViewData.SetActivePageAndTitle(WalletsNavPages.Payouts, "Manage payouts", Context.GetStoreData().StoreName);
}

<script type="text/javascript">
    function selectAll(e, elementClass)
    {
        const items = document.getElementsByClassName("selection-item-"+elementClass);
        for (let i = 0; i < items.length; i++) {
            items[i].checked = e.checked;
        }
    }
</script>

<form method="post">
<h4 class="mb-3">@ViewData["Title"]</h4>
    @if (!Model.PayoutStateSets.Any())
    {
        <p class="text-secondary mt-3">
            There are no payouts yet.
        </p>
    }
    <div class="row">
        <ul class="nav col-md-10 col-sm-12">
            @for (var index = 0; index < Model.PayoutStateSets.Count; index++)
            {
                var state = Model.PayoutStateSets[index];
                <li class="nav-item py-0">
                    <a class="nav-link btn btn-secondary btn-sm mr-1 @(index == 0 ? "active" : "")" data-toggle="tab" href="#@state.State" role="tab">@state.State.GetStateString() (@state.Payouts.Count)</a>
                </li>
            }
        </ul>
    </div>

    <div class="row">
        <div class="tab-content w-100">
            @for (var index = 0; index < Model.PayoutStateSets.Count; index++)
            {
                var state = Model.PayoutStateSets[index];
                var stateActions = new List<(string Action, string Text)>();
                switch (state.State)
                {
                    case PayoutState.AwaitingApproval:
                        stateActions.Add(("approve", "Approve selected payouts"));
                        stateActions.Add(("approve-pay", "Approve & Send selected payouts"));
                        stateActions.Add(("cancel", "Cancel selected payouts"));
                        break;
                    case PayoutState.AwaitingPayment:
                        stateActions.Add(("pay", "Send selected payouts"));
                        stateActions.Add(("cancel", "Cancel selected payouts"));
                        break;
                }
                <div class="tab-pane @(index == 0 ? "active" : "") " id="@state.State" role="tabpanel">
                    <input type="hidden" asp-for="PayoutStateSets[index].State"/>
                    <input type="hidden" asp-for="PaymentMethodId"/>

                    <div class="row mt-2 ml-2">
                        @if (state.Payouts.Any() && stateActions.Any())
                        {
                            <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown" id="@state.State-actions">
                                Actions
                            </button>
                            <div class="dropdown-menu">
                                @foreach (var action in stateActions)
                                {
                                    <button type="submit" id="@state.State-@action.Action" name="Command" class="dropdown-item" role="button" value="@state.State-@action.Action">@action.Text</button>
                                }
                            </div>
                        }
                    </div>
                    <div class="row">
                        <div class="col-md-12">

                            @if (state.Payouts.Any())
                            {
                                <table class="table table-sm table-responsive-lg">
                                    <thead class="thead-inverse">
                                    <tr>
                                        <th>
                                            <input id="@state.State-selectAllCheckbox" type="checkbox" onclick="selectAll(this, '@state.State.ToString()'); return true;"/>
                                        </th>
                                        <th style="min-width: 90px;" class="col-md-auto">
                                            Date
                                        </th>
                                        <th class="text-left">Source</th>
                                        <th class="text-left">Destination</th>
                                        <th class="text-right">Amount</th>
                                        @if (state.State != PayoutState.AwaitingApproval)
                                        {
                                            <th class="text-right">Transaction</th>
                                        }
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @for (int i = 0; i < state.Payouts.Count; i++)
                                    {
                                        var pp = state.Payouts[i];
                                        <tr class="payout">
                                            <td>
                                                <span>
                                                    <input type="checkbox" class="selection-item-@state.State.ToString()" asp-for="PayoutStateSets[index].Payouts[i].Selected"/>
                                                    <input type="hidden" asp-for="PayoutStateSets[index].Payouts[i].PayoutId"/>
                                                </span>
                                            </td>
                                            <td>
                                                <span>@pp.Date.ToBrowserDate()</span>
                                            </td>
                                            <td class="mw-100">
                                                <span>@pp.PullPaymentName</span>
                                            </td>
                                            <td>
                                                <span>@pp.Destination</span>
                                            </td>
                                            <td class="text-right">
                                                <span>@pp.Amount</span>
                                            </td>
                                            @if (state.State != PayoutState.AwaitingApproval)
                                            {
                                                <td class="text-right">
                                                    @if (!(pp.TransactionLink is null))
                                                    {
                                                        <a class="transaction-link" href="@pp.TransactionLink">Link</a>
                                                    }
                                                </td>
                                            }
                                        </tr>
                                    }
                                    </tbody>
                                </table>
                            }
                            else
                            {
                                <p class="mb-0 p-4" id="@state.State-no-payouts">No payouts.</p>
                            }
                        </div>
                    </div>
                </div>
            }
        </div>
    </div>
</form>