54 lines
2.8 KiB
PHP
54 lines
2.8 KiB
PHP
{{-- R24: the configuration itself is long, so it is the part that scrolls —
|
|
the title and the close button stay where they were. --}}
|
|
<x-ui.modal :title="__('vpn.get_config_title', ['name' => $name])">
|
|
@if ($config === null)
|
|
<p class="text-sm text-muted">{{ __('vpn.get_config_body') }}</p>
|
|
|
|
<form id="vpn-config-access" wire:submit="reveal" class="mt-4 space-y-3">
|
|
{{-- autocomplete hint keeps password managers from offering to save
|
|
this as a new login for the site. --}}
|
|
<x-ui.input name="password" type="password" wire:model="password"
|
|
:label="__('vpn.your_password')" autocomplete="current-password" />
|
|
</form>
|
|
@else
|
|
<div x-data="vpnConfigActions(@js($this->filename()))">
|
|
<pre x-ref="config" class="max-h-64 overflow-auto rounded-lg border border-line bg-surface-2 p-4 font-mono text-xs leading-relaxed text-body">{{ $config }}</pre>
|
|
<div class="mt-3 flex flex-wrap items-center gap-2">
|
|
<x-ui.button variant="primary" x-on:click="download()">
|
|
<x-ui.icon name="download" class="size-4" />{{ __('vpn.download') }}
|
|
</x-ui.button>
|
|
<x-ui.button variant="secondary" x-on:click="copy()">
|
|
<x-ui.icon name="copy" class="size-4" />
|
|
<span x-text="copied ? @js(__('vpn.copied')) : @js(__('vpn.copy'))"></span>
|
|
</x-ui.button>
|
|
<x-ui.button variant="secondary" wire:click="toggleQr" wire:loading.attr="disabled">
|
|
<x-ui.icon name="qr-code" class="size-4" />{{ $showQr ? __('vpn.qr_hide') : __('vpn.qr_show') }}
|
|
</x-ui.button>
|
|
<p x-show="failed" x-cloak class="text-xs text-danger">{{ __('vpn.copy_failed') }}</p>
|
|
</div>
|
|
|
|
@if ($qrSvg)
|
|
<div class="mt-4 flex flex-col items-center gap-2 rounded-lg border border-line p-4">
|
|
<div>{!! $qrSvg !!}</div>
|
|
<p class="text-xs text-muted">{{ __('vpn.qr_hint') }}</p>
|
|
</div>
|
|
@endif
|
|
|
|
</div>
|
|
@endif
|
|
|
|
<x-slot:footer>
|
|
<div class="flex justify-end gap-2">
|
|
<x-ui.button variant="secondary" type="button" x-on:click="Livewire.dispatch('closeModal')">
|
|
{{ $config === null ? __('vpn.cancel') : __('common.close') }}
|
|
</x-ui.button>
|
|
@if ($config === null)
|
|
{{-- form=, because the footer sits outside the <form>. --}}
|
|
<x-ui.button variant="primary" type="submit" form="vpn-config-access" wire:loading.attr="disabled">
|
|
<x-ui.icon name="unlock" class="size-4" />{{ __('vpn.reveal') }}
|
|
</x-ui.button>
|
|
@endif
|
|
</div>
|
|
</x-slot:footer>
|
|
</x-ui.modal>
|