network: more readable rule table

also disable a few column orderings

circle/network/static/network/network.less

@@ -11,3 +11,10 @@
   text-align: center;
   width: 60px;
 }
+
+#rule-list-table {
+  td {
+    text-align: center;
+    &:nth-child(2), &:nth-child(3) {text-align: left;}
+  }
+}

circle/network/tables.py

@@ -144,6 +144,7 @@ class RecordTable(Table):
     address = TemplateColumn(
         template_name="network/columns/records-address.html"
     )
+    ttl = Column(verbose_name=_("TTL"))
 
     class Meta:
         model = Record
@@ -167,16 +168,26 @@ class SmallRecordTable(Table):
 
 
 class RuleTable(Table):
-    r_type = LinkColumn('network.rule', args=[A('pk')])
+    r_type = LinkColumn(
+        'network.rule', args=[A('pk')],
+        verbose_name=_("type"),
+        orderable=False,
+    )
     color_desc = TemplateColumn(
-        template_name="network/columns/color-desc.html"
+        template_name="network/columns/rule-short-description.html",
+        verbose_name=_("Short description"),
+        orderable=False,
+    )
+    nat_external_port = Column(
+        verbose_name=_("NAT")
     )
 
     class Meta:
         model = Rule
-        attrs = {'class': 'table table-striped table-hover table-condensed'}
-        fields = ('r_type', 'color_desc', 'owner', 'extra', 'direction',
-                  'action', 'proto', 'sport', 'dport', 'nat',
+        attrs = {'class': 'table table-striped table-hover table-condensed',
+                 'id': "rule-list-table"}
+        fields = ('r_type', 'color_desc', 'extra', 'direction',
+                  'action', 'proto', 'dport',
                   'nat_external_port', )
         order_by = 'direction'
 
@@ -198,7 +209,7 @@ class VlanTable(Table):
     class Meta:
         model = Vlan
         attrs = {'class': 'table table-striped table-condensed'}
-        fields = ('vid', 'name', 'interface', 'network4', 'network6',
+        fields = ('vid', 'name', 'network4', 'network6',
                   'domain', )
         order_by = 'vid'
 

circle/network/templates/network/columns/_rule-type.html

+{% if record.r_type == "host" %}
+  {{ record.host.get_fqdn }}
+{% elif record.r_type == "vlan" %}
+  {{ record.vlan.name }}
+{% elif record.r_type == "vlangroup" %}
+  {{ record.vlangroup }} 
+  [{% for v in record.vlangroup.vlans.all %}
+    {{ v.name }}{% if not forloop.last %},{% endif %}
+  {% endfor %}]
+{% elif record.r_type == "group" %}
+  {{ record.hostgroup.name }}
+{% elif record.r_type == "firewall" %}
+  {{ record.firewall }}
+{% else %}
+  -
+{% endif %}

circle/network/templates/network/columns/color-desc.html

-{% load i18n %}
-{% load l10n %}
-
-{# <span style="color: #FF0000;">[{{ record.r_type }}]</span> #}
-{% if record.direction == "1" %}{{ record.foreign_network }}{% else %}{{ record.r_type }}{% endif %}
-{#<span style="color: #0000FF;"> ▸ </span>#}
-<i class="fa fa-arrow-right"></i>
-{% if record.direction == "0" %}{{ record.foreign_network }}{% else %}{{ record.r_type }}{% endif %}
-<span style="color: #00FF00;">
-    {% if record.proto %}
-        proto={{ record.proto }}
-    {% endif %}
-    {% if record.sport %}
-        sport={{ record.sport }}
-    {% endif %}
-    {% if record.dport %}
-        dport={{ record.dport }}
-    {% endif %}
-{{ record.description }}

circle/network/templates/network/columns/rule-short-description.html

+{% load i18n %}
+
+{% if record.direction == "in" %}
+  {{ record.foreign_network }}
+  [{% for v in record.foreign_network.vlans.all %}
+    {{ v.name }}{% if not forloop.last %},{% endif %}
+  {% endfor %}]
+{% else %}
+  {% include "network/columns/_rule-type.html" %}
+{% endif %}
+
+<i class="fa fa-arrow-right"></i>
+
+{% if record.direction == "out" %}
+  {{ record.foreign_network }}
+  [{% for v in record.foreign_network.vlans.all %}
+    {{ v.name }}{% if not forloop.last %},{% endif %}
+  {% endfor %}]
+{% else %}
+  {% include "network/columns/_rule-type.html" %}
+{% endif %}
+
+{% if record.nat %}
+  <span class="label label-success">NAT
+      [
+        {{record.nat_external_port}}
+        <i class="fa fa-arrow-right"></i>
+        {{ record.dport }}
+      ]
+      {{ record.proto|upper }}
+  </span>
+{% endif %}