55 lines
1.8 KiB
HTML
55 lines
1.8 KiB
HTML
{% extends "default.html" %}
|
|
|
|
{% block title %}API Key{% endblock %}
|
|
{% set active_page = "api_key" %}
|
|
{% block default_content %}
|
|
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<h1 class="h3">New API Key {{ api_key.name }} is created</h1>
|
|
<div class="alert alert-warning">For security reasons, API Key is only visible when it is created.</div>
|
|
<div class="input-group mb-2">
|
|
<input class="form-control"
|
|
id="apikey-{{ api_key.id }}"
|
|
readonly
|
|
value="**********">
|
|
<div class="input-group-append">
|
|
<span class="input-group-text">
|
|
<i class="fe fe-eye toggle-api-key"
|
|
data-show="off"
|
|
data-secret="{{ api_key.code }}"></i>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<button class="clipboard btn btn-primary"
|
|
data-clipboard-action="copy"
|
|
data-clipboard-text="{{ api_key.code }}"
|
|
data-clipboard-target="#apikey-{{ api_key.id }}">
|
|
Copy <i class="fe fe-clipboard"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
{% block script %}
|
|
|
|
<script>
|
|
$(".toggle-api-key").on('click', function (event) {
|
|
let that = $(this);
|
|
let apiInput = that.parent().parent().parent().find("input");
|
|
if (that.attr("data-show") === "off") {
|
|
let apiKey = $(this).attr("data-secret");
|
|
apiInput.val(apiKey);
|
|
that.addClass("fe-eye-off");
|
|
that.removeClass("fe-eye");
|
|
that.attr("data-show", "on");
|
|
} else {
|
|
that.removeClass("fe-eye-off");
|
|
that.addClass("fe-eye");
|
|
apiInput.val("**********");
|
|
that.attr("data-show", "off");
|
|
}
|
|
|
|
});
|
|
</script>
|
|
{% endblock %}
|