Tabify object add/edit views

This commit is contained in:
jeremystretch 2021-08-06 16:11:02 -04:00
parent 65659fb676
commit 8653b0f3d0
5 changed files with 119 additions and 98 deletions

View File

@ -18,79 +18,92 @@
{% endif %} {% endif %}
{% endblock controls %} {% endblock controls %}
{% block content %} {% block tabs %}
<form action="" method="post" enctype="multipart/form-data"> <ul class="nav nav-tabs px-3">
{% csrf_token %} <li class="nav-item" role="presentation">
{% for field in form.hidden_fields %}{{ field }}{% endfor %} <button class="nav-link active" id="edit-form-tab" data-bs-toggle="tab" data-bs-target="#edit-form" type="button" role="tab" aria-controls="edit-form" aria-selected="true">
{% if obj.pk %}Edit{% else %}Create{% endif %}
</button>
</li>
</ul>
{% endblock tabs %}
<div class="row"> {% block content-wrapper %}
<div class="col col-md-12 col-lg-10 offset-lg-1"> <div class="tab-content">
{% block tabs %}{% endblock %} <div class="tab-pane show active" id="edit-form" role="tabpanel" aria-labelledby="object-list-tab">
{% block form %} <form action="" method="post" enctype="multipart/form-data">
{% if form.Meta.fieldsets %} {% csrf_token %}
{% for field in form.hidden_fields %}{{ field }}{% endfor %}
{# Render grouped fields according to Form #} <div class="row">
{% for group, fields in form.Meta.fieldsets %} <div class="col col-md-12 col-lg-10 offset-lg-1">
<div class="field-group"> {% block form %}
<h5 class="text-center">{{ group }}</h5> {% if form.Meta.fieldsets %}
{% for name in fields %}
{% render_field form|getfield:name %} {# Render grouped fields according to Form #}
{% for group, fields in form.Meta.fieldsets %}
<div class="field-group">
<h5 class="text-center">{{ group }}</h5>
{% for name in fields %}
{% render_field form|getfield:name %}
{% endfor %}
</div>
{% endfor %} {% endfor %}
</div>
{% endfor %}
{% if form.custom_fields %} {% if form.custom_fields %}
<div class="field-group"> <div class="field-group">
<h5 class="text-center">Custom Fields</h5> <h5 class="text-center">Custom Fields</h5>
{% render_custom_fields form %} {% render_custom_fields form %}
</div> </div>
{% endif %} {% endif %}
{% if form.comments %} {% if form.comments %}
<div class="field-group"> <div class="field-group">
{% render_field form.comments label='Comments' %} {% render_field form.comments label='Comments' %}
</div> </div>
{% endif %} {% endif %}
{% else %} {% else %}
{# Render all fields in a single group #} {# Render all fields in a single group #}
<div class="field-group"> <div class="field-group">
<h5 class="text-center">{{ obj_type|capfirst }}</h5> <h5 class="text-center">{{ obj_type|capfirst }}</h5>
{% block form_fields %}{% render_form form %}{% endblock %} {% block form_fields %}{% render_form form %}{% endblock %}
</div> </div>
{% endif %} {% endif %}
{% endblock form %} {% endblock form %}
</div> </div>
</div>
<div class="row my-3">
<div class="col col-md-12 col-lg-10 offset-lg-1 text-end">
{% block buttons %}
<a class="btn btn-outline-danger" href="{{ return_url }}">Cancel</a>
{% if obj.pk %}
<button type="submit" name="_update" class="btn btn-primary">
Save
</button>
{% else %}
<button type="submit" name="_addanother" class="btn btn-outline-primary">
Create & Add Another
</button>
<button type="submit" name="_create" class="btn btn-primary">
Create
</button>
{% endif %}
{% endblock buttons %}
</div>
</div>
</form>
</div> </div>
</div>
<div class="row my-3"> {% if obj and settings.DOCS_ROOT %}
<div class="col col-md-12 col-lg-10 offset-lg-1 text-end"> {% include 'inc/modal.html' with name='docs' content=obj|get_docs %}
{% block buttons %} {% endif %}
<a class="btn btn-outline-danger" href="{{ return_url }}">Cancel</a>
{% if obj.pk %} {% endblock content-wrapper %}
<button type="submit" name="_update" class="btn btn-primary">
Save
</button>
{% else %}
<button type="submit" name="_addanother" class="btn btn-outline-primary">
Create & Add Another
</button>
<button type="submit" name="_create" class="btn btn-primary">
Create
</button>
{% endif %}
{% endblock buttons %}
</div>
</div>
</form>
{% if obj and settings.DOCS_ROOT %}
{% include 'inc/modal.html' with name='docs' content=obj|get_docs %}
{% endif %}
{% endblock content %}

View File

@ -1,31 +1,31 @@
{% load helpers %} {% load helpers %}
<ul class="nav nav-pills justify-content-center border-bottom-0 mb-1"> <ul class="nav nav-tabs px-3">
<li class="nav-item"> <li class="nav-item">
<a <a
class="nav-link {% if active_tab == 'add' %}active{% endif %}" class="nav-link {% if active_tab == 'add' %}active{% endif %}"
href="{% url 'ipam:ipaddress_add' %}{% querystring request %}" href="{% url 'ipam:ipaddress_add' %}{% querystring request %}"
> >
New IP {% if obj.pk %}Edit{% else %}Create{% endif %}
</a> </a>
</li> </li>
{% if 'interface' in request.GET or 'vminterface' in request.GET %} {% if 'interface' in request.GET or 'vminterface' in request.GET %}
<li class="nav-item"> <li class="nav-item">
<a <a
class="nav-link {% if active_tab == 'assign' %}active{% endif %}" class="nav-link {% if active_tab == 'assign' %}active{% endif %}"
href="{% url 'ipam:ipaddress_assign' %}{% querystring request %}" href="{% url 'ipam:ipaddress_assign' %}{% querystring request %}"
> >
Assign IP Assign IP
</a> </a>
</li> </li>
{% else %} {% else %}
<li class="nav-item"> <li class="nav-item">
<a <a
class="nav-link {% if active_tab == 'bulk_add' %}active{% endif %}" class="nav-link {% if active_tab == 'bulk_add' %}active{% endif %}"
href="{% url 'ipam:ipaddress_bulk_add' %}{% querystring request %}" href="{% url 'ipam:ipaddress_bulk_add' %}{% querystring request %}"
> >
Bulk Create Bulk Create
</a> </a>
</li> </li>
{% endif %} {% endif %}
</ul> </ul>

View File

@ -5,6 +5,10 @@
{% block title %}Assign an IP Address{% endblock title %} {% block title %}Assign an IP Address{% endblock title %}
{% block tabs %}
{% include 'ipam/inc/ipadress_edit_header.html' with active_tab='assign' %}
{% endblock %}
{% block content %} {% block content %}
<form action="{% querystring request %}" method="post" class="form form-horizontal"> <form action="{% querystring request %}" method="post" class="form form-horizontal">
{% csrf_token %} {% csrf_token %}

View File

@ -4,8 +4,11 @@
{% block title %}Bulk Add IP Addresses{% endblock %} {% block title %}Bulk Add IP Addresses{% endblock %}
{% block tabs %}
{% include 'ipam/inc/ipadress_edit_header.html' with active_tab='bulk_add' %}
{% endblock %}
{% block form %} {% block form %}
{% include 'ipam/inc/ipadress_edit_header.html' with active_tab='bulk_add' %}
<div class="field-group"> <div class="field-group">
<h5 class="text-center">IP Addresses</h5> <h5 class="text-center">IP Addresses</h5>
{% render_field form.pattern %} {% render_field form.pattern %}

View File

@ -3,10 +3,11 @@
{% load form_helpers %} {% load form_helpers %}
{% load helpers %} {% load helpers %}
{% block tabs %}
{% include 'ipam/inc/ipadress_edit_header.html' with active_tab='add' %}
{% endblock tabs %}
{% block form %} {% block form %}
{% if not obj.pk %}
{% include 'ipam/inc/ipadress_edit_header.html' with active_tab='add' %}
{% endif %}
<div class="field-group"> <div class="field-group">
<h4 class="mb-3">IP Address</h4> <h4 class="mb-3">IP Address</h4>
{% render_field form.address %} {% render_field form.address %}