Add details view & remove the code duplication

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

diff --git a/testapi/opnfv_testapi/ui/components/deploy-results/deploy-result/deployResult.html b/testapi/opnfv_testapi/ui/components/deploy-results/deploy-result/deployResult.html
index 82a0780..c0803ff 100644 (file)
--- a/testapi/opnfv_testapi/ui/components/deploy-results/deploy-result/deployResult.html
+++ b/testapi/opnfv_testapi/ui/components/deploy-results/deploy-result/deployResult.html
@@ -3,72 +3,16 @@
     <div class="table-responsive">
         <table class="table"  ng-data="ctrl.data.pods">
             <tbody>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Id&nbsp;:</td>
-                    <td class="podsTableLeftTd">{{ctrl.data._id}}</td>
-                </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Installer&nbsp;:</td>
-                    <td  width="90%" class="podsTableLeftTd">{{ctrl.data.installer}}</td>
-                </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Version&nbsp;:</td>
-                    <td  width="90%" class="podsTableLeftTd">{{ctrl.data.version}}</td>
-                </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Scenario&nbsp;:</td>
-                    <td width="90%" class="podsTableLeftTd">{{ctrl.data.scenario}}</td>
-                </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Pod&nbsp;Name&nbsp;:</td>
-                    <td  width="90%" class="podsTableLeftTd">{{ctrl.data.pod_name}}</td>
-                </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Criteria&nbsp;:</td>
-                    <td  width="90%" class="podsTableLeftTd">{{ctrl.data.criteria}}</td>
+                <tr ng-repeat-start="(index, detail) in ctrl.data_field"  style="padding:9px">
+                    <td class="podsTableTd">{{detail | capitalize}}&nbsp;:</td>
+                    <td width="86%" class="podsTableLeftTd">{{ctrl.data[index]}}</td>
                 </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Start&nbsp;Date&nbsp;:</td>
-                    <td  width="90%" class="podsTableLeftTd">{{ctrl.data.start_date}}</td>
-                </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Stop&nbsp;Date&nbsp;:</td>
-                    <td width="90%"  class="podsTableLeftTd">{{ctrl.data.stop_date}}</td>
-                </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Job&nbsp;Name&nbsp;:</td>
-                    <td width="90%" class="podsTableLeftTd">{{ctrl.data.job_name}}</td>
-                </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Build&nbsp;ID&nbsp;:</td>
-                    <td width="90%" class="podsTableLeftTd">{{ctrl.data['build_id']}}</td>
-                </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Upstream&nbsp;Job&nbsp;Name&nbsp;:</td>
-                    <td width="90%" class="podsTableLeftTd">{{ctrl.data.upstream_job_name}}</td>
-                </tr>
-                <tr style="padding:9px">
-                    <td class="podsTableTd">Upstream&nbspBuild&nbsp;ID&nbsp;:</td>
-                    <td width="90%" class="podsTableLeftTd">{{ctrl.data.upstream_build_id}}</td>
+                <tr ng-repeat-end=>
                 </tr>
                 <tr style="padding:9px">
                     <td class="podsTableTd">Details&nbsp;:</td>
-                    <td width="90%" class="podsTableLeftTd">
-                            <a ng-click="ctrl.showDetails()">
-                                <p ng-if="ctrl.details">Hide</p>
-                                <p ng-if="!ctrl.details">Show</p>
-                            </a>
-                            <table class="table" ng-class="{'hidden' : !ctrl.details}" style="margin:10px">
-                            <tbody>
-                                <tr style="padding:9px"></tr>
-                                <tr ng-repeat-start="(index, detail) in ctrl.data.details" style="padding:9px">
-                                    <td class="podsTableTd">{{index | capitalize}}&nbsp;:</td>
-                                    <td width="90%" class="podsTableLeftTd">{{detail}}</td>
-                                </tr>
-                                <tr ng-repeat-end=>
-                                </tr>
-                            </tbody>
-                        </table>
+                    <td width="86%" class="podsTableLeftTd">
+                        <json-tree object="ctrl.json.object" root-name="object" start-expanded="true"></json-tree>
                     </td>
                 </tr>
             </tbody>

diff --git a/testapi/opnfv_testapi/ui/components/deploy-results/deploy-result/deployResultController.js b/testapi/opnfv_testapi/ui/components/deploy-results/deploy-result/deployResultController.js
index 40cf1cb..6f9b84c 100644 (file)
--- a/testapi/opnfv_testapi/ui/components/deploy-results/deploy-result/deployResultController.js
+++ b/testapi/opnfv_testapi/ui/components/deploy-results/deploy-result/deployResultController.js
@@ -21,7 +21,7 @@
 
     DeployResultController.$inject = [
         '$scope', '$http', '$filter', '$state', '$window', '$uibModal', 'testapiApiUrl','raiseAlert',
-        'confirmModal'
+        'confirmModal', 'dataFieldService'
     ];
 
     /**
@@ -30,12 +30,16 @@
      * through result declared in TestAPI.
      */
     function DeployResultController($scope, $http, $filter, $state, $window, $uibModal, testapiApiUrl,
-        raiseAlert, confirmModal) {
+        raiseAlert, confirmModal, dataFieldService) {
         var ctrl = this;
         ctrl.url = testapiApiUrl + '/deployresults';
         ctrl._id = $state.params['_id'];
         ctrl.loadDetails = loadDetails
-        ctrl.showDetails = showDetails
+        ctrl.data_field = {}
+
+        ctrl.json = {};
+        ctrl.json.string = '{"id": ""}';
+        ctrl.json.object = JSON.parse(ctrl.json.string);
 
         /**
          *Contact the testapi and retrevie the result details
@@ -46,6 +50,10 @@
             ctrl.podsRequest =
                 $http.get(resultUrl).success(function (data) {
                     ctrl.data = data;
+                    ctrl.object=JSON.stringify(ctrl.data.details)
+                    ctrl.json.object = JSON.parse(ctrl.object)
+                    delete ctrl.data.details;
+                    ctrl.data_field = dataFieldService.dataFunction(ctrl.data, ctrl.data_field)
                 }).catch(function (error) {
                     ctrl.data = null;
                     ctrl.showError = true;
@@ -53,13 +61,6 @@
                 });
         }
 
-        function showDetails(){
-            if(ctrl.details){
-                ctrl.details = false
-            }else{
-                ctrl.details = true
-            }
-        }
         ctrl.loadDetails();
     }
 })();
\ No newline at end of file