88 lines
4.3 KiB
Plaintext
88 lines
4.3 KiB
Plaintext
<div class="space-y-6">
|
|
<!-- Page header with back link -->
|
|
<div class="flex items-center gap-4">
|
|
<%= link_to admin_gateways_path, class: "inline-flex items-center gap-2 text-sm font-medium text-gray-600 hover:text-gray-900 transition-colors" do %>
|
|
<i class="fas fa-arrow-left"></i>
|
|
Back to Gateways
|
|
<% end %>
|
|
</div>
|
|
|
|
<div class="border-b border-gray-200 pb-5">
|
|
<h1 class="text-3xl font-bold leading-tight tracking-tight text-gray-900">Register New Gateway</h1>
|
|
<p class="mt-2 text-sm text-gray-600">Add a new Android gateway device to your SMS system.</p>
|
|
</div>
|
|
|
|
<!-- Form card -->
|
|
<div class="rounded-xl bg-white shadow-sm ring-1 ring-gray-900/5 px-6 py-8 max-w-2xl">
|
|
<%= form_with url: admin_gateways_path, method: :post, local: true, class: "space-y-6" do |f| %>
|
|
<!-- Device ID field -->
|
|
<div>
|
|
<%= label_tag "gateway[device_id]", "Device ID", class: "block text-sm font-medium text-gray-700" %>
|
|
<div class="mt-1 relative">
|
|
<div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3">
|
|
<i class="fas fa-mobile-alt text-gray-400"></i>
|
|
</div>
|
|
<%= text_field_tag "gateway[device_id]", nil,
|
|
class: "block w-full pl-10 rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm py-3",
|
|
placeholder: "device-001",
|
|
required: true %>
|
|
</div>
|
|
<p class="mt-1 text-sm text-gray-500">A unique identifier for this gateway device (e.g., phone model, serial number)</p>
|
|
</div>
|
|
|
|
<!-- Name field -->
|
|
<div>
|
|
<%= label_tag "gateway[name]", "Gateway Name", class: "block text-sm font-medium text-gray-700" %>
|
|
<div class="mt-1 relative">
|
|
<div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3">
|
|
<i class="fas fa-tag text-gray-400"></i>
|
|
</div>
|
|
<%= text_field_tag "gateway[name]", nil,
|
|
class: "block w-full pl-10 rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm py-3",
|
|
placeholder: "Office Phone",
|
|
required: true %>
|
|
</div>
|
|
<p class="mt-1 text-sm text-gray-500">A friendly name to identify this gateway</p>
|
|
</div>
|
|
|
|
<!-- Priority field -->
|
|
<div>
|
|
<%= label_tag "gateway[priority]", "Priority", class: "block text-sm font-medium text-gray-700" %>
|
|
<div class="mt-1 relative">
|
|
<div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3">
|
|
<i class="fas fa-sort-numeric-up text-gray-400"></i>
|
|
</div>
|
|
<%= number_field_tag "gateway[priority]", 1,
|
|
min: 1,
|
|
max: 10,
|
|
class: "block w-full pl-10 rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm py-3" %>
|
|
</div>
|
|
<p class="mt-1 text-sm text-gray-500">Priority level (1-10). Higher priority gateways are used first for sending messages.</p>
|
|
</div>
|
|
|
|
<!-- Information box -->
|
|
<div class="rounded-lg bg-blue-50 px-4 py-4 ring-1 ring-blue-600/10">
|
|
<div class="flex items-start gap-3">
|
|
<div class="flex-shrink-0">
|
|
<i class="fas fa-info-circle text-blue-600 text-xl"></i>
|
|
</div>
|
|
<div>
|
|
<h3 class="text-sm font-semibold text-blue-800">Gateway API Key</h3>
|
|
<p class="mt-1 text-sm text-blue-700">
|
|
After creating the gateway, you'll receive a unique API key. You'll need to configure this key in your Android gateway app to connect it to the system.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Action buttons -->
|
|
<div class="flex items-center gap-3 pt-4">
|
|
<%= submit_tag "Register Gateway",
|
|
class: "inline-flex justify-center items-center gap-2 rounded-lg bg-blue-600 px-6 py-3 text-sm font-semibold text-white shadow-sm hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600 transition-all duration-200" %>
|
|
<%= link_to "Cancel", admin_gateways_path,
|
|
class: "inline-flex justify-center items-center gap-2 rounded-lg bg-gray-100 px-6 py-3 text-sm font-semibold text-gray-700 hover:bg-gray-200 transition-all duration-200" %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
</div>
|