mirror of
https://github.com/netbox-community/netbox.git
synced 2024-05-10 07:54:54 +00:00
Convert scripts to use HTMX
This commit is contained in:
@ -10,6 +10,7 @@ from rq import Worker
|
||||
|
||||
from netbox.views import generic
|
||||
from utilities.forms import ConfirmationForm
|
||||
from utilities.htmx import is_htmx
|
||||
from utilities.tables import paginate_table
|
||||
from utilities.utils import copy_safe_request, count_related, normalize_querydict, shallow_compare_dict
|
||||
from utilities.views import ContentTypePermissionRequiredMixin
|
||||
@ -820,6 +821,16 @@ class ScriptResultView(ContentTypePermissionRequiredMixin, GetScriptMixin, View)
|
||||
|
||||
script = self._get_script(result.name)
|
||||
|
||||
# If this is an HTMX request, return only the rendered table HTML
|
||||
if is_htmx(request):
|
||||
response = render(request, 'extras/htmx/script_result.html', {
|
||||
'script': script,
|
||||
'result': result,
|
||||
})
|
||||
if result.completed:
|
||||
response.status_code = 286
|
||||
return response
|
||||
|
||||
return render(request, 'extras/script_result.html', {
|
||||
'script': script,
|
||||
'result': result,
|
||||
|
52
netbox/templates/extras/htmx/script_result.html
Normal file
52
netbox/templates/extras/htmx/script_result.html
Normal file
@ -0,0 +1,52 @@
|
||||
{% load helpers %}
|
||||
{% load log_levels %}
|
||||
|
||||
{% if result.completed %}
|
||||
<p>
|
||||
Run: <strong>{{ result.created|annotated_date }}</strong>
|
||||
{% if result.completed %}
|
||||
Duration: <strong>{{ result.duration }}</strong>
|
||||
{% endif %}
|
||||
</p>
|
||||
<div class="card mb-3">
|
||||
<h5 class="card-header">Script Log</h5>
|
||||
<div class="card-body">
|
||||
<table class="table table-hover panel-body">
|
||||
<tr>
|
||||
<th>Line</th>
|
||||
<th>Level</th>
|
||||
<th>Message</th>
|
||||
</tr>
|
||||
{% for log in result.data.log %}
|
||||
<tr>
|
||||
<td>{{ forloop.counter }}</td>
|
||||
<td>{% log_level log.status %}</td>
|
||||
<td class="rendered-markdown">{{ log.message|render_markdown }}</td>
|
||||
</tr>
|
||||
{% empty %}
|
||||
<tr>
|
||||
<td colspan="3" class="text-center text-muted">
|
||||
No log output
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
</div>
|
||||
{% if execution_time %}
|
||||
<div class="card-footer text-end text-muted">
|
||||
<small>Exec Time: {{ execution_time|floatformat:3 }}s</small>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<h4>Output</h4>
|
||||
{% if result.data.output %}
|
||||
<pre class="block">{{ result.data.output }}</pre>
|
||||
{% else %}
|
||||
<p class="text-muted">None</p>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<div class="spinner-border" id="spinner" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
<h3>Results pending...</h3>
|
||||
{% endif %}
|
@ -4,16 +4,10 @@
|
||||
{% load log_levels %}
|
||||
{% load static %}
|
||||
|
||||
{% block head %}
|
||||
<script src="{% static 'jobs.js' %}?v{{ settings.VERSION }}"
|
||||
onerror="window.location='{% url 'media_failure' %}?filename=jobs.js'"></script>
|
||||
{% endblock %}
|
||||
|
||||
{% block title %}{{ script }}{% endblock %}
|
||||
|
||||
{% block subtitle %}
|
||||
{{ script.Meta.description|render_markdown }}
|
||||
<span id="pending-result-label">{% include 'extras/inc/job_label.html' with result=result %}</span>
|
||||
{% endblock %}
|
||||
|
||||
{% block header %}
|
||||
@ -37,81 +31,21 @@
|
||||
<li class="nav-item" role="presentation">
|
||||
<a href="#log" role="tab" data-bs-toggle="tab" class="nav-link active">Log</a>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<a href="#output" role="tab" data-bs-toggle="tab" class="nav-link">Output</a>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<a href="#source" role="tab" data-bs-toggle="tab" class="nav-link">Source</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content mb-3">
|
||||
<p>
|
||||
Run: <strong>{{ result.created|annotated_date }}</strong>
|
||||
{% if result.completed %}
|
||||
Duration: <strong>{{ result.duration }}</strong>
|
||||
{% else %}
|
||||
<div class="spinner-border" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
</p>
|
||||
<div role="tabpanel" class="tab-pane active" id="log">
|
||||
{% if result.completed %}
|
||||
<div class="row">
|
||||
<div class="col col-md-12">
|
||||
<div class="card">
|
||||
<h5 class="card-header">
|
||||
Script Log
|
||||
</h5>
|
||||
<div class="card-body">
|
||||
<table class="table table-hover panel-body">
|
||||
<tr>
|
||||
<th>Line</th>
|
||||
<th>Level</th>
|
||||
<th>Message</th>
|
||||
</tr>
|
||||
{% for log in result.data.log %}
|
||||
<tr>
|
||||
<td>{{ forloop.counter }}</td>
|
||||
<td>{% log_level log.status %}</td>
|
||||
<td class="rendered-markdown">{{ log.message|render_markdown }}</td>
|
||||
</tr>
|
||||
{% empty %}
|
||||
<tr>
|
||||
<td colspan="3" class="text-center text-muted">
|
||||
No log output
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
</div>
|
||||
{% if execution_time %}
|
||||
<div class="card-footer text-end text-muted">
|
||||
<small>Exec Time: {{ execution_time|floatformat:3 }}s</small>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="row">
|
||||
<div class="col col-md-12">
|
||||
<div class="well">Pending Results</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div role="tabpanel" class="tab-pane" id="output">
|
||||
<pre class="block">{{ result.data.output }}</pre>
|
||||
</div>
|
||||
<div role="tabpanel" class="tab-pane" id="source">
|
||||
<p><code>{{ script.filename }}</code></p>
|
||||
<pre class="block">{{ script.source }}</pre>
|
||||
<div role="tabpanel" class="tab-pane active" id="log">
|
||||
<div class="row">
|
||||
<div class="col col-md-12" hx-get="{% url 'extras:script_result' job_result_pk=result.pk %}" hx-trigger="every 3s">
|
||||
{% include 'extras/htmx/script_result.html' %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div role="tabpanel" class="tab-pane" id="source">
|
||||
<p><code>{{ script.filename }}</code></p>
|
||||
<pre class="block">{{ script.source }}</pre>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock content-wrapper %}
|
||||
|
||||
{% block data %}
|
||||
<span data-job-url="{% url 'extras-api:jobresult-detail' pk=result.pk %}"></span>
|
||||
<span data-job-complete="{{ result.completed }}"></span>
|
||||
{% endblock %}
|
||||
|
Reference in New Issue
Block a user