aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2021-01-21 14:42:43 +0100
committerChocobozzz <me@florianbigard.com>2021-01-21 14:42:43 +0100
commit3b01f4c0ac764ecb70efaadfd939ca868c28769c (patch)
tree99c0cdef6dac0d43dd16c02b8bae3c132037cda6 /client/src/app
parentd44cdcd766fbccbe4b96f34c11a64f0e2168c3b9 (diff)
downloadPeerTube-3b01f4c0ac764ecb70efaadfd939ca868c28769c.tar.gz
PeerTube-3b01f4c0ac764ecb70efaadfd939ca868c28769c.tar.zst
PeerTube-3b01f4c0ac764ecb70efaadfd939ca868c28769c.zip
Support progress for ffmpeg tasks
Diffstat (limited to 'client/src/app')
-rw-r--r--client/src/app/+admin/system/jobs/jobs.component.html13
-rw-r--r--client/src/app/+admin/system/jobs/jobs.component.scss3
-rw-r--r--client/src/app/+admin/system/jobs/jobs.component.ts10
3 files changed, 22 insertions, 4 deletions
diff --git a/client/src/app/+admin/system/jobs/jobs.component.html b/client/src/app/+admin/system/jobs/jobs.component.html
index 2d60e7b9e..b6457a005 100644
--- a/client/src/app/+admin/system/jobs/jobs.component.html
+++ b/client/src/app/+admin/system/jobs/jobs.component.html
@@ -40,7 +40,8 @@
40 <th style="width: 40px"></th> 40 <th style="width: 40px"></th>
41 <th style="width: calc(100% - 390px)" class="job-id" i18n>ID</th> 41 <th style="width: calc(100% - 390px)" class="job-id" i18n>ID</th>
42 <th style="width: 200px" class="job-type" i18n>Type</th> 42 <th style="width: 200px" class="job-type" i18n>Type</th>
43 <th style="width: 200px" class="job-type" i18n *ngIf="jobState === 'all'">State</th> 43 <th style="width: 200px" class="job-state" i18n *ngIf="jobState === 'all'">State</th>
44 <th style="width: 100px" class="job-progress" i18n *ngIf="hasProgress()">Progress</th>
44 <th style="width: 150px" class="job-date" i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th> 45 <th style="width: 150px" class="job-date" i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th>
45 </tr> 46 </tr>
46 </ng-template> 47 </ng-template>
@@ -55,9 +56,15 @@
55 56
56 <td class="job-id c-hand" [pRowToggler]="job" [title]="job.id">{{ job.id }}</td> 57 <td class="job-id c-hand" [pRowToggler]="job" [title]="job.id">{{ job.id }}</td>
57 <td class="job-type c-hand" [pRowToggler]="job">{{ job.type }}</td> 58 <td class="job-type c-hand" [pRowToggler]="job">{{ job.type }}</td>
58 <td class="job-type c-hand" [pRowToggler]="job" *ngIf="jobState === 'all'"> 59
60 <td class="job-state c-hand" [pRowToggler]="job" *ngIf="jobState === 'all'">
59 <span class="badge" [ngClass]="getJobStateClass(job.state)">{{ job.state }}</span> 61 <span class="badge" [ngClass]="getJobStateClass(job.state)">{{ job.state }}</span>
60 </td> 62 </td>
63
64 <td class="job-state" [pRowToggler]="job" *ngIf="hasProgress()">
65 {{ getProgress(job) }}
66 </td>
67
61 <td class="job-date c-hand" [pRowToggler]="job">{{ job.createdAt | date: 'short' }}</td> 68 <td class="job-date c-hand" [pRowToggler]="job">{{ job.createdAt | date: 'short' }}</td>
62 </tr> 69 </tr>
63 </ng-template> 70 </ng-template>
@@ -94,7 +101,7 @@
94 <ng-container *ngIf="jobType === 'all'" i18n>No jobs found.</ng-container> 101 <ng-container *ngIf="jobType === 'all'" i18n>No jobs found.</ng-container>
95 <ng-container *ngIf="jobType !== 'all'" i18n>No <code>{{ jobType }}</code> jobs found.</ng-container> 102 <ng-container *ngIf="jobType !== 'all'" i18n>No <code>{{ jobType }}</code> jobs found.</ng-container>
96 </ng-container> 103 </ng-container>
97 <ng-container *ngIf="jobState !== 'all'"> 104 <ng-container *ngIf="jobState !== 'all'">
98 <ng-container *ngIf="jobType === 'all'" i18n>No <span class="badge" [ngClass]="getJobStateClass(jobState)">{{ jobState }}</span> jobs found.</ng-container> 105 <ng-container *ngIf="jobType === 'all'" i18n>No <span class="badge" [ngClass]="getJobStateClass(jobState)">{{ jobState }}</span> jobs found.</ng-container>
99 <ng-container *ngIf="jobType !== 'all'" i18n>No <code>{{ jobType }}</code> jobs found that are <span class="badge" [ngClass]="getJobStateClass(jobState)">{{ jobState }}</span>.</ng-container> 106 <ng-container *ngIf="jobType !== 'all'" i18n>No <code>{{ jobType }}</code> jobs found that are <span class="badge" [ngClass]="getJobStateClass(jobState)">{{ jobState }}</span>.</ng-container>
100 </ng-container> 107 </ng-container>
diff --git a/client/src/app/+admin/system/jobs/jobs.component.scss b/client/src/app/+admin/system/jobs/jobs.component.scss
index 784ec4572..9c6ae73e1 100644
--- a/client/src/app/+admin/system/jobs/jobs.component.scss
+++ b/client/src/app/+admin/system/jobs/jobs.component.scss
@@ -9,7 +9,8 @@
9 max-width: 30vw !important; 9 max-width: 30vw !important;
10} 10}
11 11
12.job-type { 12.job-type,
13.job-state {
13 width: 150px !important; 14 width: 150px !important;
14} 15}
15 16
diff --git a/client/src/app/+admin/system/jobs/jobs.component.ts b/client/src/app/+admin/system/jobs/jobs.component.ts
index b1940b0d3..6ab17b3c1 100644
--- a/client/src/app/+admin/system/jobs/jobs.component.ts
+++ b/client/src/app/+admin/system/jobs/jobs.component.ts
@@ -83,6 +83,16 @@ export class JobsComponent extends RestTable implements OnInit {
83 this.saveJobStateAndType() 83 this.saveJobStateAndType()
84 } 84 }
85 85
86 hasProgress () {
87 return this.jobType === 'all' || this.jobType === 'video-transcoding'
88 }
89
90 getProgress (job: Job) {
91 if (job.state === 'active') return job.progress + '%'
92
93 return ''
94 }
95
86 protected loadData () { 96 protected loadData () {
87 let jobState = this.jobState as JobState 97 let jobState = this.jobState as JobState
88 if (this.jobState === 'all') jobState = null 98 if (this.jobState === 'all') jobState = null