diff options
author | Sawyer Bergeron <sbergeron@iol.unh.edu> | 2019-04-09 16:30:57 -0400 |
---|---|---|
committer | Parker Berberian <pberberian@iol.unh.edu> | 2019-05-03 11:48:22 -0400 |
commit | 8864dae63b9512835862aabbe7f288fbe3c661e0 (patch) | |
tree | 9a85c3f2759e2e6e6dd375b7a17c7d2e8331f05c /dashboard/src/templates/config_bundle | |
parent | d26781393ba3827b698e89573ace06ace4240f95 (diff) |
Implement OPNFV workflow
This is a counterpart to an update to network models,
and allows for configuring baremetal OPNFV and Openstack deploys
Change-Id: I0185dbfa6c9105d7e63a7e7d7dd1f5cf228a8877
Signed-off-by: Sawyer Bergeron <sbergeron@iol.unh.edu>
Signed-off-by: Parker Berberian <pberberian@iol.unh.edu>
Diffstat (limited to 'dashboard/src/templates/config_bundle')
6 files changed, 182 insertions, 136 deletions
diff --git a/dashboard/src/templates/config_bundle/steps/assign_host_roles.html b/dashboard/src/templates/config_bundle/steps/assign_host_roles.html new file mode 100644 index 0000000..3ba7665 --- /dev/null +++ b/dashboard/src/templates/config_bundle/steps/assign_host_roles.html @@ -0,0 +1,22 @@ +{% extends "config_bundle/steps/table_formset.html" %} + +{% load bootstrap3 %} + +{% block table %} +<thead> + <tr> + <th>Host</th> + <th>Role</th> + </tr> +</thead> +<tbody> + {% for form in formset %} + <tr> + <td>{% bootstrap_field form.host_name show_label=False %}</td> + <td>{% bootstrap_field form.role show_label=False %}</td> + </tr> + {% endfor %} +</tbody> + +{{formset.management_form}} +{% endblock table %} diff --git a/dashboard/src/templates/config_bundle/steps/assign_network_roles.html b/dashboard/src/templates/config_bundle/steps/assign_network_roles.html new file mode 100644 index 0000000..0e887d6 --- /dev/null +++ b/dashboard/src/templates/config_bundle/steps/assign_network_roles.html @@ -0,0 +1,22 @@ +{% extends "config_bundle/steps/table_formset.html" %} + +{% load bootstrap3 %} + +{% block table %} +<thead> + <tr> + <th>Role</th> + <th>Network</th> + </tr> +</thead> +<tbody> + {% for form in formset %} + <tr> + <td>{% bootstrap_field form.role show_label=False %}</td> + <td>{% bootstrap_field form.network show_label=False %}</td> + </tr> + {% endfor %} +</tbody> + +{{formset.management_form}} +{% endblock table %} diff --git a/dashboard/src/templates/config_bundle/steps/config_software.html b/dashboard/src/templates/config_bundle/steps/config_software.html index e1f9541..b181c7e 100644 --- a/dashboard/src/templates/config_bundle/steps/config_software.html +++ b/dashboard/src/templates/config_bundle/steps/config_software.html @@ -8,58 +8,12 @@ <form action="/wf/workflow/" method="POST" id="software_config_form" class="form"> {% csrf_token %} <p>Give it a name:</p> - {{ form.name }} + {% bootstrap_field form.name %} <p>And a description:</p> - {{ form.description }} - <div id="hidden" style="display:none;"> - <p>Install OPNFV?</p> - {{ form.opnfv }} - <p>Choose your:</p> - <table> - <thead> - <tr> - <th>Installer</th> - <th>Scenario</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{form.installer}}</td> - <td>{{form.scenario}}</td> - </tr> - </tbody> - </table> - </div> - + {% bootstrap_field form.description %} </form> -<script> -var supported = {{supported|safe}}; -var installer_drop = document.getElementById("id_installer"); -installer_drop.addEventListener("change", filter); -var scenario_drop = document.getElementById("id_scenario"); -var scenario_options = {}; -for(var i=0; i<scenario_drop.options.length; i++){ - var option = scenario_drop.options[i]; - scenario_options[option.text] = option; -} - -scenario_drop.disabled=true; - -function filter(){ - //clear out existing options - while(scenario_drop.firstChild){ - scenario_drop.removeChild(scenario_drop.firstChild) - } - var installer = installer_drop.options[installer_drop.selectedIndex].text; - var options = supported[installer]; - for(var i=0; i<options.length; i++){ - scenario_drop.appendChild(scenario_options[options[i]]); - } - scenario_drop.disabled = false; -} -</script> {% endblock content %} diff --git a/dashboard/src/templates/config_bundle/steps/define_software.html b/dashboard/src/templates/config_bundle/steps/define_software.html index 8e7be91..ba1ff34 100644 --- a/dashboard/src/templates/config_bundle/steps/define_software.html +++ b/dashboard/src/templates/config_bundle/steps/define_software.html @@ -1,102 +1,55 @@ -{% extends "workflow/viewport-element.html" %} -{% load staticfiles %} +{% extends "config_bundle/steps/table_formset.html" %} {% load bootstrap3 %} +{% block table %} + <thead> + <tr> + <th>Device</th> + <th>Image</th> + <th>HeadNode</th> + </tr> + </thead> + <tbody> +{% for form in formset %} + <tr> + <td>{% bootstrap_field form.host_name show_label=False %}</td> + <td>{% bootstrap_field form.image show_label=False %}</td> + <td class="table_hidden_input_parent"> + <input id="radio_{{forloop.counter}}" class="my_radio" type="radio" name="headnode" value="{{forloop.counter}}"> + {{ form.headnode }} + </td> + </tr> +{% endfor %} +{{formset.management_form}} + +{% endblock table %} + +{% block tablejs %} +<script> + + document.getElementById("radio_{{headnode}}").checked = true; + +</script> +{% endblock tablejs %} -{% block extrahead %} - <!-- DataTables CSS --> - <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}" - rel="stylesheet"> - <!-- DataTables Responsive CSS --> - <link href="{% static "bower_components/datatables-responsive/css/dataTables.responsive.css" %}" rel="stylesheet"> -{% endblock extrahead %} - -{% block content %} -{% if error %} - <h1 style="text-align:center;">{{ error }}</h1> -{% else %} - <form style="width: 90%; margin: 5%;" method="post" action="" class="form" id="softwaredefinitionform"> - {% csrf_token %} - - <div class="row"> - <div class="col-lg-12"> - <div class="dataTables_wrapper"> - <table class="table table-striped table-bordered table-hover" id="table" cellspacing="0" - width="100%"> - - {% block table %} - <thead> - <tr> - <th>Device</th> - <th>Role</th> - <th>Image</th> - </tr> - </thead> - <tbody> - {% for form in formset %} - <tr> - {% for field in form %} - <td>{{ field }}</td> - {% endfor %} - </tr> - {% endfor %} - {{formset.management_form}} - - {% endblock table %} - - </table> - </div> - <!-- /.table-responsive --> - <!-- /.panel-body --> - <!-- /.panel --> - </div> - <!-- /.col-lg-12 --> - </div> - </form> - - <script> -function filter_images(){ - var filter_data = {{filter_data|safe}}; - for(var key in filter_data){ - var dropdown = document.getElementById(key); - var to_remove = filter_data[key]; - for(var i=0; i<to_remove.length; i++){ - for(var j=dropdown.children.length-1; j>=0; j--){ - if(dropdown.children[j].text == to_remove[i]){ - dropdown.removeChild(dropdown.children[j]); - } - } - } +{% block onleave %} +var parents = document.getElementsByClassName("table_hidden_input_parent"); +for(var i=0; i<parents.length; i++){ + var node = parents[i]; + var radio = node.getElementsByClassName("my_radio")[0]; + var checkbox = radio.nextElementSibling; + if(radio.checked){ + checkbox.value = "True"; } } -filter_images(); - </script> -{% endif %} -{% endblock content %} - -{% block extrajs %} - {{ block.super }} - <!-- DataTables JavaScript --> - - <script src={% static "bower_components/datatables/media/js/jquery.dataTables.min.js" %}></script> - <script src={% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js" %}></script> - - <script src={% static "js/dataTables-sort.js" %}></script> - - {% block tablejs %} - {% endblock tablejs %} -{% endblock extrajs %} - - -{% block onleave %} -var form = $("#softwaredefinitionform"); +var form = $("#table_formset"); var formData = form.serialize(); var req = new XMLHttpRequest(); req.open("POST", "/wf/workflow/", false); req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); req.onerror = function() { alert("problem with form submission"); } req.send(formData); -{% endblock %} +{% endblock onleave %} diff --git a/dashboard/src/templates/config_bundle/steps/pick_installer.html b/dashboard/src/templates/config_bundle/steps/pick_installer.html new file mode 100644 index 0000000..3b170d9 --- /dev/null +++ b/dashboard/src/templates/config_bundle/steps/pick_installer.html @@ -0,0 +1,32 @@ +{% extends "workflow/viewport-element.html" %} +{% load staticfiles %} + +{% load bootstrap3 %} + +{% block content %} + +{% if unavailable %} +<h1>Please choose a config bundle first</h1> +{% else %} + +<form id="installer_form" action="/wf/workflow/" method="POST" id="installer_config_form" class="form"> + {% csrf_token %} + <p>Choose your installer:</p> + {% bootstrap_field form.installer %} + <p>Choose your scenario:</p> + {% bootstrap_field form.scenario %} +</form> + +{% endif %} + +{% endblock content %} + +{% block onleave %} +var form = $("#installer_form"); +var formData = form.serialize(); +var req = new XMLHttpRequest(); +req.open("POST", "/wf/workflow/", false); +req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); +req.onerror = function() { alert("problem with form submission"); } +req.send(formData); +{% endblock %} diff --git a/dashboard/src/templates/config_bundle/steps/table_formset.html b/dashboard/src/templates/config_bundle/steps/table_formset.html new file mode 100644 index 0000000..ad2c5a3 --- /dev/null +++ b/dashboard/src/templates/config_bundle/steps/table_formset.html @@ -0,0 +1,63 @@ +{% extends "workflow/viewport-element.html" %} +{% load staticfiles %} + +{% load bootstrap3 %} + +{% block extrahead %} + <!-- DataTables CSS --> + <link href="{% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" %}" + rel="stylesheet"> + + <!-- DataTables Responsive CSS --> + <link href="{% static "bower_components/datatables-responsive/css/dataTables.responsive.css" %}" rel="stylesheet"> +{% endblock extrahead %} + +{% block content %} +{% if error %} + <h1 style="text-align:center;">{{ error }}</h1> +{% else %} +<div style="padding: 5%;"> + <form method="post" action="" class="form" id="table_formset"> + {% csrf_token %} + + <div class="row"> + <div class="col-lg-12"> + <div class="dataTables_wrapper"> + <table class="table table-striped table-bordered table-hover" id="table" cellspacing="0" width="100%"> + + {% block table %} + {% endblock table %} + + </table> + </div> + </div> + </div> + </form> +</div> + +{% endif %} +{% endblock content %} + +{% block extrajs %} + {{ block.super }} + <!-- DataTables JavaScript --> + + <script src={% static "bower_components/datatables/media/js/jquery.dataTables.min.js" %}></script> + <script src={% static "bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js" %}></script> + + <script src={% static "js/dataTables-sort.js" %}></script> + + {% block tablejs %} + {% endblock tablejs %} +{% endblock extrajs %} + + +{% block onleave %} +var form = $("#table_formset"); +var formData = form.serialize(); +var req = new XMLHttpRequest(); +req.open("POST", "/wf/workflow/", false); +req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); +req.onerror = function() { alert("problem with form submission"); } +req.send(formData); +{% endblock %} |