Files
MySMSAPio/app/views/admin/api_keys/new.html.erb
2025-10-22 17:22:17 +08:00

106 lines
5.1 KiB
Plaintext

<div class="space-y-6">
<!-- Page header with back link -->
<div class="flex items-center gap-4">
<%= link_to admin_api_keys_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 API Keys
<% end %>
</div>
<div class="border-b border-gray-200 pb-5">
<h1 class="text-3xl font-bold leading-tight tracking-tight text-gray-900">Create New API Key</h1>
<p class="mt-2 text-sm text-gray-600">Generate a new API key with specific permissions for your application.</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_api_keys_path, method: :post, local: true, class: "space-y-6" do |f| %>
<!-- Name field -->
<div>
<%= label_tag "api_key[name]", "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 "api_key[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: "My Application",
required: true %>
</div>
<p class="mt-1 text-sm text-gray-500">A descriptive name to identify this API key</p>
</div>
<!-- Permissions checkboxes -->
<div>
<label class="block text-sm font-medium text-gray-700 mb-3">Permissions</label>
<div class="space-y-3">
<label class="relative flex items-start">
<div class="flex items-center h-6">
<%= check_box_tag "api_key[send_sms]", "1", true,
class: "h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-600" %>
</div>
<div class="ml-3">
<span class="text-sm font-medium text-gray-900">Send SMS</span>
<p class="text-sm text-gray-500">Allow sending outbound SMS messages</p>
</div>
</label>
<label class="relative flex items-start">
<div class="flex items-center h-6">
<%= check_box_tag "api_key[receive_sms]", "1", true,
class: "h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-600" %>
</div>
<div class="ml-3">
<span class="text-sm font-medium text-gray-900">Receive SMS</span>
<p class="text-sm text-gray-500">Allow receiving and querying inbound SMS</p>
</div>
</label>
<label class="relative flex items-start">
<div class="flex items-center h-6">
<%= check_box_tag "api_key[manage_gateways]", "1", false,
class: "h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-600" %>
</div>
<div class="ml-3">
<span class="text-sm font-medium text-gray-900">Manage Gateways</span>
<p class="text-sm text-gray-500">Allow managing gateway devices and settings</p>
</div>
</label>
<label class="relative flex items-start">
<div class="flex items-center h-6">
<%= check_box_tag "api_key[manage_otp]", "1", true,
class: "h-4 w-4 rounded border-gray-300 text-blue-600 focus:ring-blue-600" %>
</div>
<div class="ml-3">
<span class="text-sm font-medium text-gray-900">Manage OTP</span>
<p class="text-sm text-gray-500">Allow generating and verifying OTP codes</p>
</div>
</label>
</div>
</div>
<!-- Expiration field -->
<div>
<%= label_tag "api_key[expires_at]", "Expiration Date (Optional)", 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-calendar text-gray-400"></i>
</div>
<%= datetime_local_field_tag "api_key[expires_at]", 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" %>
</div>
<p class="mt-1 text-sm text-gray-500">Leave empty for no expiration</p>
</div>
<!-- Action buttons -->
<div class="flex items-center gap-3 pt-4">
<%= submit_tag "Create API Key",
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_api_keys_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>