Add UI for client API keys
This commit is contained in:
parent
2017e640b6
commit
9b93629f45
9 changed files with 215 additions and 85 deletions
|
@ -18,57 +18,70 @@
|
|||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header">
|
||||
<h3 class="box-title">@lang('base.api.index.list')</h3>
|
||||
<div class="box-tools">
|
||||
<a href="{{ route('account.api.new') }}"><button class="btn btn-primary btn-sm">Create New</button></a>
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="box box-primary">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">Credentials List</h3>
|
||||
<div class="box-tools">
|
||||
<a href="{{ route('account.api.new') }}" class="btn btn-sm btn-primary">Create New</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body table-responsive no-padding">
|
||||
<table class="table table-hover">
|
||||
<tbody>
|
||||
<div class="box-body table-responsive no-padding">
|
||||
<table class="table table-hover">
|
||||
<tr>
|
||||
<th>@lang('strings.memo')</th>
|
||||
<th>@lang('strings.public_key')</th>
|
||||
<th class="text-right hidden-sm hidden-xs">@lang('strings.last_used')</th>
|
||||
<th class="text-right hidden-sm hidden-xs">@lang('strings.created')</th>
|
||||
<th>Key</th>
|
||||
<th>Memo</th>
|
||||
<th>Last Used</th>
|
||||
<th>Created</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
@foreach ($keys as $key)
|
||||
@foreach($keys as $key)
|
||||
<tr>
|
||||
<td>
|
||||
<code class="toggle-display" style="cursor:pointer" data-toggle="tooltip" data-placement="right" title="Click to Reveal">
|
||||
<i class="fa fa-key"></i> ••••••••
|
||||
</code>
|
||||
<code class="hidden" data-attr="api-key">
|
||||
{{ $key->identifier }}{{ decrypt($key->token) }}
|
||||
</code>
|
||||
</td>
|
||||
<td>{{ $key->memo }}</td>
|
||||
<td><code>{{ $key->identifier . decrypt($key->token) }}</code></td>
|
||||
<td class="text-right hidden-sm hidden-xs">
|
||||
<td>
|
||||
@if(!is_null($key->last_used_at))
|
||||
@datetimeHuman($key->last_used_at)
|
||||
@else
|
||||
@else
|
||||
—
|
||||
@endif
|
||||
</td>
|
||||
<td class="text-right hidden-sm hidden-xs">
|
||||
@datetimeHuman($key->created_at)
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<a href="#delete" class="text-danger" data-action="delete" data-attr="{{ $key->identifier }}"><i class="fa fa-trash"></i></a>
|
||||
<td>@datetimeHuman($key->created_at)</td>
|
||||
<td>
|
||||
<a href="#" data-action="revoke-key" data-attr="{{ $key->identifier }}">
|
||||
<i class="fa fa-trash-o text-danger"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
|
||||
@section('footer-scripts')
|
||||
@parent
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('[data-action="delete"]').click(function (event) {
|
||||
$(function () {
|
||||
$('[data-toggle="tooltip"]').tooltip()
|
||||
});
|
||||
$('.toggle-display').on('click', function () {
|
||||
$(this).parent().find('code[data-attr="api-key"]').removeClass('hidden');
|
||||
$(this).hide();
|
||||
});
|
||||
|
||||
$('[data-action="revoke-key"]').click(function (event) {
|
||||
var self = $(this);
|
||||
event.preventDefault();
|
||||
swal({
|
||||
|
|
Reference in a new issue