mirror of
https://github.com/btcpayserver/btcpayserver.git
synced 2025-02-22 06:21:44 +01:00
Add API Key QR scan + click to reveal api key in List view (#2174)
This commit is contained in:
parent
58d01738ab
commit
64a68b95b0
3 changed files with 91 additions and 47 deletions
|
@ -4,62 +4,101 @@
|
|||
ViewData.SetActivePageAndTitle(ManageNavPages.APIKeys, "Manage your API Keys");
|
||||
}
|
||||
|
||||
<partial name="_StatusMessage" />
|
||||
<partial name="_StatusMessage"/>
|
||||
|
||||
<p>
|
||||
The <a asp-controller="Home" asp-action="SwaggerDocs" target="_blank">BTCPay Server Greenfield API</a> offers programmatic access to your instance. You can manage your BTCPay
|
||||
Server (e.g. stores, invoices, users) as well as automate workflows and integrations (see <a href="https://docs.btcpayserver.org/GreenFieldExample/">use case examples</a>).
|
||||
Server (e.g. stores, invoices, users) as well as automate workflows and integrations (see <a href="https://docs.btcpayserver.org/GreenFieldExample/">use case examples</a>).
|
||||
For that you need the API keys, which can be generated here. Find more information in the <a href="@Url.Action("SwaggerDocs", "Home")#section/Authentication" target="_blank">API authentication docs</a>.
|
||||
</p>
|
||||
<table class="table table-lg">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Label</th>
|
||||
<th>Key</th>
|
||||
<th>Permissions</th>
|
||||
<th class="text-right">Actions</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Label</th>
|
||||
<th>Key</th>
|
||||
<th>Permissions</th>
|
||||
<th class="text-right">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach (var keyData in Model.ApiKeyDatas)
|
||||
{
|
||||
<tr>
|
||||
<td>@keyData.Label</td>
|
||||
<td><code>@keyData.Id</code></td>
|
||||
<td>
|
||||
@{
|
||||
var permissions = keyData.GetBlob().Permissions;
|
||||
}
|
||||
@if (!permissions.Any())
|
||||
{
|
||||
<span class="text-warning">No permissions</span>
|
||||
}
|
||||
else
|
||||
{
|
||||
<ul>
|
||||
@foreach (var permission in Permission.ToPermissions(permissions).Select(c => c.ToString()).Distinct().ToArray())
|
||||
{
|
||||
<li><code>@permission</code></li>
|
||||
}
|
||||
</ul>
|
||||
}
|
||||
</td>
|
||||
<td class="text-right">
|
||||
<a asp-action="RemoveAPIKey" asp-route-id="@keyData.Id" asp-controller="Manage">Remove</a>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
@if (!Model.ApiKeyDatas.Any())
|
||||
{
|
||||
<tr>
|
||||
<td colspan="4" class="text-center h5 py-2">
|
||||
No API keys
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
@{
|
||||
var index = 0;
|
||||
}
|
||||
@foreach (var keyData in Model.ApiKeyDatas)
|
||||
{
|
||||
<tr>
|
||||
<td>@keyData.Label</td>
|
||||
<td>
|
||||
<code class="hide-when-js">@keyData.Id</code>
|
||||
<code class="only-for-js cursor-pointer" data-reveal="@keyData.Id">Click to reveal</code>
|
||||
</td>
|
||||
<td>
|
||||
@{
|
||||
var permissions = keyData.GetBlob().Permissions;
|
||||
}
|
||||
@if (!permissions.Any())
|
||||
{
|
||||
<span class="text-warning">No permissions</span>
|
||||
}
|
||||
else
|
||||
{
|
||||
<ul>
|
||||
@foreach (var permission in Permission.ToPermissions(permissions).Select(c => c.ToString()).Distinct().ToArray())
|
||||
{
|
||||
<li>
|
||||
<code>@permission</code>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
}
|
||||
</td>
|
||||
<td class="text-right">
|
||||
<a asp-action="RemoveAPIKey" asp-route-id="@keyData.Id" asp-controller="Manage">Remove</a>
|
||||
<span class="only-for-js">-</span>
|
||||
<button type="button" class="btn btn-link only-for-js" data-qr="@index">Show QR</button>
|
||||
</td>
|
||||
</tr>
|
||||
index++;
|
||||
}
|
||||
@if (!Model.ApiKeyDatas.Any())
|
||||
{
|
||||
<tr>
|
||||
<td colspan="4" class="text-center h5 py-2">
|
||||
No API keys
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
<a class="btn btn-primary" asp-action="AddApiKey" id="AddApiKey">
|
||||
<span class="fa fa-plus"></span>
|
||||
Generate new key
|
||||
</a>
|
||||
|
||||
<script src="~/vendor/vuejs/vue.min.js" asp-append-version="true"></script>
|
||||
<script src="~/vendor/vue-qrcode/vue-qrcode.min.js" asp-append-version="true"></script>
|
||||
<script src="~/vendor/bc-ur/web-bundle.js" asp-append-version="true"></script>
|
||||
<script src="~/vendor/vue-qrcode-reader/vue-qrcode-reader.browser.js" asp-append-version="true"></script>
|
||||
<link href="~/vendor/vue-qrcode-reader/vue-qrcode-reader.css" rel="stylesheet" asp-append-version="true"/>
|
||||
|
||||
<partial name="ShowQR"/>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$("[data-reveal]").on("click", function (){
|
||||
$(this).text($(this).data("reveal"));
|
||||
});
|
||||
|
||||
var apiKeys = @Safe.Json(Model.ApiKeyDatas.Select(data => new
|
||||
{
|
||||
ApiKey = data.Id,
|
||||
Host = Context.Request.GetAbsoluteRoot()
|
||||
}));
|
||||
var qrApp = initQRShow("API Key QR", "", "scan-qr-modal");
|
||||
$("button[data-qr]").on("click", function (){
|
||||
var data = apiKeys[parseInt($(this).data("qr"))];
|
||||
qrApp.data = JSON.stringify(data);
|
||||
qrApp.useBCUR = false;
|
||||
$("#scan-qr-modal").modal("show");
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
|
|
@ -39,7 +39,8 @@
|
|||
data: data,
|
||||
fragments: [],
|
||||
active: false,
|
||||
modalId: modalId
|
||||
modalId: modalId,
|
||||
useBCUR: true
|
||||
},
|
||||
computed:
|
||||
{
|
||||
|
@ -78,7 +79,11 @@
|
|||
this.fragments = [];
|
||||
return;
|
||||
}
|
||||
this.fragments = window.bcur.encodeUR(this.data.toString(), 200);
|
||||
if (this.useBCUR){
|
||||
this.fragments = window.bcur.encodeUR(this.data.toString(), 200);
|
||||
}else{
|
||||
this.fragments = [this.data.toString()];
|
||||
}
|
||||
},
|
||||
start: function ()
|
||||
{
|
||||
|
|
|
@ -98,7 +98,7 @@
|
|||
|
||||
<partial name="ShowQR"/>
|
||||
<script>
|
||||
var wallets = @Safe.Json(Model.AccountKeys.Select(model => Encoders.Hex.EncodeData(Encoding.UTF8.GetBytes(JsonConvert.SerializeObject(model)))));
|
||||
var wallets = @Safe.Json(Model.AccountKeys.Select(model => Encoders.Hex.EncodeData(Encoding.UTF8.GetBytes(JsonConvert.SerializeObject(model, Formatting.None)))));
|
||||
$(document).ready(function(){
|
||||
var qrApp = initQRShow("Wallet QR", "", "scan-qr-modal");
|
||||
$("button[data-wallet]").on("click", function (){
|
||||
|
|
Loading…
Add table
Reference in a new issue