File: /home/posscale/www/printmanager/resources/views/tenant/settings/edit-connection.blade.php
<x-app-layout>
<x-slot name="header">
<h1 class="mb-0 uppercase text-3xl">
{{ __('Settings') }}
</h1>
</x-slot>
@if(session()->has('message'))
<div class="alert alert-success">
{{ session()->get('message') }}
</div>
@endif
<div class="py-12">
<div class="grid grid-cols-1">
<div class="card">
<div class="card-header flex justify-between">
<h3 class="card-title uppercase">
<i class="fas fa-cog"></i>
Printer Source Connection
</h3>
</div>
<div class="card-body">
<div class="shadow-sm overflow-hidden mb-8 ">
<form action="{{ route('settings.update', $connection->id) }}" method="POST">
@method('PUT')
@csrf
<div class="p-5" x-data="{ type: '{{$connection->type}}' }">
<div class="grid grid-cols-1 gap-4 mb-4">
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">Select connection source</span>
<select name="type" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" @change="type= $event.target.options[$event.target.selectedIndex].value">
<option {{ $connection->type =='SMTP'?'selected':''}} value="SMTP">SMTP</option>
<option {{ $connection->type =='FTP'?'selected':''}} value="FTP">FTP</option>
<option {{ $connection->type =='SNMP'?'selected':''}} value="SNMP">SNMP</option>
</select>
@error('name')
<div class="alert alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
</div>
@php
$data = json_decode($connection->data, true);
@endphp
<div class="grid grid-cols-1 mb-4 gap-4" :class="{ '!hidden': type!='SMTP'}">
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">Protocol</span>
<select name="type_for_monitoring" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1">
<option {{ isset($data['type_for_monitoring']) && $data['type_for_monitoring']=='pop'?'selected':''}} value="pop">pop</option>
<option {{ isset($data['type_for_monitoring']) && $data['type_for_monitoring']=='imap'?'selected':''}} value="imap">imap</option>
<option {{ isset($data['type_for_monitoring']) && $data['type_for_monitoring']=='exchange'?'selected':''}} value="exchange">exchange</option>
</select>
@error('host')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
</div>
<div class="grid grid-cols-2 gap-4" :class="{ '!hidden': type!='SMTP'}">
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">Host</span>
<input value="{{$data['host']??old('host')}}" type="text" name="host" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="smtp.google.com" />
@error('host')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">Port</span>
<input value="{{$data['port']??old('port')}}" type="text" name="port" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="" />
@error('port')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">User Name</span>
<input value="{{$data['user_name']??old('user_name')}}" type="text" name="user_name" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="" />
@error('user_name')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">User Password</span>
<input value="{{$data['user_password']??old('user_password')}}" type="text" name="user_password" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="" />
@error('user_password')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">From Email</span>
<input value="{{$data['from']??old('from')}}" type="text" name="from" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="" />
@error('from')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">From Name</span>
<input value="{{$data['from_name']??old('from_name')}}" type="text" name="from_name" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="" />
@error('from_name')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
</div>
<div class="grid grid-cols-1 mb-4 gap-4" :class="{ '!hidden': type!='FTP'}">
<label for="ftp_protocol" class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">Protocol</span>
<select name="ftp_protocol" id="ftp_protocol" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1">
<option {{ isset($data['ftp_protocol']) && $data['ftp_protocol']=='ftp'?'selected':''}} value="ftp">ftp</option>
<option {{ isset($data['ftp_protocol']) && $data['ftp_protocol']=='sftp'?'selected':''}} value="sftp">sftp</option>
</select>
@error('ftp_protocol')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
</div>
<div class="grid grid-cols-2 gap-4" :class="{ '!hidden': type!='FTP'}">
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">FTP Host</span>
<input value="{{$data['ftp_host']??old('ftp_host')}}" type="text" name="ftp_host" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="smtp.google.com" />
@error('ftp_host')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">FTP Port</span>
<input value="{{$data['ftp_port']??old('ftp_port')}}" type="number" name="ftp_port" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="" />
@error('ftp_port')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">FTP User Name</span>
<input value="{{$data['ftp_user_name']??old('ftp_user_name')}}" type="text" name="ftp_user_name" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="" />
@error('ftp_user_name')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">User Password</span>
<input value="{{$data['ftp_password']??old('ftp_password')}}" type="password" name="ftp_password" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="" />
@error('ftp_password')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
<label class="block form-label">
<span class="after:content-['*'] after:ml-0.5 after:text-red-500 block">Directory Path</span>
<input value="{{$data['ftp_folder']??old('from')}}" type="text" name="ftp_folder" class="form-input mt-1 px-3 py-2 bg-white border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block w-full rounded-md sm:text-sm focus:ring-1" placeholder="" />
@error('ftp_folder')
<div class="alert-danger mt-3 text-red-900">{{ $message }}</div>
@enderror
</label>
</div>
<div class="mt-10">
<input type="submit" value="Save" class="btn-primary inline-flex items-center px-4 py-2 bg-gray-800 dark:bg-gray-200 border border-transparent rounded-md font-semibold text-xs text-white dark:text-gray-800 uppercase tracking-widest hover:bg-gray-700 dark:hover:bg-white focus:bg-gray-700 dark:focus:bg-white active:bg-gray-900 dark:active:bg-gray-300 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 dark:focus:ring-offset-gray-800 transition ease-in-out duration-150">
<a href="{{ route('settings.index') }}" class="ml-5 inline-flex items-center px-4 py-2 bg-red-800 dark:bg-red-200 border border-transparent rounded-md font-semibold text-xs text-white dark:text-red-800 uppercase tracking-widest hover:bg-red-700 dark:hover:bg-white focus:bg-gray-700 dark:focus:bg-white active:bg-gray-900 dark:active:bg-gray-300 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 dark:focus:ring-offset-red-800 transition ease-in-out duration-150">Cancel</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</x-app-layout>