This commit is contained in:
pika 2025-03-31 09:32:33 +02:00
parent 0a99abb52d
commit 7ce4914ea1
5 changed files with 182 additions and 37 deletions

View file

@ -53,6 +53,20 @@
<small class="form-hint">Choose a unique name for this application</small>
</div>
<div class="mb-3">
<label class="form-label">Application URL (Optional)</label>
<div class="input-group">
<span class="input-group-text">
<span class="ti ti-link"></span>
</span>
<input type="url" class="form-control" name="url" id="url" value="{{ app.url if app else '' }}"
placeholder="https://example.com">
</div>
<small class="form-hint">
If provided, the application name will be clickable and link to this URL.
</small>
</div>
<div class="mb-3">
<label class="form-label required">Server</label>
<select class="form-select" name="server_id" required>

View file

@ -131,55 +131,56 @@
{% if server.apps %}
<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 {% 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>
<div class="app-ports-badges d-flex flex-wrap ms-2" onclick="event.stopPropagation();">
{% for port in app.ports %}
<span class="badge bg-blue me-1">{{ port.port_number }}/{{ port.protocol }}</span>
{% endfor %}
</div>
</div>
<div class="accordion-item bg-dark-subtle rounded-3 mb-3">
<h2 class="accordion-header" id="app-heading-{{ app.id }}">
<button class="accordion-button collapsed bg-dark-subtle text-white" type="button"
data-bs-toggle="collapse" data-bs-target="#app-collapse-{{ app.id }}" aria-expanded="false"
aria-controls="app-collapse-{{ app.id }}">
<span class="me-2">{{ app.name }}</span>
{% for port in app.ports %}
<span class="badge bg-primary mx-1">{{ port.number }}/{{ port.protocol }}</span>
{% endfor %}
</button>
</h2>
<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-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">
<div id="app-collapse-{{ app.id }}" class="accordion-collapse collapse"
aria-labelledby="app-heading-{{ app.id }}">
<div class="accordion-body p-0">
<div class="d-flex justify-content-between align-items-center p-3 border-bottom">
<div class="app-title">
{% 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 %}
</div>
<div class="app-actions">
<a href="{{ url_for('dashboard.app_view', app_id=app.id) }}" class="btn btn-sm btn-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">
<a href="{{ url_for('dashboard.app_edit', app_id=app.id) }}" class="btn btn-sm btn-secondary">
<span class="ti ti-edit"></span> Edit
</a>
<button class="btn btn-sm btn-outline-danger" onclick="deleteApp({{ app.id }}, '{{ app.name }}')">
<button type="button" class="btn btn-sm btn-danger"
onclick="deleteApp({{ app.id }}, '{{ app.name }}')">
<span class="ti ti-trash"></span> Delete
</button>
</div>
</div>
<!-- Documentation preview -->
{% if app.documentation %}
<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>
<!-- Documentation section with improved styling -->
<div class="documentation-wrapper p-3">
<div class="markdown-content theme-styled">
{% if app.documentation %}
{{ app.documentation|markdown|safe }}
{% else %}
<div class="empty-documentation">
<p class="text-muted">No documentation available for this application.</p>
</div>
{% endif %}
</div>
</div>
{% endif %}
</div>
</div>
</div>