Clean up object edit forms

This commit is contained in:
jeremystretch 2021-08-24 13:59:54 -04:00
parent b63c838c74
commit 545474a1a3
21 changed files with 613 additions and 569 deletions

View File

@ -1422,6 +1422,10 @@ class VLANGroupForm(BootstrapMixin, CustomFieldModelForm):
'name', 'slug', 'description', 'scope_type', 'region', 'sitegroup', 'site', 'location', 'rack',
'clustergroup', 'cluster',
]
fieldsets = (
('VLAN Group', ('name', 'slug', 'description')),
('Scope', ('scope_type', 'region', 'sitegroup', 'site', 'location', 'rack', 'clustergroup', 'cluster')),
)
widgets = {
'scope_type': StaticSelect,
}

View File

@ -769,7 +769,6 @@ class VLANGroupView(generic.ObjectView):
class VLANGroupEditView(generic.ObjectEditView):
queryset = VLANGroup.objects.all()
model_form = forms.VLANGroupForm
template_name = 'ipam/vlangroup_edit.html'
class VLANGroupDeleteView(generic.ObjectDeleteView):

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -725,15 +725,6 @@ div.paginator > form > div.input-group {
div.field-group:not(:first-of-type) {
margin-top: $spacer * 3;
h1,
h2,
h3,
h4,
h5,
h6 {
margin-bottom: $spacer;
}
}
label.required {

View File

@ -6,28 +6,32 @@
{% block form %}
<div class="field-group">
<h4 class="mb-3">Termination</h4>
<div class="row mb-2">
<h5 class="offset-sm-3">Circuit Termination</h5>
</div>
<div class="row mb-3">
<label class="col-sm-3 col-form-label">Provider</label>
<label class="col-sm-3 col-form-label text-lg-end">Provider</label>
<div class="col">
<input class="form-control" value="{{ obj.circuit.provider }}" disabled />
</div>
</div>
<div class="row mb-3">
<label class="col-sm-3 col-form-label">Circuit</label>
<label class="col-sm-3 col-form-label text-lg-end">Circuit</label>
<div class="col">
<input class="form-control" value="{{ obj.circuit.cid }}" disabled />
</div>
</div>
<div class="row mb-3">
<label class="col-sm-3 col-form-label">Termination</label>
<label class="col-sm-3 col-form-label text-lg-end">Termination</label>
<div class="col">
<input class="form-control" value="{{ form.term_side.value }}" disabled />
</div>
</div>
{% render_field form.mark_connected %}
{% with providernetwork_tab_active=form.initial.provider_network %}
<ul class="nav nav-tabs" role="tablist">
<div class="row mb-2">
<div class="offset-sm-3">
<ul class="nav nav-pills" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link{% if not providernetwork_tab_active %} active{% endif %}" role="tab" type="button" data-bs-target="#site" data-bs-toggle="tab">Site</button>
</li>
@ -35,7 +39,9 @@
<button class="nav-link{% if providernetwork_tab_active %} active{% endif %}" role="tab" type="button" data-bs-toggle="tab" data-bs-target="#providernetwork">Provider Network</button>
</li>
</ul>
<div class="tab-content">
</div>
</div>
<div class="tab-content p-0">
<div class="tab-pane{% if not providernetwork_tab_active %} active{% endif %}" id="site">
{% render_field form.region %}
{% render_field form.site_group %}
@ -48,7 +54,9 @@
{% endwith %}
</div>
<div class="field-group">
<h4 class="mb-3">Termination Details</h4>
<div class="row mb-2">
<h5 class="offset-sm-3">Termination Details</h5>
</div>
{% render_field form.port_speed %}
{% render_field form.upstream_speed %}
{% render_field form.xconnect_id %}

View File

@ -5,10 +5,11 @@
{% block title %}Connect {{ form.instance.termination_a.device }} {{ form.instance.termination_a }} to {{ termination_b_type|bettertitle }}{% endblock %}
{% block content %}
{% with termination_a=form.instance.termination_a %}
{% render_errors form %}
<form method="post">
{% block content-wrapper %}
<div class="tab-content">
{% with termination_a=form.instance.termination_a %}
{% render_errors form %}
<form method="post">
{% csrf_token %}
{% for field in form.hidden_fields %}
{{ field }}
@ -152,15 +153,21 @@
</div>
<div class="row my-3 justify-content-center">
<div class="col col-md-8">
<div class="card">
<h5 class="card-header">Cable</h5>
<div class="card-body">
{% include 'dcim/inc/cable_form.html' %}
</div>
</div>
</div>
</div>
<div class="row my-3">
<div class="col col-md-12 text-center">
<a href="{{ return_url }}" class="btn btn-outline-danger">Cancel</a>
<button type="submit" name="_update" class="btn btn-primary">Connect</button>
</div>
</div>
</form>
{% endwith %}
</form>
{% endwith %}
</div>
{% endblock %}

View File

@ -5,14 +5,18 @@
{% render_errors form %}
<div class="field-group">
<h5 class="text-center">Device</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Device</h5>
</div>
{% render_field form.name %}
{% render_field form.device_role %}
{% render_field form.tags %}
</div>
<div class="field-group">
<h5 class="text-center">Hardware</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Hardware</h5>
</div>
{% render_field form.manufacturer %}
{% render_field form.device_type %}
{% render_field form.serial %}
@ -20,7 +24,9 @@
</div>
<div class="field-group">
<h5 class="text-center">Location</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Location</h5>
</div>
{% render_field form.region %}
{% render_field form.site_group %}
{% render_field form.site %}
@ -52,7 +58,9 @@
</div>
<div class="field-group">
<h5 class="text-center">Management</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Management</h5>
</div>
{% render_field form.status %}
{% render_field form.platform %}
{% if obj.pk %}
@ -62,20 +70,26 @@
</div>
<div class="field-group">
<h5 class="text-center">Virtualization</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Virtualization</h5>
</div>
{% render_field form.cluster_group %}
{% render_field form.cluster %}
</div>
<div class="field-group">
<h5 class="text-center">Tenancy</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Tenancy</h5>
</div>
{% render_field form.tenant_group %}
{% render_field form.tenant %}
</div>
{% if form.custom_fields %}
<div class="field-group">
<h5 class="text-center">Custom Fields</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Custom Fields</h5>
</div>
{% render_custom_fields form %}
</div>

View File

@ -1,12 +1,10 @@
{% load form_helpers %}
<div class="card">
<h5 class="card-header">Cable</h5>
<div class="card-body">
{% render_field form.status %}
{% render_field form.type %}
{% render_field form.label %}
{% render_field form.color %}
<div class="row mb-3">
{% render_field form.status %}
{% render_field form.type %}
{% render_field form.label %}
{% render_field form.color %}
<div class="row mb-3">
<label class="col-sm-3 col-form-label text-lg-end">{{ form.length.label }}</label>
<div class="col-md-5">
{{ form.length }}
@ -15,13 +13,11 @@
{{ form.length_unit }}
</div>
<div class="invalid-feedback"></div>
</div>
{% render_field form.tags %}
{% if form.custom_fields %}
</div>
{% render_field form.tags %}
{% if form.custom_fields %}
<div class="field-group">
<h4>Custom Fields</h4>
{% render_custom_fields form %}
</div>
{% endif %}
</div>
</div>
{% endif %}

View File

@ -3,7 +3,9 @@
{% block form %}
<div class="field-group">
<h4 class="mb-3">Interface</h4>
<div class="row mb-2">
<h5 class="offset-sm-3">Interface</h5>
</div>
{% if form.instance.device %}
<div class="row mb-3">
<label class="col-sm-3 col-form-label text-lg-end required" for="id_device">Device</label>
@ -15,18 +17,20 @@
{% render_field form.name %}
{% render_field form.label %}
{% render_field form.type %}
{% render_field form.enabled %}
{% render_field form.parent %}
{% render_field form.lag %}
{% render_field form.mac_address %}
{% render_field form.mtu %}
{% render_field form.mgmt_only %}
{% render_field form.mark_connected %}
{% render_field form.description %}
{% render_field form.tags %}
{% render_field form.enabled %}
{% render_field form.mgmt_only %}
{% render_field form.mark_connected %}
</div>
<div class="field-group">
<h4 class="mb-3">802.1Q Switching</h4>
<div class="row mb-2">
<h5 class="offset-sm-3">802.1Q Switching</h5>
</div>
{% render_field form.mode %}
{% render_field form.vlan_group %}
{% render_field form.untagged_vlan %}
@ -34,7 +38,9 @@
</div>
{% if form.custom_fields %}
<div class="field-group">
<h4 class="mb-3">Custom Fields</h4>
<div class="row mb-2">
<h5 class="offset-sm-3">Custom Fields</h5>
</div>
{% render_custom_fields form %}
</div>
{% endif %}

View File

@ -3,7 +3,9 @@
{% block form %}
<div class="field-group">
<h5 class="text-center">Rack</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Rack</h5>
</div>
{% render_field form.region %}
{% render_field form.site_group %}
{% render_field form.site %}
@ -14,18 +16,24 @@
{% render_field form.tags %}
</div>
<div class="field-group">
<h5 class="text-center">Inventory Control</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Inventory Control</h5>
</div>
{% render_field form.facility_id %}
{% render_field form.serial %}
{% render_field form.asset_tag %}
</div>
<div class="field-group">
<h5 class="text-center">Tenancy</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Tenancy</h5>
</div>
{% render_field form.tenant_group %}
{% render_field form.tenant %}
</div>
<div class="field-group">
<h5 class="text-center">Dimensions</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Dimensions</h5>
</div>
{% render_field form.type %}
{% render_field form.width %}
{% render_field form.u_height %}
@ -48,7 +56,9 @@
</div>
{% if form.custom_fields %}
<div class="field-group">
<h5 class="text-center">Custom Fields</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Custom Fields</h5>
</div>
{% render_custom_fields form %}
</div>
{% endif %}

View File

@ -2,17 +2,18 @@
{% load form_helpers %}
{% block form %}
<div class="card">
<h5 class="card-header">Virtual Chassis</h5>
<div class="card-body">
<div class="field-group">
<div class="row mb-2">
<h5 class="offset-sm-3">Virtual Chassis</h5>
</div>
{% render_field form.name %}
{% render_field form.domain %}
{% render_field form.tags %}
</div>
<div class="field-group">
<div class="row mb-2">
<h5 class="offset-sm-3">Member Devices</h5>
</div>
<div class="card">
<h5 class="card-header">Member Devices</h5>
<div class="card-body">
{% render_field form.region %}
{% render_field form.site_group %}
{% render_field form.site %}
@ -20,13 +21,12 @@
{% render_field form.members %}
{% render_field form.initial_position %}
</div>
</div>
{% if form.custom_fields %}
<div class="card">
<h5 class="card-header">Custom Fields</h5>
<div class="card-body">
{% render_custom_fields form %}
<div class="field-group">
<div class="row mb-2">
<h5 class="offset-sm-3">Custom Fields</h5>
</div>
{% render_custom_fields form %}
</div>
{% endif %}
{% endblock %}

View File

@ -2,33 +2,34 @@
{% load helpers %}
{% load form_helpers %}
{% block title %}{% if vc_form.instance %}Editing Virtual Chassis {{ vc_form.instance }}{% else %}New Virtual Chassis{% endif %}{% endblock %}
{% block title %}Editing Virtual Chassis {{ vc_form.instance }}{% endblock %}
{% block content %}
{% block content-wrapper %}
<div class="tab-content">
<div class="tab-pane show active" id="edit-form" role="tabpanel" aria-labelledby="object-list-tab">
<form action="" method="post" enctype="multipart/form-data" class="form-object-edit">
{% csrf_token %}
{{ pk_form.pk }}
{{ formset.management_form }}
<div class="card">
<h5 class="card-header">Virtual Chassis</h5>
<div class="card-body">
<div class="field-group">
<div class="row mb-2">
<h5 class="offset-sm-3">Virtual Chassis</h5>
</div>
{% render_field vc_form.name %}
{% render_field vc_form.domain %}
{% render_field vc_form.master %}
{% render_field vc_form.tags %}
</div>
</div>
{% if vc_form.custom_fields %}
<div class="card">
<h5 class="card-header">Custom Fields</h5>
<div class="card-body">
<div class="field-group">
<div class="row mb-2">
<h5 class="offset-sm-3">Custom Fields</h5>
</div>
{% render_custom_fields vc_form %}
</div>
</div>
{% endif %}
<div class="card">
<h5 class="card-header">Members</h5>
<div class="card-body">
<div class="field-group mb-5">
<h5 class="text-center">Members</h5>
<table class="table">
<thead>
<tr>
@ -85,7 +86,6 @@
</tbody>
</table>
</div>
</div>
<div class="text-end">
<a href="{{ return_url }}" class="btn btn-outline-danger">Cancel</a>
{% if vc_form.instance.pk %}
@ -95,4 +95,6 @@
{% endif %}
</div>
</form>
</div>
</div>
{% endblock %}

View File

@ -43,7 +43,9 @@
{# Render grouped fields according to Form #}
{% for group, fields in form.Meta.fieldsets %}
<div class="field-group">
<h5 class="text-center">{{ group }}</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">{{ group }}</h5>
</div>
{% for name in fields %}
{% render_field form|getfield:name %}
{% endfor %}
@ -52,7 +54,9 @@
{% if form.custom_fields %}
<div class="field-group">
<h5 class="text-center">Custom Fields</h5>
<div class="row mb-1">
<h5 class="offset-sm-3">Custom Fields</h5>
</div>
{% render_custom_fields form %}
</div>
{% endif %}
@ -66,7 +70,6 @@
{% else %}
{# Render all fields in a single group #}
<div class="field-group">
<h5 class="text-center">{{ obj_type|capfirst }}</h5>
{% block form_fields %}{% render_form form %}{% endblock %}
</div>
{% endif %}

View File

@ -9,7 +9,9 @@
{% block form %}
<div class="field-group">
<h4 class="mb-3">IP Address</h4>
<div class="row mb-2">
<h5 class="offset-sm-3">IP Address</h5>
</div>
{% render_field form.address %}
{% render_field form.status %}
{% render_field form.role %}
@ -19,14 +21,20 @@
{% render_field form.tags %}
</div>
<div class="field-group">
<h4 class="mb-3">Tenancy</h4>
<div class="row mb-2">
<h5 class="offset-sm-3">Tenancy</h5>
</div>
{% render_field form.tenant_group %}
{% render_field form.tenant %}
</div>
<div class="field-group">
<h4 class="mb-3">Interface Assignment</h4>
<div class="row mb-2">
<h5 class="offset-sm-3">Interface Assignment</h5>
</div>
{% with vm_tab_active=form.initial.vminterface %}
<ul class="nav nav-tabs" role="tablist">
<div class="row mb-2">
<div class="offset-sm-3">
<ul class="nav nav-pills" role="tablist">
<li role="presentation" class="nav-item">
<button
role="tab"
@ -54,7 +62,9 @@
</button>
</li>
</ul>
<div class="tab-content">
</div>
</div>
<div class="tab-content p-0">
<div class="tab-pane {% if not vm_tab_active %}active{% endif %}" id="device" role="tabpanel" aria-labeled-by="device_tab">
{% render_field form.device %}
{% render_field form.interface %}
@ -63,13 +73,17 @@
{% render_field form.virtual_machine %}
{% render_field form.vminterface %}
</div>
</div>
{% endwith %}
{% render_field form.primary_for_parent %}
</div>
{% endwith %}
</div>
<div class="field-group">
<h4 class="mb-3">NAT IP (Inside)</h4>
<ul class="nav nav-tabs" role="tablist">
<div class="row mb-2">
<h5 class="offset-sm-3">NAT IP (Inside)</h5>
</div>
<div class="row mb-2">
<div class="offset-sm-3">
<ul class="nav nav-pills" role="tablist">
<li class="nav-item" role="presentation">
<button
role="tab"
@ -110,7 +124,9 @@
</button>
</li>
</ul>
<div class="tab-content">
</div>
</div>
<div class="tab-content p-0">
<div class="tab-pane active" id="by_device" aria-labelledby="device_tab" role="tabpanel">
{% render_field form.nat_region %}
{% render_field form.nat_site_group %}
@ -130,7 +146,9 @@
</div>
{% if form.custom_fields %}
<div class="field-group">
<h4 class="mb-3">Custom Fields</h4>
<div class="row mb-2">
<h5 class="offset-sm-3">Custom Fields</h5>
</div>
{% render_custom_fields form %}
</div>
{% endif %}

View File

@ -3,7 +3,9 @@
{% block form %}
<div class="field-group">
<h5 class="text-center">Service</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Service</h5>
</div>
{% if obj.device %}
<div class="row mb-3">
<label class="col-sm-3 col-form-label text-lg-end">Device</label>
@ -35,17 +37,14 @@
<span class="form-text">{{ form.ports.help_text }}</span>
</div>
</div>
{% render_field form.ipaddresses %}
{% render_field form.description %}
{% render_field form.tags %}
</div>
{% if form.custom_fields %}
<div class="card">
<h5 class="card-header">Custom Fields</h5>
<div class="card-body">
<div class="row mb-2">
<h5 class="offset-sm-3">Custom Fields</h5>
</div>
{% render_custom_fields form %}
</div>
</div>
{% endif %}
{% endblock %}

View File

@ -5,7 +5,9 @@
{% block form %}
<div class="field-group mb-3">
<h5 class="text-center">VLAN</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">VLAN</h5>
</div>
{% render_field form.vid %}
{% render_field form.name %}
{% render_field form.status %}
@ -14,14 +16,20 @@
{% render_field form.tags %}
</div>
<div class="field-group mb-3">
<h5 class="text-center">Tenancy</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Tenancy</h5>
</div>
{% render_field form.tenant_group %}
{% render_field form.tenant %}
</div>
<div class="field-group mb-3">
<h5 class="text-center">Assignment</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Assignment</h5>
</div>
{% with site_tab_active=form.initial.site %}
<ul class="nav nav-tabs" role="tablist">
<div class="row mb-2">
<div class="offset-sm-3">
<ul class="nav nav-pills" role="tablist">
<li class="nav-item" role="presentation">
<a class="nav-link{% if not site_tab_active %} active{% endif %}" href="#group" role="tab" data-bs-toggle="tab">VLAN Group</a>
</li>
@ -29,7 +37,9 @@
<a class="nav-link{% if site_tab_active %} active{% endif %}" href="#site" role="tab" data-bs-toggle="tab">Site</a>
</li>
</ul>
<div class="tab-content">
</div>
</div>
<div class="tab-content p-0">
<div class="tab-pane{% if not site_tab_active %} active{% endif %}" id="group">
{% render_field form.scope_type %}
{% render_field form.group %}
@ -44,7 +54,9 @@
</div>
{% if form.custom_fields %}
<div class="field-group">
<h5 class="text-center">Custom Fields</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Custom Fields</h5>
</div>
{% render_custom_fields form %}
</div>
{% endif %}

View File

@ -1,30 +0,0 @@
{% extends 'generic/object_edit.html' %}
{% load form_helpers %}
{% load helpers %}
{% block form %}
<div class="field-group">
<h5 class="text-center">VLAN Group</h5>
{% render_field form.name %}
{% render_field form.slug %}
{% render_field form.description %}
</div>
<div class="field-group">
<h5 class="text-center">Scope</h5>
{% render_field form.scope_type %}
{% render_field form.region %}
{% render_field form.sitegroup %}
{% render_field form.site %}
{% render_field form.location %}
{% render_field form.rack %}
{% render_field form.clustergroup %}
{% render_field form.cluster %}
</div>
{% if form.custom_fields %}
<div class="field-group">
<h5 class="text-center">Custom Fields</h5>
{% render_custom_fields form %}
</div>
{% endif %}
{% endblock %}

View File

@ -3,7 +3,9 @@
{% block form %}
<div class="field-group">
<h5 class="text-center">Interface</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Interface</h5>
</div>
{% if form.instance.virtual_machine %}
<div class="row mb-3">
<label class="col-sm-3 col-form-label text-lg-end required" for="id_device">Virtual Machine</label>
@ -19,10 +21,11 @@
{% render_field form.mtu %}
{% render_field form.description %}
{% render_field form.tags %}
</div>
<div class="field-group">
<h5 class="text-center">802.1Q Switching</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">802.1Q Switching</h5>
</div>
{% render_field form.mode %}
{% render_field form.vlan_group %}
{% render_field form.untagged_vlan %}
@ -30,7 +33,9 @@
</div>
{% if form.custom_fields %}
<div class="field-group">
<h5 class="text-center">Custom Fields</h5>
<div class="row mb-2">
<h5 class="offset-sm-3">Custom Fields</h5>
</div>
{% render_custom_fields form %}
</div>
{% endif %}