aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2020-04-08 14:05:55 +0200
committerChocobozzz <me@florianbigard.com>2020-04-08 14:05:55 +0200
commitb1f3b635edf48949d268ce3d72fc33f126932a21 (patch)
tree1e5f9806358131355e93489e1d89d87a8f19415e /client
parenta911462d02bb9134f539ba904d440693608a27c2 (diff)
downloadPeerTube-b1f3b635edf48949d268ce3d72fc33f126932a21.tar.gz
PeerTube-b1f3b635edf48949d268ce3d72fc33f126932a21.tar.zst
PeerTube-b1f3b635edf48949d268ce3d72fc33f126932a21.zip
Improve admin tables row expand
Diffstat (limited to 'client')
-rw-r--r--client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.html22
-rw-r--r--client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.scss2
-rw-r--r--client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.ts6
-rw-r--r--client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.html3
-rw-r--r--client/src/app/+admin/moderation/video-blacklist-list/video-blacklist-list.component.html3
-rw-r--r--client/src/app/+admin/system/jobs/jobs.component.html11
-rw-r--r--client/src/app/+admin/system/jobs/jobs.component.scss2
-rw-r--r--client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html4
8 files changed, 36 insertions, 17 deletions
diff --git a/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.html b/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.html
index 80c66ec60..18d88c20c 100644
--- a/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.html
+++ b/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.html
@@ -1,6 +1,4 @@
1<div class="admin-sub-header"> 1<div class="admin-sub-header">
2 <div i18n class="form-sub-title">Video redundancies list</div>
3
4 <div class="select-filter-block"> 2 <div class="select-filter-block">
5 <label for="displayType" i18n>Display</label> 3 <label for="displayType" i18n>Display</label>
6 4
@@ -19,6 +17,7 @@
19> 17>
20 <ng-template pTemplate="header"> 18 <ng-template pTemplate="header">
21 <tr> 19 <tr>
20 <th style="width: 40px"></th>
22 <th i18n *ngIf="isDisplayingRemoteVideos()">Strategy</th> 21 <th i18n *ngIf="isDisplayingRemoteVideos()">Strategy</th>
23 <th i18n pSortableColumn="name">Video name <p-sortIcon field="name"></p-sortIcon></th> 22 <th i18n pSortableColumn="name">Video name <p-sortIcon field="name"></p-sortIcon></th>
24 <th i18n>Video URL</th> 23 <th i18n>Video URL</th>
@@ -27,8 +26,15 @@
27 </tr> 26 </tr>
28 </ng-template> 27 </ng-template>
29 28
30 <ng-template pTemplate="body" let-redundancy> 29 <ng-template pTemplate="body" let-expanded="expanded" let-redundancy>
31 <tr class="expander" [pRowToggler]="redundancy"> 30 <tr>
31
32 <td class="expand-cell">
33 <span class="expander" i18n-ngbTooltip ngbTooltip="List redundancies" [pRowToggler]="redundancy">
34 <i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i>
35 </span>
36 </td>
37
32 <td *ngIf="isDisplayingRemoteVideos()">{{ getRedundancyStrategy(redundancy) }}</td> 38 <td *ngIf="isDisplayingRemoteVideos()">{{ getRedundancyStrategy(redundancy) }}</td>
33 39
34 <td>{{ redundancy.name }}</td> 40 <td>{{ redundancy.name }}</td>
@@ -46,16 +52,16 @@
46 </ng-template> 52 </ng-template>
47 53
48 <ng-template pTemplate="rowexpansion" let-redundancy> 54 <ng-template pTemplate="rowexpansion" let-redundancy>
49 <tr> 55 <tr *ngIf="redundancy.redundancies.files.length !== 0">
50 <td colspan="2"> 56 <td [attr.colspan]="getColspan()">
51 <div *ngFor="let file of redundancy.redundancies.files" class="expansion-block"> 57 <div *ngFor="let file of redundancy.redundancies.files" class="expansion-block">
52 <my-video-redundancy-information [redundancyElement]="file"></my-video-redundancy-information> 58 <my-video-redundancy-information [redundancyElement]="file"></my-video-redundancy-information>
53 </div> 59 </div>
54 </td> 60 </td>
55 </tr> 61 </tr>
56 62
57 <tr> 63 <tr *ngIf="redundancy.redundancies.streamingPlaylists.length !== 0">
58 <td colspan="2"> 64 <td [attr.colspan]="getColspan()">
59 <div *ngFor="let playlist of redundancy.redundancies.streamingPlaylists"> 65 <div *ngFor="let playlist of redundancy.redundancies.streamingPlaylists">
60 <my-video-redundancy-information [redundancyElement]="playlist"></my-video-redundancy-information> 66 <my-video-redundancy-information [redundancyElement]="playlist"></my-video-redundancy-information>
61 </div> 67 </div>
diff --git a/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.scss b/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.scss
index 05018c281..e1085cd1b 100644
--- a/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.scss
+++ b/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.scss
@@ -6,7 +6,7 @@
6} 6}
7 7
8.admin-sub-header { 8.admin-sub-header {
9 align-items: flex-end; 9 justify-content: flex-end;
10 10
11 .select-filter-block { 11 .select-filter-block {
12 &:not(:last-child) { 12 &:not(:last-child) {
diff --git a/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.ts b/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.ts
index 2edee99a3..d563b4e95 100644
--- a/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.ts
+++ b/client/src/app/+admin/follows/video-redundancies-list/video-redundancies-list.component.ts
@@ -65,6 +65,12 @@ export class VideoRedundanciesListComponent extends RestTable implements OnInit
65 }) 65 })
66 } 66 }
67 67
68 getColspan () {
69 if (this.isDisplayingRemoteVideos()) return 3
70
71 return 2
72 }
73
68 isDisplayingRemoteVideos () { 74 isDisplayingRemoteVideos () {
69 return this.displayType === 'remote-videos' 75 return this.displayType === 'remote-videos'
70 } 76 }
diff --git a/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.html b/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.html
index 30eb2dbde..b25412c99 100644
--- a/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.html
+++ b/client/src/app/+admin/moderation/video-abuse-list/video-abuse-list.component.html
@@ -15,8 +15,9 @@
15 15
16 <ng-template pTemplate="body" let-expanded="expanded" let-videoAbuse> 16 <ng-template pTemplate="body" let-expanded="expanded" let-videoAbuse>
17 <tr> 17 <tr>
18
18 <td class="expand-cell"> 19 <td class="expand-cell">
19 <span class="expander" [pRowToggler]="videoAbuse"> 20 <span class="expander" i18n-ngbTooltip ngbTooltip="More information" [pRowToggler]="videoAbuse">
20 <i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i> 21 <i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i>
21 </span> 22 </span>
22 </td> 23 </td>
diff --git a/client/src/app/+admin/moderation/video-blacklist-list/video-blacklist-list.component.html b/client/src/app/+admin/moderation/video-blacklist-list/video-blacklist-list.component.html
index a0b89acc6..4f9a6c18c 100644
--- a/client/src/app/+admin/moderation/video-blacklist-list/video-blacklist-list.component.html
+++ b/client/src/app/+admin/moderation/video-blacklist-list/video-blacklist-list.component.html
@@ -15,8 +15,9 @@
15 15
16 <ng-template pTemplate="body" let-videoBlacklist let-expanded="expanded"> 16 <ng-template pTemplate="body" let-videoBlacklist let-expanded="expanded">
17 <tr> 17 <tr>
18
18 <td class="expand-cell"> 19 <td class="expand-cell">
19 <span *ngIf="videoBlacklist.reason" class="expander" [pRowToggler]="videoBlacklist"> 20 <span *ngIf="videoBlacklist.reason" class="expander" i18n-ngbTooltip ngbTooltip="More information" [pRowToggler]="videoBlacklist">
20 <i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i> 21 <i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i>
21 </span> 22 </span>
22 </td> 23 </td>
diff --git a/client/src/app/+admin/system/jobs/jobs.component.html b/client/src/app/+admin/system/jobs/jobs.component.html
index b0f68eadd..3dd4e8a2a 100644
--- a/client/src/app/+admin/system/jobs/jobs.component.html
+++ b/client/src/app/+admin/system/jobs/jobs.component.html
@@ -1,6 +1,4 @@
1<div class="admin-sub-header"> 1<div class="admin-sub-header">
2 <div i18n class="form-sub-title">Jobs list</div>
3
4 <div class="select-filter-block"> 2 <div class="select-filter-block">
5 <label for="jobType" i18n>Job type</label> 3 <label for="jobType" i18n>Job type</label>
6 <div class="peertube-select-container"> 4 <div class="peertube-select-container">
@@ -27,6 +25,7 @@
27> 25>
28 <ng-template pTemplate="header"> 26 <ng-template pTemplate="header">
29 <tr> 27 <tr>
28 <th style="width: 40px"></th>
30 <th class="job-id" i18n>ID</th> 29 <th class="job-id" i18n>ID</th>
31 <th class="job-type" i18n>Type</th> 30 <th class="job-type" i18n>Type</th>
32 <th class="job-date" i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th> 31 <th class="job-date" i18n pSortableColumn="createdAt">Created <p-sortIcon field="createdAt"></p-sortIcon></th>
@@ -35,7 +34,13 @@
35 </ng-template> 34 </ng-template>
36 35
37 <ng-template pTemplate="body" let-expanded="expanded" let-job> 36 <ng-template pTemplate="body" let-expanded="expanded" let-job>
38 <tr class="expander" [pRowToggler]="job"> 37 <tr>
38 <td class="expand-cell">
39 <span class="expander" [pRowToggler]="job" i18n-ngbTooltip ngbTooltip="More information">
40 <i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i>
41 </span>
42 </td>
43
39 <td class="job-id" [title]="job.id">{{ job.id }}</td> 44 <td class="job-id" [title]="job.id">{{ job.id }}</td>
40 <td class="job-type">{{ job.type }}</td> 45 <td class="job-type">{{ job.type }}</td>
41 <td class="job-date">{{ job.createdAt }}</td> 46 <td class="job-date">{{ job.createdAt }}</td>
diff --git a/client/src/app/+admin/system/jobs/jobs.component.scss b/client/src/app/+admin/system/jobs/jobs.component.scss
index 4cb706d2d..4a3de9274 100644
--- a/client/src/app/+admin/system/jobs/jobs.component.scss
+++ b/client/src/app/+admin/system/jobs/jobs.component.scss
@@ -18,7 +18,7 @@
18} 18}
19 19
20.admin-sub-header { 20.admin-sub-header {
21 align-items: flex-end; 21 justify-content: flex-end;
22 22
23 .select-filter-block { 23 .select-filter-block {
24 &:not(:last-child) { 24 &:not(:last-child) {
diff --git a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html
index 329948cb5..922664338 100644
--- a/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html
+++ b/client/src/app/+my-account/my-account-video-imports/my-account-video-imports.component.html
@@ -15,8 +15,8 @@
15 15
16 <ng-template pTemplate="body" let-expanded="expanded" let-videoImport> 16 <ng-template pTemplate="body" let-expanded="expanded" let-videoImport>
17 <tr> 17 <tr>
18 <td> 18 <td class="expand-cell">
19 <span *ngIf="videoImport.error" class="expander" [pRowToggler]="videoImport"> 19 <span *ngIf="videoImport.error" class="expander" [pRowToggler]="videoImport" i18n-ngbTooltip ngbTooltip="See the error">
20 <i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i> 20 <i [ngClass]="expanded ? 'glyphicon glyphicon-menu-down' : 'glyphicon glyphicon-menu-right'"></i>
21 </span> 21 </span>
22 </td> 22 </td>