mirror of
https://github.com/btcpayserver/btcpayserver.git
synced 2025-02-22 14:22:40 +01:00
1831692761
Modal cart, remove items, checkout Fix removal and adding of cart items Improve cart UI Add cart bundle, remove unused js files from the view when cart isn't used Do not enable cart by default Do not put modal into the view when the cart is disabled Escape js properties Work with amounts as cents Make animation speed look constant Enable tips in the cart Fix cart UI
147 lines
7.2 KiB
Text
147 lines
7.2 KiB
Text
@addTagHelper *, Meziantou.AspNetCore.BundleTagHelpers
|
|
@inject BTCPayServer.HostedServices.CssThemeManager themeManager
|
|
|
|
@model BTCPayServer.Models.AppViewModels.ViewPointOfSaleViewModel
|
|
@{
|
|
ViewData["Title"] = Model.Title;
|
|
Layout = null;
|
|
}
|
|
|
|
<!DOCTYPE html>
|
|
<html class="h-100">
|
|
<head>
|
|
<title>@Model.Title</title>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
<link href="@this.Context.Request.GetAbsoluteUri(themeManager.BootstrapUri)" rel="stylesheet" />
|
|
@if (Model.CustomCSSLink != null)
|
|
{
|
|
<link href="@Model.CustomCSSLink" rel="stylesheet" />
|
|
}
|
|
<link href="~/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
|
|
|
|
@if (Model.EnableShoppingCart)
|
|
{
|
|
<script type="text/javascript">
|
|
var srvModel = @Html.Raw(Json.Serialize(Model));
|
|
</script>
|
|
<bundle name="wwwroot/bundles/cart-bundle.min.js" />
|
|
}
|
|
</head>
|
|
<body class="h-100">
|
|
@if (Model.EnableShoppingCart)
|
|
{
|
|
<div id="cartModal" class="modal" tabindex="-1" role="dialog">
|
|
<div class="modal-dialog modal-lg" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Shopping cart</h5>
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<table id="js-cart-list" class="table mt-2 mb-3">
|
|
<thead class="thead-dark">
|
|
<tr>
|
|
<th colspan="2">Product</th>
|
|
<th class="text-right" width="80">Quantity</th>
|
|
<th class="text-right" width="25%">Price</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody></tbody>
|
|
</table>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
|
<form method="post" asp-antiforgery="false" data-buy>
|
|
<input id="js-cart-amount" class="form-control" type="hidden" name="amount">
|
|
<button id="js-cart-pay" class="btn btn-primary" type="submit"><b>@Model.CustomButtonText</b></button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
<div class="container d-flex h-100">
|
|
<div class="justify-content-center align-self-center text-center mx-auto px-2 py-3 w-100" style="margin: auto;">
|
|
<h1 class="mb-4">@Model.Title</h1>
|
|
@if (Model.EnableShoppingCart)
|
|
{
|
|
<a id="js-cart" class="btn btn-warning text-white text-right" href="#" data-toggle="modal" data-target="#cartModal"><i class="fa fa-shopping-basket"></i> <span class="badge badge-light badge-pill"><span id="js-cart-items">0</span></span></a>
|
|
}
|
|
<div class="row">
|
|
@for (int i = 0; i < Model.Items.Length; i++)
|
|
{
|
|
var className = (Model.Items.Length - i) > (Model.Items.Length % 4) ? "col-sm-6 col-lg-3" : "col-md align-self-start";
|
|
var item = Model.Items[i];
|
|
var image = item.Image;
|
|
var description = item.Description;
|
|
<div class="@className my-3 px-2">
|
|
<div class="card" data-id="@i">
|
|
@if (!String.IsNullOrWhiteSpace(image))
|
|
{
|
|
<img class="card-img-top" src="@image" alt="Card image cap">
|
|
}
|
|
<div class="card-body">
|
|
<h5 class="card-title">@item.Title</h5>
|
|
@if (!String.IsNullOrWhiteSpace(description))
|
|
{
|
|
<p class="card-text">@description</p>
|
|
}
|
|
@if (item.Custom && !Model.EnableShoppingCart)
|
|
{
|
|
<form method="post" asp-antiforgery="false" data-buy>
|
|
<input type="hidden" name="choicekey" value="@item.Id" />
|
|
<div class="input-group">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text">@Model.CurrencySymbol</span>
|
|
</div>
|
|
<input class="form-control" type="number" min="@item.Price.Value" step="@Model.Step" name="amount"
|
|
value="@item.Price.Value" placeholder="Amount">
|
|
<div class="input-group-append">
|
|
<button class="btn btn-primary" type="submit">@Model.CustomButtonText</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
}
|
|
else
|
|
{
|
|
<form method="post" asp-antiforgery="false">
|
|
<button type="submit" name="choiceKey" class="js-add-cart btn btn-primary" value="@item.Id">
|
|
@String.Format(Model.ButtonText, @item.Price.Formatted)</button>
|
|
</form>
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
@if (Model.ShowCustomAmount)
|
|
{
|
|
<div class="row mt-2 mb-4">
|
|
<div class="col-lg-4 offset-lg-4 col-md-6 offset-md-3 px-2">
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<h5 class="card-title">Custom Amount</h5>
|
|
<p class="card-text">Create invoice to pay custom amount</p>
|
|
<form method="post" asp-antiforgery="false" data-buy>
|
|
<div class="input-group">
|
|
<div class="input-group-prepend">
|
|
<span class="input-group-text">@Model.CurrencySymbol</span>
|
|
</div>
|
|
<input class="form-control" type="number" min="0" step="@Model.Step" name="amount" placeholder="Amount">
|
|
<div class="input-group-append"><button class="btn btn-primary" type="submit">@Model.CustomButtonText</button></div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|