fix bug api key managemtn for admin

03-apiservice/app/templates/apikey_edit.html

@@ -0,0 +1,106 @@
+{% extends "sqladmin/edit.html" %}
+
+{% block content %}
+{{ super() }}
+
+{# key_id ใช้ model.id ถ้ามี ไม่งั้น fallback จาก path params #}
+{% set key_id = model.id if (model is defined and model) else request.path_params.get('pk') %}
+ 
+
+<div class="card mt-3">
+    <div class="card-header">
+        <h5>API Key Actions</h5>
+    </div>
+    <div class="card-body">
+        <button type="button" class="btn btn-warning me-2" onclick="regenerateApiKey({{ key_id|default('null') }})">
+            <i class="fa fa-refresh"></i> Regenerate API Key
+        </button>
+        <button type="button" class="btn btn-info" onclick="viewApiKey({{ key_id|default('null') }})">
+            <i class="fa fa-eye"></i> View API Key (if just created)
+        </button>
+        
+        <div id="apiKeyResult" class="mt-3" style="display: none;">
+            <div class="alert alert-warning">
+                <h6>⚠️ Important: Save this key immediately!</h6>
+                <p>This key will only be shown once and cannot be retrieved later.</p>
+                <div class="input-group">
+                    <input type="text" id="apiKeyValue" class="form-control" readonly>
+                    <button class="btn btn-primary" onclick="copyApiKey()">
+                        <i class="fa fa-copy"></i> Copy
+                    </button>
+                </div>
+                <small id="apiKeyMessage" class="text-muted mt-2 d-block"></small>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script>
+async function regenerateApiKey(keyId) {
+    if (!confirm('Are you sure you want to regenerate this API key? The old key will stop working immediately!')) {
+        return;
+    }
+    
+    try {
+        const rootPath = '{{ request.scope.get("root_path", "") }}';
+        const url = `${rootPath}/admin/api-keys/${keyId}/regenerate`;
+        
+        const response = await fetch(url, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            }
+        });
+        
+        const data = await response.json();
+        
+        if (data.success) {
+            document.getElementById('apiKeyValue').value = data.api_key;
+            document.getElementById('apiKeyMessage').textContent = data.message;
+            document.getElementById('apiKeyResult').style.display = 'block';
+            
+            alert('✅ API Key regenerated successfully!\n\nNew Key: ' + data.api_key + '\n\nPlease copy and save it now!');
+        } else {
+            alert('❌ Error: ' + (data.message || 'Failed to regenerate API key'));
+        }
+    } catch (error) {
+        alert('❌ Error: ' + error.message);
+    }
+}
+
+async function viewApiKey(keyId) {
+    try {
+        const rootPath = '{{ request.scope.get("root_path", "") }}';
+        const url = `${rootPath}/admin/api-keys/${keyId}/view`;
+        
+        const response = await fetch(url, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            }
+        });
+        
+        const data = await response.json();
+        
+        if (data.success) {
+            document.getElementById('apiKeyValue').value = data.api_key;
+            document.getElementById('apiKeyMessage').textContent = data.message;
+            document.getElementById('apiKeyResult').style.display = 'block';
+            
+            alert('✅ API Key retrieved!\n\nKey: ' + data.api_key + '\n\nPlease copy and save it now!');
+        } else {
+            alert('ℹ️ ' + data.message);
+        }
+    } catch (error) {
+        alert('❌ Error: ' + error.message);
+    }
+}
+
+function copyApiKey() {
+    const input = document.getElementById('apiKeyValue');
+    input.select();
+    document.execCommand('copy');
+    alert('✅ API Key copied to clipboard!');
+}
+</script>
+{% endblock %}