1
0
mirror of https://github.com/netbox-community/netbox.git synced 2024-05-10 07:54:54 +00:00

Closes #9416: Dashboard widgets (#11823)

* Replace masonry with gridstack

* Initial work on dashboard widgets

* Implement function to save dashboard layout

* Define a default dashboard

* Clean up widgets

* Implement widget configuration views & forms

* Permit merging dict value with existing dict in user config

* Add widget deletion view

* Enable HTMX for widget configuration

* Implement view to add dashboard widgets

* ObjectCountsWidget: Identify models by app_label & name

* Add color customization to dashboard widgets

* Introduce Dashboard model to store user dashboard layout & config

* Clean up utility functions

* Remove hard-coded API URL

* Use fixed grid cell height

* Add modal close button

* Clean up dashboard views

* Rebuild JS
This commit is contained in:
Jeremy Stretch
2023-02-24 16:04:00 -05:00
committed by GitHub
parent 36771e821c
commit 084a2cc52c
40 changed files with 788 additions and 310 deletions

View File

@ -0,0 +1,37 @@
{% load dashboard %}
<div
class="grid-stack-item"
gs-w="{{ widget.width }}"
gs-h="{{ widget.height }}"
gs-x="{{ widget.x }}"
gs-y="{{ widget.y }}"
gs-id="{{ widget.id }}"
>
<div class="card grid-stack-item-content">
<div class="card-header text-center text-light bg-{% if widget.color %}{{ widget.color }}{% else %}secondary{% endif %} p-1">
<div class="float-start ps-1">
<a href="#"
hx-get="{% url 'extras:dashboardwidget_config' id=widget.id %}"
hx-target="#htmx-modal-content"
data-bs-toggle="modal"
data-bs-target="#htmx-modal"
><i class="mdi mdi-cog text-gray"></i></a>
</div>
<div class="float-end pe-1">
<a href="#"
hx-get="{% url 'extras:dashboardwidget_delete' id=widget.id %}"
hx-target="#htmx-modal-content"
data-bs-toggle="modal"
data-bs-target="#htmx-modal"
><i class="mdi mdi-close text-gray"></i></a>
</div>
{% if widget.title %}
<strong>{{ widget.title }}</strong>
{% endif %}
</div>
<div class="card-body p-2">
{% render_widget widget %}
</div>
</div>
</div>

View File

@ -0,0 +1,27 @@
{% load form_helpers %}
<form hx-post="{% url 'extras:dashboardwidget_add' %}" id="widget_add_form">
{% csrf_token %}
<div class="modal-header">
<h5 class="modal-title">Add a Widget</h5>
</div>
<div class="modal-body">
{% block form %}
{% render_field widget_form.widget_class %}
<div class="row mb-3">
<label class="col-sm-3 col-form-label text-lg-end">Description</label>
<div class="col">
<div class="form-control-plaintext">{{ widget_class.description|placeholder }}</div>
</div>
</div>
{% render_field widget_form.color %}
{% render_field widget_form.title %}
{% render_form config_form %}
{% endblock form %}
</div>
<div class="modal-footer">
{% block buttons %}
<button class="btn btn-primary">Save</button>
{% endblock buttons %}
</div>
</form>

View File

@ -0,0 +1,20 @@
{% load form_helpers %}
<form hx-post="{{ form_url }}">
{% csrf_token %}
<div class="modal-header">
<h5 class="modal-title">Widget Configuration</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
{% block form %}
{% render_form widget_form %}
{% render_form config_form %}
{% endblock form %}
</div>
<div class="modal-footer">
{% block buttons %}
<button class="btn btn-primary">Save</button>
{% endblock buttons %}
</div>
</form>

View File

@ -0,0 +1,4 @@
<div class="htmx-container"
hx-get="{% url 'extras:objectchange_list' %}?sort=-time"
hx-trigger="load"
></div>

View File

@ -0,0 +1,14 @@
{% load helpers %}
{% if counts %}
<div class="list-group list-group-flush">
{% for model, count in counts %}
<a href="{% url model|viewname:"list" %}" class="list-group-item list-group-item-action">
<div class="d-flex w-100 justify-content-between align-items-center">
{{ model|meta:"verbose_name_plural"|bettertitle }}
<h6 class="mb-1">{{ count }}</h6>
</div>
</a>
{% endfor %}
</div>
{% endif %}