mirror of
https://github.com/goharbor/harbor.git
synced 2024-11-23 10:45:45 +01:00
commit
373acba9fa
@ -6,9 +6,7 @@ export const JOB_LOG_VIEWER_TEMPLATE: string = `
|
||||
<span class="spinner spinner-md"></span>
|
||||
</div>
|
||||
<pre [hidden]="onGoing">
|
||||
<code>
|
||||
{{log}}
|
||||
</code>
|
||||
<code>{{log}}</code>
|
||||
</pre>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
|
@ -11,7 +11,7 @@
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
import { Component, Input } from '@angular/core';
|
||||
import {ChangeDetectionStrategy, ChangeDetectorRef, Component, Input} from '@angular/core';
|
||||
|
||||
import { JOB_LOG_VIEWER_TEMPLATE, JOB_LOG_VIEWER_STYLES } from './job-log-viewer.component.template';
|
||||
import { JobLogService } from '../service/index';
|
||||
@ -23,7 +23,8 @@ const supportSet: string[] = ["replication", "scan"];
|
||||
@Component({
|
||||
selector: 'job-log-viewer',
|
||||
template: JOB_LOG_VIEWER_TEMPLATE,
|
||||
styles: [JOB_LOG_VIEWER_STYLES]
|
||||
styles: [JOB_LOG_VIEWER_STYLES],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush
|
||||
})
|
||||
|
||||
export class JobLogViewerComponent {
|
||||
@ -53,7 +54,8 @@ export class JobLogViewerComponent {
|
||||
|
||||
constructor(
|
||||
private jobLogService: JobLogService,
|
||||
private errorHandler: ErrorHandler
|
||||
private errorHandler: ErrorHandler,
|
||||
private ref: ChangeDetectorRef
|
||||
) { }
|
||||
|
||||
open(jobId: number | string): void {
|
||||
@ -78,5 +80,8 @@ export class JobLogViewerComponent {
|
||||
this.onGoing = false;
|
||||
this.errorHandler.error(error);
|
||||
});
|
||||
|
||||
let hnd = setInterval(()=>this.ref.markForCheck(), 100);
|
||||
setTimeout(()=>clearInterval(hnd), 2000);
|
||||
}
|
||||
}
|
@ -106,4 +106,10 @@ export const TAG_DETAIL_STYLES: string = `
|
||||
margin-left: 6px;
|
||||
font-weight: 500;
|
||||
}
|
||||
.tip-icon-medium {
|
||||
color: orange;
|
||||
}
|
||||
.tip-icon-low{
|
||||
color:yellow;
|
||||
}
|
||||
`;
|
@ -44,7 +44,7 @@ export const TAG_DETAIL_HTML: string = `
|
||||
<clr-icon shape="error" size="24" class="is-error"></clr-icon>
|
||||
</div>
|
||||
<div class="second-row">
|
||||
<clr-icon shape="exclamation-triangle" size="24" class="is-warning"></clr-icon>
|
||||
<clr-icon shape="exclamation-triangle" size="24" class="tip-icon-medium"></clr-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="second-column">
|
||||
@ -53,10 +53,10 @@ export const TAG_DETAIL_HTML: string = `
|
||||
</div>
|
||||
<div class="third-column">
|
||||
<div>
|
||||
<clr-icon shape="play" size="20" class="is-warning rotate-90"></clr-icon>
|
||||
<clr-icon shape="play" size="20" class="tip-icon-low rotate-90"></clr-icon>
|
||||
</div>
|
||||
<div class="second-row">
|
||||
<clr-icon shape="help" size="20"></clr-icon>
|
||||
<clr-icon shape="help" size="18" style="margin-left: 2px;"></clr-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fourth-column">
|
||||
|
@ -43,13 +43,13 @@ export const SCANNING_STYLES: string = `
|
||||
margin-left: -4px;
|
||||
}
|
||||
.bar-block-high {
|
||||
background-color: red;
|
||||
background-color: #e62700;
|
||||
}
|
||||
.bar-block-medium {
|
||||
background-color: yellow;
|
||||
background-color: orange;
|
||||
}
|
||||
.bar-block-low {
|
||||
background-color: orange;
|
||||
background-color: yellow;
|
||||
}
|
||||
.bar-block-none {
|
||||
background-color: green;
|
||||
@ -84,7 +84,24 @@ export const SCANNING_STYLES: string = `
|
||||
.refresh-btn:hover {
|
||||
color: #007CBB;
|
||||
}
|
||||
.tip-icon-low {
|
||||
|
||||
.label.label-medium{
|
||||
background-color: #ffe4a9;
|
||||
border: 1px solid orange;
|
||||
color: orange;
|
||||
}
|
||||
.tip-icon-medium {
|
||||
color: orange;
|
||||
}
|
||||
.label.label-low{
|
||||
background: rgba(251, 255, 0, 0.38);
|
||||
color: #c5c50b;
|
||||
border: 1px solid #e6e63f;
|
||||
}
|
||||
.tip-icon-low {
|
||||
color: yellow;
|
||||
}
|
||||
.font-color-green{
|
||||
color:green;
|
||||
}
|
||||
`;
|
@ -16,15 +16,15 @@ export const TIP_COMPONENT_HTML: string = `
|
||||
<span>{{highCount}} {{'VULNERABILITY.SEVERITY.HIGH' | translate }}</span>
|
||||
</div>
|
||||
<div *ngIf="hasMedium" class="bar-summary-item">
|
||||
<clr-icon *ngIf="hasMedium" shape="exclamation-triangle" class="is-warning" size="22"></clr-icon>
|
||||
<clr-icon *ngIf="hasMedium" shape="exclamation-triangle" class="tip-icon-medium" size="22"></clr-icon>
|
||||
<span>{{mediumCount}} {{'VULNERABILITY.SEVERITY.MEDIUM' | translate }}</span>
|
||||
</div>
|
||||
<div *ngIf="hasLow" class="bar-summary-item">
|
||||
<clr-icon shape="info-circle" class="tip-icon-low" size="24"></clr-icon>
|
||||
<clr-icon shape="play" class="tip-icon-low rotate-90" size="20"></clr-icon>
|
||||
<span>{{lowCount}} {{'VULNERABILITY.SEVERITY.LOW' | translate }}</span>
|
||||
</div>
|
||||
<div *ngIf="hasUnknown" class="bar-summary-item">
|
||||
<clr-icon shape="help" size="20"></clr-icon>
|
||||
<clr-icon shape="help" size="18" style="margin-left: 3px;"></clr-icon>
|
||||
<span>{{unknownCount}} {{'VULNERABILITY.SEVERITY.UNKNOWN' | translate }}</span>
|
||||
</div>
|
||||
<div *ngIf="hasNone" class="bar-summary-item">
|
||||
@ -64,14 +64,19 @@ export const GRID_COMPONENT_HTML: string = `
|
||||
<clr-dg-cell>{{res.id}}</clr-dg-cell>
|
||||
<clr-dg-cell [ngSwitch]="res.severity">
|
||||
<span *ngSwitchCase="5" class="label label-danger">{{severityText(res.severity) | translate}}</span>
|
||||
<span *ngSwitchCase="4" class="label label-warning">{{severityText(res.severity) | translate}}</span>
|
||||
<span *ngSwitchCase="3" class="label label-success">{{severityText(res.severity) | translate}}</span>
|
||||
<span *ngSwitchCase="1" class="label label-info">{{severityText(res.severity) | translate}}</span>
|
||||
<span *ngSwitchCase="4" class="label label-medium">{{severityText(res.severity) | translate}}</span>
|
||||
<span *ngSwitchCase="3" class="label label-low">{{severityText(res.severity) | translate}}</span>
|
||||
<span *ngSwitchCase="1" class="label">{{severityText(res.severity) | translate}}</span>
|
||||
<span *ngSwitchDefault>{{severityText(res.severity) | translate}}</span>
|
||||
</clr-dg-cell>
|
||||
<clr-dg-cell>{{res.package}}</clr-dg-cell>
|
||||
<clr-dg-cell>{{res.version}}</clr-dg-cell>
|
||||
<clr-dg-cell>{{res.fixedVersion}}</clr-dg-cell>
|
||||
<clr-dg-cell>
|
||||
<div *ngIf="res.fixedVersion; else elseBlock">
|
||||
<clr-icon shape="wrench" class="is-success" size="20"></clr-icon> <span class="font-color-green">{{res.fixedVersion}}</span>
|
||||
</div>
|
||||
<ng-template #elseBlock>{{res.fixedVersion}}</ng-template>
|
||||
</clr-dg-cell>
|
||||
<clr-dg-row-detail *clrIfExpanded>
|
||||
{{'VULNERABILITY.GRID.COLUMN_DESCRIPTION' | translate}}: {{res.description}}
|
||||
</clr-dg-row-detail>
|
||||
|
@ -167,7 +167,7 @@
|
||||
text-align: center;
|
||||
margin-top: 3px;
|
||||
position: relative;
|
||||
bottom: -2px;
|
||||
bottom: 12px;
|
||||
}
|
||||
|
||||
.esxc-gauge-small .esxc-title .esxc-bar-title {
|
||||
|
@ -44,8 +44,8 @@
|
||||
.statistic-item-divider {
|
||||
height: 54px;
|
||||
display: inline-block;
|
||||
width: 1px;
|
||||
background-color: #ccc;
|
||||
width: 2px;
|
||||
background-color: #bdbdbd;
|
||||
opacity: 0.55;
|
||||
margin-left: 4px;
|
||||
margin-right: 12px;
|
||||
|
@ -40,3 +40,10 @@
|
||||
.modal-header{
|
||||
padding: 0;
|
||||
}
|
||||
.rotate-90 {
|
||||
-webkit-transform: rotate(-90deg);
|
||||
-moz-transform: rotate(-90deg);
|
||||
-ms-transform: rotate(-90deg);
|
||||
-o-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user