Merge pull request #4166 from jaredevantabor/job-results-labels

Job Labels should be collapsible

awx/ui/client/legacy-styles/ansible-ui.less

@@ -2222,3 +2222,18 @@ a:hover {
 .modal-body .alert {
     padding: 10px;
 }
+
+.WorkflowBadge{
+    background-color: @b7grey;
+    border-radius: 10px;
+    color: @default-bg;
+    display: inline-block;
+    font-family: 'Open Sans';
+    font-weight: bold;
+    font-style: normal;
+    font-size: x-small;
+    height: 14px;
+    margin-left: 5px;
+    padding-left: 2px;
+    width: 14px;
+}

awx/ui/client/src/job-results/job-results.block.less

@@ -94,6 +94,15 @@
     width: 100%;
 }
 
+.JobResults-expandArrow {
+    color: #D7D7D7;
+    font-size: 14px;
+    font-weight: bold;
+    margin-right: 10px;
+    text-transform: uppercase;
+    margin-left: 10px;
+}
+
 .JobResults-resultRowText--revision{
     font-family: monospace;
 }

awx/ui/client/src/job-results/job-results.controller.js

@@ -86,6 +86,18 @@ export default ['jobData', 'jobDataOptions', 'jobLabels', 'jobFinished', 'count'
         jobResultsService.relaunchJob($scope);
     };
 
+    $scope.lessLabels = false;
+    $scope.toggleLessLabels = function() {
+        if (!$scope.lessLabels) {
+            $('#job-results-labels').slideUp(200);
+            $scope.lessLabels = true;
+        }
+        else {
+            $('#job-results-labels').slideDown(200);
+            $scope.lessLabels = false;
+        }
+    };
+
     // get initial count from resolve
     $scope.count = count.val;
     $scope.hostCount = getTotalHostCount(count.val);

awx/ui/client/src/job-results/job-results.partial.html

@@ -97,6 +97,15 @@
                                 data-placement="top">
                                 {{ job.summary_fields.job_template.name }}
                             </a>
+                            <a href="{{ workflow_result_link }}"
+                                aw-tool-tip="View workflow results"
+                                data-placement="top"
+                                data-original-title="" title="">
+                                <i class="WorkflowBadge"
+                                    ng-show="job.launch_type === 'workflow' ">
+                                    W
+                                </i>
+                            </a>
                         </div>
                     </div>
 
@@ -305,11 +314,27 @@
                     <!-- LABELS DETAIL -->
                     <div class="JobResults-resultRow"
                         ng-show="labels && labels.length > 0">
-                        <label class="JobResults-resultRowLabel
+                        <div class="JobResults-resultRow">
-                            JobResults-resultRowLabel--fullWidth">
+                            <a class="JobResults-resultRowLabel
-                            Labels
+                                JobResults-resultRowLabel--fullWidth"
-                        </label>
+                                ng-show="lessLabels"
-                        <div class="LabelList
+                                href=""
+                                ng-click="toggleLessLabels()">
+                                    Labels
+                                <i class="JobResults-expandArrow
+                                    fa fa-caret-right"></i>
+                            </a>
+                            <a class="JobResults-resultRowLabel
+                                JobResults-resultRowLabel--fullWidth"
+                                ng-show="!lessLabels"
+                                href=""
+                                ng-click="toggleLessLabels()">
+                                    Labels
+                                <i class="JobResults-expandArrow
+                                    fa fa-caret-down"></i>
+                            </a>
+                        </div>
+                        <div id="job-results-labels" class="LabelList
                             JobResults-resultRowText
                             JobResults-resultRowText--fullWidth">
                             <div ng-repeat="label in labels"

awx/ui/client/src/lists/AllJobs.js

@@ -41,6 +41,17 @@ export default
                 label: 'Name',
                 columnClass: 'col-lg-2 col-md-3 col-sm-4 col-xs-6',
                 ngClick: "viewJobDetails(job)",
+                badgePlacement: 'right',
+                badgeCustom: true,
+                badgeIcon: `<a href="{{ workflow_result_link }}"
+                    aw-tool-tip="View workflow results"
+                    data-placement="top"
+                    data-original-title="" title="">
+                    <i class="WorkflowBadge"
+                        ng-show="job.launch_type === 'workflow' ">
+                        W
+                    </i>
+                </a>`
             },
             type: {
                 label: 'Type',

awx/ui/client/src/shared/generator-helpers.js

@@ -327,7 +327,11 @@ angular.module('GeneratorHelpers', [systemStatus.name])
                     }
                     html += "\n";
                 }
-            } else {
+            }
+            else if(field.badgeCustom === true){
+                html += field.badgeIcon;
+            }
+            else {
                 if (field.badgeToolTip) {
                     html += "<a ";
                     html += (field.badgeNgHref) ? "ng-href=\"" + field.badgeNgHref + "\" " : "href=\"\"";