btcpayserver/BTCPayServer/Views/Invoice/ListInvoices.cshtml

@model InvoicesModel
@{
    ViewData["Title"] = "Invoices";
    var rootUrl = Context.Request.GetAbsoluteRoot();
}

@section HeadScripts {
    <script src="~/modal/btcpay.js"></script>
}

<section>
    <div class="container">

        <div class="row">
            <div class="col-lg-12 text-center">
                <partial name="_StatusMessage" for="StatusMessage" />
            </div>
        </div>

        <div class="row">
            <div class="col-lg-12 text-center">
                <h2 class="section-heading">@ViewData["Title"]</h2>
                <hr class="primary">
                <p>Create, search or pay an invoice. (<a href="#help" data-toggle="collapse">Help</a>)</p>
                <div id="help" class="collapse text-left">
                    <p>
                        You can search for invoice Id, deposit address, price, order id, store id, any buyer information and any product information.<br />
                        You can also apply filters to your search by searching for <code>filtername:value</code>, here is a list of supported filters
                    </p>
                    <ul>
                        <li><code>storeid:id</code> for filtering a specific store</li>
                        <li><code>status:(expired|invalid|complete|confirmed|paid|new)</code> for filtering a specific status</li>
                        <li><code>exceptionstatus:(paidover|paidlate|paidpartial)</code> for filtering a specific exception state</li>
                        <li><code>unusual:(true|false)</code> for filtering invoices which might requires merchant attention (those invalid or with an exceptionstatus)</li>
                    </ul>
                    <p>
                        If you want all confirmed and complete invoices, you can duplicate a filter <code>status:confirmed status:complete</code>.
                    </p>
                </div>
            </div>
        </div>

        <div class="row no-gutter" style="margin-bottom: 5px;">
            <div class="col-lg-6">
                <a asp-action="CreateInvoice" class="btn btn-primary" role="button"><span class="fa fa-plus"></span> Create a new invoice</a>

                <a class="btn btn-primary dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    Export
                </a>
                <div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
                    <a asp-action="Export" asp-route-format="json" asp-route-searchTerm="@Model.SearchTerm" class="dropdown-item" target="_blank">CSV</a>
                </div>
            </div>

            <div class="col-lg-6">
                <div class="form-group">
                    <form asp-action="SearchInvoice" method="post" style="float:right;">
                        <div class="input-group">
                            <input asp-for="SearchTerm" class="form-control" style="width:300px;" />
                            <span class="input-group-btn">
                                <button type="submit" class="btn btn-primary" title="Search invoice">
                                    <span class="fa fa-search"></span> Search
                                </button>
                            </span>
                        </div>
                        <input type="hidden" asp-for="Count" />
                        <span asp-validation-for="SearchTerm" class="text-danger"></span>
                    </form>
                </div>
            </div>
        </div>

        <div class="row">
            <table class="table table-sm table-responsive-md">
                <thead>
                    <tr>
                        <th>Date</th>
                        <th>OrderId</th>
                        <th>InvoiceId</th>
                        <th>Status</th>
                        <th style="text-align:right">Amount</th>
                        <th style="text-align:right">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var invoice in Model.Invoices)
                    {
                        <tr>
                            <td>@invoice.Date.ToTimeAgo()</td>
                            <td>
                                @if (invoice.RedirectUrl != string.Empty)
                                {
                                    <a href="@invoice.RedirectUrl">@invoice.OrderId</a>
                                }
                                else
                                {
                                    <span>@invoice.OrderId</span>
                                }
                            </td>
                            <td>@invoice.InvoiceId</td>
                            @if (invoice.Status == "paid")
                            {
                                <td>
                                    <div class="btn-group">
                                        <a class="dropdown-toggle dropdown-toggle-split" style="cursor: pointer;" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                            @invoice.Status <span class="sr-only">Toggle Dropdown</span>
                                        </a>
                                        <div class="dropdown-menu pull-right">
                                            <button class="dropdown-item small" data-toggle="modal" data-target="#myModal" onclick="$('#invoiceId').val('@invoice.InvoiceId')">Make Invalid</button>
                                        </div>
                                    </div>
                                </td>
                            }
                            else
                            {
                                <td>@invoice.Status</td>
                            }
                            <td style="text-align:right">@invoice.AmountCurrency</td>
                            <td style="text-align:right">
                                @if (invoice.ShowCheckout)
                                {
                                    <span>
                                        <a asp-action="Checkout" asp-route-invoiceId="@invoice.InvoiceId">Checkout</a>
                                        <a href="javascript:btcpay.showInvoice('@invoice.InvoiceId')">[^]</a>
                                        -
                                    </span>
                                }
                                <a asp-action="Invoice" asp-route-invoiceId="@invoice.InvoiceId">Details</a>
                            </td>
                        </tr>
                    }
                </tbody>
            </table>
            <span>
                @if (Model.Skip != 0)
                {
                    <a href="@Url.Action("ListInvoices", new
                        {
                            searchTerm = Model.SearchTerm,
                            skip = Math.Max(0, Model.Skip - Model.Count),
                            count = Model.Count,
                        })"><<</a><span> - </span>
                }
                <a href="@Url.Action("ListInvoices", new
                    {
                        searchTerm = Model.SearchTerm,
                        skip = Model.Skip + Model.Count,
                        count = Model.Count,
                    })">>></a>
            </span>
        </div>

    </div>
</section>

<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
    <form method="post" action="/invoices/invalidatepaid">
        <input id="invoiceId" name="invoiceId" type="hidden" />
        <div class="modal-dialog">

            <!-- Modal content-->
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Set Invoice status to Invalid</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body">
                    <p>Are you sure you want to invalidate this transaction? This action is NOT undoable!</p>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-danger">Yes, make invoice Invalid</button>
                    <button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>
                </div>
            </div>

        </div>
    </form>
</div>