aljaz/btcpayserver
1
0
Fork 0
mirror of https://github.com/aljazceru/btcpayserver.git synced 2025-12-17 22:14:26 +01:00
Code Issues Packages Projects Releases Wiki Activity

Hide pagination & page size when not necessary (#2122)

Browse Source 
* UI: Hide pagination and page size when not necessary

* UI: Use pager component for notifications list

* UI: Use pager component for wallet transactions list

* UI: Improve pager component

* Fix from code review
This commit is contained in:
Dennis Reimann
2020-12-12 07:21:37 +01:00
committed by GitHub
parent 282d0abb62
commit ed497cab99
8 changed files with 71 additions and 199 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
BTCPayServer/Components/Pager/Default.cshtml
View File

@@ -1,8 +1,14 @@
@model BasePagingViewModel
@if (Model.Total > 0)
@{
var pageSizeOptions = new [] { 50, 100, 250, 500 };
}
@if (Model.Total > pageSizeOptions.Min())
{
<nav aria-label="..." class="w-100">
@if (Model.Total > Model.Count)
{
<ul class="pagination float-left">
<li class="page-item @(Model.Skip == 0 ? "disabled" : null)">
<a class="page-link" tabindex="-1" href="@NavigatePages(-1, Model.Count)">&laquo;</a>
@@ -25,33 +31,22 @@
<a class="page-link" href="@NavigatePages(1, Model.Count)">&raquo;</a>
</li>
</ul>
}
@if (Model.Total >= 50)
@if (Model.Total >= pageSizeOptions.Min())
{
<ul class="pagination float-right">
<li class="page-item disabled">
<span class="page-link">Page Size:</span>
</li>
<li class="page-item @(Model.Count == 50 ? "active" : null)">
<a class="page-link" href="@NavigatePages(0, 50)">50</a>
</li>
@if (Model.Total >= 100)
@foreach (int pageSize in pageSizeOptions)
{
<li class="page-item @(Model.Count == 100 ? "active" : null)">
<a class="page-link" href="@NavigatePages(0, 100)">100</a>
if (Model.Total >= pageSize)
{
<li class="page-item @(Model.Count == pageSize ? "active" : null)">
<a class="page-link" href="@NavigatePages(0, pageSize)">@pageSize</a>
</li>
}
@if (Model.Total >= 250)
{
<li class="page-item @(Model.Count == 250 ? "active" : null)">
<a class="page-link" href="@NavigatePages(0, 250)">250</a>
</li>
}
@if (Model.Total >= 500)
{
<li class="page-item @(Model.Count == 500 ? "active" : null)">
<a class="page-link" href="@NavigatePages(0, 500)">500</a>
</li>
}
</ul>
}
@@ -70,14 +65,22 @@
skip = Model.Skip + count;
}
var act = Url.Action(null, new
var query = new Dictionary<string, object>
{
searchTerm = Model.SearchTerm,
timezoneOffset = Model.TimezoneOffset,
skip = skip,
count = count,
});
{ "searchTerm", Model.SearchTerm },
{ "timezoneOffset", Model.TimezoneOffset },
{ "skip", skip },
{ "count", count }
};
return act;
if (Model.PaginationQuery != null)
{
// merge both, prefering the `query` properties in case of duplicate keys
query = query.Concat(Model.PaginationQuery)
.GroupBy(e => e.Key)
.ToDictionary(g => g.Key, g => g.First().Value);
}
return Url.Action(null, query);
}
}

7
BTCPayServer/Controllers/WalletsController.cs
View File

@@ -290,6 +290,13 @@ namespace BTCPayServer.Controllers
Count = count,
Total = 0
};
if (labelFilter != null)
{
model.PaginationQuery = new Dictionary<string, object>
{
{"labelFilter", labelFilter}
};
}
if (transactions == null)
{
TempData.SetStatusMessageModel(new StatusMessageModel()

2
BTCPayServer/Models/BasePagingViewModel.cs
View File

@@ -1,3 +1,4 @@
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
namespace BTCPayServer.Models
@@ -10,5 +11,6 @@ namespace BTCPayServer.Models
[DisplayFormat(ConvertEmptyStringToNull = false)]
public string SearchTerm { get; set; }
public int? TimezoneOffset { get; set; }
public Dictionary<string, object> PaginationQuery { get; set; }
}
}

7
BTCPayServer/Models/NotificationViewModels/IndexViewModel.cs
View File

@@ -3,13 +3,8 @@ using BTCPayServer.Abstractions.Contracts;
namespace BTCPayServer.Models.NotificationViewModels
{
public class IndexViewModel
public class IndexViewModel : BasePagingViewModel
{
public int Skip { get; set; }
public int Count { get; set; }
public int Total { get; set; }
public List<NotificationViewModel> Items { get; set; }
}
}

5
BTCPayServer/Models/WalletViewModels/ListTransactionsViewModel.cs
View File

@@ -4,7 +4,7 @@ using BTCPayServer.Services.Labels;
namespace BTCPayServer.Models.WalletViewModels
{
public class ListTransactionsViewModel
public class ListTransactionsViewModel : BasePagingViewModel
{
public class TransactionViewModel
{
@@ -19,8 +19,5 @@ namespace BTCPayServer.Models.WalletViewModels
}
public HashSet<ColoredLabel> Labels { get; set; } = new HashSet<ColoredLabel>();
public List<TransactionViewModel> Transactions { get; set; } = new List<TransactionViewModel>();
public int Skip { get; set; }
public int Count { get; set; }
public int Total { get; set; }
}
}

2
BTCPayServer/Views/Invoice/ListInvoices.cshtml
View File

@@ -329,7 +329,7 @@
</tbody>
</table>
<vc:pager view-model="Model"></vc:pager>
<vc:pager view-model="Model" />
</form>
}
else

68
BTCPayServer/Views/Notifications/Index.cshtml
View File

@@ -86,73 +86,7 @@
</tbody>
</table>
<nav aria-label="..." class="w-100">
@if (Model.Total != 0)
{
<ul class="pagination float-left">
<li class="page-item @(Model.Skip == 0 ? "disabled" : null)">
<a class="page-link" tabindex="-1" href="@ListItemsPage(-1, Model.Count)">&laquo;</a>
</li>
<li class="page-item disabled">
@if (Model.Total <= Model.Count)
{
<span class="page-link">
1–@Model.Items.Count
</span>
}
else
{
<span class="page-link">
@(Model.Skip + 1)–@(Model.Skip + Model.Items.Count), Total: @Model.Total
</span>
}
</li>
<li class="page-item @(Model.Total > (Model.Skip + Model.Items.Count) ? null : "disabled")">
<a class="page-link" href="@ListItemsPage(1, Model.Count)">&raquo;</a>
</li>
</ul>
}
<ul class="pagination float-right">
<li class="page-item disabled">
<span class="page-link">Page Size:</span>
</li>
<li class="page-item @(Model.Count == 50 ? "active" : null)">
<a class="page-link" href="@ListItemsPage(0, 50)">50</a>
</li>
<li class="page-item @(Model.Count == 100 ? "active" : null)">
<a class="page-link" href="@ListItemsPage(0, 100)">100</a>
</li>
<li class="page-item @(Model.Count == 250 ? "active" : null)">
<a class="page-link" href="@ListItemsPage(0, 250)">250</a>
</li>
<li class="page-item @(Model.Count == 500 ? "active" : null)">
<a class="page-link" href="@ListItemsPage(0, 500)">500</a>
</li>
</ul>
</nav>
@{
string ListItemsPage(int prevNext, int count)
{
var skip = Model.Skip;
if (prevNext == -1)
{
skip = Math.Max(0, Model.Skip - Model.Count);
}
else if (prevNext == 1)
{
skip = Model.Skip + count;
}
var act = Url.Action("Index", new
{
skip = skip,
count = count,
});
return act;
}
}
<vc:pager view-model="Model" />
</div>
</div>

76
BTCPayServer/Views/Wallets/WalletTransactions.cshtml
View File

@@ -68,7 +68,7 @@
}
<div class="row">
<div class="col-md-12">
If BTCPay Server shows you an invalid balance, <a asp-action="WalletRescan" asp-route-walletId="@this.Context.GetRouteValue("walletId")">rescan your wallet</a>. <br />
If BTCPay Server shows you an invalid balance, <a asp-action="WalletRescan" asp-route-walletId="@Context.GetRouteValue("walletId")">rescan your wallet</a>. <br />
If some transactions appear in BTCPay Server, but are missing on Electrum or another wallet, <a href="https://docs.btcpayserver.org/FAQ/FAQ-Wallet/#missing-payments-in-my-software-or-hardware-wallet">follow those instructions</a>.
</div>
</div>
@@ -126,7 +126,7 @@
<a asp-route-labelFilter="@label.Text" class="text-white">@label.Text</a>
<form
asp-route-walletId="@this.Context.GetRouteValue("walletId")"
asp-route-walletId="@Context.GetRouteValue("walletId")"
asp-action="ModifyTransaction"
method="post"
class="removeTransactionLabelForm">
@@ -169,7 +169,7 @@
<span class="fa fa-tags cursor-pointer" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></span>
<div class="dropdown-menu">
<form asp-action="ModifyTransaction" method="post"
asp-route-walletId="@this.Context.GetRouteValue("walletId")">
asp-route-walletId="@Context.GetRouteValue("walletId")">
<input type="hidden" name="transactionId" value="@transaction.Id" />
<div class="input-group p-2">
<input name="addlabel" placeholder="Label name" maxlength="20" type="text" class="form-control form-control-sm" />
@@ -206,7 +206,7 @@
}
<div class="dropdown-menu">
<form asp-action="ModifyTransaction" method="post"
asp-route-walletId="@this.Context.GetRouteValue("walletId")">
asp-route-walletId="@Context.GetRouteValue("walletId")">
<input type="hidden" name="transactionId" value="@transaction.Id" />
<div class="input-group p-2">
<textarea name="addcomment" maxlength="200" rows="2" cols="20" class="form-control form-control-sm">@transaction.Comment</textarea>
@@ -222,72 +222,6 @@
}
</tbody>
</table>
<nav class="w-100">
@if (Model.Total != 0)
{
<ul class="pagination float-left">
<li class="page-item @(Model.Skip == 0 ? "disabled" : null)">
<a class="page-link" tabindex="-1" href="@ListTransactionsPage(-1, Model.Count)">&laquo;</a>
</li>
<li class="page-item disabled">
@if (Model.Total <= Model.Count)
{
<span class="page-link">
1–@Model.Transactions.Count
</span>
}
else
{
<span class="page-link">
@(Model.Skip + 1)–@(Model.Skip + Model.Transactions.Count), Total: @Model.Total
</span>
}
</li>
<li class="page-item @(Model.Total > (Model.Skip + Model.Transactions.Count) ? null : "disabled")">
<a class="page-link" href="@ListTransactionsPage(1, Model.Count)">&raquo;</a>
</li>
</ul>
}
<ul class="pagination float-right">
<li class="page-item disabled">
<span class="page-link">Page Size:</span>
</li>
<li class="page-item @(Model.Count == 50 ? "active" : null)">
<a class="page-link" href="@ListTransactionsPage(0, 50)">50</a>
</li>
<li class="page-item @(Model.Count == 100 ? "active" : null)">
<a class="page-link" href="@ListTransactionsPage(0, 100)">100</a>
</li>
<li class="page-item @(Model.Count == 250 ? "active" : null)">
<a class="page-link" href="@ListTransactionsPage(0, 250)">250</a>
</li>
<li class="page-item @(Model.Count == 500 ? "active" : null)">
<a class="page-link" href="@ListTransactionsPage(0, 500)">500</a>
</li>
</ul>
</nav>
@{
string ListTransactionsPage(int prevNext, int count)
{
var skip = Model.Skip;
if (prevNext == -1)
{
skip = Math.Max(0, Model.Skip - Model.Count);
}
else if (prevNext == 1)
{
skip = Model.Skip + count;
}
var act = Url.Action("WalletTransactions", new
{
labelFilter = Context.Request.Query["labelFilter"],
skip = skip,
count = count,
});
return act;
}
}
<vc:pager view-model="Model" />
</div>
</div>