Improve Ports/Rules selection UI
Previously Ports tab in "Add Firewall Group" form and "Rules" tab in "Add Firewall Policy" provided poor UX. This commit improves them to more interactive UI as FWaaS v1 "Add Firewall Policy" form does. Note that static files are moved to static/neutron_fwaas_dashboard. If we place static files directly under 'static' directory, after collectstatic runs they cannot be distinguished from static files from horizon or other plugins. Change-Id: Ib1e3cd5f915a4e7b1277f5a79c43c5b6ad66c790 Closes-Bug: #1747506
This commit is contained in:
parent
2b281e03e3
commit
8c74c1e3eb
|
@ -21,7 +21,7 @@
|
|||
</div>
|
||||
<div class="help_text">
|
||||
{{ step.get_help_text }}
|
||||
<div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
|
|
@ -1,10 +1,12 @@
|
|||
{% load i18n %}
|
||||
|
||||
<noscript><h3>{{ step }}</h3></noscript>
|
||||
<div id="portListSortContainer">
|
||||
<div id="portListSortContainer" class="sort-container">
|
||||
<div class="col-sm-6">
|
||||
<h4 id="selected_port_label">{% trans "Selected Ports" %}</h4>
|
||||
<ul id="selected_port" class="portlist box-list"></ul>
|
||||
<h4>{% trans "Available Ports" %}</h4>
|
||||
<ul id="available_port" class="portlist"></ul>
|
||||
<ul id="available_port" class="portlist box-list"></ul>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
{% include "project/firewalls_v2/_update_port_help.html" %}
|
||||
|
@ -20,4 +22,14 @@
|
|||
<div class="help_text">
|
||||
{{ step.get_help_text }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
if (typeof $ !== 'undefined') {
|
||||
horizon.firewalls_v2.workflow_init($(".workflow"));
|
||||
} else {
|
||||
addHorizonLoadEvent(function() {
|
||||
horizon.firewalls_v2.workflow_init($(".workflow"));
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
{% load i18n %}
|
||||
|
||||
<noscript><h3>{{ step }}</h3></noscript>
|
||||
<div id="ruleListSortContainer">
|
||||
<div id="ruleListSortContainer" class="sort-container">
|
||||
<div class="col-sm-6">
|
||||
<h4 id="selected_rule_label">{% trans "Selected Rules" %}</h4>
|
||||
<ul id="selected_rule" class="rulelist"></ul>
|
||||
<ul id="selected_rule" class="rulelist box-list"></ul>
|
||||
<h4>{% trans "Available Rules" %}</h4>
|
||||
<ul id="available_rule" class="rulelist"></ul>
|
||||
<ul id="available_rule" class="rulelist box-list"></ul>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
{% include "project/firewalls_v2/_update_rule_help.html" %}
|
||||
|
@ -23,3 +23,13 @@
|
|||
{{ step.get_help_text }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
if (typeof $ !== 'undefined') {
|
||||
horizon.firewalls_v2.workflow_init($(".workflow"));
|
||||
} else {
|
||||
addHorizonLoadEvent(function() {
|
||||
horizon.firewalls_v2.workflow_init($(".workflow"));
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -17,3 +17,4 @@ FEATURE = 'neutron-fwaas-dashboard'
|
|||
|
||||
ADD_INSTALLED_APPS = ['neutron_fwaas_dashboard']
|
||||
AUTO_DISCOVER_STATIC_FILES = True
|
||||
ADD_SCSS_FILES = ['neutron_fwaas_dashboard/scss/firewalls.scss']
|
||||
|
|
|
@ -0,0 +1,21 @@
|
|||
/**
|
||||
* Licensed under the Apache License, Version 2.0 (the "License"); you may
|
||||
* not use this file except in compliance with the License. You may obtain
|
||||
* a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
||||
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
||||
* License for the specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
horizon.firewalls_v2 = {
|
||||
workflow_init: function() {
|
||||
// Initialise the drag and drop rule list
|
||||
horizon.lists.generate_html("port");
|
||||
horizon.lists.generate_html("rule");
|
||||
}
|
||||
};
|
|
@ -0,0 +1,7 @@
|
|||
@import "/dashboard/scss/components/resource_topology";
|
||||
|
||||
.sort-container {
|
||||
#selected_port {
|
||||
@include common_box_list_selected("port");
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue