diff options
author | Rigel Kent <sendmemail@rigelk.eu> | 2020-08-27 17:27:37 +0200 |
---|---|---|
committer | Rigel Kent <par@rigelk.eu> | 2020-09-28 13:25:50 +0200 |
commit | 7f0d85616944681ed447f4342d86eee8141c7612 (patch) | |
tree | dc51b7dd989f7bcdff37ef1332a61d05a652ab53 /client/src/app/+admin/system/logs | |
parent | cd372e840b6a291a56e0d5135548d05a98415155 (diff) | |
download | PeerTube-7f0d85616944681ed447f4342d86eee8141c7612.tar.gz PeerTube-7f0d85616944681ed447f4342d86eee8141c7612.tar.zst PeerTube-7f0d85616944681ed447f4342d86eee8141c7612.zip |
jobs/logs view select and empty state visual improvements
Diffstat (limited to 'client/src/app/+admin/system/logs')
-rw-r--r-- | client/src/app/+admin/system/logs/logs.component.html | 35 | ||||
-rw-r--r-- | client/src/app/+admin/system/logs/logs.component.scss | 5 | ||||
-rw-r--r-- | client/src/app/+admin/system/logs/logs.component.ts | 19 |
3 files changed, 39 insertions, 20 deletions
diff --git a/client/src/app/+admin/system/logs/logs.component.html b/client/src/app/+admin/system/logs/logs.component.html index ae1b0c601..e92e11c2a 100644 --- a/client/src/app/+admin/system/logs/logs.component.html +++ b/client/src/app/+admin/system/logs/logs.component.html | |||
@@ -5,17 +5,30 @@ | |||
5 | </select> | 5 | </select> |
6 | </div> | 6 | </div> |
7 | 7 | ||
8 | <div class="peertube-select-container"> | 8 | <ng-select |
9 | <select [(ngModel)]="startDate" (ngModelChange)="refresh()" class="form-control"> | 9 | [(ngModel)]="startDate" |
10 | <option *ngFor="let timeChoice of timeChoices" [value]="timeChoice.id">{{ timeChoice.label }}</option> | 10 | (ngModelChange)="refresh()" |
11 | </select> | 11 | [clearable]="false" |
12 | </div> | 12 | [searchable]="false" |
13 | 13 | > | |
14 | <div class="peertube-select-container" *ngIf="!isAuditLog()"> | 14 | <ng-option *ngFor="let time of timeChoices" [value]="time.id"> |
15 | <select [(ngModel)]="level" (ngModelChange)="refresh()" class="form-control"> | 15 | {{ time.label }} ({{ time.id | date: time.dateFormat }} - <span i18n>now</span>) |
16 | <option *ngFor="let levelChoice of levelChoices" [value]="levelChoice.id">{{ levelChoice.label }}</option> | 16 | </ng-option> |
17 | </select> | 17 | </ng-select> |
18 | </div> | 18 | |
19 | <ng-select | ||
20 | [(ngModel)]="level" | ||
21 | (ngModelChange)="refresh()" | ||
22 | [clearable]="false" | ||
23 | [searchable]="false" | ||
24 | > | ||
25 | <ng-option *ngFor="let levelChoice of levelChoices" [value]="levelChoice.id"> | ||
26 | <ng-container *ngIf="levelChoice.id === 'debug'"><span style="font-size:80%;color:lightgray;vertical-align:text-top;">⬤</span> {{ levelChoice.label }}</ng-container> | ||
27 | <ng-container *ngIf="levelChoice.id === 'info'"><span style="font-size:80%;color:lightskyblue;vertical-align:text-top;">⬤</span> {{ levelChoice.label }}</ng-container> | ||
28 | <ng-container *ngIf="levelChoice.id === 'warn'"><span style="font-size:80%;color:orange;vertical-align:text-top;">⬤</span> {{ levelChoice.label }}</ng-container> | ||
29 | <ng-container *ngIf="levelChoice.id === 'error'"><span style="font-size:80%;color:red;vertical-align:text-top;">⬤</span> {{ levelChoice.label }}</ng-container> | ||
30 | </ng-option> | ||
31 | </ng-select> | ||
19 | 32 | ||
20 | <my-button i18n-label label="Refresh" icon="refresh" (click)="refresh()"></my-button> | 33 | <my-button i18n-label label="Refresh" icon="refresh" (click)="refresh()"></my-button> |
21 | </div> | 34 | </div> |
diff --git a/client/src/app/+admin/system/logs/logs.component.scss b/client/src/app/+admin/system/logs/logs.component.scss index 6b92f4d0b..587a9795c 100644 --- a/client/src/app/+admin/system/logs/logs.component.scss +++ b/client/src/app/+admin/system/logs/logs.component.scss | |||
@@ -52,7 +52,8 @@ | |||
52 | } | 52 | } |
53 | 53 | ||
54 | my-button, | 54 | my-button, |
55 | .peertube-select-container { | 55 | .peertube-select-container, |
56 | ng-select { | ||
56 | margin-left: 10px; | 57 | margin-left: 10px; |
57 | } | 58 | } |
58 | } | 59 | } |
@@ -62,6 +63,7 @@ | |||
62 | flex-direction: column; | 63 | flex-direction: column; |
63 | 64 | ||
64 | .peertube-select-container, | 65 | .peertube-select-container, |
66 | ng-select, | ||
65 | my-button { | 67 | my-button { |
66 | width: 100% !important; | 68 | width: 100% !important; |
67 | margin-left: 0px !important; | 69 | margin-left: 0px !important; |
@@ -80,6 +82,7 @@ | |||
80 | flex-direction: column; | 82 | flex-direction: column; |
81 | 83 | ||
82 | .peertube-select-container, | 84 | .peertube-select-container, |
85 | ng-select, | ||
83 | my-button { | 86 | my-button { |
84 | width: 100% !important; | 87 | width: 100% !important; |
85 | margin-left: 0px !important; | 88 | margin-left: 0px !important; |
diff --git a/client/src/app/+admin/system/logs/logs.component.ts b/client/src/app/+admin/system/logs/logs.component.ts index c9c9dc3d1..62b8bc0b9 100644 --- a/client/src/app/+admin/system/logs/logs.component.ts +++ b/client/src/app/+admin/system/logs/logs.component.ts | |||
@@ -14,7 +14,7 @@ export class LogsComponent implements OnInit { | |||
14 | loading = false | 14 | loading = false |
15 | 15 | ||
16 | logs: LogRow[] = [] | 16 | logs: LogRow[] = [] |
17 | timeChoices: { id: string, label: string }[] = [] | 17 | timeChoices: { id: string, label: string, dateFormat: string }[] = [] |
18 | levelChoices: { id: LogLevel, label: string }[] = [] | 18 | levelChoices: { id: LogLevel, label: string }[] = [] |
19 | logTypeChoices: { id: 'audit' | 'standard', label: string }[] = [] | 19 | logTypeChoices: { id: 'audit' | 'standard', label: string }[] = [] |
20 | 20 | ||
@@ -76,15 +76,18 @@ export class LogsComponent implements OnInit { | |||
76 | this.timeChoices = [ | 76 | this.timeChoices = [ |
77 | { | 77 | { |
78 | id: lastWeek.toISOString(), | 78 | id: lastWeek.toISOString(), |
79 | label: $localize`Last week` | 79 | label: $localize`Last week`, |
80 | dateFormat: 'shortDate' | ||
80 | }, | 81 | }, |
81 | { | 82 | { |
82 | id: lastDay.toISOString(), | 83 | id: lastDay.toISOString(), |
83 | label: $localize`Last day` | 84 | label: $localize`Last day`, |
85 | dateFormat: 'short' | ||
84 | }, | 86 | }, |
85 | { | 87 | { |
86 | id: lastHour.toISOString(), | 88 | id: lastHour.toISOString(), |
87 | label: $localize`Last hour` | 89 | label: $localize`Last hour`, |
90 | dateFormat: 'mediumTime' | ||
88 | } | 91 | } |
89 | ] | 92 | ] |
90 | 93 | ||
@@ -95,19 +98,19 @@ export class LogsComponent implements OnInit { | |||
95 | this.levelChoices = [ | 98 | this.levelChoices = [ |
96 | { | 99 | { |
97 | id: 'debug', | 100 | id: 'debug', |
98 | label: $localize`Debug` | 101 | label: $localize`debug` |
99 | }, | 102 | }, |
100 | { | 103 | { |
101 | id: 'info', | 104 | id: 'info', |
102 | label: $localize`Info` | 105 | label: $localize`info` |
103 | }, | 106 | }, |
104 | { | 107 | { |
105 | id: 'warn', | 108 | id: 'warn', |
106 | label: $localize`Warning` | 109 | label: $localize`warning` |
107 | }, | 110 | }, |
108 | { | 111 | { |
109 | id: 'error', | 112 | id: 'error', |
110 | label: $localize`Error` | 113 | label: $localize`error` |
111 | } | 114 | } |
112 | ] | 115 | ] |
113 | 116 | ||