Monitoring: ns export metric; ns new alarm

Change-Id: Ie428b53d320d1a2cee67bb776dada7988d6d32d3
Signed-off-by: lombardofr <lombardo@everyup.it>
diff --git a/instancehandler/template/instance_list.html b/instancehandler/template/instance_list.html
index ff76215..9baae4c 100644
--- a/instancehandler/template/instance_list.html
+++ b/instancehandler/template/instance_list.html
@@ -47,6 +47,8 @@
     {% include 'modal/instance_create.html' %}
     {% include 'modal/instance_show.html' %}
     {% include 'modal/instance_new_action.html' %}
+    {% include 'modal/instance_new_alarm.html' %}
+    {% include 'modal/instance_export_metric.html' %}
 {% endblock %}
 
 {% block resource_block %}
diff --git a/instancehandler/template/instance_list_ns.html b/instancehandler/template/instance_list_ns.html
index 7743043..dd84d47 100644
--- a/instancehandler/template/instance_list_ns.html
+++ b/instancehandler/template/instance_list_ns.html
@@ -75,14 +75,21 @@
                             <ul class="dropdown-menu">
                                 <li><a href="#"
                                        onclick="javascript:performAction('{% url 'projects:instances:action' instance_id=i|get:'_id' project_id=project_id type=type %}')">
-                                    <i class="fa fa-magic"></i>Exec NS Primitive</a></li>
+                                    <i class="fa fa-magic"></i> Exec NS Primitive</a></li>
                                 <li>
                                     <a href="{% url 'projects:instances:ns_operations' project_id=project_id type=type instance_id=i|get:'_id' %}">
-                                        <i class="fa fa-list"></i>Active operations</a></li>
+                                        <i class="fa fa-list"></i> Active operations</a></li>
+                                <li class="divider"></li>
+                                <li><a href="#"
+                                       onclick="javascript:newAlarmNs('{% url 'projects:instances:ns_create_alarm' instance_id=i|get:'_id' project_id=project_id type=type %}')">
+                                    <i class="far fa-bell"></i> New Alarm</a></li>
+                                <li><a href="#"
+                                       onclick="javascript:exportMetricNs('{% url 'projects:instances:ns_export_metric' instance_id=i|get:'_id' project_id=project_id type=type %}')">
+                                    <i class="far fa-chart-bar"></i> Export metric</a></li>
                                 <li class="divider"></li>
                                 <li>
                                     <a href="javascript:deleteNs('{% url 'projects:instances:delete' instance_id=i|get:'_id' project_id=project_id type=type %}', true)">
-                                        <i class="far fa-trash-alt" style="color:red" ></i>Force delete</a></li>
+                                        <i class="far fa-trash-alt" style="color:red" ></i> Force delete</a></li>
                             </ul>
 
 
diff --git a/instancehandler/template/modal/instance_export_metric.html b/instancehandler/template/modal/instance_export_metric.html
new file mode 100644
index 0000000..cd3d1b5
--- /dev/null
+++ b/instancehandler/template/modal/instance_export_metric.html
@@ -0,0 +1,75 @@
+<div class="modal" id="modal_instance_export_metric" xmlns="http://www.w3.org/1999/html">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">×</span></button>
+                <h4 class="modal-title">Export metric</h4>
+            </div>
+
+            <form id="formExportMetricNS" action="" class="form-horizontal" method="post" enctype="multipart/form-data">
+                {% csrf_token %}
+                <div class="modal-body" id="modal_instance_export_metric">
+
+
+                    <div class="form-group">
+                        <label for="metric_name" class="col-sm-3">Name *</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="metric_name" name="metric_name" required>
+                        </div>
+                        <label for="metric_name" class="col-sm-3">Metric Name *</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="metric_name" name="metric_name" required>
+                        </div>
+                    </div>
+
+
+                    <div class="form-group">
+                        <label for="vnf_member_index" class="col-sm-3">VNF Member index *</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="vnf_member_index" name="vnf_member_index" required>
+                        </div>
+                        <label for="vdu_name" class="col-sm-3">VDU Name *</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="vdu_name" name="vdu_name" required>
+                        </div>
+                    </div>
+
+                    <div class="form-group">
+
+
+                        <label for="correlation_id" class="col-sm-3">Correlation</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="correlation_id" name="correlation_id" >
+                        </div>
+
+                    </div>
+                    <div class="form-group">
+                        <label for="collection_unit" class="col-sm-3">Collection Unit</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="collection_unit" name="collection_unit" >
+                        </div>
+                        <label for="collection_period" class="col-sm-3">Collection period </label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="collection_period" name="collection_period" >
+                        </div>
+
+                    </div>
+                    <div class="form-group">
+
+
+                    </div>
+
+
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Cancel</button>
+                    <button class="btn btn-primary pull-right">Create</button>
+                </div>
+            </form>
+
+        </div>
+        <!-- /.modal-content -->
+    </div>
+    <!-- /.modal-dialog -->
+</div>
diff --git a/instancehandler/template/modal/instance_new_alarm.html b/instancehandler/template/modal/instance_new_alarm.html
new file mode 100644
index 0000000..fe5fbfe
--- /dev/null
+++ b/instancehandler/template/modal/instance_new_alarm.html
@@ -0,0 +1,83 @@
+<div class="modal" id="modal_instance_new_alarm" xmlns="http://www.w3.org/1999/html">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">×</span></button>
+                <h4 class="modal-title">Create Alarm</h4>
+            </div>
+
+            <form id="formAlarmNS" action="" class="form-horizontal" method="post" enctype="multipart/form-data">
+                {% csrf_token %}
+                <div class="modal-body" id="modal_instance_new_alarm_body">
+
+
+                    <div class="form-group">
+                        <label for="alarm_name" class="col-sm-3">Name *</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="alarm_name" name="alarm_name" required>
+                        </div>
+                        <label for="metric_name" class="col-sm-3">Metric Name *</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="metric_name" name="metric_name" required>
+                        </div>
+                    </div>
+
+
+                    <div class="form-group">
+                        <label for="vnf_member_index" class="col-sm-3">VNF Member index *</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="vnf_member_index" name="vnf_member_index" required>
+                        </div>
+                        <label for="vdu_name" class="col-sm-3">VDU Name *</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="vdu_name" name="vdu_name" required>
+                        </div>
+                    </div>
+
+                    <div class="form-group">
+
+                        <label for="statistic" class="col-sm-3">Statistic *</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="statistic" name="statistic" required>
+                        </div>
+                        <label for="correlation_id" class="col-sm-3">Correlation</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="correlation_id" name="correlation_id" >
+                        </div>
+
+                    </div>
+                    <div class="form-group">
+                        <label for="threshold_value" class="col-sm-3">Threshold Value *</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="threshold_value" name="threshold_value" required>
+                        </div>
+                        <label for="statistic" class="col-sm-3">Severity</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="severity" name="severity" >
+                        </div>
+
+                    </div>
+                    <div class="form-group">
+                        <label for="operation" class="col-sm-3">Operation</label>
+                        <div class="col-sm-3">
+                            <input class="form-control input-sm" id="operation" name="operation" >
+                        </div>
+
+
+
+                    </div>
+
+
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Cancel</button>
+                    <button class="btn btn-primary pull-right">Create</button>
+                </div>
+            </form>
+
+        </div>
+        <!-- /.modal-content -->
+    </div>
+    <!-- /.modal-dialog -->
+</div>