websites/homedocs
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

wip

Browse source
This commit is contained in:
pika 2025-03-31 01:03:02 +02:00
parent 254593d260
commit 0a99abb52d
4 changed files with 279 additions and 148 deletions
Download patch file Download diff file Expand all files Collapse all files

84
.gitignore vendored
View file

@ -1,2 +1,86 @@
tests/__pycache__/conftest.cpython-313-pytest-8.3.5.pyc
scripts/__pycache__/check_routes.cpython-313-pytest-8.3.5.pyc
# Python bytecode
__pycache__/
*.py[cod]
*$py.class
# Distribution / packaging
dist/
build/
*.egg-info/
# Virtual environments
venv/
env/
ENV/
.env/
.venv/
# Flask stuff
instance/
.webassets-cache
flask_session/
# SQLite database files
*.sqlite
*.sqlite3
*.db
# Unit test / coverage reports
htmlcov/
.tox/
.coverage
.coverage.*
.cache
nosetests.xml
coverage.xml
*.cover
.hypothesis/
.pytest_cache/
# Jupyter Notebook
.ipynb_checkpoints
# VS Code
.vscode/
*.code-workspace
# PyCharm
.idea/
*.iml
*.iws
*.ipr
# Environment variables
.env
.env.local
.env.development
.env.test
.env.production
# Logs
logs/
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# System files
.DS_Store
Thumbs.db
ehthumbs.db
Desktop.ini
# User-specific files
*.swp
*.swo
*~
# Local development settings
local_settings.py
# Media and static files (if collected locally)
/media/
/static/collected/

38
app/routes/api.py
View file

@ -287,6 +287,9 @@ def add_app_port(app_id):
"""Add a port to an application"""
app = App.query.get_or_404(app_id)
# Check if request is AJAX (XMLHttpRequest)
is_ajax = request.headers.get('X-Requested-With') == 'XMLHttpRequest' or request.accept_mimetypes.best == 'application/json'
try:
port_number = request.form.get("port_number")
protocol = request.form.get("protocol", "TCP")
@ -301,7 +304,7 @@ def add_app_port(app_id):
flash(error, "danger")
return (
redirect(url_for("dashboard.app_view", app_id=app_id))
if not request.is_xhr
if not is_ajax
else jsonify({"success": False, "error": error})
), 400
@ -314,7 +317,7 @@ def add_app_port(app_id):
flash(error_msg, "warning")
return (
redirect(url_for("dashboard.app_view", app_id=app_id))
if not request.is_xhr
if not is_ajax
else jsonify({"success": False, "error": error_msg})
), 400
@ -332,30 +335,29 @@ def add_app_port(app_id):
flash(success_msg, "success")
# If it's a regular form submission (not AJAX), redirect
if not request.is_xhr and not request.is_json:
if not is_ajax and request.content_type != 'application/json':
return redirect(url_for("dashboard.app_view", app_id=app_id))
# Otherwise return JSON for API/AJAX calls
return jsonify(
{
"success": True,
"message": success_msg,
"port": {
"id": new_port.id,
"number": new_port.port_number,
"protocol": new_port.protocol,
"description": new_port.description,
},
# Otherwise return JSON response
return jsonify({
"success": True,
"message": success_msg,
"port": {
"id": new_port.id,
"port_number": new_port.port_number,
"protocol": new_port.protocol,
"description": new_port.description
}
)
})
except Exception as e:
db.session.rollback()
flash(f"Error: {str(e)}", "danger")
error_msg = f"Error adding port: {str(e)}"
flash(error_msg, "danger")
return (
redirect(url_for("dashboard.app_view", app_id=app_id))
if not request.is_xhr
else jsonify({"success": False, "error": str(e)})
if not is_ajax
else jsonify({"success": False, "error": error_msg})
), 500

13
app/templates/dashboard/app_view.html
View file

@ -71,14 +71,14 @@
<th>PORT</th>
<th>PROTOCOL</th>
<th>DESCRIPTION</th>
<th width="40"></th>
<th class="w-1"></th>
</tr>
</thead>
<tbody>
{% for port in app.ports %}
<tr>
<td>{{ port.port_number }}</td>
<td>{{ port.protocol }}</td>
<td><span class="badge bg-blue">{{ port.protocol }}</span></td>
<td>{{ port.description }}</td>
<td>
<button type="button" class="btn btn-sm btn-ghost-danger"
@ -97,12 +97,10 @@
<span class="ti ti-plug"></span>
</div>
<p class="empty-title">No ports configured</p>
<p class="empty-subtitle text-muted">
Add port information to track which ports this application uses.
</p>
<p class="empty-subtitle text-muted">Add ports to document what this application uses</p>
<div class="empty-action">
<button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addPortModal">
<span class="ti ti-plus me-2"></span> Add Port
<span class="ti ti-plus me-1"></span> Add Port
</button>
</div>
</div>
@ -355,7 +353,8 @@
const appId = {{ app.id }};
let portToDelete = null;
// Function to handle port delete confirmation
// IMPORTANT: Define confirmDeletePort outside the DOMContentLoaded event
// so it's available in the global scope
function confirmDeletePort(portId) {
portToDelete = portId;
const modal = new bootstrap.Modal(document.getElementById('deletePortModal'));

274
app/templates/dashboard/server_view.html
View file

@ -11,14 +11,15 @@
<h2 class="page-title">
{{ server.hostname }}
</h2>
<div class="text-muted mt-1">{{ server.ip_address }}</div>
</div>
<div class="col-auto ms-auto">
<div class="col-auto ms-auto d-print-none">
<div class="btn-list">
<a href="{{ url_for('dashboard.server_edit', server_id=server.id) }}" class="btn btn-primary">
<span class="ti ti-edit me-2"></span>Edit Server
<span class="ti ti-edit"></span> Edit Server
</a>
<button class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#deleteServerModal">
<span class="ti ti-trash me-2"></span>Delete
<span class="ti ti-trash"></span> Delete
</button>
</div>
</div>
@ -26,7 +27,7 @@
</div>
<div class="row mt-3">
<div class="col-md-4">
<div class="col-md-6 col-lg-4">
<!-- Server Information -->
<div class="card">
<div class="card-header">
@ -34,11 +35,11 @@
</div>
<div class="card-body">
<div class="mb-3">
<div class="form-label">IP Address</div>
<label class="form-label text-muted">IP Address</label>
<div>{{ server.ip_address }}</div>
</div>
<div class="mb-3">
<div class="form-label">Subnet</div>
<label class="form-label text-muted">Subnet</label>
<div>
<a href="{{ url_for('ipam.subnet_view', subnet_id=server.subnet_id) }}">
{{ server.subnet.cidr }}
@ -46,127 +47,138 @@
({{ server.subnet.location }})
</div>
</div>
<div class="mb-3">
<div class="form-label">Scan Status</div>
<div>{{ server.last_scan or 'Not scanned yet' }}</div>
<div>
<label class="form-label text-muted">Scan Status</label>
<div>{{ server.scan_status or 'Not scanned yet' }}</div>
</div>
</div>
</div>
<!-- Port Usage Map -->
<div class="card mb-4">
<!-- Port Usage Card -->
<div class="card mt-3">
<div class="card-header d-flex justify-content-between align-items-center">
<h3 class="card-title">Port Usage</h3>
<div>
<button class="btn btn-sm btn-outline-primary" id="get-free-port">Get Free Port</button>
</div>
<a href="#" class="btn btn-sm btn-outline-primary" id="getFreePorts">Get Free Port</a>
</div>
<div class="card-body">
<div class="port-usage-compact">
<div class="port-legend mb-3">
<span class="port-indicator port-free me-2"></span> Free
<span class="port-indicator port-used ms-3 me-2"></span> Used
</div>
<div class="d-flex align-items-center mb-3">
<span class="d-flex align-items-center me-3">
<span class="status-dot status-green me-2"></span> Free
</span>
<span class="d-flex align-items-center">
<span class="status-dot status-red me-2"></span> Used
</span>
</div>
<div id="port-ranges" class="port-ranges">
<!-- Port ranges will be rendered here -->
</div>
<div class="mt-3">
<h4 class="card-subtitle">Used Ports</h4>
<div class="d-flex flex-wrap mt-2">
{% set used_ports = [] %}
{% for app in server.apps %}
{% for port in app.ports %}
{% set _ = used_ports.append({'port': port.port_number, 'protocol': port.protocol, 'app': app.name}) %}
{% endfor %}
{% endfor %}
<div class="mt-3">
<h4 class="h5">Used Ports</h4>
<div id="used-ports-list" class="used-ports-list">
<!-- Used ports will be listed here -->
</div>
{% if used_ports %}
{% for port_info in used_ports %}
<span class="badge bg-red me-1 mb-1 text-dark" title="{{ port_info.app }}">
{{ port_info.port }}/{{ port_info.protocol }}
</span>
{% endfor %}
{% else %}
<span class="text-muted">No ports in use</span>
{% endif %}
</div>
</div>
</div>
</div>
</div>
<div class="col-md-8">
<div class="col-md-6 col-lg-8">
<!-- Documentation section -->
<div class="card">
<div class="card-header">
<h3 class="card-title">Documentation</h3>
</div>
<div class="card-body markdown-content">
<div class="card-body">
{% if server.documentation %}
{{ server.documentation|markdown|safe }}
{% else %}
<div class="empty">
<div class="empty-icon">
<span class="ti ti-file-text"></span>
</div>
<p class="empty-title">No documentation available</p>
<p class="empty-subtitle text-muted">
Add documentation to this server to keep track of important information.
</p>
<div class="empty-action">
<a href="{{ url_for('dashboard.server_edit', server_id=server.id) }}" class="btn btn-primary">
<span class="ti ti-edit me-2"></span> Add Documentation
</a>
</div>
<div class="markdown-content">
{{ server.documentation|markdown|safe }}
</div>
{% else %}
<div class="text-muted">No documentation added yet.</div>
{% endif %}
</div>
</div>
<!-- Applications section with collapsible cards -->
<div class="card mt-3">
<div class="card-header">
<div class="card-header d-flex justify-content-between align-items-center">
<h3 class="card-title">Applications</h3>
<div class="card-actions">
<a href="{{ url_for('dashboard.app_new', server_id=server.id) }}" class="btn btn-primary me-2">
<span class="ti ti-plus me-2"></span> Add Application
<div>
<a href="{{ url_for('dashboard.app_new', server_id=server.id) }}" class="btn btn-primary">
<span class="ti ti-plus"></span> Add Application
</a>
<button class="btn btn-outline-primary" id="toggle-all-apps">
<span class="ti ti-chevrons-down me-1"></span> <span id="toggle-text">Expand All</span>
{% if server.apps and server.apps|length > 1 %}
<button id="expandAllBtn" class="btn btn-outline-secondary ms-2" data-expanded="false">
<span class="ti ti-chevrons-down"></span> Expand All
</button>
{% endif %}
</div>
</div>
<div class="card-body">
{% if server.apps %}
<div class="accordion" id="accordionApps">
<div class="accordion" id="applicationAccordion">
{% for app in server.apps %}
<div class="accordion-item">
<h2 class="accordion-header" id="heading-{{ app.id }}">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
data-bs-target="#collapse-{{ app.id }}" aria-expanded="false" aria-controls="collapse-{{ app.id }}">
<div class="d-flex justify-content-between align-items-center w-100 me-2">
<button class="accordion-button {% if server.apps|length > 1 %}collapsed{% endif %}" type="button"
data-bs-toggle="collapse" data-bs-target="#collapse-{{ app.id }}"
aria-expanded="{% if server.apps|length == 1 %}true{% else %}false{% endif %}"
aria-controls="collapse-{{ app.id }}">
<div class="d-flex align-items-center justify-content-between w-100">
<span>{{ app.name }}</span>
{% if app.ports %}
<div>
<div class="app-ports-badges d-flex flex-wrap ms-2" onclick="event.stopPropagation();">
{% for port in app.ports %}
<span class="badge bg-azure me-1">{{ port.port_number }}/{{ port.protocol }}</span>
<span class="badge bg-blue me-1">{{ port.port_number }}/{{ port.protocol }}</span>
{% endfor %}
</div>
{% endif %}
</div>
</button>
</h2>
<div id="collapse-{{ app.id }}" class="accordion-collapse collapse" aria-labelledby="heading-{{ app.id }}"
data-bs-parent="#accordionApps">
<div id="collapse-{{ app.id }}"
class="accordion-collapse collapse {% if server.apps|length == 1 %}show{% endif %}"
aria-labelledby="heading-{{ app.id }}" data-bs-parent="#applicationAccordion">
<div class="accordion-body">
<div class="d-flex justify-content-end mb-3">
<a href="{{ url_for('dashboard.app_view', app_id=app.id) }}"
class="btn btn-sm btn-outline-primary me-2">
<span class="ti ti-eye me-1"></span> View
</a>
<a href="{{ url_for('dashboard.app_edit', app_id=app.id) }}"
class="btn btn-sm btn-outline-primary me-2">
<span class="ti ti-edit me-1"></span> Edit
</a>
<button class="btn btn-sm btn-outline-danger" onclick="deleteApp('{{ app.id }}', '{{ app.name }}')">
<span class="ti ti-trash me-1"></span> Delete
</button>
<div class="d-flex justify-content-between mb-3">
<h4>{{ app.name }}</h4>
<div class="btn-list">
<a href="{{ url_for('dashboard.app_view', app_id=app.id) }}"
class="btn btn-sm btn-outline-primary">
<span class="ti ti-eye"></span> View
</a>
<a href="{{ url_for('dashboard.app_edit', app_id=app.id) }}"
class="btn btn-sm btn-outline-secondary">
<span class="ti ti-edit"></span> Edit
</a>
<button class="btn btn-sm btn-outline-danger" onclick="deleteApp({{ app.id }}, '{{ app.name }}')">
<span class="ti ti-trash"></span> Delete
</button>
</div>
</div>
<!-- Documentation preview -->
{% if app.documentation %}
<div class="markdown-content">
{{ app.documentation|markdown|safe }}
<div class="mt-3">
<h5>Documentation</h5>
<div class="markdown-content card p-3 bg-light">
{{ (app.documentation | truncate(200, true, "..."))|markdown|safe }}
{% if app.documentation | length > 200 %}
<a href="{{ url_for('dashboard.app_view', app_id=app.id) }}" class="mt-2 d-block">Read more...</a>
{% endif %}
</div>
</div>
{% else %}
<div class="text-muted">No documentation available</div>
{% endif %}
</div>
</div>
@ -201,8 +213,7 @@
<div class="modal-content">
<div class="modal-body">
<div class="modal-title">Are you sure?</div>
<div>This will permanently delete the server "{{ server.hostname }}" and all associated applications and ports.
</div>
<div>This will permanently delete the server "{{ server.hostname }}" and all its applications.</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
@ -215,7 +226,7 @@
</div>
</div>
<!-- Delete App Modal Template - Will be dynamically populated -->
<!-- Delete App Modal Template -->
<div class="modal modal-blur fade" id="deleteAppModal" tabindex="-1">
<div class="modal-dialog modal-sm modal-dialog-centered">
<div class="modal-content">
@ -249,47 +260,51 @@
new bootstrap.Modal(modal).show();
}
// Toggle expand/collapse all
// Initialize expand/collapse functionality
document.addEventListener('DOMContentLoaded', function () {
const toggleBtn = document.getElementById('toggle-all-apps');
const toggleText = document.getElementById('toggle-text');
let isExpanded = false;
const expandAllBtn = document.getElementById('expandAllBtn');
if (expandAllBtn) {
expandAllBtn.addEventListener('click', function () {
const isExpanded = expandAllBtn.getAttribute('data-expanded') === 'true';
const accordionItems = document.querySelectorAll('.accordion-collapse');
toggleBtn.addEventListener('click', function () {
const accordionButtons = document.querySelectorAll('.accordion-button');
const accordionContents = document.querySelectorAll('.accordion-collapse');
isExpanded = !isExpanded;
if (isExpanded) {
// Expand all
accordionButtons.forEach(button => {
button.classList.remove('collapsed');
button.setAttribute('aria-expanded', 'true');
accordionItems.forEach(item => {
if (isExpanded) {
// Collapse all items
bootstrap.Collapse.getInstance(item)?.hide();
} else {
// Expand all items
bootstrap.Collapse.getInstance(item) || new bootstrap.Collapse(item, { toggle: false });
bootstrap.Collapse.getInstance(item).show();
}
});
accordionContents.forEach(content => {
content.classList.add('show');
});
// Update button state
expandAllBtn.setAttribute('data-expanded', isExpanded ? 'false' : 'true');
if (isExpanded) {
expandAllBtn.innerHTML = '<span class="ti ti-chevrons-down"></span> Expand All';
} else {
expandAllBtn.innerHTML = '<span class="ti ti-chevrons-up"></span> Collapse All';
}
});
}
toggleText.textContent = 'Collapse All';
toggleBtn.querySelector('span:first-child').classList.remove('ti-chevrons-down');
toggleBtn.querySelector('span:first-child').classList.add('ti-chevrons-up');
} else {
// Collapse all
accordionButtons.forEach(button => {
button.classList.add('collapsed');
button.setAttribute('aria-expanded', 'false');
// Handle free port button
document.getElementById('getFreePorts')?.addEventListener('click', function (e) {
e.preventDefault();
fetch(`/api/servers/{{ server.id }}/suggest_port`)
.then(response => response.json())
.then(data => {
if (data.port) {
alert(`Available port: ${data.port}`);
} else {
alert('No available ports found');
}
})
.catch(error => {
console.error('Error finding free port:', error);
alert('Error finding free port');
});
accordionContents.forEach(content => {
content.classList.remove('show');
});
toggleText.textContent = 'Expand All';
toggleBtn.querySelector('span:first-child').classList.remove('ti-chevrons-up');
toggleBtn.querySelector('span:first-child').classList.add('ti-chevrons-down');
}
});
});
</script>
@ -364,5 +379,36 @@
.copy-port:hover {
opacity: 1;
}
.markdown-content {
overflow-wrap: break-word;
}
.markdown-content h1,
.markdown-content h2,
.markdown-content h3,
.markdown-content h4,
.markdown-content h5,
.markdown-content h6 {
margin-top: 1rem;
margin-bottom: 0.5rem;
}
.markdown-content p {
margin-bottom: 1rem;
}
.markdown-content a {
color: var(--tblr-primary);
}
.badge.bg-red.text-dark {
color: #000 !important;
font-weight: 500;
}
.card-body .markdown-content {
padding: 0;
}
</style>
{% endblock %}