Redesign the projects page & project page

redesign the projects page like pods page
included the delete, filter, create, edit,
batch delete in the projects page.
Unify the update modal for projects page and
project page.
Fix authenticate - fault opertaions

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

1 files changed, 62 insertions, 66 deletions

diff --git a/testapi/opnfv_testapi/ui/components/projects/projects.html b/testapi/opnfv_testapi/ui/components/projects/projects.html
index 28c08b1..e8bb947 100644
--- a/testapi/opnfv_testapi/ui/components/projects/projects.html
+++ b/testapi/opnfv_testapi/ui/components/projects/projects.html
@@ -1,76 +1,72 @@
 <h3>Projects</h3>
 
 <div class="row" style="margin-bottom:24px;"></div>
-<div class="project-create" ng-class="{ 'hidden': ! ((auth.projectNames.length>0) &&
-    auth.isAuthenticated) }">
-    <h4>Create</h4>
-    <div class="row">
-        <div ng-repeat="require in ctrl.createRequirements">
-            <div class="create-project" style="margin-left:24px;">
-                <p class="input-group">
-                    <label for="cpid">{{require.label|capitalize}}: </label>
-                    <a ng-if="require.type == 'text'">
-                        <input type="text" dynamic-model="'ctrl.' + require.label"/>
-                    </a>
-                    <a ng-if="require.type == 'textarea'">
-                        <textarea rows="2" cols="50" dynamic-model="'ctrl.' + require.label">
-                        </textarea>
-                    </a>
-                </p>
-            </div>
-        </div>
-        <div class="col-md-1 col-sm-1 col-xs-1 " style="margin-top:15px;">
-                <button type="submit" class="btn btn-primary" ng-click="ctrl.create()">Create</button>
-        </div>
-        <div class="col-md-11  col-sm-11 col-xs-11">
-            <div ng-show="ctrl.showCreateError" class="alert alert-danger" role="alert">
-                <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
-                <span class="sr-only">Error:</span>
-                {{ctrl.error}}
-            </div>
-            <div ng-show="ctrl.showCreateSuccess" class="alert alert-success" role="alert">
-                <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
-                Create Success
-            </div>
-        </div>
+<div class="row podsTable" style="vertical-align:middle">
+    <div class="col-sm-1 pull-right" ng-class="{ 'hidden': ! ((auth.projectNames.length>0) &&
+        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-1 pull-right"  ng-class="{ 'hidden': ! ((auth.projectNames.length>0) &&
+        auth.isAuthenticated) }">
+        <button type="button" class="btn btn-success" ng-click="ctrl.openCreateModal()">
+          <i class="fa fa-plus"></i> Create</button>
+    </div>
+    <div class="col-sm-1 pull-right">
+        <button type="button" class="btn btn-success" ng-click="ctrl.listProjects()">
+          <i class="fa fa-search"></i> Filter</button>
+    </div>
+    <div class="col-sm-3 pull-right">
+        <span style="margin-top:6px">Search:&nbsp;&nbsp;</span>
+        <input type="text" class="form-control search" ng-Model="ctrl.filterText" style="width:80%;" placeholder="Search By Name">
     </div>
 </div>
-
-
-<div class="project-filters">
-    <h4>Filters</h4>
-    <div class="row">
-        <div class="col-md-3">
-            <label for="cpid">Name</label>
-                <input type="text" class="form-control"
-                    ng-model="ctrl.filterName"/>
-        </div>
-        <div class="col-md-1" style="margin-top:24px;">
-            <button type="submit" class="btn btn-primary" ng-click="ctrl.update()">Filter</button>
-        </div>
-        <div class="col-md-1" style="margin-top:24px;">
-            <button type="submit" class="btn btn-primary btn-danger" ng-click="ctrl.clearFilters()">Clear</button>
-        </div>
-        <div class="col-md-7"  style="margin-top:10px;">
-            <div ng-show="ctrl.showUpdateError" class="alert alert-danger" role="alert">
-                <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
-                <span class="sr-only">Error:</span>
-                {{ctrl.error}}
-            </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 ng-show="ctrl.data" class="projects-table" style="margin-top:24px; margin-left:8px;">
-    <table ng-data="ctrl.data.projects" ng-show="ctrl.data" class="table table-striped table-hover">
+<div class='clo-md-12' style="padding-right:0px">
+    <div class="table-responsive">
+        <table class="table table-bordered table-hover"  ng-data="ctrl.data.projects">
+        <thead>
+        <tr style="
+        text-align: center;">
+            <th style="width: 1%;">Bulk Select</th>
+            <th style="width: 19%;">Name</th>
+            <th style="width: 70%;">Description</th>
+            <th style="width: 10%;">Operations</th>
+        </tr>
+        </thead>
         <tbody>
-            <tr ng-repeat-start="(index, project) in ctrl.data.projects">
-                <td>
-                    <a ui-sref='project({name: project.name})'>{{project.name}}</a>
-                </td>
-            </tr>
-            <tr ng-repeat-end=>
-            </tr>
+        <tr ng-repeat-start="(index, project) in ctrl.data.projects" style="padding:9px">
+            <td>
+            <div class="text-center">
+                    <input type="checkbox" value="{{project.name}}"  ng-model="ctrl.checkBox[index]" >
+                </div>
+            </td>
+            <td>{{project.name}}</td>
+            <td>{{project.description}}</td>
+            <td>
+                <span class="podsTable-col">
+                    <a class="text-warning" ng-click="ctrl.openUpdateModal(project.name)" title="Edit" ng-class="{'hidden': ! ((auth.projectNames.length>0) &&
+                        auth.isAuthenticated)}" >
+                        <i class="fa fa-pencil-square-o"></i></a>
+                    <a class="text-danger"  ng-click="ctrl.openDeleteModal(project.name)" title="Delete" ng-class="{'hidden': ! ((auth.projectNames.length>0) &&
+                        auth.isAuthenticated)}">
+                        <i class="fa fa-trash-o"></i></a>
+                    <a class="text-info" ng-click="ctrl.viewProject(project.name)"><i class="fa fa-eye"></i></a>
+                </span>
+            </td>
+        </tr>
+        <tr ng-repeat-end=>
+        </tr>
         </tbody>
-    </table>
+        </table>
+    </div>
 </div>
\ No newline at end of file