2022-06-19 19:52:12 -07:00
@using BTCPayServer.Client
2023-03-13 02:12:58 +01:00
@using BTCPayServer.Services
@using Microsoft.AspNetCore.Mvc.TagHelpers
@using BTCPayServer.Abstractions.TagHelpers
2023-03-08 17:57:36 +09:00
@inject BTCPayServer.Security.ContentSecurityPolicies Csp
2023-03-13 02:12:58 +01:00
@inject BTCPayServerEnvironment Env
@inject DisplayFormatter DisplayFormatter
@model BTCPayServer.Models.ViewPullPaymentModel
2020-06-24 10:34:09 +09:00
@{
ViewData["Title"] = Model.Title;
2023-03-08 17:57:36 +09:00
Csp.UnsafeEval();
2020-06-24 10:34:09 +09:00
Layout = null;
2020-10-13 09:58:46 +02:00
string StatusTextClass(string status)
{
switch (status)
{
case "Completed":
case "In Progress":
2021-10-18 05:37:59 +02:00
return "bg-success";
2020-10-13 09:58:46 +02:00
case "Cancelled":
2021-10-18 05:37:59 +02:00
return "bg-danger";
2020-10-13 09:58:46 +02:00
default:
2021-10-18 05:37:59 +02:00
return "bg-warning";
2020-10-13 09:58:46 +02:00
}
}
}
2020-06-24 10:34:09 +09:00
<!DOCTYPE html>
2022-06-19 19:52:12 -07:00
<html lang="en" @(Env.IsDeveloping ? " data-devenv" : "")>
2020-06-24 10:34:09 +09:00
<head>
2022-05-03 17:28:50 +02:00
<partial name="LayoutHead" />
2023-01-30 09:23:49 +01:00
<partial name="LayoutHeadStoreBranding" model="@(Model.BrandColor, Model.CssFileId, Model.CustomCSSLink, Model.EmbeddedCSS)" />
2023-06-19 13:40:52 +02:00
<link href="~/vendor/bootstrap-vue/bootstrap-vue.min.css" asp-append-version="true" rel="stylesheet" />
2022-05-18 07:38:10 -05:00
<style>
.no-marker > ul { list-style-type: none; }
</style>
2020-06-24 10:34:09 +09:00
</head>
2023-01-30 09:23:49 +01:00
<body class="min-vh-100">
<div id="app" class="d-flex flex-column min-vh-100 pb-l">
2020-10-13 09:58:46 +02:00
@if (Model.IsPending)
{
2021-12-11 04:32:23 +01:00
<nav class="btcpay-header navbar sticky-top py-3 py-lg-4 d-print-none">
2022-06-19 19:52:12 -07:00
<div class="container gap-3">
<form asp-action="ClaimPullPayment" asp-route-pullPaymentId="@Model.Id" class="flex-fill">
2020-10-13 09:58:46 +02:00
<div class="row align-items-center" style="width:calc(100% + 30px)">
<div class="col-12 mb-3 col-lg-6 mb-lg-0">
2021-10-18 05:37:59 +02:00
<div class="input-group">
2023-06-16 03:56:17 +02:00
@if (Model.LnurlEndpoint is not null)
2022-06-28 16:02:17 +02:00
{
2022-07-12 08:17:44 +02:00
<button type="button" class="input-group-prepend btn btn-outline-secondary" id="lnurlwithdraw-button" data-bs-toggle="modal" data-bs-target="#scan-qr-modal">
2022-06-28 16:02:17 +02:00
<span class="fa fa-qrcode fa-2x" title="LNURL-Withdraw"></span>
</button>
}
2021-10-18 05:37:59 +02:00
<input class="form-control form-control-lg font-monospace" asp-for="Destination" placeholder="Enter destination to claim funds" required style="font-size:.9rem;height:42px;">
2021-11-15 19:58:17 -08:00
@if (Model.PaymentMethods.Length == 1)
{
<input type="hidden" asp-for="SelectedPaymentMethod">
<span class="input-group-text">@Model.PaymentMethods.First().ToPrettyString()</span>
}
else
{
<select class="form-select w-auto" asp-for="SelectedPaymentMethod" asp-items="Model.PaymentMethods.Select(id => new SelectListItem(id.ToPrettyString(), id.ToString()))"></select>
}
2021-10-18 05:37:59 +02:00
</div>
2020-10-13 09:58:46 +02:00
</div>
2021-10-18 05:37:59 +02:00
2020-10-13 09:58:46 +02:00
<div class="col-12 mb-3 col-sm-6 mb-sm-0 col-lg-3">
<div class="input-group">
2022-03-25 22:09:58 -06:00
<input type="number" inputmode="decimal" class="form-control form-control-lg text-end hide-number-spin" asp-for="ClaimedAmount" max="@Model.AmountDue" min="@Model.MinimumClaim" step="any" placeholder="Amount" required>
2021-05-19 04:39:27 +02:00
<span class="input-group-text px-3">@Model.Currency.ToUpper()</span>
2020-09-30 19:14:30 +02:00
</div>
2020-10-08 08:37:18 +02:00
</div>
2020-10-13 09:58:46 +02:00
<div class="col-12 col-sm-6 col-lg-3">
<button class="btn btn-lg btn-primary w-100 text-nowrap" type="submit">Claim Funds</button>
</div>
</div>
</form>
</div>
</nav>
}
<main class="flex-grow-1 py-4">
<div class="container">
2021-04-08 15:32:42 +02:00
<partial name="_StatusMessage" model="@(new ViewDataDictionary(ViewData){ { "Margin", "mb-4" } })" />
2020-10-13 09:58:46 +02:00
@if (!ViewContext.ModelState.IsValid)
{
2022-05-18 07:38:10 -05:00
@Html.ValidationSummary(string.Empty, new { @class = $"alert alert-danger mb-4 pb-0 {(ViewContext.ModelState.ErrorCount.Equals(1) ? "no-marker" : "")}" })
2020-10-08 08:37:18 +02:00
}
2022-05-18 07:38:10 -05:00
2020-10-13 09:58:46 +02:00
<div class="row">
<div class="col col-12 col-lg-6 mb-4">
2021-11-21 20:56:43 -08:00
<div class="bg-tile h-100 m-0 p-3 p-sm-5 rounded">
2022-10-20 11:17:42 +09:00
@if (!string.IsNullOrWhiteSpace(Model.Title))
2020-10-08 08:37:18 +02:00
{
2020-10-13 09:58:46 +02:00
<h2 class="h4 mb-3">@Model.Title</h2>
2020-10-08 08:37:18 +02:00
}
2020-10-13 09:58:46 +02:00
<div class="d-flex align-items-center">
2021-03-07 22:51:50 +00:00
<span class="text-muted text-nowrap">Start Date</span>
2020-10-13 09:58:46 +02:00
2021-04-13 10:36:49 +02:00
<span class="text-nowrap">@Model.StartDate.ToString("g")</span>
2021-03-07 22:51:50 +00:00
</div>
<div class="d-flex align-items-center">
2021-03-08 08:45:16 +00:00
<span class="text-muted text-nowrap">Last Updated</span>
2021-03-07 22:51:50 +00:00
2021-04-13 10:36:49 +02:00
<span class="text-nowrap">@Model.LastRefreshed.ToString("g")</span>
2021-11-21 20:56:43 -08:00
<button type="button" class="btn btn-link fw-semibold d-none d-lg-inline-block d-print-none border-0 p-0 ms-4 only-for-js" id="copyLink">
2020-10-13 09:58:46 +02:00
Copy Link
</button>
</div>
@if (!string.IsNullOrEmpty(Model.ResetIn))
2020-10-08 08:37:18 +02:00
{
2020-10-13 09:58:46 +02:00
<p>
<span class="text-muted text-nowrap">Reset in</span>
<span class="text-nowrap">@Model.ResetIn</span>
</p>
}
2022-02-09 21:54:00 -08:00
@if (!string.IsNullOrEmpty(Model.Description))
2020-10-13 09:58:46 +02:00
{
2022-02-09 21:54:00 -08:00
<div class="mt-4">@Safe.Raw(Model.Description)</div>
2020-10-13 09:58:46 +02:00
}
</div>
</div>
<div class="col col-12 col-lg-6 mb-4">
2021-11-21 20:56:43 -08:00
<div class="bg-tile h-100 m-0 p-3 p-sm-5 rounded">
2020-10-13 09:58:46 +02:00
<h2 class="h4 mb-3">Payment Details</h2>
<dl class="mb-0 mt-md-4">
2021-05-19 04:39:27 +02:00
<div class="d-flex d-print-inline-block flex-column mb-4 me-5">
2023-03-13 02:12:58 +01:00
<dt class="h4 fw-semibold text-nowrap text-primary text-print-default order-2 order-sm-1 mb-1">@DisplayFormatter.Currency(Model.AmountDue, Model.Currency)</dt>
2021-11-21 20:56:43 -08:00
<dd class="order-1 order-sm-2 mb-1">Available claim</dd>
2020-10-13 09:58:46 +02:00
</div>
<div class="progress bg-light d-none d-sm-flex mb-sm-4 d-print-none" style="height:5px">
<div class="progress-bar bg-primary" role="progressbar" style="width:@((Model.AmountCollected / Model.Amount) * 100)%"></div>
</div>
2021-05-19 04:39:27 +02:00
<div class="d-flex d-print-inline-block flex-column mb-4 me-5 d-sm-inline-flex mb-sm-0">
2023-03-13 02:12:58 +01:00
<dt class="h4 fw-semibold text-nowrap order-2 order-sm-1 mb-1">@DisplayFormatter.Currency(Model.AmountCollected, Model.Currency)</dt>
2021-11-21 20:56:43 -08:00
<dd class="order-1 order-sm-2 mb-1">Already claimed</dd>
2020-10-13 09:58:46 +02:00
</div>
2021-05-19 04:39:27 +02:00
<div class="d-flex d-print-inline-block flex-column mb-0 d-sm-inline-flex float-sm-end">
2023-03-13 02:12:58 +01:00
<dt class="h4 text-sm-end fw-semibold text-nowrap order-2 order-sm-1 mb-1">@DisplayFormatter.Currency(Model.Amount, Model.Currency)</dt>
2021-11-21 20:56:43 -08:00
<dd class="text-sm-end order-1 order-sm-2 mb-1">Claim limit</dd>
2020-10-13 09:58:46 +02:00
</div>
</dl>
</div>
</div>
</div>
<div class="row">
<div class="col">
2021-11-21 20:56:43 -08:00
<div class="bg-tile h-100 m-0 p-3 p-sm-5 rounded">
<h2 class="h4 mb-0">Claims</h2>
2022-06-19 19:52:12 -07:00
@if (Model.Payouts.Any())
{
<div class="table-responsive">
2020-10-13 09:58:46 +02:00
<table class="table my-0">
<thead>
<tr class="table-borderless">
2021-05-19 04:39:27 +02:00
<th class="fw-normal text-secondary" scope="col">Destination</th>
2021-10-18 05:37:59 +02:00
<th class="fw-normal text-secondary" scope="col">Method</th>
2021-05-19 04:39:27 +02:00
<th class="fw-normal text-secondary text-end text-nowrap">Amount requested</th>
<th class="fw-normal text-secondary text-end">Status</th>
2020-10-08 08:37:18 +02:00
</tr>
2020-10-13 09:58:46 +02:00
</thead>
<tbody>
@foreach (var invoice in Model.Payouts)
2020-07-23 17:15:08 +02:00
{
2020-10-13 09:58:46 +02:00
<tr>
<td class="text-break">
@invoice.Destination
</td>
2021-10-18 05:37:59 +02:00
<td class="text-nowrap">@invoice.PaymentMethod.ToPrettyString()</td>
<td class="text-end text-nowrap">@invoice.AmountFormatted</td>
2021-05-19 04:39:27 +02:00
<td class="text-end text-nowrap">
2020-10-13 09:58:46 +02:00
@if (!string.IsNullOrEmpty(invoice.Link))
{
2022-03-29 03:09:30 -07:00
<a class="transaction-link text-white badge @StatusTextClass(invoice.Status.ToString())" href="@invoice.Link" rel="noreferrer noopener">@invoice.Status.GetStateString()</a>
2020-10-13 09:58:46 +02:00
}
else
{
2022-03-29 03:09:30 -07:00
<span class="text-white badge @StatusTextClass(invoice.Status.ToString())">@invoice.Status.GetStateString()</span>
2020-10-13 09:58:46 +02:00
}
</td>
2020-06-24 10:34:09 +09:00
</tr>
2020-07-23 17:15:08 +02:00
}
2020-10-13 09:58:46 +02:00
</tbody>
2020-06-24 10:34:09 +09:00
</table>
2022-06-19 19:52:12 -07:00
</div>
}
else
{
<p class="text-muted mt-3 mb-0">No claim made yet.</p>
}
2020-06-24 10:34:09 +09:00
</div>
</div>
</div>
</div>
2020-10-13 09:58:46 +02:00
</main>
2023-01-30 09:23:49 +01:00
<footer class="store-footer">
<p permission="@Policies.CanViewStoreSettings">
<a asp-action="EditPullPayment" asp-controller="UIPullPayment" asp-route-storeId="@Model.StoreId" asp-route-pullPaymentId="@Model.Id">
2022-08-11 14:30:42 +02:00
Edit pull payment
2022-06-19 19:52:12 -07:00
</a>
</p>
2023-03-08 13:39:03 +01:00
<a class="store-powered-by" href="https://btcpayserver.org" target="_blank" rel="noreferrer noopener">
2023-01-30 09:23:49 +01:00
Powered by <partial name="_StoreFooterLogo" />
</a>
2020-10-13 09:58:46 +02:00
</footer>
2020-06-24 10:34:09 +09:00
</div>
2021-10-18 05:37:59 +02:00
<partial name="LayoutFoot" />
2023-06-16 03:56:17 +02:00
@if (Model.LnurlEndpoint is not null)
2022-07-12 08:17:44 +02:00
{
2023-06-16 03:56:17 +02:00
var lnurlUri = LNURL.LNURL.EncodeUri(Model.LnurlEndpoint, "withdrawRequest", false).ToString();
var lnurlBech32 = LNURL.LNURL.EncodeUri(Model.LnurlEndpoint, "withdrawRequest", true).ToString();
2022-07-12 08:17:44 +02:00
var note = "You can scan or open this link with a <a href='https://github.com/fiatjaf/lnurl-rfc#lnurl-documents' target='_blank' rel='noreferrer noopener'>LNURL-Withdraw</a> enabled wallet.";
if (!Model.AutoApprove)
{
note += "<br/><span class='fw-bold'>Please note that this pull payment does not automatically send out funds, and so will process payment after LNURL-withdraw flow is completed.</span>";
}
<script src="~/vendor/vue-qrcode/vue-qrcode.min.js" asp-append-version="true"></script>
<script src="~/vendor/vuejs/vue.min.js" asp-append-version="true"></script>
<partial name="ShowQR"/>
2022-08-31 12:27:06 +02:00
<script>
2022-07-12 08:17:44 +02:00
document.addEventListener("DOMContentLoaded", () => {
2022-08-31 12:27:06 +02:00
const modes = {
uri: { title: "URI", fragments: [@Safe.Json(lnurlUri)], showData: true, href: @Safe.Json(lnurlUri) },
2023-06-16 03:56:17 +02:00
bech32: { title: "Bech32", fragments: [@Safe.Json(lnurlBech32)], showData: true, href: @Safe.Json(lnurlBech32) }
2022-07-12 08:17:44 +02:00
};
2022-08-31 12:27:06 +02:00
initQRShow({ title: "LNURL Withdraw", note: @Safe.Json(note), modes })
2022-07-12 08:17:44 +02:00
});
2020-10-13 09:58:46 +02:00
</script>
2022-07-12 08:17:44 +02:00
}
2023-06-29 15:43:01 +02:00
<script>
2022-07-12 08:17:44 +02:00
document.addEventListener("DOMContentLoaded", () => {
document.getElementById("copyLink").addEventListener("click", window.copyUrlToClipboard);
});
</script>
2023-06-29 15:43:01 +02:00
<vc:ui-extension-point location="pullpayment-view" model="@Model"></vc:ui-extension-point>
2020-06-24 10:34:09 +09:00
</body>
</html>
