76 lines
6.0 KiB
PHP
76 lines
6.0 KiB
PHP
<form wire:submit="save">
|
|
<x-modal :title="__('addons.smtp.setup_title')" icon="alert">
|
|
<div class="p-5 flex flex-col gap-5">
|
|
@if ($flash)
|
|
<p @class([
|
|
'rounded-lg border px-3 py-2 text-[12.5px]',
|
|
'border-online/30 bg-online/10 text-online' => $flashOk,
|
|
'border-offline/30 bg-offline/10 text-offline' => ! $flashOk,
|
|
])>{{ $flash }}</p>
|
|
@endif
|
|
|
|
{{-- Server --}}
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
|
<div class="flex flex-col gap-1.5 sm:col-span-2">
|
|
<label class="text-[12px] font-semibold text-ink-2">{{ __('addons.smtp.host') }}</label>
|
|
<input wire:model="host" type="text" placeholder="smtp.example.com"
|
|
class="w-full rounded-lg bg-raised border border-line px-3 py-2.5 text-sm font-mono text-ink outline-none focus:border-accent focus:ring-1 focus:ring-accent">
|
|
@error('host') <p class="text-[12px] text-offline">{{ $message }}</p> @enderror
|
|
</div>
|
|
<div class="flex flex-col gap-1.5">
|
|
<label class="text-[12px] font-semibold text-ink-2">{{ __('addons.smtp.port') }}</label>
|
|
<input wire:model="port" type="number" min="1" max="65535"
|
|
class="w-full rounded-lg bg-raised border border-line px-3 py-2.5 text-sm font-mono text-ink outline-none focus:border-accent focus:ring-1 focus:ring-accent">
|
|
@error('port') <p class="text-[12px] text-offline">{{ $message }}</p> @enderror
|
|
</div>
|
|
<div class="flex flex-col gap-1.5">
|
|
<label class="text-[12px] font-semibold text-ink-2">{{ __('addons.smtp.encryption') }}</label>
|
|
<select wire:model="encryption" class="w-full rounded-lg bg-raised border border-line px-3 py-2.5 text-sm text-ink outline-none focus:border-accent">
|
|
<option value="tls">TLS</option>
|
|
<option value="ssl">SSL</option>
|
|
<option value="">{{ __('addons.smtp.enc_none') }}</option>
|
|
</select>
|
|
</div>
|
|
<div class="flex flex-col gap-1.5">
|
|
<label class="text-[12px] font-semibold text-ink-2">{{ __('addons.smtp.username') }}</label>
|
|
<input wire:model="username" type="text" autocomplete="off"
|
|
class="w-full rounded-lg bg-raised border border-line px-3 py-2.5 text-sm text-ink outline-none focus:border-accent focus:ring-1 focus:ring-accent">
|
|
</div>
|
|
<div class="flex flex-col gap-1.5">
|
|
<label class="text-[12px] font-semibold text-ink-2">{{ __('addons.smtp.password') }}</label>
|
|
<input wire:model="password" type="password" autocomplete="new-password"
|
|
class="w-full rounded-lg bg-raised border border-line px-3 py-2.5 text-sm text-ink outline-none focus:border-accent focus:ring-1 focus:ring-accent">
|
|
@if ($hasStoredPassword) <p class="text-[11px] text-ink-3">{{ __('addons.smtp.password_stored') }}</p> @endif
|
|
</div>
|
|
<div class="flex flex-col gap-1.5">
|
|
<label class="text-[12px] font-semibold text-ink-2">{{ __('addons.smtp.from_email') }}</label>
|
|
<input wire:model="fromEmail" type="email"
|
|
class="w-full rounded-lg bg-raised border border-line px-3 py-2.5 text-sm text-ink outline-none focus:border-accent focus:ring-1 focus:ring-accent">
|
|
@error('fromEmail') <p class="text-[12px] text-offline">{{ $message }}</p> @enderror
|
|
</div>
|
|
<div class="flex flex-col gap-1.5">
|
|
<label class="text-[12px] font-semibold text-ink-2">{{ __('addons.smtp.to_email') }}</label>
|
|
<input wire:model="toEmail" type="email"
|
|
class="w-full rounded-lg bg-raised border border-line px-3 py-2.5 text-sm text-ink outline-none focus:border-accent focus:ring-1 focus:ring-accent">
|
|
@error('toEmail') <p class="text-[12px] text-offline">{{ $message }}</p> @enderror
|
|
</div>
|
|
</div>
|
|
|
|
{{-- Events --}}
|
|
<fieldset class="flex flex-col gap-2.5 rounded-xl border border-line-soft p-3.5">
|
|
<legend class="px-1.5 text-[11px] font-bold uppercase tracking-wide text-ink-3">{{ __('addons.smtp.events_title') }}</legend>
|
|
<label class="flex items-center gap-2.5 cursor-pointer text-[13px] text-ink"><input type="checkbox" wire:model="evDeviceOffline" class="checkbox"> {{ __('addons.smtp.ev_device_offline') }}</label>
|
|
<label class="flex items-center gap-2.5 cursor-pointer text-[13px] text-ink"><input type="checkbox" wire:model="evLowBattery" class="checkbox"> {{ __('addons.smtp.ev_low_battery') }}</label>
|
|
<label class="flex items-center gap-2.5 cursor-pointer text-[13px] text-ink"><input type="checkbox" wire:model="evAutomation" class="checkbox"> {{ __('addons.smtp.ev_automation') }}</label>
|
|
</fieldset>
|
|
</div>
|
|
|
|
<x-slot:footer>
|
|
<button type="button" wire:click="sendTest" wire:loading.attr="disabled" wire:target="sendTest"
|
|
class="mr-auto rounded-lg border border-line px-3.5 py-2 text-[13px] font-semibold text-ink-2 hover:text-ink hover:bg-raised transition-colors">{{ __('addons.smtp.test') }}</button>
|
|
<button type="button" wire:click="closeModal" class="rounded-lg border border-line px-3.5 py-2 text-[13px] font-semibold text-ink-2 hover:text-ink hover:bg-raised transition-colors">{{ __('common.cancel') }}</button>
|
|
<button type="submit" class="rounded-lg bg-accent px-3.5 py-2 text-[13px] font-bold text-base hover:brightness-110 transition-[filter]">{{ __('addons.smtp.save') }}</button>
|
|
</x-slot:footer>
|
|
</x-modal>
|
|
</form>
|