homedocs/app/templates/dashboard/app_view.html
2025-03-30 21:52:20 +02:00

223 lines
No EOL
8.1 KiB
HTML

{% extends "layout.html" %}
{% 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">
Application Details
</div>
<h2 class="page-title">
{{ app.name }}
</h2>
</div>
<div class="col-auto ms-auto">
<div class="btn-list">
<a href="{{ url_for('dashboard.app_edit', app_id=app.id) }}" class="btn btn-primary">
<span class="ti ti-edit me-2"></span>Edit Application
</a>
<button class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#deleteAppModal">
<span class="ti ti-trash me-2"></span>Delete
</button>
</div>
</div>
</div>
</div>
<div class="row mt-3">
<div class="col-md-4">
<!-- Basic Information -->
<div class="card">
<div class="card-header">
<h3 class="card-title">Basic Information</h3>
</div>
<div class="card-body">
<div class="mb-3">
<div class="form-label">Server</div>
<div>
<a href="{{ url_for('dashboard.server_view', server_id=server.id) }}">
{{ server.hostname }}
</a>
({{ server.ip_address }})
</div>
</div>
<div class="mb-3">
<div class="form-label">Created</div>
<div>{{ app.created_at.strftime('%Y-%m-%d %H:%M') }}</div>
</div>
<div class="mb-3">
<div class="form-label">Last Updated</div>
<div>{{ app.updated_at.strftime('%Y-%m-%d %H:%M') }}</div>
</div>
</div>
</div>
<!-- Ports -->
<div class="card mt-3">
<div class="card-header">
<h3 class="card-title">Ports</h3>
<div class="card-actions">
<button class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#addPortModal">
<span class="ti ti-plus me-1"></span> Add Port
</button>
</div>
</div>
<div class="card-body">
{% if app.ports %}
<div class="table-responsive">
<table class="table table-vcenter">
<thead>
<tr>
<th>Port</th>
<th>Protocol</th>
<th>Description</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>{{ port.description or 'No description' }}</td>
<td>
<a href="#" data-bs-toggle="modal" data-bs-target="#deletePortModal{{ port.id }}"
class="btn btn-sm btn-ghost-danger">
<span class="ti ti-trash"></span>
</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}
<div class="empty">
<div class="empty-icon">
<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>
<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
</button>
</div>
</div>
{% endif %}
</div>
</div>
</div>
<div class="col-md-8">
<!-- Documentation section - ENHANCED -->
<div class="card">
<div class="card-header">
<h3 class="card-title">Documentation</h3>
</div>
<div class="card-body markdown-content">
{% if app.documentation %}
{{ app.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 application to keep track of important information.
</p>
<div class="empty-action">
<a href="{{ url_for('dashboard.app_edit', app_id=app.id) }}" class="btn btn-primary">
<span class="ti ti-edit me-2"></span> Add Documentation
</a>
</div>
</div>
{% endif %}
</div>
</div>
</div>
</div>
</div>
<!-- Add Port Modal -->
<div class="modal" id="addPortModal" tabindex="-1">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<form method="POST" action="{{ url_for('api.add_port', app_id=app.id) }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<div class="modal-header">
<h5 class="modal-title">Add Port</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="mb-3">
<label class="form-label required">Port Number</label>
<input type="number" class="form-control" name="port_number" required min="1" max="65535">
</div>
<div class="mb-3">
<label class="form-label required">Protocol</label>
<select class="form-select" name="protocol" required>
<option value="TCP">TCP</option>
<option value="UDP">UDP</option>
<option value="SCTP">SCTP</option>
<option value="OTHER">OTHER</option>
</select>
</div>
<div class="mb-3">
<label class="form-label">Description</label>
<input type="text" class="form-control" name="description" placeholder="What is this port used for?">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary">Add Port</button>
</div>
</form>
</div>
</div>
</div>
<!-- Delete App Modal -->
<div class="modal modal-blur fade" id="deleteAppModal" tabindex="-1">
<div class="modal-dialog modal-sm modal-dialog-centered">
<div class="modal-content">
<div class="modal-body">
<div class="modal-title">Are you sure?</div>
<div>This will permanently delete the application "{{ app.name }}" and all its ports.</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<form method="POST" action="{{ url_for('dashboard.app_delete', app_id=app.id) }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="btn btn-danger">Delete Application</button>
</form>
</div>
</div>
</div>
</div>
<!-- Delete Port Modals -->
{% for port in app.ports %}
<div class="modal modal-blur fade" id="deletePortModal{{ port.id }}" tabindex="-1">
<div class="modal-dialog modal-sm modal-dialog-centered">
<div class="modal-content">
<div class="modal-body">
<div class="modal-title">Are you sure?</div>
<div>This will delete port {{ port.port_number }}/{{ port.protocol }}.</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<form method="POST" action="{{ url_for('api.delete_port', port_id=port.id) }}">
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
<button type="submit" class="btn btn-danger">Delete Port</button>
</form>
</div>
</div>
</div>
</div>
{% endfor %}
{% endblock %}