Design the scenario create method

design scenario create method in modal way.
design scenario page.
Add,delete for installers,versions, projects, customs, trust
indicators and scores are implemented.
tests are not included. validations are not added.

Change-Id: I999229c00869fcd5a4efa97cb2679a08fc24b271
Signed-off-by: thuva4 <tharma.thuva@gmail.com>

1 files changed, 60 insertions, 0 deletions

diff --git a/testapi/opnfv_testapi/ui/components/scenarios/scenarios.html b/testapi/opnfv_testapi/ui/components/scenarios/scenarios.html
new file mode 100644
index 0000000..75a21b7
--- /dev/null
+++ b/testapi/opnfv_testapi/ui/components/scenarios/scenarios.html
@@ -0,0 +1,60 @@
+<h3>Scenarios</h3>
+<div class="row" style="margin-bottom:24px;"></div>
+<div class="row podsTable" style="vertical-align:middle">
+    <div class="col-sm-1 pull-right" ng-class="{ 'hidden': !auth.isAuthenticated }" >
+        <button type="button" class="btn btn-danger" ng-click="ctrl.openBatchDeleteModal()">
+              <i class="fa fa-minus"></i> Delete</button>
+    </div>
+    <div class="col-sm-2 pull-right"  ng-class="{ 'hidden': !auth.isAuthenticated}">
+        <button type="button" class="btn btn-success" ng-click="ctrl.openScenarioModal()">
+          <i class="fa fa-plus"></i>Create&nbsp;Scenario</button>
+    </div>
+</div>
+<div class='clo-md-12'>
+    <div ng-show="ctrl.showError" class="alert alert-danger" role="alert">
+        <span class="pull-right">&nbsp;{{ctrl.error}}</span>
+        <span class="glyphicon glyphicon-exclamation-sign pull-right" aria-hidden="true" >Error:</span>
+    </div>
+    <div ng-show="ctrl.showCreateSuccess" class="alert alert-success" role="alert">
+        <span class="pull-right">&nbsp;{{ctrl.success}}</span>
+        <span class="glyphicon glyphicon-ok pull-right" aria-hidden="true"></span>
+    </div>
+</div>
+<div class='clo-md-12' style="padding-right:0px">
+    <div class="table-responsive">
+        <table class="table table-bordered table-hover"  ng-data="ctrl.data.scenarios">
+        <thead>
+        <tr style="
+        text-align: center;">
+            <th style="width: 1%;">Bulk&nbsp;Select</th>
+            <th style="width: 80%;">Name</th>
+            <th style="width: 19%;" ng-class="{'hidden': !auth.isAuthenticated}">Operations</th>
+        </tr>
+        </thead>
+        <tbody>
+        <tr ng-repeat-start="(index, scenario) in ctrl.data.scenarios" style="padding:9px">
+            <td>
+                <div class="text-center">
+                    <input type="checkbox" value="{{scenario.name}}"  ng-model="ctrl.checkBox[index]" >
+                </div>
+            </td>
+            <td>
+                <a class="text-info" ng-click="ctrl.viewScenario(scenario.name)">
+                    {{scenario.name}}
+                </a>
+            </td>
+            <td ng-class="{'hidden': !auth.isAuthenticated}">
+                <span class="podsTable-col">
+                    <a class="text-warning" ng-click="ctrl.openUpdateModal(scenario.name)" title="Edit Name">
+                        <i class="fa fa-pencil-square-o"></i></a>
+                    <a class="text-danger"  ng-click="ctrl.openDeleteModal(scenario.name)" title="Delete">
+                        <i class="fa fa-trash-o"></i></a>
+                </span>
+            </td>
+        <tr ng-repeat-end=>
+        </tr>
+        </tbody>
+        </table>
+    </div>
+</div>
+