| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>DNS Hosts 配置管理</title> |
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"> |
| <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.1/font/bootstrap-icons.css" rel="stylesheet"> |
| <link rel="stylesheet" href="style.css"> |
| </head> |
| <body> |
| <div class="container mt-4"> |
| <div class="card"> |
| <div class="card-header bg-primary text-white"> |
| <h2 class="mb-0">DNS Hosts 配置管理</h2> |
| </div> |
| <div class="card-body"> |
| <div class="row mb-4"> |
| <div class="col-md-6"> |
| <div class="alert alert-info"> |
| <div>海外配置版本: <span id="oversea-version" class="badge bg-secondary">-</span></div> |
| <div>国内配置版本: <span id="cn-version" class="badge bg-secondary">-</span></div> |
| </div> |
| </div> |
| </div> |
| |
| <div class="card mb-4"> |
| <div class="card-body"> |
| <div class="alert alert-warning"> |
| <i class="bi bi-info-circle"></i> 提示：域名格式如 "+.example.com" 或 "specific.example.com" |
| </div> |
| |
| <div class="table-responsive"> |
| <table class="table table-bordered table-hover" id="hosts-table"> |
| <thead class="table-light"> |
| <tr> |
| <th> |
| 域名 |
| <div class="input-group mt-2"> |
| <span class="input-group-text"><i class="bi bi-search"></i></span> |
| <input type="text" class="form-control" id="domain-search" placeholder="搜索域名..."> |
| </div> |
| </th> |
| <th> |
| IP地址 |
| <div class="input-group mt-2"> |
| <span class="input-group-text"><i class="bi bi-search"></i></span> |
| <input type="text" class="form-control" id="ip-search" placeholder="搜索IP..."> |
| </div> |
| </th> |
| <th>操作</th> |
| </tr> |
| </thead> |
| <tbody></tbody> |
| </table> |
| </div> |
| |
| <div class="d-flex justify-content-between align-items-center mt-3"> |
| <div class="pagination-info"> |
| 显示 <span id="showing-entries">0-0</span> 条，共 <span id="total-entries">0</span> 条 |
| </div> |
| <nav aria-label="Page navigation"> |
| <ul class="pagination mb-0" id="pagination"> |
| </ul> |
| </nav> |
| </div> |
| </div> |
| </div> |
| |
| <div class="d-flex justify-content-between"> |
| <button class="btn btn-success" id="add-host"> |
| <i class="bi bi-plus-circle"></i> 添加新记录 |
| </button> |
| <button class="btn btn-primary" id="save-hosts"> |
| <i class="bi bi-save"></i> 保存更改 |
| </button> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script> |
| <script src="script.js"></script> |
| </body> |
| </html> |