Merge pull request #1761 from dennisreimann/store-ui

UI updates: Manage store
This commit is contained in:
Nicolas Dorier 2020-07-23 16:28:11 +09:00 committed by GitHub
commit df413d1af0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 179 additions and 112 deletions

View File

@ -56,7 +56,7 @@ namespace BTCPayServer.Models.StoreViewModels
public List<AdditionalPaymentMethod> ThirdPartyPaymentMethods { get; set; } =
new List<AdditionalPaymentMethod>();
[Display(Name = "Invoice expires if the full amount has not been paid after ... minutes")]
[Display(Name = "Invoice expires if the full amount has not been paid after ")]
[Range(1, 60 * 24 * 24)]
public int InvoiceExpiration
{
@ -64,7 +64,7 @@ namespace BTCPayServer.Models.StoreViewModels
set;
}
[Display(Name = "Payment invalid if transactions fails to confirm ... minutes after invoice expiration")]
[Display(Name = "Payment invalid if transactions fails to confirm after invoice expiration")]
[Range(10, 60 * 24 * 24)]
public int MonitoringExpiration
{
@ -72,13 +72,13 @@ namespace BTCPayServer.Models.StoreViewModels
set;
}
[Display(Name = "Consider the invoice confirmed when the payment transaction...")]
[Display(Name = "Consider the invoice confirmed when the payment transaction")]
public SpeedPolicy SpeedPolicy
{
get; set;
}
[Display(Name = "Add additional fee (network fee) to invoice...")]
[Display(Name = "Add additional fee (network fee) to invoice")]
public NetworkFeeMode NetworkFeeMode
{
get; set;

View File

@ -14,11 +14,16 @@
}
<partial name="_StatusMessage" />
@if (!ViewContext.ModelState.IsValid)
{
<div class="row">
<div class="col-md-6">
<div asp-validation-summary="All" class="text-danger"></div>
</div>
</div>
}
<div class="modal fade" id="btcpayservervault" tabindex="-1" role="dialog" aria-labelledby="btcpayservervault" aria-hidden="true">
</div>

View File

@ -6,24 +6,103 @@
<partial name="_StatusMessage" />
@if (!ViewContext.ModelState.IsValid)
{
<div class="row">
<div class="col-md-6">
<div asp-validation-summary="All" class="text-danger"></div>
</div>
</div>
}
<div class="row">
<div class="col-md-8">
<form method="post">
<h4 class="mb-3">Payment</h4>
<div class="form-group">
<label asp-for="DefaultPaymentMethod"></label>
<select asp-for="DefaultPaymentMethod" asp-items="Model.CryptoCurrencies" class="form-control w-auto"></select>
</div>
<div class="form-group mb-4">
<div class="form-check">
<input asp-for="RequiresRefundEmail" type="checkbox" class="form-check-input"/>
<label asp-for="RequiresRefundEmail" class="form-check-label"></label>
</div>
</div>
<div class="form-group mb-4">
<label asp-for="OnChainMinValue"></label>
<div class="input-group">
<input asp-for="OnChainMinValue" class="form-control" style="max-width: 20ch;"/>
<div class="input-group-append">
<span class="input-group-text">Example: 6.15 USD</span>
</div>
</div>
<span asp-validation-for="OnChainMinValue" class="text-danger"></span>
</div>
<div class="form-group mb-4">
<label asp-for="LightningMaxValue"></label>
<div class="input-group">
<input asp-for="LightningMaxValue" class="form-control" style="max-width: 20ch;"/>
<div class="input-group-append">
<span class="input-group-text">Example: 21.0 USD</span>
</div>
</div>
<span asp-validation-for="LightningMaxValue" class="text-danger"></span>
</div>
<div class="form-group">
<div class="form-check">
<input asp-for="LightningAmountInSatoshi" type="checkbox" class="form-check-input"/>
<label asp-for="LightningAmountInSatoshi" class="form-check-label"></label>
<span asp-validation-for="LightningAmountInSatoshi" class="text-danger"></span>
</div>
</div>
<div class="form-group">
<div class="form-check">
<input asp-for="LightningPrivateRouteHints" type="checkbox" class="form-check-input"/>
<label asp-for="LightningPrivateRouteHints" class="form-check-label"></label>
<span asp-validation-for="LightningPrivateRouteHints" class="text-danger"></span>
</div>
</div>
<div class="form-group">
<div class="form-check">
<input asp-for="RedirectAutomatically" type="checkbox" class="form-check-input"/>
<label asp-for="RedirectAutomatically" class="form-check-label"></label>
<span asp-validation-for="RedirectAutomatically" class="text-danger"></span>
</div>
</div>
<div class="form-group">
<div class="form-check">
<input asp-for="ShowRecommendedFee" type="checkbox" class="form-check-input"/>
<label asp-for="ShowRecommendedFee" class="form-check-label"></label>
<p class="form-text text-muted">Fee will be shown for BTC and LTC onchain payments only.</p>
</div>
</div>
<div class="form-group">
<label asp-for="RecommendedFeeBlockTarget"></label>
<input asp-for="RecommendedFeeBlockTarget" class="form-control" style="width:8ch" />
<span asp-validation-for="RecommendedFeeBlockTarget" class="text-danger"></span>
</div>
<h4 class="mt-5 mb-3">Appearance</h4>
<div class="form-group">
<label asp-for="DefaultLang"></label>
<select asp-for="DefaultLang" asp-items="Model.Languages" class="form-control w-auto"></select>
</div>
<div class="form-group">
<label asp-for="HtmlTitle"></label>
<input asp-for="HtmlTitle" class="form-control"/>
<span asp-validation-for="HtmlTitle" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="CustomLogo"></label>
<a href="https://docs.btcpayserver.org/Theme/#checkout-page-themes" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
<input asp-for="CustomLogo" class="form-control" />
<input asp-for="CustomLogo" class="form-control"/>
<span asp-validation-for="CustomLogo" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="CustomCSS"></label>
<a href="https://docs.btcpayserver.org/Theme/#checkout-page-themes" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
<input asp-for="CustomCSS" class="form-control" />
<input asp-for="CustomCSS" class="form-control"/>
<span asp-validation-for="CustomCSS" class="text-danger"></span>
<p class="form-text text-muted">
Bundled Themes:
@ -44,65 +123,6 @@
}
</script>
</div>
<div class="form-group">
<label asp-for="HtmlTitle"></label>
<input asp-for="HtmlTitle" class="form-control" />
<span asp-validation-for="HtmlTitle" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="DefaultPaymentMethod"></label>
<select asp-for="DefaultPaymentMethod" asp-items="Model.CryptoCurrencies" class="form-control"></select>
</div>
<div class="form-group">
<label asp-for="DefaultLang"></label>
<select asp-for="DefaultLang" asp-items="Model.Languages" class="form-control"></select>
</div>
<div class="form-group">
<div class="form-check">
<input asp-for="RequiresRefundEmail" type="checkbox" class="form-check-input" />
<label asp-for="RequiresRefundEmail" class="form-check-label"></label>
</div>
</div>
<div class="form-group">
<label asp-for="OnChainMinValue"></label>
<input asp-for="OnChainMinValue" class="form-control" />
<span asp-validation-for="OnChainMinValue" class="text-danger"></span>
<p class="form-text text-muted">Example: 5.50 USD</p>
</div>
<div class="form-group">
<label asp-for="LightningMaxValue"></label>
<input asp-for="LightningMaxValue" class="form-control" />
<span asp-validation-for="LightningMaxValue" class="text-danger"></span>
<p class="form-text text-muted">Example: 5.50 USD</p>
</div>
<div class="form-group">
<div class="form-check">
<input asp-for="LightningAmountInSatoshi" type="checkbox" class="form-check-input" />
<label asp-for="LightningAmountInSatoshi" class="form-check-label"></label>
<span asp-validation-for="LightningAmountInSatoshi" class="text-danger"></span>
</div>
<div class="form-check">
<input asp-for="LightningPrivateRouteHints" type="checkbox" class="form-check-input" />
<label asp-for="LightningPrivateRouteHints" class="form-check-label"></label>
<span asp-validation-for="LightningPrivateRouteHints" class="text-danger"></span>
</div>
<div class="form-check">
<input asp-for="RedirectAutomatically" type="checkbox" class="form-check-input" />
<label asp-for="RedirectAutomatically" class="form-check-label"></label>
<span asp-validation-for="RedirectAutomatically" class="text-danger"></span>
</div>
<div class="form-check">
<input asp-for="ShowRecommendedFee" type="checkbox" class="form-check-input" />
<label asp-for="ShowRecommendedFee" class="form-check-label"></label>
<p class="form-text text-muted">Fee will be shown for BTC and LTC onchain payments only.</p>
</div>
</div>
<div class="form-group">
<label asp-for="RecommendedFeeBlockTarget"></label>
<input asp-for="RecommendedFeeBlockTarget" class="form-control" />
<span asp-validation-for="RecommendedFeeBlockTarget" class="text-danger"></span>
</div>
<button name="command" type="submit" class="btn btn-primary" value="Save">Save</button>
</form>
</div>

View File

@ -12,32 +12,35 @@
<form method="post">
<div class="form-group">
<label asp-for="Label"></label>
@if(ViewBag.HidePublicKey)
@if (ViewBag.HidePublicKey)
{
<small class="text-muted">optional</small>
}
<input asp-for="Label" class="form-control" />
<span asp-validation-for="Label" class="text-danger"></span>
</div>
@if(!ViewBag.HidePublicKey)
@if (!ViewBag.HidePublicKey)
{
<div class="form-group">
<label asp-for="PublicKey"></label>
<small class="text-muted">Keep empty for server-initiated pairing</small>
<input asp-for="PublicKey" class="form-control" />
<span asp-validation-for="PublicKey" class="text-danger"></span>
</div>}
</div>
}
@if(ViewBag.ShowStores)
@if (ViewBag.ShowStores)
{
<div class="form-group">
<label asp-for="StoreId" class="control-label"></label>
<select asp-for="StoreId" asp-items="Model.Stores" class="form-control"></select>
<span asp-validation-for="StoreId" class="text-danger"></span>
</div>}
</div>
}
else
{
<input type="hidden" asp-for="StoreId" />}
<input type="hidden" asp-for="StoreId" />
}
<div class="form-group">
<input id="RequestPairing" type="submit" value="Request pairing" class="btn btn-primary" />
</div>

View File

@ -7,9 +7,10 @@
<partial name="_StatusMessage" />
@if (Model.StoreNotConfigured)
{
<div class="alert alert-warning alert-dismissible" role="alert">
<div class="alert alert-warning alert-dismissible mb-5" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<span>Warning: No wallet has been linked to your BTCPay Store. See <a href="https://docs.btcpayserver.org/WalletSetup/" target="_blank" class="alert-link">this link</a> for more information on how to connect your store and wallet.</span>
Warning: No wallet has been linked to your BTCPay Store.<br/>
See <a href="https://docs.btcpayserver.org/WalletSetup/" target="_blank" class="alert-link">this link</a> for more information on how to connect your store and wallet.
</div>
}
<h4>Access token</h4>
@ -21,14 +22,17 @@
<div class="row">
<div class="col-md-8">
<a id="CreateNewToken" asp-action="CreateToken" class="btn btn-primary" role="button"><span class="fa fa-plus" asp-route-storeId="@this.Context.GetRouteValue("storeId")"></span> Create a new token</a>
<table class="table table-sm table-responsive-md">
<thead>
@if (Model.Tokens.Any())
{
<table class="table table-sm table-responsive-md">
<thead>
<tr>
<th>Label</th>
<th class="text-right">Actions</th>
</tr>
</thead>
<tbody>
</thead>
<tbody>
@foreach (var token in Model.Tokens)
{
<tr>
@ -38,11 +42,12 @@
</td>
</tr>
}
</tbody>
</table>
</tbody>
</table>
}
</div>
</div>
<hr class="my-5" />
<h4>Legacy API Keys</h4>
<div class="row">
<div class="col-md-8">

View File

@ -12,9 +12,12 @@
<p>
To start using Pay Buttons you need to explicitly turn on this feature.
Once you do so, any 3rd party entity will be able to create an invoice on your instance store (via API for example).
The POS app is preauthorised and does not need this enabled.
</p>
@Html.Hidden("EnableStore", true)
<button name="command" type="submit" value="save" class="btn btn-primary">Allow outside world to create invoices via API (POS app is preauthorised and does not need this enabled).</button>
<button name="command" type="submit" value="save" class="btn btn-lg btn-primary px-4">
Allow outside world to create invoices via API
</button>
</div>
</form>
</div>

View File

@ -6,11 +6,15 @@
<partial name="_StatusMessage" />
@if (!ViewContext.ModelState.IsValid)
{
<div class="row">
<div class="col-md-8">
<div asp-validation-summary="All" class="text-danger"></div>
</div>
</div>
}
<div class="row">
<div class="col-md-8">
<form method="post">

View File

@ -6,11 +6,14 @@
<partial name="_StatusMessage" />
@if (!ViewContext.ModelState.IsValid)
{
<div class="row">
<div class="col-md-6">
<div asp-validation-summary="All" class="text-danger"></div>
</div>
</div>
}
<div class="row">
<div class="col-md-8">
<div class="form-group">

View File

@ -7,15 +7,20 @@
<partial name="_StatusMessage" />
@if (!ViewContext.ModelState.IsValid)
{
<div class="row">
<div class="col-md-6">
<div asp-validation-summary="All" class="text-danger"></div>
</div>
</div>
}
<div class="row">
<div class="col-md-8">
<form method="post">
<div class="mb-5">
<h4 class="mb-3">General</h4>
<div class="form-group">
<label asp-for="Id"></label>
<input asp-for="Id" readonly class="form-control" />
@ -30,6 +35,23 @@
<input asp-for="StoreWebsite" class="form-control" />
<span asp-validation-for="StoreWebsite" class="text-danger"></span>
</div>
<h4 class="mt-5 mb-3">Payment</h4>
<div class="form-group">
<div class="form-check">
<input asp-for="AnyoneCanCreateInvoice" type="checkbox" class="form-check-input" />
<label asp-for="AnyoneCanCreateInvoice" class="form-check-label"></label>
<a href="https://docs.btcpayserver.org/FAQ/FAQ-Stores/#allow-anyone-to-create-invoice" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
</div>
</div>
<div class="form-group">
<div class="form-check">
<input asp-for="PayJoinEnabled" type="checkbox" class="form-check-input"/>
<label asp-for="PayJoinEnabled" class="form-check-label"></label>
<a href="https://docs.btcpayserver.org/Payjoin/" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
<span asp-validation-for="PayJoinEnabled" class="text-danger"></span>
</div>
</div>
<div class="form-group">
<label asp-for="NetworkFeeMode"></label>
<a href="https://docs.btcpayserver.org/FAQ/FAQ-Stores/#add-network-fee-to-invoice-vary-with-mining-fees" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
@ -39,19 +61,17 @@
<option value="Never">Never add network fee</option>
</select>
</div>
<div class="form-group">
<div class="form-check">
<input asp-for="AnyoneCanCreateInvoice" type="checkbox" class="form-check-input" />
<label asp-for="AnyoneCanCreateInvoice" class="form-check-label"></label>
<a href="https://docs.btcpayserver.org/FAQ/FAQ-Stores/#allow-anyone-to-create-invoice" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
</div>
</div>
<div class="form-group">
<div class="mb-2">
<label asp-for="InvoiceExpiration" class="d-inline"></label>
<a href="https://docs.btcpayserver.org/FAQ/FAQ-Stores/#invoice-expires-if-the-full-amount-has-not-been-paid-after-minutes" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
</div>
<input asp-for="InvoiceExpiration" class="form-control" />
<div class="input-group">
<input asp-for="InvoiceExpiration" class="form-control" style="max-width:10ch;"/>
<div class="input-group-append">
<span class="input-group-text">minutes</span>
</div>
</div>
<span asp-validation-for="InvoiceExpiration" class="text-danger"></span>
</div>
<div class="form-group">
@ -59,7 +79,12 @@
<label asp-for="MonitoringExpiration" class="d-inline"></label>
<a href="https://docs.btcpayserver.org/FAQ/FAQ-Stores/#payment-invalid-if-transactions-fails-to-confirm-minutes-after-invoice-expiration" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
</div>
<input asp-for="MonitoringExpiration" class="form-control" />
<div class="input-group">
<input asp-for="MonitoringExpiration" class="form-control" style="max-width:10ch;"/>
<div class="input-group-append">
<span class="input-group-text">minutes</span>
</div>
</div>
<span asp-validation-for="MonitoringExpiration" class="text-danger"></span>
</div>
<div class="form-group">
@ -67,7 +92,12 @@
<label asp-for="PaymentTolerance" class="d-inline"></label>
<a href="https://docs.btcpayserver.org/FAQ/FAQ-Stores/#consider-the-invoice-paid-even-if-the-paid-amount-is-less-than-expected" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
</div>
<input asp-for="PaymentTolerance" class="form-control" />
<div class="input-group">
<input asp-for="PaymentTolerance" class="form-control" style="max-width:10ch;"/>
<div class="input-group-append">
<span class="input-group-text">percent</span>
</div>
</div>
<span asp-validation-for="PaymentTolerance" class="text-danger"></span>
</div>
<div class="form-group">
@ -75,7 +105,7 @@
<label asp-for="SpeedPolicy" class="d-inline"></label>
<a href="https://docs.btcpayserver.org/FAQ/FAQ-Stores/#consider-the-invoice-confirmed-when-the-payment-transaction" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
</div>
<select asp-for="SpeedPolicy" class="form-control">
<select asp-for="SpeedPolicy" class="form-control w-auto">
<option value="0">Is unconfirmed</option>
<option value="1">Has at least 1 confirmation</option>
<option value="3">Has at least 2 confirmations</option>
@ -83,15 +113,9 @@
</select>
<span asp-validation-for="SpeedPolicy" class="text-danger"></span>
</div>
<div class="form-check mb-5">
<input asp-for="PayJoinEnabled" type="checkbox" class="form-check-input"/>
<label asp-for="PayJoinEnabled" class="form-check-label"></label>
<a href="https://docs.btcpayserver.org/Payjoin/" target="_blank"><span class="fa fa-question-circle-o" title="More information..."></span></a>
<span asp-validation-for="PayJoinEnabled" class="text-danger"></span>
</div>
</div>
<h5>Derivation Scheme</h5>
<h4 class="mt-5 mb-3">Derivation Scheme</h4>
<p>The Derivation Scheme represents the destination of the funds received by your invoice on chain.</p>
<table class="table table-sm table-responsive-md mt-0 mb-5">
@ -108,23 +132,23 @@
{
<tr class="@(@scheme.Collapsed? "collapsed": "")">
<td>@scheme.Crypto</td>
<td title="@scheme.Value" data-toggle="tooltip">
<td title="@scheme.Value" data-toggle="tooltip" class="d-flex">
@if (string.IsNullOrEmpty(scheme.Value))
{
<span class="smMaxWidth">Not set</span>
}
else
{
<div class="d-inline-flex justify-content-between smMaxWidth">
<span class="text-truncate ">
@scheme.Value
</span>
<code class="text-truncate" style="max-width:25ch">
@scheme.Value
</code>
<code>
@if (scheme.Value.Length > 20)
{
var match =Regex.Match(scheme.Value, @"((?:-\[(?:[^\]])+\])+|\S{6})$");
var match = Regex.Match(scheme.Value, @"((?:-\[(?:[^\]])+\])+|\S{6})$");
@match.Value;
}
</div>
</code>
}
</td>
<td style="text-align:center;">
@ -156,7 +180,7 @@
</tbody>
</table>
<h5>Lightning nodes (Experimental)</h5>
<h4 class="mt-5 mb-3">Lightning nodes (Experimental)</h4>
<p>
A connection to a lightning charge node is required to generate lightning network enabled invoices.
<br />
@ -179,7 +203,7 @@
<td>@scheme.CryptoCode</td>
<td class="smMaxWidth text-truncate">@scheme.Address</td>
<td style="text-align:center;">
@if(scheme.Enabled)
@if (scheme.Enabled)
{
<span class="text-success fa fa-check"></span>
}
@ -204,7 +228,7 @@
</p>
</div>
<h5>Additional Payment methods</h5>
<h4 class="mt-5 mb-3">Additional Payment methods</h4>
<table class="table table-sm table-responsive-md mt-1 mb-5">
<thead>
<tr>
@ -234,7 +258,7 @@
</tbody>
</table>
<h5>Services</h5>
<h4 class="mt-5 mb-3">Services</h4>
<table class="table table-sm table-responsive-md mt-1 mb-5">
<thead>
<tr>
@ -252,9 +276,9 @@
</tbody>
</table>
@if(Model.CanDelete)
@if (Model.CanDelete)
{
<h5>Other actions...</h5>
<h4 class="mt-5 mb-3">Other actions</h4>
<p><a href="#danger-zone" data-toggle="collapse"><b>Click here to see more actions</b></a></p>
<div id="danger-zone" class="collapse">
<a class="btn btn-outline-danger form-control" asp-action="DeleteStore" asp-route-storeId="@Model.Id">Delete this store</a>