diff --git a/assets/js/app.ts b/assets/js/app.ts index 7f9ad907..5ca0c621 100644 --- a/assets/js/app.ts +++ b/assets/js/app.ts @@ -819,6 +819,40 @@ const NetworkMap = { } } +// MikroTik Port Sync - automatically switches port when SSL checkbox is toggled +const MikrotikPortSync = { + handleSslChange: null as ((e: Event) => void) | null, + + mounted(this: any) { + const sslCheckbox = this.el.querySelector('[name="device[mikrotik_use_ssl]"]') + const portInput = this.el.querySelector('[name="device[mikrotik_port]"]') as HTMLInputElement + + if (!sslCheckbox || !portInput) return + + this.handleSslChange = () => { + const isChecked = (sslCheckbox as HTMLInputElement).checked + const currentPort = portInput.value.trim() + + // Only update port if it's empty or set to one of the default values + if (currentPort === '' || currentPort === '8729' || currentPort === '8728') { + portInput.value = isChecked ? '8729' : '8728' + // Trigger a change event so LiveView validates the new value + portInput.dispatchEvent(new Event('input', { bubbles: true })) + } + } + + sslCheckbox.addEventListener('change', this.handleSslChange) + }, + + destroyed(this: any) { + const sslCheckbox = this.el.querySelector('[name="device[mikrotik_use_ssl]"]') + if (sslCheckbox && this.handleSslChange) { + sslCheckbox.removeEventListener('change', this.handleSslChange) + this.handleSslChange = null + } + } +} + const csrfToken = document.querySelector("meta[name='csrf-token']")?.getAttribute("content") if (!csrfToken) { throw new Error('CSRF token meta tag not found') @@ -830,7 +864,7 @@ const userTimezone = Intl.DateTimeFormat().resolvedOptions().timeZone || "UTC" const liveSocket = new LiveSocket("/live", Socket, { longPollFallbackMs: 2500, params: { _csrf_token: csrfToken, timezone: userTimezone }, - hooks: { ...colocatedHooks, SensorChart, CopyToClipboard, ScrollToTop, AutoDismissFlash, BetaBannerDismiss, NetworkMap, DeviceListReorder }, + hooks: { ...colocatedHooks, SensorChart, CopyToClipboard, ScrollToTop, AutoDismissFlash, BetaBannerDismiss, NetworkMap, DeviceListReorder, MikrotikPortSync }, }) // Show progress bar on live navigation and form submits diff --git a/lib/towerops_web/live/device_live/form.html.heex b/lib/towerops_web/live/device_live/form.html.heex index 83a9b2f1..b7d4d774 100644 --- a/lib/towerops_web/live/device_live/form.html.heex +++ b/lib/towerops_web/live/device_live/form.html.heex @@ -358,7 +358,11 @@ <%= if @live_action == :edit and @is_mikrotik_device and @current_scope.user.is_superuser do %> -
+

MikroTik API Configuration