<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{.title}} - 后台管理</title>
    <link rel="stylesheet" href="/css/admin.css">
    <link rel="icon" href="/img/favicon.png" type="image/png">
</head>
<body>
    <div class="admin-container">
        <header class="admin-header">
            <div class="header-left">
                <h1>后台管理</h1>
            </div>
            <div class="header-right">
                <span id="current-user"></span>
                <a href="/admin/settings" class="btn btn-icon" title="设置">
                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                        <circle cx="12" cy="12" r="3"/>
                        <path d="M12 1v6m0 6v6M5.64 5.64l4.24 4.24m4.24 4.24l4.24 4.24M1 12h6m6 0h6M5.64 18.36l4.24-4.24m4.24-4.24l4.24-4.24"/>
                    </svg>
                </a>
                <button id="logout-btn" class="btn btn-secondary">登出</button>
            </div>
        </header>

        <div class="admin-layout">
            <aside class="admin-sidebar">
                <nav class="sidebar-nav">
                    <a href="#" class="nav-item active" data-page="dashboard">
                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <rect x="3" y="3" width="7" height="7"></rect>
                            <rect x="14" y="3" width="7" height="7"></rect>
                            <rect x="14" y="14" width="7" height="7"></rect>
                            <rect x="3" y="14" width="7" height="7"></rect>
                        </svg>
                        <span>仪表盘</span>
                    </a>
                    <a href="#" class="nav-item" data-page="routes">
                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path>
                        </svg>
                        <span>路由管理</span>
                    </a>
                    <a href="#" class="nav-item" data-page="files">
                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
                            <polyline points="14 2 14 8 20 8"></polyline>
                        </svg>
                        <span>文件管理</span>
                    </a>
                    <a href="#" class="nav-item" data-page="config">
                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <circle cx="12" cy="12" r="3"></circle>
                            <path d="M12 1v6m0 6v6M5.64 5.64l4.24 4.24m4.24 4.24l4.24 4.24M1 12h6m6 0h6M5.64 18.36l4.24-4.24m4.24-4.24l4.24-4.24"></path>
                        </svg>
                        <span>配置管理</span>
                    </a>
                    <a href="#" class="nav-item" data-page="logs">
                        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <polyline points="9 11 12 14 22 4"></polyline>
                            <path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"></path>
                        </svg>
                        <span>日志查看</span>
                    </a>
                </nav>
            </aside>

            <main class="admin-content">
                <!-- 仪表盘 -->
                <div id="page-dashboard" class="page active">
                    <div class="page-header">
                        <h2>系统概览</h2>
                    </div>
                    <div class="stats-grid">
                        <div class="stat-card">
                            <div class="stat-icon">👥</div>
                            <div class="stat-info">
                                <div class="stat-value" id="stat-users">-</div>
                                <div class="stat-label">用户总数</div>
                            </div>
                        </div>
                        <div class="stat-card">
                            <div class="stat-icon">🛣️</div>
                            <div class="stat-info">
                                <div class="stat-value" id="stat-routes">-</div>
                                <div class="stat-label">路由总数</div>
                            </div>
                        </div>
                        <div class="stat-card">
                            <div class="stat-icon">📝</div>
                            <div class="stat-info">
                                <div class="stat-value" id="stat-logs">-</div>
                                <div class="stat-label">日志条目</div>
                            </div>
                        </div>
                        <div class="stat-card">
                            <div class="stat-icon">⏰</div>
                            <div class="stat-info">
                                <div class="stat-value" id="stat-time">-</div>
                                <div class="stat-label">服务器时间</div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 路由管理 -->
                <div id="page-routes" class="page">
                    <div class="page-header">
                        <h2>路由管理</h2>
                        <button class="btn btn-primary" id="add-route-btn">添加路由</button>
                    </div>
                    <div class="table-container">
                        <table class="data-table">
                            <thead>
                                <tr>
                                    <th>ID</th>
                                    <th>方法</th>
                                    <th>路径</th>
                                    <th>类型</th>
                                    <th>描述</th>
                                    <th>状态</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody id="routes-table-body">
                                <tr>
                                    <td colspan="7" class="empty-state">加载中...</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

                <!-- 文件管理 -->
                <div id="page-files" class="page">
                    <div class="page-header">
                        <h2>文件管理</h2>
                        <button class="btn btn-primary" id="refresh-files-btn">刷新</button>
                    </div>
                    <div class="file-browser" id="file-browser">
                        <div class="empty-state">加载中...</div>
                    </div>
                </div>

                <!-- 配置管理 -->
                <div id="page-config" class="page">
                    <div class="page-header">
                        <h2>配置管理</h2>
                    </div>
                    <div class="config-controls">
                        <select id="config-select">
                            <option value="tool-status.json">tool-status.json</option>
                            <option value="update-info.json">update-info.json</option>
                            <option value="media-types.json">media-types.json</option>
                            <option value="modules.json">modules.json</option>
                            <option value="plugins.json">plugins.json</option>
                            <option value="lang/zh-CN.json">lang/zh-CN.json</option>
                            <option value="lang/en-US.json">lang/en-US.json</option>
                        </select>
                        <button class="btn btn-primary" id="load-config-btn">加载配置</button>
                    </div>
                    <div class="editor-container">
                        <textarea id="config-editor" class="code-editor"></textarea>
                    </div>
                    <div class="button-group" style="margin-top: 1rem;">
                        <button id="save-config-btn" class="btn btn-primary">保存配置</button>
                        <button id="save-reload-config-btn" class="btn btn-success">保存并立即加载</button>
                    </div>
                </div>

                <!-- 日志查看 -->
                <div id="page-logs" class="page">
                    <div class="page-header">
                        <h2>日志查看</h2>
                        <div class="button-group">
                            <button class="btn btn-primary" id="refresh-logs-btn">刷新</button>
                            <button class="btn btn-secondary" id="clear-logs-btn">清空</button>
                        </div>
                    </div>
                    <div class="logs-container">
                        <div id="logs-content" class="logs-content"></div>
                    </div>
                </div>
            </main>
        </div>
    </div>

    <!-- 路由编辑模态框 -->
    <div id="route-modal" class="modal">
        <div class="modal-content">
            <div class="modal-header">
                <h3 id="route-modal-title">添加路由</h3>
                <button class="modal-close">&times;</button>
            </div>
            <div class="modal-body">
                <form id="route-form">
                    <input type="hidden" id="route-id">
                    <div class="form-group">
                        <label>HTTP 方法</label>
                        <select id="route-method" required>
                            <option value="GET">GET</option>
                            <option value="POST">POST</option>
                            <option value="PUT">PUT</option>
                            <option value="DELETE">DELETE</option>
                            <option value="PATCH">PATCH</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label>路径</label>
                        <input type="text" id="route-path" required placeholder="/api/example">
                    </div>
                    <div class="form-group">
                        <label>类型</label>
                        <select id="route-type" required>
                            <option value="view">视图 (view)</option>
                            <option value="json">JSON (json)</option>
                            <option value="file">文件 (file)</option>
                            <option value="static">静态 (static)</option>
                            <option value="custom">自定义 (custom)</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label>处理器/文件路径</label>
                        <input type="text" id="route-handler" required placeholder="views/index.html 或 handler 函数">
                    </div>
                    <div class="form-group">
                        <label>描述</label>
                        <input type="text" id="route-description" placeholder="路由描述">
                    </div>
                    <div class="form-group">
                        <label>
                            <input type="checkbox" id="route-active" checked>
                            启用
                        </label>
                    </div>
                    <div class="form-group">
                        <label>排序</label>
                        <input type="number" id="route-order" value="0">
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" id="route-cancel-btn">取消</button>
                <button class="btn btn-primary" id="route-save-btn">保存</button>
            </div>
        </div>
    </div>

    <script src="/js/admin.js"></script>
</body>
</html>
