328 lines
11 KiB
HTML
328 lines
11 KiB
HTML
{% extends "layout.html" %}
|
|
{% from "components/markdown_content.html" import render_markdown, render_markdown_with_truncate %}
|
|
|
|
{% block styles %}
|
|
<link href="{{ url_for('static', filename='css/github-markdown-reading-view.css') }}" rel="stylesheet">
|
|
<style>
|
|
/* Custom styling for markdown within tables */
|
|
.documentation-cell {
|
|
min-width: 300px;
|
|
max-width: 600px;
|
|
}
|
|
|
|
.documentation-cell .markdown-content {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.documentation-cell .markdown-reading-view {
|
|
background: transparent !important;
|
|
padding: 0;
|
|
}
|
|
|
|
.documentation-cell h1,
|
|
.documentation-cell h2,
|
|
.documentation-cell h3 {
|
|
margin-top: 0;
|
|
margin-bottom: 0.25rem;
|
|
font-size: 1rem;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.documentation-cell p {
|
|
margin-bottom: 0.25rem;
|
|
}
|
|
|
|
.documentation-cell .markdown-alert {
|
|
padding: 0.5rem;
|
|
margin: 0.25rem 0;
|
|
}
|
|
|
|
.app-name {
|
|
color: var(--tblr-primary);
|
|
font-weight: 600;
|
|
}
|
|
|
|
.server-link {
|
|
color: var(--tblr-body-color);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.server-link:hover {
|
|
text-decoration: underline;
|
|
}
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-xl">
|
|
<div class="page-header d-print-none">
|
|
<div class="row align-items-center">
|
|
<div class="col">
|
|
<div class="page-pretitle">
|
|
Subnet Details
|
|
</div>
|
|
<h2 class="page-title">
|
|
{{ subnet.cidr }} - {{ subnet.location }}
|
|
</h2>
|
|
</div>
|
|
<div class="col-auto ms-auto d-print-none">
|
|
<div class="btn-list">
|
|
<a href="{{ url_for('ipam.subnet_edit', subnet_id=subnet.id) }}" class="btn btn-primary">
|
|
<i class="ti ti-edit me-1"></i> Edit
|
|
</a>
|
|
<form method="POST" action="{{ url_for('ipam.subnet_scan', subnet_id=subnet.id) }}" class="d-inline">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
|
<button type="submit" class="btn btn-warning">
|
|
<i class="ti ti-search me-1"></i> Scan Now
|
|
</button>
|
|
</form>
|
|
<button type="button" class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#deleteSubnetModal">
|
|
<i class="ti ti-trash me-1"></i> Delete
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% with messages = get_flashed_messages(with_categories=true) %}
|
|
{% if messages %}
|
|
{% for category, message in messages %}
|
|
<div class="alert alert-{{ category }} alert-dismissible fade show mt-3" role="alert">
|
|
{{ message }}
|
|
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
|
</div>
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% endwith %}
|
|
|
|
<div class="row mt-3">
|
|
<div class="col-md-6">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">Subnet Information</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<table class="table table-vcenter">
|
|
<tr>
|
|
<td><strong>CIDR Notation</strong></td>
|
|
<td>{{ subnet.cidr }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Location</strong></td>
|
|
<td>{{ subnet.location }}</td>
|
|
</tr>
|
|
{% set network = get_ip_network(subnet.cidr) %}
|
|
{% if network %}
|
|
<tr>
|
|
<td><strong>Network Address</strong></td>
|
|
<td>{{ network.network_address }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Broadcast Address</strong></td>
|
|
<td>{{ network.broadcast_address if network.prefixlen < 31 else 'N/A' }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Netmask</strong></td>
|
|
<td>{{ network.netmask }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Host Range</strong></td>
|
|
<td>
|
|
{% if network.prefixlen < 31 %} {{ network.network_address + 1 }} - {{ network.broadcast_address - 1 }}
|
|
{% else %} {{ network.network_address }} - {{ network.broadcast_address }} {% endif %} </td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Total Hosts</strong></td>
|
|
<td>
|
|
{% if network.prefixlen < 31 %} {{ network.num_addresses - 2 }} {% else %} {{ network.num_addresses }}
|
|
{% endif %} </td>
|
|
</tr>
|
|
{% endif %}
|
|
<tr>
|
|
<td><strong>Auto Scan</strong></td>
|
|
<td>{{ 'Yes' if subnet.auto_scan else 'No' }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Last Scanned</strong></td>
|
|
<td>{{ subnet.last_scanned|default('Never', true) }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td><strong>Created</strong></td>
|
|
<td>{{ subnet.created_at.strftime('%Y-%m-%d %H:%M') }}</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">Servers in Subnet</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
{% if subnet.servers %}
|
|
<div class="table-responsive">
|
|
<table class="table table-vcenter card-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Hostname</th>
|
|
<th>IP Address</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for server in subnet.servers %}
|
|
<tr>
|
|
<td><a href="{{ url_for('dashboard.server_view', server_id=server.id) }}">{{ server.hostname }}</a>
|
|
</td>
|
|
<td>{{ server.ip_address }}</td>
|
|
<td>
|
|
<a href="{{ url_for('dashboard.server_view', server_id=server.id) }}"
|
|
class="btn btn-sm btn-primary">
|
|
<i class="ti ti-eye"></i>
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% else %}
|
|
<div class="empty">
|
|
<div class="empty-icon">
|
|
<i class="ti ti-server"></i>
|
|
</div>
|
|
<p class="empty-title">No servers in this subnet</p>
|
|
<p class="empty-subtitle text-muted">
|
|
You can add a new server to this subnet from the dashboard
|
|
</p>
|
|
<div class="empty-action">
|
|
<a href="{{ url_for('dashboard.server_new') }}" class="btn btn-primary">
|
|
<i class="ti ti-plus me-2"></i> Add New Server
|
|
</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Applications in this Subnet Section -->
|
|
<div class="row mt-3">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">Applications in this Subnet</h3>
|
|
</div>
|
|
<div class="card-body p-0">
|
|
{% if subnet_apps %}
|
|
<div class="table-responsive">
|
|
<table class="table card-table table-vcenter">
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Server</th>
|
|
<th>Documentation</th>
|
|
<th class="w-1"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for app in subnet_apps %}
|
|
<tr>
|
|
<td class="text-nowrap">
|
|
{% if app.url %}
|
|
<a href="{{ app.url }}" target="_blank" class="app-link text-primary fw-bold">
|
|
{{ app.name }} <span class="ti ti-external-link text-muted fs-6 ms-1"></span>
|
|
</a>
|
|
{% else %}
|
|
<span class="fw-bold">{{ app.name }}</span>
|
|
{% endif %}
|
|
<!-- <span class="app-name">{{ app.name }}</span> -->
|
|
</td>
|
|
<td class="text-nowrap">
|
|
<a href="{{ url_for('dashboard.server_view', server_id=app.server.id) }}" class="server-link">
|
|
{{ app.server.hostname }} ({{ app.server.ip_address }})
|
|
</a>
|
|
</td>
|
|
<td class="documentation-cell">
|
|
{% if app.documentation %}
|
|
{{ render_markdown_with_truncate(app.documentation, 120) }}
|
|
{% else %}
|
|
<span class="text-muted">No documentation available</span>
|
|
{% endif %}
|
|
</td>
|
|
<td>
|
|
<a href="{{ url_for('dashboard.app_view', app_id=app.id) }}" class="btn btn-sm btn-primary">
|
|
View
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% else %}
|
|
<div class="empty p-4">
|
|
<div class="empty-icon">
|
|
<span class="ti ti-app-window"></span>
|
|
</div>
|
|
<p class="empty-title">No applications found</p>
|
|
<p class="empty-subtitle text-muted">
|
|
No applications are running on servers in this subnet.
|
|
</p>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Update the usage progress bar section -->
|
|
<div class="card mt-3">
|
|
<div class="card-body">
|
|
<div class="mb-3">
|
|
<div class="d-flex justify-content-between">
|
|
<div class="form-label mb-0">IP Usage ({{ used_ips }} of {{ total_ips }})</div>
|
|
<div class="text-muted">{{ (used_ips / total_ips * 100)|round(1) }}%</div>
|
|
</div>
|
|
<div class="progress mt-2">
|
|
<div class="progress-bar" style="width: {{ (used_ips / total_ips * 100) if total_ips > 0 else 0 }}%"
|
|
role="progressbar"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Delete Confirmation Modal -->
|
|
<div class="modal fade" id="deleteSubnetModal" tabindex="-1" aria-labelledby="deleteSubnetModalLabel"
|
|
aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="deleteSubnetModalLabel">Confirm Deletion</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>Are you sure you want to delete the subnet {{ subnet.cidr }}?</p>
|
|
{% if subnet.servers %}
|
|
<div class="alert alert-danger">
|
|
<strong>Warning:</strong> This subnet has {{ subnet.servers|length }} servers assigned to it.
|
|
You must delete or reassign these servers before deleting the subnet.
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
|
|
<form method="POST" action="{{ url_for('ipam.subnet_delete', subnet_id=subnet.id) }}">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
|
|
<button type="submit" class="btn btn-danger" {{ 'disabled' if subnet.servers }}>Delete Subnet</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|