mirror of
https://github.com/netbox-community/netbox.git
synced 2025-07-22 03:56:53 -06:00
Added colored labels for device and rack roles
This commit is contained in:
parent
b2f03dfb16
commit
a89fb734a0
@ -1,7 +1,7 @@
|
|||||||
import django_tables2 as tables
|
import django_tables2 as tables
|
||||||
from django_tables2.utils import Accessor
|
from django_tables2.utils import Accessor
|
||||||
|
|
||||||
from utilities.tables import BaseTable, ToggleColumn
|
from utilities.tables import BaseTable, ColorColumn, ToggleColumn
|
||||||
|
|
||||||
from .models import (
|
from .models import (
|
||||||
ConsolePort, ConsolePortTemplate, ConsoleServerPortTemplate, Device, DeviceBayTemplate, DeviceRole, DeviceType,
|
ConsolePort, ConsolePortTemplate, ConsoleServerPortTemplate, Device, DeviceBayTemplate, DeviceRole, DeviceType,
|
||||||
@ -108,7 +108,7 @@ class RackRoleTable(BaseTable):
|
|||||||
pk = ToggleColumn()
|
pk = ToggleColumn()
|
||||||
name = tables.LinkColumn(verbose_name='Name')
|
name = tables.LinkColumn(verbose_name='Name')
|
||||||
rack_count = tables.Column(verbose_name='Racks')
|
rack_count = tables.Column(verbose_name='Racks')
|
||||||
color = tables.Column(verbose_name='Color')
|
color = ColorColumn(verbose_name='Color')
|
||||||
slug = tables.Column(verbose_name='Slug')
|
slug = tables.Column(verbose_name='Slug')
|
||||||
actions = tables.TemplateColumn(template_code=RACKROLE_ACTIONS, attrs={'td': {'class': 'text-right'}},
|
actions = tables.TemplateColumn(template_code=RACKROLE_ACTIONS, attrs={'td': {'class': 'text-right'}},
|
||||||
verbose_name='')
|
verbose_name='')
|
||||||
@ -258,14 +258,14 @@ class DeviceRoleTable(BaseTable):
|
|||||||
pk = ToggleColumn()
|
pk = ToggleColumn()
|
||||||
name = tables.LinkColumn(verbose_name='Name')
|
name = tables.LinkColumn(verbose_name='Name')
|
||||||
device_count = tables.Column(verbose_name='Devices')
|
device_count = tables.Column(verbose_name='Devices')
|
||||||
|
color = ColorColumn(verbose_name='Color')
|
||||||
slug = tables.Column(verbose_name='Slug')
|
slug = tables.Column(verbose_name='Slug')
|
||||||
color = tables.Column(verbose_name='Color')
|
|
||||||
actions = tables.TemplateColumn(template_code=DEVICEROLE_ACTIONS, attrs={'td': {'class': 'text-right'}},
|
actions = tables.TemplateColumn(template_code=DEVICEROLE_ACTIONS, attrs={'td': {'class': 'text-right'}},
|
||||||
verbose_name='')
|
verbose_name='')
|
||||||
|
|
||||||
class Meta(BaseTable.Meta):
|
class Meta(BaseTable.Meta):
|
||||||
model = DeviceRole
|
model = DeviceRole
|
||||||
fields = ('pk', 'name', 'device_count', 'slug', 'color', 'actions')
|
fields = ('pk', 'name', 'device_count', 'color', 'slug', 'actions')
|
||||||
|
|
||||||
|
|
||||||
#
|
#
|
||||||
|
@ -294,27 +294,39 @@ ul.rack_near_face li.empty:hover a {
|
|||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Rack elevation colors (from http://flatuicolors.com) */
|
/* Colors (from http://flatuicolors.com) */
|
||||||
.teal { background-color: #1abc9c; border-bottom: 1px solid #16a085; }
|
.teal { background-color: #1abc9c; }
|
||||||
.teal:hover { background-color: #16a085; }
|
.green { background-color: #2ecc71; }
|
||||||
.green { background-color: #2ecc71; border-bottom: 1px solid #27ae60; }
|
.blue { background-color: #3498db; }
|
||||||
.green:hover { background-color: #27ae60; }
|
.purple { background-color: #9b59b6; }
|
||||||
.blue { background-color: #3498db; border-bottom: 1px solid #2980b9; }
|
.yellow { background-color: #f1c40f; }
|
||||||
.blue:hover { background-color: #2980b9; }
|
.orange { background-color: #e67e22; }
|
||||||
.purple { background-color: #9b59b6; border-bottom: 1px solid #8e44ad; }
|
.red { background-color: #e74c3c; }
|
||||||
.purple:hover { background-color: #8e44ad; }
|
.light_gray { background-color: #dce2e3; }
|
||||||
.yellow { background-color: #f1c40f; border-bottom: 1px solid #f39c12; }
|
.medium_gray { background-color: #95a5a6; }
|
||||||
.yellow:hover { background-color: #f39c12; }
|
.dark_gray { background-color: #34495e; }
|
||||||
.orange { background-color: #e67e22; border-bottom: 1px solid #d35400; }
|
|
||||||
.orange:hover { background-color: #d35400; }
|
/* Rack elevation coloring */
|
||||||
.red { background-color: #e74c3c; border-bottom: 1px solid #c0392b; }
|
ul.rack .teal { border-bottom: 1px solid #16a085; }
|
||||||
.red:hover { background-color: #c0392b; }
|
ul.rack .teal:hover { background-color: #16a085; }
|
||||||
.light_gray { background-color: #dce2e3; border-bottom: 1px solid #bdc3c7; }
|
ul.rack .green { border-bottom: 1px solid #27ae60; }
|
||||||
.light_gray:hover { background-color: #bdc3c7; }
|
ul.rack .green:hover { background-color: #27ae60; }
|
||||||
.medium_gray { background-color: #95a5a6; border-bottom: 1px solid #7f8c8d; }
|
ul.rack .blue { border-bottom: 1px solid #2980b9; }
|
||||||
.medium_gray:hover { background-color: #7f8c8d; }
|
ul.rack .blue:hover { background-color: #2980b9; }
|
||||||
.dark_gray { background-color: #34495e; border-bottom: 1px solid #2c3e50; }
|
ul.rack .purple { border-bottom: 1px solid #8e44ad; }
|
||||||
.dark_gray:hover { background-color: #2c3e50; }
|
ul.rack .purple:hover { background-color: #8e44ad; }
|
||||||
|
ul.rack .yellow { border-bottom: 1px solid #f39c12; }
|
||||||
|
ul.rack .yellow:hover { background-color: #f39c12; }
|
||||||
|
ul.rack .orange { border-bottom: 1px solid #d35400; }
|
||||||
|
ul.rack .orange:hover { background-color: #d35400; }
|
||||||
|
ul.rack .red { border-bottom: 1px solid #c0392b; }
|
||||||
|
ul.rack .red:hover { background-color: #c0392b; }
|
||||||
|
ul.rack .light_gray { border-bottom: 1px solid #bdc3c7; }
|
||||||
|
ul.rack .light_gray:hover { background-color: #bdc3c7; }
|
||||||
|
ul.rack .medium_gray { border-bottom: 1px solid #7f8c8d; }
|
||||||
|
ul.rack .medium_gray:hover { background-color: #7f8c8d; }
|
||||||
|
ul.rack .dark_gray { border-bottom: 1px solid #2c3e50; }
|
||||||
|
ul.rack .dark_gray:hover { background-color: #2c3e50; }
|
||||||
|
|
||||||
/* Misc */
|
/* Misc */
|
||||||
.banner-bottom {
|
.banner-bottom {
|
||||||
|
@ -28,3 +28,10 @@ class ToggleColumn(tables.CheckBoxColumn):
|
|||||||
@property
|
@property
|
||||||
def header(self):
|
def header(self):
|
||||||
return mark_safe('<input type="checkbox" name="_all" title="Select all" />')
|
return mark_safe('<input type="checkbox" name="_all" title="Select all" />')
|
||||||
|
|
||||||
|
|
||||||
|
class ColorColumn(tables.Column):
|
||||||
|
|
||||||
|
def render(self, record):
|
||||||
|
html = '<label class="label {}">{}</label>'.format(record.color, record.get_color_display())
|
||||||
|
return mark_safe(html)
|
||||||
|
Loading…
Reference in New Issue
Block a user