Add job.duration in web ui (#23963)

![image](https://user-images.githubusercontent.com/18380374/230532947-271ac389-8134-4c5e-8f2f-ced4a4fd0ebe.png)

![image](https://user-images.githubusercontent.com/18380374/230532963-e76532c5-7ca1-4b01-ae77-cc1223350fe7.png)

Maybe we can change the location of it.

routers/web/repo/actions/view.go

@@ -75,6 +75,7 @@ type ViewJob struct {
 	Name     string `json:"name"`
 	Status   string `json:"status"`
 	CanRerun bool   `json:"canRerun"`
+	Duration string `json:"duration"`
 }
 
 type ViewCommit struct {
@@ -144,6 +145,7 @@ func ViewPost(ctx *context_module.Context) {
 			Name:     v.Name,
 			Status:   v.Status.String(),
 			CanRerun: v.Status.IsDone() && ctx.Repo.CanWrite(unit.TypeActions),
+			Duration: v.Duration().String(),
 		})
 	}
 

web_src/js/components/RepoActionView.vue

@@ -32,6 +32,7 @@
                 <ActionRunStatus :status="job.status"/>
                 <span class="ui text gt-mx-3">{{ job.name }}</span>
               </a>
+              <span class="step-summary-duration">{{ job.duration }}</span>
               <button class="job-brief-rerun" @click="rerunJob(index)" v-if="job.canRerun">
                 <SvgIcon name="octicon-sync" class="ui text black"/>
               </button>
@@ -57,7 +58,7 @@
               <ActionRunStatus :status="jobStep.status" class="gt-mr-3"/>
 
               <span class="step-summary-msg">{{ jobStep.summary }}</span>
-              <span class="step-summary-dur">{{ jobStep.duration }}</span>
+              <span class="step-summary-duration">{{ jobStep.duration }}</span>
             </div>
 
             <!-- the log elements could be a lot, do not use v-if to destroy/reconstruct the DOM -->
@@ -112,6 +113,7 @@ const sfc = {
           //   name: '',
           //   status: '',
           //   canRerun: false,
+          //   duration: '',
           // },
         ],
         commit: {
@@ -492,7 +494,7 @@ export function ansiLogToHTML(line) {
   flex: 1;
 }
 
-.job-step-container .job-step-summary .step-summary-dur {
+.job-step-container .job-step-summary .step-summary-duration {
   margin-left: 16px;
 }