136 lines
3.8 KiB
Text
136 lines
3.8 KiB
Text
package templates
|
|
|
|
// IndexProps contains the properties for the Index component
|
|
type IndexProps struct {
|
|
Title string
|
|
}
|
|
|
|
// Index is the main page component
|
|
templ Index(props IndexProps) {
|
|
@Layout(props.Title) {
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-10">
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<h1>{ props.Title }</h1>
|
|
<div class="current-ip d-flex align-items-center">
|
|
<span class="me-2">Current IP:</span>
|
|
<span id="current-ip" class="fw-bold"></span>
|
|
<button
|
|
id="refresh-ip"
|
|
class="btn btn-sm btn-outline-secondary ms-2"
|
|
title="Refresh current IP"
|
|
>
|
|
<i class="bi bi-arrow-clockwise"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<!-- Configuration Warning -->
|
|
<div
|
|
id="config-warning"
|
|
class="alert alert-warning config-warning"
|
|
style="display: none"
|
|
>
|
|
<h4>Configuration Required</h4>
|
|
<p>
|
|
Please configure your Cloudflare API credentials to manage your
|
|
DNS records.
|
|
</p>
|
|
<button
|
|
class="btn btn-primary"
|
|
data-bs-toggle="modal"
|
|
data-bs-target="#configModal"
|
|
>
|
|
Configure Now
|
|
</button>
|
|
</div>
|
|
<!-- Configuration Status -->
|
|
<div id="config-status" class="card mb-4" style="display: none">
|
|
<div
|
|
class="card-header d-flex justify-content-between align-items-center"
|
|
>
|
|
<h5 class="mb-0">Configuration</h5>
|
|
<button
|
|
class="btn btn-sm btn-outline-primary"
|
|
data-bs-toggle="modal"
|
|
data-bs-target="#configModal"
|
|
>
|
|
Edit
|
|
</button>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col-md-4">
|
|
<strong>Domain:</strong> <span id="domain-name">mz.uy</span>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<strong>Zone ID:</strong> <span id="zone-id"></span>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<strong>IP Update Schedule:</strong>
|
|
<span id="update-schedule"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- DNS Records Section -->
|
|
<div id="dns-records-section" style="display: none">
|
|
<div class="card">
|
|
<div
|
|
class="card-header d-flex justify-content-between align-items-center"
|
|
>
|
|
<h5 class="mb-0">DNS Records</h5>
|
|
<div>
|
|
<button
|
|
id="update-all-records"
|
|
class="btn btn-sm btn-success me-2"
|
|
>
|
|
<i class="bi bi-arrow-repeat"></i> Update All to Current IP
|
|
</button>
|
|
<button
|
|
class="btn btn-sm btn-primary"
|
|
data-bs-toggle="modal"
|
|
data-bs-target="#recordModal"
|
|
>
|
|
<i class="bi bi-plus-lg"></i> Add Record
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="card-body p-0">
|
|
<div class="table-responsive">
|
|
<table class="table table-striped table-hover mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th>Type</th>
|
|
<th>Name</th>
|
|
<th>Content</th>
|
|
<th>TTL</th>
|
|
<th>Proxied</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="dns-records">
|
|
<!-- DNS records will be inserted here -->
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Loading Indicator -->
|
|
<div id="loading" class="text-center my-5">
|
|
<div class="spinner-border" role="status">
|
|
<span class="visually-hidden">Loading...</span>
|
|
</div>
|
|
<p class="mt-2">Loading...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@ConfigModal()
|
|
@RecordModal()
|
|
<!-- Toast container for notifications -->
|
|
<div class="toast-container"></div>
|
|
<script src="/assets/js/app.js"></script>
|
|
}
|
|
}
|