mirrors/btcpayserver
1
0
Fork 0
mirror of https://github.com/btcpayserver/btcpayserver.git synced 2025-02-20 13:34:37 +01:00
Code Issues Projects Releases Packages Wiki Activity

UI: Unify payment request list with invoices (#4294)

Browse source 
Some quick win updates to the payment requests list that unify the display with the invoices list:

- Status is displayed as badge
- Amount is properly formatted
- Expiry date format and ability to switch to relative date
This commit is contained in:
d11n 2022-11-18 05:24:57 +01:00 • committed by GitHub
parent ff572eef7f
commit 3942463ac9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 30 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
BTCPayServer/Controllers/UIPaymentRequestController.cs
View file

@ -74,7 +74,15 @@ namespace BTCPayServer.Controllers
IncludeArchived = includeArchived
});
model.Items = result.Select(data => new ViewPaymentRequestViewModel(data)).ToList();
model.Items = result.Select(data =>
{
var blob = data.GetBlob();
return new ViewPaymentRequestViewModel(data)
{
AmountFormatted = _Currencies.FormatCurrency(blob.Amount, blob.Currency)
};
}).ToList();
return View(model);
}

2
BTCPayServer/Models/PaymentRequestViewModels/ListPaymentRequestsViewModel.cs
View file

@ -101,7 +101,7 @@ namespace BTCPayServer.Models.PaymentRequestViewModels
switch (data.Status)
{
case Client.Models.PaymentRequestData.PaymentRequestStatus.Pending:
Status = ExpiryDate.HasValue ? $"Expires on {ExpiryDate.Value:g}" : "Pending";
Status = "Pending";
IsPending = true;
break;
case Client.Models.PaymentRequestData.PaymentRequestStatus.Completed:

2
BTCPayServer/Views/UIInvoice/ListInvoices.cshtml
View file

@ -285,7 +285,7 @@
<th class="w-150px">
<div class="d-flex align-items-center gap-1">
Date
<button type="button" class="btn btn-link p-0 fa fa-clock-o switch-time-format" title="Switch date format"></button>
<button type="button" class="btn btn-link p-0 fa fa-clock-o switch-time-format only-for-js" title="Switch date format"></button>
</div>
</th>
<th class="text-nowrap">Order Id</th>

24
BTCPayServer/Views/UIPaymentRequest/GetPaymentRequests.cshtml
View file

@ -1,4 +1,7 @@
@using BTCPayServer.Services.PaymentRequests
@using Microsoft.AspNetCore.Html
@using Microsoft.AspNetCore.Mvc.TagHelpers
@using BTCPayServer.Components
@model BTCPayServer.Models.PaymentRequestViewModels.ListPaymentRequestsViewModel
@{
Layout = "_Layout";
@ -55,9 +58,14 @@
<thead>
<tr>
<th>Title</th>
<th>Expiry</th>
<th class="text-end">Price</th>
<th class="text-end">Status</th>
<th class="w-150px">
<div class="d-flex align-items-center gap-1">
Expiry
<button type="button" class="btn btn-link p-0 fa fa-clock-o switch-time-format only-for-js" title="Switch date format"></button>
</div>
</th>
<th>Status</th>
<th class="text-end">Amount</th>
<th class="text-end">Actions</th>
</tr>
</thead>
@ -68,9 +76,13 @@
<td>
<a asp-action="EditPaymentRequest" asp-route-storeId="@item.StoreId" asp-route-payReqId="@item.Id" id="Edit-@item.Id">@item.Title</a>
</td>
<td>@(item.ExpiryDate?.ToString("g") ?? "No Expiry")</td>
<td class="text-end">@item.Amount @item.Currency</td>
<td class="text-end">@item.Status</td>
<td>
@(item.ExpiryDate?.ToBrowserDate() ?? new HtmlString($"<span class=\"text-muted\">No Expiry</span>"))
</td>
<td>
<span class="badge badge-@item.Status.ToLower()">@item.Status</span>
</td>
<td class="text-end">@item.AmountFormatted</td>
<td class="text-end">
<a asp-controller="UIInvoice" asp-action="ListInvoices" asp-route-storeId="@item.StoreId" asp-route-searchterm="@($"orderid:{PaymentRequestRepository.GetOrderIdForPaymentRequest(item.Id)}")">Invoices</a>
<span> - </span>

1
BTCPayServer/wwwroot/main/site.css
View file

@ -97,6 +97,7 @@ a.unobtrusive-link {
}
/* Badges */
.badge-pending,
.badge-new {
background: #d4edda;
color: #000;