Created the view function for the pods page.
It will redirect to pods/:name page where user
can see the more details about the pod.
Change-Id: I0d6c06098fd78ecca523a49e2bb532001adaeaa8
Signed-off-by: thuva4 <tharma.thuva@gmail.com>
vertical-align: middle;
}
-.podTable-col {
+.podsTable-col {
font-size: 20px !important;
}
-.podTable-col a:not(:first-child) {
+.podsTable-col a:not(:first-child) {
margin-left: 10px;
}
-.podTable {
+.podsTable {
padding: 10px 0;
margin: 10px 0;
background-color: #fff;
}
-.podTable .search {
+.podsTable .search {
width: 150px;
}
-.podTable >div {
+.podsTable >div {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: right;
margin: 10px 0;
-}
\ No newline at end of file
+}
+
+.podsTableTd {
+ border-top:none!important;
+ float: right!important;
+ padding-bottom:0px!important;
+ font-weight:bold;
+}
+
+.podsTableLeftTd{
+ border-top:none!important;
+ padding-bottom:0px!important;
+}
templateUrl: 'testapi-ui/components/pods/pods.html',
controller: 'PodsController as ctrl'
}).
+ state('pod', {
+ url: '/pods/:name',
+ templateUrl: 'testapi-ui/components/pods/pod/pod.html',
+ controller: 'PodController as ctrl'
+ }).
state('projects', {
url: '/projects',
templateUrl: 'testapi-ui/components/projects/projects.html',
--- /dev/null
+<legend>Pod</legend>
+<div style="padding-right:0px">
+ <div class="table-responsive">
+ <table class="table" ng-data="ctrl.data.pods">
+ <tbody>
+ <tr style="padding:9px">
+ <td class="podsTableTd">Id :</td>
+ <td class="podsTableLeftTd">{{ctrl.data._id}}</td>
+ </tr>
+ <tr style="padding:9px">
+ <td class="podsTableTd">Name :</td>
+ <td width="90%" class="podsTableLeftTd">{{ctrl.data.name}}</td>
+ </tr>
+ <tr style="padding:9px">
+ <td class="podsTableTd">Owner :</td>
+ <td width="90%" class="podsTableLeftTd">{{ctrl.data.owner}}</td>
+ </tr>
+ <tr style="padding:9px">
+ <td class="podsTableTd">Role :</td>
+ <td width="90%" class="podsTableLeftTd">{{ctrl.data.role}}</td>
+ </tr>
+ <tr style="padding:9px">
+ <td class="podsTableTd">Mode :</td>
+ <td width="90%" class="podsTableLeftTd">{{ctrl.data.mode}}</td>
+ </tr>
+ <tr style="padding:9px">
+ <td class="podsTableTd">Created at :</td>
+ <td width="90%" class="podsTableLeftTd">{{ctrl.data['creation_date']}}</td>
+ </tr>
+ <tr style="padding:9px">
+ <td class="podsTableTd">Details :</td>
+ <td width="90%" class="podsTableLeftTd">{{ctrl.data.details}}</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+</div>
+<div class="col-md-12">
+ <div ng-show="ctrl.showError" class="col-md-12 alert alert-danger" role="alert">
+ <span class="pull-right"> {{ctrl.error}}</span>
+ <span class="glyphicon glyphicon-exclamation-sign pull-right" aria-hidden="true" >Error:</span>
+ </div>
+ <div ng-show="ctrl.showSuccess" class="col-md-12 alert alert-success" role="alert">
+ <span class="pull-right"> {{ctrl.success}}</span>
+ <span class="glyphicon glyphicon-ok pull-right" aria-hidden="true"></span>
+ </div>
+ </div>
\ No newline at end of file
--- /dev/null
+/*
+ * 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.
+ */
+
+(function () {
+ 'use strict';
+
+ angular
+ .module('testapiApp')
+ .controller('PodController', PodController);
+
+ PodController.$inject = [
+ '$scope', '$http', '$filter', '$state', '$window', '$uibModal', 'testapiApiUrl','raiseAlert',
+ 'confirmModal'
+ ];
+
+ /**
+ * TestAPI Pod Controller
+ * This controller is for the '/pod' page where a user can browse
+ * through pod declared in TestAPI.
+ */
+ function PodController($scope, $http, $filter, $state, $window, $uibModal, testapiApiUrl,
+ raiseAlert, confirmModal) {
+ var ctrl = this;
+ ctrl.url = testapiApiUrl + '/pods';
+ ctrl.name = $state.params['name'];
+ ctrl.loadDetails = loadDetails
+
+ /**
+ *Contact the testapi and retrevie the pod details
+ */
+ function loadDetails(){
+ var podUrl = ctrl.url + '/' + ctrl.name;
+ ctrl.showError = false;
+ ctrl.podsRequest =
+ $http.get(podUrl).success(function (data) {
+ ctrl.data = data;
+ }).catch(function (error) {
+ ctrl.data = null;
+ ctrl.showError = true;
+ ctrl.error = error.statusText;
+ });
+ }
+ ctrl.loadDetails();
+ }
+})();
\ No newline at end of file
<div cg-busy="{promise:ctrl.authRequest,message:'Loading'}"></div>
<div cg-busy="{promise:ctrl.podsRequest,message:'Loading'}"></div>
<br>
-<div class="row podTable" style="vertical-align:middle">
+<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>
text-align: center;">
<th>Bulk Select</th>
<th>Name</th>
- <th>Details</th>
<th>Role</th>
<th>Mode</th>
- <th>CreatedAt</th>
<th>Operation</th>
</tr>
</thead>
</div>
</td>
<td>{{pod.name}}</td>
- <td style="width:20%;">{{pod.details}}</td>
<td>{{pod.role}}</td>
<td>{{pod.mode}}</td>
<td>
- {{pod.creation_date}}
- </td>
- <td>
- <span class="podTable-col">
- <a class="text-warning" title="Edit" ng-class="{ 'hidden': !auth.isAuthenticated }" >
- <i class="fa fa-pencil-square-o"></i></a>
- <a class="text-danger" ng-click="ctrl.openDeleteModal(pod.name)" title="Delete" ng-class="{ 'hidden': !auth.isAuthenticated }">
- <i class="fa fa-trash-o"></i></a>
- <a class="text-info" ><i class="fa fa-eye"></i></a>
- </span>
+ <span class="podsTable-col">
+ <a class="text-warning" title="Edit" ng-class="{ 'hidden': !auth.isAuthenticated }" >
+ <i class="fa fa-pencil-square-o"></i></a>
+ <a class="text-danger" ng-click="ctrl.openDeleteModal(pod.name)" title="Delete" ng-class="{ 'hidden': !auth.isAuthenticated }">
+ <i class="fa fa-trash-o"></i></a>
+ <a class="text-info" ng-click="ctrl.viewPod(pod.name)"><i class="fa fa-eye"></i></a>
+ </span>
</td>
</tr>
<tr ng-repeat-end=>
ctrl.openCreateModal = openCreateModal
ctrl.podDelete = podDelete
ctrl.batchDelete = batchDelete;
+ ctrl.viewPod = viewPod
/**
* This is called when the date filter calendar is opened. It
});
}
+ function viewPod(name){
+ console.log('hello');
+ $state.go('pod', {'name':name}, {reload: true});
+ }
/**
* This will contact the TestAPI to delete a pod for given
* name.
<script src="testapi-ui/shared/alerts/alertModalFactory.js"></script>
<script src="testapi-ui/shared/alerts/confirmModalFactory.js"></script>
<script src="testapi-ui/components/pods/podsController.js"></script>
+ <script src="testapi-ui/components/pods/pod/podController.js"></script>
<script src="testapi-ui/components/projects/projectsController.js"></script>
<script src="testapi-ui/components/projects/project/projectController.js"></script>
<script src="testapi-ui/components/results/resultsController.js"></script>
Code Review / releng-testresults.git / commitdiff