Unify POS app card markup

This commit is contained in:
Umar Bolatov 2021-04-10 18:38:57 -07:00
parent e1df1c255a
commit efa567f965
No known key found for this signature in database
GPG key ID: 2C1F9AEB371D2A28

View file

@ -31,33 +31,15 @@
{ {
<img class="card-img-top" src="@item.Image" alt="Card image cap" asp-append-version="true"> <img class="card-img-top" src="@item.Image" alt="Card image cap" asp-append-version="true">
} }
<div class="card-body pb-0"> @{CardBody(item.Title, item.Description);}
<h5 class="card-title">@item.Title</h5>
@if (!String.IsNullOrWhiteSpace(item.Description))
{
<p class="card-text">@Safe.Raw(item.Description)</p>
}
</div>
<div class="card-footer bg-transparent border-0"> <div class="card-footer bg-transparent border-0">
@if (!item.Inventory.HasValue || item.Inventory.Value > 0) @if (!item.Inventory.HasValue || item.Inventory.Value > 0)
{ {
<div class="w-100">
@if (item.Custom) @if (item.Custom)
{ {
<form method="post" asp-controller="AppsPublic" asp-action="ViewPointOfSale" asp-route-appId="@Model.AppId" asp-antiforgery="false" data-buy> <form method="post" asp-controller="AppsPublic" asp-action="ViewPointOfSale" asp-route-appId="@Model.AppId" asp-antiforgery="false" data-buy>
<input type="hidden" name="choicekey" value="@item.Id"/> <input type="hidden" name="choicekey" value="@item.Id"/>
<div class="input-group"> @{PayFormInputContent(item.BuyButtonText ?? Model.CustomButtonText, item.Price.Value, item.Price.Value);}
<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" style="flex: 2 0 80px;">
<div class="input-group-append flex-fill">
<button class="btn btn-primary text-nowrap flex-fill" type="submit">
@(item.BuyButtonText ?? Model.CustomButtonText)
</button>
</div>
</div>
</form> </form>
} }
else else
@ -68,7 +50,6 @@
</button> </button>
</form> </form>
} }
</div>
} }
@if (item.Inventory.HasValue) @if (item.Inventory.HasValue)
{ {
@ -83,7 +64,8 @@
<span>Sold out</span> <span>Sold out</span>
} }
</div> </div>
}else if (anyInventoryItems) }
else if (anyInventoryItems)
{ {
<div class="w-100 pt-2">&nbsp;</div> <div class="w-100 pt-2">&nbsp;</div>
} }
@ -93,22 +75,10 @@
@if (Model.ShowCustomAmount) @if (Model.ShowCustomAmount)
{ {
<div class="card my-2"> <div class="card my-2">
<div class="card-body my-auto pb-0"> @{CardBody("Custom Amount", "Create invoice to pay custom amount");}
<h5 class="card-title">Custom Amount</h5>
<p class="card-text">Create invoice to pay custom amount</p>
</div>
<div class="card-footer bg-transparent border-0"> <div class="card-footer bg-transparent border-0">
<form method="post" asp-controller="AppsPublic" asp-action="ViewPointOfSale" asp-route-appId="@Model.AppId" asp-antiforgery="false" data-buy> <form method="post" asp-controller="AppsPublic" asp-action="ViewPointOfSale" asp-route-appId="@Model.AppId" asp-antiforgery="false" data-buy>
<div class="input-group"> @{PayFormInputContent(Model.CustomButtonText);}
<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> </form>
@if (anyInventoryItems) @if (anyInventoryItems)
{ {
@ -120,3 +90,31 @@
</div> </div>
</div> </div>
</div> </div>
@functions {
private void PayFormInputContent(string buttonText, decimal? minPriceValue = null, decimal? priceValue = null)
{
<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="@(minPriceValue ?? 0)" step="@Model.Step" name="amount" placeholder="Amount" value="@priceValue">
<div class="input-group-append">
<button class="btn btn-primary text-nowrap" type="submit">
@buttonText
</button>
</div>
</div>
}
private void CardBody(string title, string description)
{
<div class="card-body my-auto pb-0">
<h5 class="card-title">@title</h5>
@if (!String.IsNullOrWhiteSpace(description))
{
<p class="card-text">@Safe.Raw(description)</p>
}
</div>
}
}