![]() Server : Apache/2 System : Linux server-15-235-50-60 5.15.0-164-generic #174-Ubuntu SMP Fri Nov 14 20:25:16 UTC 2025 x86_64 User : gositeme ( 1004) PHP Version : 8.2.29 Disable Function : exec,system,passthru,shell_exec,proc_close,proc_open,dl,popen,show_source,posix_kill,posix_mkfifo,posix_getpwuid,posix_setpgid,posix_setsid,posix_setuid,posix_setgid,posix_seteuid,posix_setegid,posix_uname Directory : /home/gositeme/domains/soundstudiopro.com/private_html/admin_includes/ |
<?php
// API Logs Tab
// This file handles API activity logging
// API logs (mock data)
$api_logs = [
['time' => '2025-07-24 21:15:30', 'api' => 'Stripe', 'action' => 'Payment Success', 'status' => 'success', 'user' => 'user123', 'ip' => '192.168.1.100'],
['time' => '2025-07-24 21:10:15', 'api' => 'Google', 'action' => 'OAuth Login', 'status' => 'success', 'user' => 'user456', 'ip' => '192.168.1.101'],
['time' => '2025-07-24 21:05:45', 'api' => 'PayPal', 'action' => 'Payment Failed', 'status' => 'error', 'user' => 'user789', 'ip' => '192.168.1.102'],
['time' => '2025-07-24 21:00:20', 'api' => 'Twitter', 'action' => 'Share Track', 'status' => 'success', 'user' => 'user123', 'ip' => '192.168.1.100'],
['time' => '2025-07-24 20:55:10', 'api' => 'Discord', 'action' => 'Webhook Call', 'status' => 'error', 'user' => 'system', 'ip' => '192.168.1.103'],
['time' => '2025-07-24 20:50:30', 'api' => 'Facebook', 'action' => 'Login Attempt', 'status' => 'success', 'user' => 'user456', 'ip' => '192.168.1.101'],
['time' => '2025-07-24 20:45:15', 'api' => 'Stripe', 'action' => 'Refund Processed', 'status' => 'success', 'user' => 'user789', 'ip' => '192.168.1.102'],
['time' => '2025-07-24 20:40:00', 'api' => 'Apple', 'action' => 'Sign in with Apple', 'status' => 'error', 'user' => 'user123', 'ip' => '192.168.1.100']
];
// API statistics
$api_stats = [
'total_calls' => 1247,
'successful_calls' => 1198,
'failed_calls' => 49,
'success_rate' => 96.1
];
?>
<!-- API Activity Logs -->
<div class="section-header">
<h2><i class="fas fa-list-alt"></i> API Activity Logs</h2>
<p>Monitor API calls and integration activity.</p>
</div>
<!-- API Statistics -->
<div class="stats-grid" style="margin-bottom: 3rem;">
<div class="stat-card">
<div class="stat-number"><?= number_format($api_stats['total_calls']) ?></div>
<div class="stat-label">Total API Calls</div>
</div>
<div class="stat-card">
<div class="stat-number"><?= number_format($api_stats['successful_calls']) ?></div>
<div class="stat-label">Successful Calls</div>
</div>
<div class="stat-card">
<div class="stat-number"><?= number_format($api_stats['failed_calls']) ?></div>
<div class="stat-label">Failed Calls</div>
</div>
<div class="stat-card">
<div class="stat-number"><?= $api_stats['success_rate'] ?>%</div>
<div class="stat-label">Success Rate</div>
</div>
</div>
<!-- Log Filters -->
<div style="background: rgba(255, 255, 255, 0.05); border-radius: 16px; padding: 2rem; margin-bottom: 2rem;">
<h4 style="margin-top: 0; color: white; margin-bottom: 1rem;">Filter Logs</h4>
<div style="display: flex; gap: 1rem; flex-wrap: wrap; align-items: center;">
<select id="apiFilter" style="padding: 0.8rem; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 8px; background: rgba(255, 255, 255, 0.05); color: white;">
<option value="">All APIs</option>
<option value="Stripe">Stripe</option>
<option value="PayPal">PayPal</option>
<option value="Google">Google</option>
<option value="Twitter">Twitter</option>
<option value="Facebook">Facebook</option>
<option value="Discord">Discord</option>
<option value="Apple">Apple</option>
</select>
<select id="statusFilter" style="padding: 0.8rem; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 8px; background: rgba(255, 255, 255, 0.05); color: white;">
<option value="">All Status</option>
<option value="success">Success</option>
<option value="error">Error</option>
</select>
<input type="text" id="searchLogs" placeholder="Search logs..." style="padding: 0.8rem; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 8px; background: rgba(255, 255, 255, 0.05); color: white; min-width: 200px;">
<button class="btn btn-primary" onclick="exportLogs()">
<i class="fas fa-download"></i> Export Logs
</button>
<button class="btn btn-danger" onclick="clearLogs()">
<i class="fas fa-trash"></i> Clear Logs
</button>
</div>
</div>
<!-- API Logs Table -->
<div style="background: rgba(255, 255, 255, 0.05); border-radius: 16px; padding: 2rem;">
<table class="logs-table" style="width: 100%; border-collapse: collapse;">
<thead>
<tr style="border-bottom: 1px solid rgba(255, 255, 255, 0.1);">
<th style="text-align: left; padding: 1rem; color: #a0aec0; font-weight: 600;">Time</th>
<th style="text-align: left; padding: 1rem; color: #a0aec0; font-weight: 600;">API</th>
<th style="text-align: left; padding: 1rem; color: #a0aec0; font-weight: 600;">Action</th>
<th style="text-align: left; padding: 1rem; color: #a0aec0; font-weight: 600;">Status</th>
<th style="text-align: left; padding: 1rem; color: #a0aec0; font-weight: 600;">User</th>
<th style="text-align: left; padding: 1rem; color: #a0aec0; font-weight: 600;">IP Address</th>
<th style="text-align: left; padding: 1rem; color: #a0aec0; font-weight: 600;">Actions</th>
</tr>
</thead>
<tbody>
<?php foreach ($api_logs as $log): ?>
<tr class="log-row" data-api="<?= $log['api'] ?>" data-status="<?= $log['status'] ?>" style="border-bottom: 1px solid rgba(255, 255, 255, 0.05);">
<td style="padding: 1rem; color: #a0aec0;"><?= $log['time'] ?></td>
<td style="padding: 1rem; color: white; font-weight: 600;"><?= $log['api'] ?></td>
<td style="padding: 1rem; color: white;"><?= $log['action'] ?></td>
<td style="padding: 1rem;">
<span style="padding: 0.3rem 0.8rem; border-radius: 12px; font-size: 1.2rem; font-weight: 600; color: white; background: <?= $log['status'] === 'success' ? '#48bb78' : '#e53e3e' ?>;">
<?= ucfirst($log['status']) ?>
</span>
</td>
<td style="padding: 1rem; color: #a0aec0;"><?= $log['user'] ?></td>
<td style="padding: 1rem; color: #a0aec0; font-family: monospace;"><?= $log['ip'] ?></td>
<td style="padding: 1rem;">
<button class="btn btn-secondary btn-sm" onclick="viewLogDetails('<?= $log['time'] ?>')">
<i class="fas fa-eye"></i>
</button>
<button class="btn btn-primary btn-sm" onclick="retryApiCall('<?= $log['time'] ?>')">
<i class="fas fa-redo"></i>
</button>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
<!-- Log Details Modal -->
<div id="logModal" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); z-index: 1000;">
<div style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #1a202c; border-radius: 16px; padding: 2rem; max-width: 600px; width: 90%; max-height: 80vh; overflow-y: auto;">
<h3 style="color: white; margin-top: 0;">Log Details</h3>
<div id="logDetails" style="color: #a0aec0; font-family: monospace; background: rgba(255, 255, 255, 0.05); padding: 1rem; border-radius: 8px; margin-bottom: 1rem;">
<!-- Log details will be populated here -->
</div>
<button class="btn btn-secondary" onclick="closeLogModal()">Close</button>
</div>
</div>
<script>
// Log filtering functionality
document.getElementById('apiFilter')?.addEventListener('change', filterLogs);
document.getElementById('statusFilter')?.addEventListener('change', filterLogs);
document.getElementById('searchLogs')?.addEventListener('input', filterLogs);
function filterLogs() {
const apiFilter = document.getElementById('apiFilter').value;
const statusFilter = document.getElementById('statusFilter').value;
const searchQuery = document.getElementById('searchLogs').value.toLowerCase();
const rows = document.querySelectorAll('.log-row');
rows.forEach(row => {
const api = row.dataset.api;
const status = row.dataset.status;
const text = row.textContent.toLowerCase();
const apiMatch = !apiFilter || api === apiFilter;
const statusMatch = !statusFilter || status === statusFilter;
const searchMatch = !searchQuery || text.includes(searchQuery);
row.style.display = apiMatch && statusMatch && searchMatch ? '' : 'none';
});
}
function viewLogDetails(time) {
const modal = document.getElementById('logModal');
const details = document.getElementById('logDetails');
// Mock log details
details.innerHTML = `
<strong>Time:</strong> ${time}<br>
<strong>API:</strong> Stripe<br>
<strong>Action:</strong> Payment Success<br>
<strong>Status:</strong> Success<br>
<strong>User:</strong> user123<br>
<strong>IP:</strong> 192.168.1.100<br>
<strong>Request:</strong> POST /webhooks/stripe<br>
<strong>Response:</strong> 200 OK<br>
<strong>Duration:</strong> 245ms<br>
<strong>Headers:</strong> Content-Type: application/json<br>
<strong>Body:</strong> {"payment_intent": "pi_123456789"}
`;
modal.style.display = 'block';
}
function closeLogModal() {
document.getElementById('logModal').style.display = 'none';
}
function retryApiCall(time) {
if (confirm('Retry this API call?')) {
alert(`Retrying API call from ${time}...`);
}
}
function exportLogs() {
alert('Exporting API logs...');
}
function clearLogs() {
if (confirm('Are you sure you want to clear all API logs? This action cannot be undone.')) {
alert('API logs cleared successfully!');
location.reload();
}
}
// Close modal when clicking outside
document.getElementById('logModal')?.addEventListener('click', function(e) {
if (e.target === this) {
closeLogModal();
}
});
</script>