100 lines
5.6 KiB
PHP
100 lines
5.6 KiB
PHP
<?php
|
|
$server = $server ?? [];
|
|
$db = $db ?? [];
|
|
$installed = $db['installed'] ?? false;
|
|
$dbType = $db['db_type'] ?? '';
|
|
$databases = $db['databases'] ?? [];
|
|
$totalSize = $db['total_size_mb'] ?? 0;
|
|
$status = $db['status'] ?? 'inactive';
|
|
?>
|
|
|
|
<div class="page-header">
|
|
<div class="page-header-left">
|
|
<div class="back-link">
|
|
<a href="/servers/<?= $server['id'] ?>"><i class="fas fa-arrow-left"></i> Back to Server</a>
|
|
</div>
|
|
<h1 class="page-title"><i class="fas fa-database"></i> <?= htmlspecialchars($dbType) ?> Manager</h1>
|
|
<p class="page-subtitle"><?= htmlspecialchars($server['name']) ?> · <?= count($databases) ?> databases · <?= $totalSize ?> MB</p>
|
|
</div>
|
|
<div class="page-header-right">
|
|
<span class="status-badge status-<?= $status === 'active' ? 'online' : 'offline' ?>" style="font-size:0.8rem"><?= ucfirst($status) ?></span>
|
|
<button class="btn btn-secondary" onclick="location.reload()"><i class="fas fa-sync-alt"></i></button>
|
|
</div>
|
|
</div>
|
|
|
|
<?php if (!$installed): ?>
|
|
<div class="card"><div class="card-body"><div class="empty-state">
|
|
<i class="fas fa-database empty-icon" style="font-size:3rem;opacity:0.4"></i>
|
|
<h3>No database server found</h3>
|
|
<p>Neither MySQL nor MariaDB is installed on this server.</p>
|
|
<p class="text-muted">Install with: <code>sudo apt install mysql-server</code> or <code>sudo apt install mariadb-server</code></p>
|
|
</div></div></div>
|
|
<?php else: ?>
|
|
|
|
<div class="pma-layout">
|
|
<aside class="pma-sidebar">
|
|
<div class="pma-sidebar-header" style="justify-content:space-between">
|
|
<span><i class="fas fa-database"></i> Databases</span>
|
|
<span class="badge badge-info"><?= count($databases) ?></span>
|
|
</div>
|
|
<div class="pma-sidebar-filter"><input type="text" class="form-input" placeholder="Filter..." oninput="filterSidebar(this.value)" style="font-size:0.8rem"></div>
|
|
<div class="pma-sidebar-list" id="sidebarList">
|
|
<?php foreach ($databases as $d): ?>
|
|
<div class="pma-accordion-item" data-db="<?= htmlspecialchars($d['name']) ?>">
|
|
<div class="pma-accordion-header" onclick="toggleDb('<?= htmlspecialchars($d['name']) ?>')">
|
|
<i class="fas fa-database"></i>
|
|
<span class="pma-db-name"><?= htmlspecialchars($d['name']) ?></span>
|
|
<span class="pma-db-size"><?= $d['size_mb'] ?> MB</span>
|
|
<i class="fas fa-chevron-right pma-chevron"></i>
|
|
</div>
|
|
<div class="pma-accordion-body" id="tables_<?= htmlspecialchars(md5($d['name'])) ?>">
|
|
<div class="pma-loading-tables" style="display:none"><i class="fas fa-spinner fa-spin"></i> Loading...</div>
|
|
</div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
<div style="padding:0.5rem;border-top:1px solid var(--border-color);display:flex;gap:0.5rem">
|
|
<button class="btn btn-xs btn-secondary" style="flex:1" onclick="switchTab('sql')"><i class="fas fa-terminal"></i> SQL</button>
|
|
<button class="btn btn-xs btn-secondary" style="flex:1" onclick="switchTab('users');loadUsers()"><i class="fas fa-users"></i> Users</button>
|
|
</div>
|
|
</aside>
|
|
|
|
<main class="pma-content">
|
|
<div class="pma-tabs">
|
|
<button class="pma-tab" id="tabBrowse" onclick="switchTab('browse')" style="display:none"><i class="fas fa-table"></i> Browse</button>
|
|
<button class="pma-tab" id="tabStructure" onclick="switchTab('structure')" style="display:none"><i class="fas fa-list"></i> Structure</button>
|
|
<button class="pma-tab active" id="tabSql" onclick="switchTab('sql')"><i class="fas fa-terminal"></i> SQL</button>
|
|
<button class="pma-tab" id="tabUsers" onclick="switchTab('users')" style="display:none"><i class="fas fa-users"></i> Users</button>
|
|
</div>
|
|
|
|
<div id="pmaWelcome" class="pma-panel active">
|
|
<div class="empty-state"><i class="fas fa-database empty-icon" style="opacity:0.2;font-size:5rem"></i><h3>Select a database</h3><p>Click a database in the left panel.</p></div>
|
|
</div>
|
|
|
|
<div id="pmaTables" class="pma-panel"></div>
|
|
<div id="pmaStructure" class="pma-panel"></div>
|
|
<div id="pmaBrowse" class="pma-panel"></div>
|
|
<div id="pmaUsers" class="pma-panel"></div>
|
|
|
|
<div id="pmaSql" class="pma-panel active">
|
|
<div class="pma-sql-editor">
|
|
<textarea id="sqlInput" class="form-input" rows="6" style="font-family:var(--font-mono);font-size:0.85rem;border-radius:var(--radius) var(--radius) 0 0" placeholder="SELECT * FROM ...">SHOW DATABASES</textarea>
|
|
<div class="pma-sql-toolbar">
|
|
<button class="btn btn-primary btn-sm" onclick="runSql()"><i class="fas fa-play"></i> Go</button>
|
|
<button class="btn btn-secondary btn-sm" onclick="document.getElementById('sqlInput').value=''"><i class="fas fa-eraser"></i></button>
|
|
<span style="flex:1"></span>
|
|
<span class="text-muted" style="font-size:0.78rem">Ctrl+Enter</span>
|
|
</div>
|
|
<div id="sqlResult" class="nginx-config-viewer" style="display:none;border-radius:0 0 var(--radius) var(--radius);border-top:0"><pre><code id="sqlResultText"></code></pre></div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
|
|
<script>
|
|
const serverId = <?= json_encode($server['id']) ?>;
|
|
const databases = <?= json_encode(array_column($databases, 'name')) ?>;
|
|
</script>
|
|
<script src="/assets/js/database-manager.js?v=<?= asset_version() ?>"></script>
|
|
<?php endif; ?>
|