[SPARK-21135][WEB UI] On history server page，duration of incompleted...

[SPARK-21135][WEB UI] On history server page，duration of incompleted applications should be hidden instead of showing up as 0

## What changes were proposed in this pull request?

Hide duration of incompleted applications.

## How was this patch tested?

manual tests

Author: fjh100456 <fu.jinhua6@zte.com.cn>

Closes #18351 from fjh100456/master.

core/src/main/resources/org/apache/spark/ui/static/historypage-template.html

@@ -44,7 +44,7 @@
           Completed
         </span>
       </th>
-      <th>
+      <th class="durationColumn">
         <span data-toggle="tooltip" data-placement="top" title="The duration time of this application.">
           Duration
         </span>
@@ -74,7 +74,7 @@
       <td class="attemptIDSpan"><a href="{{uiroot}}/history/{{id}}/{{attemptId}}/jobs/">{{attemptId}}</a></td>
       <td>{{startTime}}</td>
       <td class="completedColumn">{{endTime}}</td>
-      <td><span title="{{duration}}" class="durationClass">{{duration}}</span></td>
+      <td class="durationColumn"><span title="{{duration}}" class="durationClass">{{duration}}</span></td>
       <td>{{sparkUser}}</td>
       <td>{{lastUpdated}}</td>
       <td><a href="{{log}}" class="btn btn-info btn-mini">Download</a></td>

core/src/main/resources/org/apache/spark/ui/static/historypage.js

@@ -182,12 +182,17 @@ $(document).ready(function() {
           for (i = 0; i < completedCells.length; i++) {
             completedCells[i].style.display='none';
           }
-        }
 
-        var durationCells = document.getElementsByClassName("durationClass");
-        for (i = 0; i < durationCells.length; i++) {
-          var timeInMilliseconds = parseInt(durationCells[i].title);
-          durationCells[i].innerHTML = formatDuration(timeInMilliseconds);
+          var durationCells = document.getElementsByClassName("durationColumn");
+          for (i = 0; i < durationCells.length; i++) {
+            durationCells[i].style.display='none';
+          }
+        } else {
+          var durationCells = document.getElementsByClassName("durationClass");
+          for (i = 0; i < durationCells.length; i++) {
+            var timeInMilliseconds = parseInt(durationCells[i].title);
+            durationCells[i].innerHTML = formatDuration(timeInMilliseconds);
+          }
         }
 
         if ($(selector.concat(" tr")).length < 20) {