NeoAnd/netbox
1
0
Fork 0
mirror of https://github.com/netbox-community/netbox.git synced 2025-07-23 17:08:41 -06:00
Code Issues Actions 9 Packages Projects Releases Wiki Activity

Fixes #7131: Only execute scope selector field visibility logic on specified views

Browse Source
This commit is contained in:
thatmattlove 2021-09-01 15:27:37 -07:00
parent 4b14b31853
commit 774dff07ee
3 changed files with 66 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
netbox/project-static/dist/netbox.js vendored
View File

Binary file not shown.

BIN
netbox/project-static/dist/netbox.js.map vendored
View File

Binary file not shown.

113
netbox/project-static/src/forms/scopeSelector.ts
View File

@ -1,8 +1,21 @@
import { getElements, toggleVisibility } from '../util'; import { getElements, toggleVisibility } from '../util';
type ShowHideMap = { type ShowHideMap = {
default: { hide: string[]; show: string[] }; /**
[k: string]: { hide: string[]; show: string[] }; * Name of view to which this map should apply.
*
* @example vlangroup_edit
*/
[view: string]: {
/**
* Default layout.
*/
default: { hide: string[]; show: string[] };
/**
* Field name to layout mapping.
*/
[fieldName: string]: { hide: string[]; show: string[] };
};
}; };
/** /**
@ -14,45 +27,47 @@ type ShowHideMap = {
* showHideMap.region.show should be shown. * showHideMap.region.show should be shown.
*/ */
const showHideMap: ShowHideMap = { const showHideMap: ShowHideMap = {
region: { vlangroup_edit: {
hide: ['id_sitegroup', 'id_site', 'id_location', 'id_rack', 'id_clustergroup', 'id_cluster'], region: {
show: ['id_region'], hide: ['id_sitegroup', 'id_site', 'id_location', 'id_rack', 'id_clustergroup', 'id_cluster'],
}, show: ['id_region'],
'site group': { },
hide: ['id_region', 'id_site', 'id_location', 'id_rack', 'id_clustergroup', 'id_cluster'], 'site group': {
show: ['id_sitegroup'], hide: ['id_region', 'id_site', 'id_location', 'id_rack', 'id_clustergroup', 'id_cluster'],
}, show: ['id_sitegroup'],
site: { },
hide: ['id_location', 'id_rack', 'id_clustergroup', 'id_cluster'], site: {
show: ['id_region', 'id_sitegroup', 'id_site'], hide: ['id_location', 'id_rack', 'id_clustergroup', 'id_cluster'],
}, show: ['id_region', 'id_sitegroup', 'id_site'],
location: { },
hide: ['id_rack', 'id_clustergroup', 'id_cluster'], location: {
show: ['id_region', 'id_sitegroup', 'id_site', 'id_location'], hide: ['id_rack', 'id_clustergroup', 'id_cluster'],
}, show: ['id_region', 'id_sitegroup', 'id_site', 'id_location'],
rack: { },
hide: ['id_clustergroup', 'id_cluster'], rack: {
show: ['id_region', 'id_sitegroup', 'id_site', 'id_location', 'id_rack'], hide: ['id_clustergroup', 'id_cluster'],
}, show: ['id_region', 'id_sitegroup', 'id_site', 'id_location', 'id_rack'],
'cluster group': { },
hide: ['id_region', 'id_sitegroup', 'id_site', 'id_location', 'id_rack', 'id_cluster'], 'cluster group': {
show: ['id_clustergroup'], hide: ['id_region', 'id_sitegroup', 'id_site', 'id_location', 'id_rack', 'id_cluster'],
}, show: ['id_clustergroup'],
cluster: { },
hide: ['id_region', 'id_sitegroup', 'id_site', 'id_location', 'id_rack'], cluster: {
show: ['id_clustergroup', 'id_cluster'], hide: ['id_region', 'id_sitegroup', 'id_site', 'id_location', 'id_rack'],
}, show: ['id_clustergroup', 'id_cluster'],
default: { },
hide: [ default: {
'id_region', hide: [
'id_sitegroup', 'id_region',
'id_site', 'id_sitegroup',
'id_location', 'id_site',
'id_rack', 'id_location',
'id_clustergroup', 'id_rack',
'id_cluster', 'id_clustergroup',
], 'id_cluster',
show: [], ],
show: [],
},
}, },
}; };
/** /**
@ -76,11 +91,11 @@ function toggleParentVisibility(query: string, action: 'show' | 'hide') {
/** /**
* Handle changes to the Scope Type field. * Handle changes to the Scope Type field.
*/ */
function handleScopeChange(element: HTMLSelectElement) { function handleScopeChange<P extends keyof ShowHideMap>(view: P, element: HTMLSelectElement) {
// Scope type's innerText looks something like `DCIM > region`. // Scope type's innerText looks something like `DCIM > region`.
const scopeType = element.options[element.selectedIndex].innerText.toLowerCase(); const scopeType = element.options[element.selectedIndex].innerText.toLowerCase();
for (const [scope, fields] of Object.entries(showHideMap)) { for (const [scope, fields] of Object.entries(showHideMap[view])) {
// If the scope type ends with the specified scope, toggle its field visibility according to // If the scope type ends with the specified scope, toggle its field visibility according to
// the show/hide values. // the show/hide values.
if (scopeType.endsWith(scope)) { if (scopeType.endsWith(scope)) {
@ -94,7 +109,7 @@ function handleScopeChange(element: HTMLSelectElement) {
break; break;
} else { } else {
// Otherwise, hide all fields. // Otherwise, hide all fields.
for (const field of showHideMap.default.hide) { for (const field of showHideMap[view].default.hide) {
toggleParentVisibility(`#${field}`, 'hide'); toggleParentVisibility(`#${field}`, 'hide');
} }
} }
@ -105,8 +120,12 @@ function handleScopeChange(element: HTMLSelectElement) {
* Initialize scope type select event listeners. * Initialize scope type select event listeners.
*/ */
export function initScopeSelector(): void { export function initScopeSelector(): void {
for (const element of getElements<HTMLSelectElement>('#id_scope_type')) { for (const view of Object.keys(showHideMap)) {
handleScopeChange(element); for (const element of getElements<HTMLSelectElement>(
element.addEventListener('change', () => handleScopeChange(element)); `html[data-netbox-url-name="${view}"] #id_scope_type`,
)) {
handleScopeChange(view, element);
element.addEventListener('change', () => handleScopeChange(view, element));
}
} }
} }