diff --git a/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/security-hub.component.scss b/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/security-hub.component.scss index 781b07802bb..fb1c6f12744 100644 --- a/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/security-hub.component.scss +++ b/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/security-hub.component.scss @@ -63,3 +63,7 @@ .min-width { min-width: 9rem !important; } + +.label { + min-width: 3rem; +} diff --git a/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/security-hub.interface.ts b/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/security-hub.interface.ts index fc677aea797..ae768bc66c5 100644 --- a/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/security-hub.interface.ts +++ b/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/security-hub.interface.ts @@ -93,3 +93,12 @@ export function getRepoLink(proId: number | string, repoName: string): any { } export const CVSS3_REG = /^([0-9]|10)(\.\d)?$/; + +export enum SeverityColors { + CRITICAL = '#FF4D2E', + HIGH = '#FF8F3D', + MEDIUM = '#FFCE66', + LOW = '#FFF1AD', + NONE = '#2EC0FF', + NA = 'gray', +} diff --git a/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/single-bar/single-bar.component.ts b/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/single-bar/single-bar.component.ts index 12571c3cc3e..e85ea3270c8 100644 --- a/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/single-bar/single-bar.component.ts +++ b/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/single-bar/single-bar.component.ts @@ -9,6 +9,8 @@ import { } from '@angular/core'; import { DangerousArtifact } from '../../../../../../../ng-swagger-gen/models/dangerous-artifact'; import * as echarts from 'echarts/core'; +import { SeverityColors } from '../security-hub.interface'; +import { TranslateService } from '@ngx-translate/core'; @Component({ selector: 'app-single-bar', @@ -23,6 +25,8 @@ export class SingleBarComponent implements OnChanges { @ViewChild('container', { static: true }) container: ElementRef; + constructor(private translate: TranslateService) {} + ngOnChanges(changes: SimpleChanges) { if (changes && changes['dangerousArtifact']) { this.initChart(); @@ -31,74 +35,87 @@ export class SingleBarComponent implements OnChanges { initChart() { const chart = echarts.init(this.container.nativeElement); - chart.setOption({ - color: ['red', '#e64524', 'orange'], - title: { - text: '', - }, - tooltip: { - formatter: '{b}: {c}', - textStyle: { - fontSize: '12px', - whiteSpace: 'nowrap', + const [severity, c, h, m] = [ + 'VULNERABILITY.GRID.COLUMN_SEVERITY', + 'VULNERABILITY.SEVERITY.CRITICAL', + 'VULNERABILITY.SEVERITY.HIGH', + 'VULNERABILITY.SEVERITY.MEDIUM', + ]; + this.translate.get([severity, c, h, m]).subscribe(res => { + chart.setOption({ + color: [ + SeverityColors.CRITICAL, + SeverityColors.HIGH, + SeverityColors.MEDIUM, + ], + title: { + text: '', }, - }, - legend: { - show: false, - }, - series: [ - { - type: 'pie', - radius: '65%', - name: 'Severity', - // adjust the start angle - startAngle: 180, - itemStyle: { - borderRadius: 2, - borderWidth: 1, - }, - labelLine: { - show: false, + tooltip: { + formatter: '{b}: {c}', + textStyle: { + fontSize: '12px', + whiteSpace: 'nowrap', }, - label: { - show: true, - position: 'inside', - formatter: '{c}', - fontSize: '9px', - }, - data: [ - { - name: 'Critical', - value: this.dangerousArtifact?.critical_cnt || 0, + }, + legend: { + show: false, + }, + series: [ + { + type: 'pie', + radius: '65%', + name: res[severity], + // adjust the start angle + startAngle: 180, + itemStyle: { + borderRadius: 2, + borderWidth: 1, }, - { - name: 'High', - value: this.dangerousArtifact?.high_cnt || 0, + labelLine: { + show: false, }, - { - name: 'Medium', - value: this.dangerousArtifact?.medium_cnt || 0, + label: { + show: true, + position: 'inside', + formatter: '{c}', + fontSize: '9px', }, - { - // make a record to fill the bottom 50% - value: - this.dangerousArtifact?.critical_cnt + - this.dangerousArtifact?.high_cnt + - this.dangerousArtifact?.medium_cnt || 0, - itemStyle: { - // stop the chart from rendering this piece - color: 'none', - decal: { - symbol: 'none', - }, + data: [ + { + name: res[c], + value: + this.dangerousArtifact?.critical_cnt || 0, }, - label: { - show: false, + { + name: res[h], + value: this.dangerousArtifact?.high_cnt || 0, }, - }, - ], - }, - ], + { + name: res[m], + value: this.dangerousArtifact?.medium_cnt || 0, + }, + { + // make a record to fill the bottom 50% + value: + this.dangerousArtifact?.critical_cnt + + this.dangerousArtifact?.high_cnt + + this.dangerousArtifact?.medium_cnt || 0, + itemStyle: { + // stop the chart from rendering this piece + color: 'none', + decal: { + symbol: 'none', + }, + }, + label: { + show: false, + }, + }, + ], + }, + ], + }); }); } } diff --git a/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/vulnerability-summary/vulnerability-summary.component.scss b/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/vulnerability-summary/vulnerability-summary.component.scss index c1ab3e578d4..1641295b787 100644 --- a/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/vulnerability-summary/vulnerability-summary.component.scss +++ b/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/vulnerability-summary/vulnerability-summary.component.scss @@ -106,3 +106,7 @@ $row-height: 48px; display: flex; align-items: center; } + +.label { + min-width: 3rem; +} diff --git a/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/vulnerability-summary/vulnerability-summary.component.ts b/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/vulnerability-summary/vulnerability-summary.component.ts index 154f8ecff83..19b3b947f11 100644 --- a/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/vulnerability-summary/vulnerability-summary.component.ts +++ b/src/portal/src/app/base/left-side-nav/interrogation-services/vulnerability-database/vulnerability-summary/vulnerability-summary.component.ts @@ -11,7 +11,12 @@ import { import { SecurityhubService } from '../../../../../../../ng-swagger-gen/services/securityhub.service'; import { SecuritySummary } from '../../../../../../../ng-swagger-gen/models/security-summary'; import { MessageHandlerService } from '../../../../../shared/services/message-handler.service'; -import { getDigestLink, severityText, VUL_ID } from '../security-hub.interface'; +import { + getDigestLink, + SeverityColors, + severityText, + VUL_ID, +} from '../security-hub.interface'; import { HAS_STYLE_MODE, StyleMode } from '../../../../../services/theme'; import { Subscription } from 'rxjs'; import { @@ -97,7 +102,14 @@ export class VulnerabilitySummaryComponent implements OnInit, OnDestroy { ]; this.translate.get([severity, c, h, m, l, n, u]).subscribe(res => { this.chart.setOption({ - color: ['red', '#e64524', 'orange', '#007CBB', 'grey', 'green'], + color: [ + SeverityColors.CRITICAL, + SeverityColors.HIGH, + SeverityColors.MEDIUM, + SeverityColors.LOW, + SeverityColors.NA, + SeverityColors.NONE, + ], title: { text: '', }, diff --git a/src/portal/src/app/base/project/repository/artifact/artifact-additions/artifact-vulnerabilities/artifact-vulnerabilities.component.scss b/src/portal/src/app/base/project/repository/artifact/artifact-additions/artifact-vulnerabilities/artifact-vulnerabilities.component.scss index bac49939130..2ae65b86540 100644 --- a/src/portal/src/app/base/project/repository/artifact/artifact-additions/artifact-vulnerabilities/artifact-vulnerabilities.component.scss +++ b/src/portal/src/app/base/project/repository/artifact/artifact-additions/artifact-vulnerabilities/artifact-vulnerabilities.component.scss @@ -58,3 +58,7 @@ .mt-5px { margin-top: 5px; } + +.label { + min-width: 3rem; +} diff --git a/src/portal/src/app/base/project/repository/artifact/artifact.module.ts b/src/portal/src/app/base/project/repository/artifact/artifact.module.ts index 528fb0e9f75..bd4f49961b2 100644 --- a/src/portal/src/app/base/project/repository/artifact/artifact.module.ts +++ b/src/portal/src/app/base/project/repository/artifact/artifact.module.ts @@ -14,7 +14,6 @@ import { BuildHistoryComponent } from './artifact-additions/build-history/build- import { ArtifactVulnerabilitiesComponent } from './artifact-additions/artifact-vulnerabilities/artifact-vulnerabilities.component'; import { ArtifactDefaultService, ArtifactService } from './artifact.service'; import { ArtifactDetailRoutingResolverService } from '../../../../services/routing-resolvers/artifact-detail-routing-resolver.service'; -import { ResultTipComponent } from './vulnerability-scanning/result-tip.component'; import { ResultBarChartComponent } from './vulnerability-scanning/result-bar-chart.component'; import { ResultTipHistogramComponent } from './vulnerability-scanning/result-tip-histogram/result-tip-histogram.component'; import { HistogramChartComponent } from './vulnerability-scanning/histogram-chart/histogram-chart.component'; @@ -80,7 +79,6 @@ const routes: Routes = [ DependenciesComponent, BuildHistoryComponent, ArtifactVulnerabilitiesComponent, - ResultTipComponent, ResultBarChartComponent, ResultTipHistogramComponent, HistogramChartComponent, diff --git a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-bar-chart.component.spec.ts b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-bar-chart.component.spec.ts index c0eb04b0548..1325491865b 100644 --- a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-bar-chart.component.spec.ts +++ b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-bar-chart.component.spec.ts @@ -1,6 +1,5 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ResultBarChartComponent } from './result-bar-chart.component'; -import { ResultTipComponent } from './result-tip.component'; import { ResultTipHistogramComponent } from './result-tip-histogram/result-tip-histogram.component'; import { HistogramChartComponent } from './histogram-chart/histogram-chart.component'; import { @@ -35,7 +34,6 @@ describe('ResultBarChartComponent (inline template)', () => { imports: [SharedTestingModule], declarations: [ ResultBarChartComponent, - ResultTipComponent, ResultTipHistogramComponent, HistogramChartComponent, ], diff --git a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.scss b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.scss index 0c54c7ad34b..036339899ba 100644 --- a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.scss +++ b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.scss @@ -125,21 +125,10 @@ $twenty-two-pixel: 18px; } } -.label.label-medium { - background-color: #ffe4a9; - border: 1px solid orange; - color: orange; -} - .tip-icon-medium { color: orange; } -.label.label-low { - background: rgb(251 255 0 / 38%); - color: #c5c50b; - border: 1px solid #e6e63f; -} .tip-icon-low { color: #007CBB; @@ -178,30 +167,6 @@ hr { margin-left: 3px; } -.shadow-critical { - box-shadow: 1px -1px 1px red; -} - -.shadow-high { - box-shadow: 1px -1px 1px #e64524; -} - -.shadow-medium { - box-shadow: 1px -1px 1px orange; -} - -.shadow-low { - box-shadow: 1px -1px 1px #007CBB; -} - -.shadow-none { - box-shadow: 1px -1px 1px green; -} - -.shadow-unknown { - box-shadow: 1px -1px 1px gray; -} - .w-360 { width: 360px !important; } @@ -248,23 +213,23 @@ hr { } .level-critical { - background:red; - color:red; + background:#FF4D2E; + color:#FF4D2E; } .level-high { - background:#e64524; - color:#e64524; + background:#FF8F3D; + color:#FF8F3D; } .level-medium { - background-color: orange; - color:orange; + background-color: #FFCE66; + color:#FFCE66; } .level-low { - background: #007CBB; - color:#007CBB; + background: #FFF1AD; + color:#FFF1AD; } .level-none { diff --git a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.ts b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.ts index f3657c33d0f..d349168e587 100644 --- a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.ts +++ b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip-histogram/result-tip-histogram.component.ts @@ -9,6 +9,7 @@ import { VULNERABILITY_SEVERITY, } from '../../../../../../shared/units/utils'; import { HAS_STYLE_MODE, StyleMode } from '../../../../../../services/theme'; +import { SeverityColors } from '../../../../../left-side-nav/interrogation-services/vulnerability-database/security-hub.interface'; const MIN = 60; const MIN_STR = 'min '; @@ -229,27 +230,27 @@ export class ResultTipHistogramComponent implements OnInit { { text: 'VULNERABILITY.SEVERITY.CRITICAL', value: this.criticalCount ? this.criticalCount : 0, - color: 'red', + color: SeverityColors.CRITICAL, }, { text: 'VULNERABILITY.SEVERITY.HIGH', value: this.highCount ? this.highCount : 0, - color: '#e64524', + color: SeverityColors.HIGH, }, { text: 'VULNERABILITY.SEVERITY.MEDIUM', value: this.mediumCount ? this.mediumCount : 0, - color: 'orange', + color: SeverityColors.MEDIUM, }, { text: 'VULNERABILITY.SEVERITY.LOW', value: this.lowCount ? this.lowCount : 0, - color: '#007CBB', + color: SeverityColors.LOW, }, { text: 'VULNERABILITY.SEVERITY.NONE', value: this.noneCount ? this.noneCount : 0, - color: 'grey', + color: SeverityColors.NA, }, ]; } diff --git a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip.component.html b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip.component.html deleted file mode 100644 index 9bea41ba400..00000000000 --- a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip.component.html +++ /dev/null @@ -1,176 +0,0 @@ -
- -
-
-
-
-
-
-
- -
- - - {{ 'VULNERABILITY.OVERALL_SEVERITY' | translate }} - {{ - 'VULNERABILITY.SEVERITY.HIGH' - | translate - | titlecase - }} - - - - {{ 'VULNERABILITY.OVERALL_SEVERITY' | translate }} - {{ - 'VULNERABILITY.SEVERITY.MEDIUM' - | translate - | titlecase - }} - - - - {{ 'VULNERABILITY.OVERALL_SEVERITY' | translate }} - {{ - 'VULNERABILITY.SEVERITY.LOW' | translate | titlecase - }} - - - - {{ 'VULNERABILITY.OVERALL_SEVERITY' | translate }} - {{ - 'VULNERABILITY.SEVERITY.UNKNOWN' - | translate - | titlecase - }} - - - - {{ - 'VULNERABILITY.NO_VULNERABILITY' | translate - }} - -
-
-
- {{ - tipTitle - }} -
-
-
- - {{ highCount }}{{ getPackageText(highCount) | translate }} - {{ haveText(highCount) | translate }} - {{ 'VULNERABILITY.SEVERITY.HIGH' | translate }} - {{ unitText(highCount) | translate }} -
-
- - {{ mediumCount }}{{ getPackageText(mediumCount) | translate }} - {{ haveText(mediumCount) | translate }} - {{ 'VULNERABILITY.SEVERITY.MEDIUM' | translate }} - {{ unitText(mediumCount) | translate }} -
-
- - {{ lowCount }}{{ getPackageText(lowCount) | translate }} - {{ haveText(lowCount) | translate }} - {{ 'VULNERABILITY.SEVERITY.LOW' | translate }} - {{ unitText(lowCount) | translate }} -
-
- - {{ unknownCount }}{{ getPackageText(unknownCount) | translate }} - {{ haveText(unknownCount) | translate }} - {{ 'VULNERABILITY.SEVERITY.UNKNOWN' | translate }} - {{ unitText(unknownCount) | translate }} -
-
- - {{ noneCount }}{{ - 'VULNERABILITY.SEVERITY.NONE' | translate - }} -
-
-
- {{ 'VULNERABILITY.CHART.SCANNING_TIME' | translate }} - - {{ - completeTimestamp | harborDatetime : 'MM/dd/y HH:mm:ss' - }} -
-
-
-
diff --git a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip.component.spec.ts b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip.component.spec.ts deleted file mode 100644 index 91c97c5cf35..00000000000 --- a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip.component.spec.ts +++ /dev/null @@ -1,67 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { ResultTipComponent } from './result-tip.component'; -import { - UserPermissionDefaultService, - UserPermissionService, - VulnerabilitySummary, -} from '../../../../../shared/services'; -import { VULNERABILITY_SCAN_STATUS } from '../../../../../shared/units/utils'; -import { SharedTestingModule } from '../../../../../shared/shared.module'; - -describe('ResultTipComponent (inline template)', () => { - let component: ResultTipComponent; - let fixture: ComponentFixture; - let mockData: VulnerabilitySummary = { - scan_status: VULNERABILITY_SCAN_STATUS.SUCCESS, - severity: 'High', - end_time: new Date(), - summary: { - total: 124, - fixable: 50, - summary: { - High: 5, - Low: 5, - }, - }, - }; - - beforeEach(async () => { - await TestBed.configureTestingModule({ - imports: [SharedTestingModule], - declarations: [ResultTipComponent], - providers: [ - { - provide: UserPermissionService, - useClass: UserPermissionDefaultService, - }, - ], - }).compileComponents(); - }); - - beforeEach(() => { - fixture = TestBed.createComponent(ResultTipComponent); - component = fixture.componentInstance; - component.summary = mockData; - - fixture.detectChanges(); - }); - - it('should be created', () => { - expect(component).toBeTruthy(); - }); - - it('should reader the bar with different width', () => { - fixture.detectChanges(); - fixture.whenStable().then(() => { - fixture.detectChanges(); - let el: HTMLElement = - fixture.nativeElement.querySelector('.bar-block-none'); - expect(el).not.toBeNull(); - expect(el.style.width).toEqual('0px'); - let el2: HTMLElement = - fixture.nativeElement.querySelector('.bar-block-high'); - expect(el2).not.toBeNull(); - expect(el2.style.width).toEqual('0px'); - }); - }); -}); diff --git a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip.component.ts b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip.component.ts deleted file mode 100644 index dbd5d80ba9a..00000000000 --- a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/result-tip.component.ts +++ /dev/null @@ -1,198 +0,0 @@ -import { Component, Input } from '@angular/core'; -import { - VulnerabilitySeverity, - VulnerabilitySummary, -} from '../../../../../shared/services'; -import { VULNERABILITY_SCAN_STATUS } from '../../../../../shared/units/utils'; - -export const MIN_TIP_WIDTH = 5; -export const MAX_TIP_WIDTH = 100; - -@Component({ - selector: 'hbr-vulnerability-summary-chart', - templateUrl: './result-tip.component.html', - styleUrls: ['./scanning.scss'], -}) -export class ResultTipComponent { - _tipTitle: string = ''; - _highCount: number = 0; - _mediumCount: number = 0; - _lowCount: number = 0; - _unknownCount: number = 0; - _noneCount: number = 0; - - totalPackages: number = 0; - packagesWithVul: number = 0; - - @Input() summary: VulnerabilitySummary = { - scan_status: VULNERABILITY_SCAN_STATUS.NOT_SCANNED, - severity: '', - end_time: new Date(), - }; - - get scanLevel() { - let level; - if (this._highCount && this._highCount >= 1) { - level = VulnerabilitySeverity.HIGH; - } else if (this._mediumCount && this._mediumCount >= 1) { - level = VulnerabilitySeverity.MEDIUM; - } else if (this._lowCount && this._lowCount >= 1) { - level = VulnerabilitySeverity.LOW; - } else if (this._unknownCount && this._unknownCount >= 1) { - level = VulnerabilitySeverity.UNKNOWN; - } else if (this.totalPackages === 0) { - level = VulnerabilitySeverity.UNKNOWN; - } else { - level = VulnerabilitySeverity.NONE; - } - return level; - } - - constructor() {} - - tipWidth(severity: VulnerabilitySeverity): string { - let n: number = 0; - let m: number = this.totalPackages; - - if (m === 0) { - // If no packages recognized, then show grey - if (severity === VulnerabilitySeverity.UNKNOWN) { - return MAX_TIP_WIDTH + 'px'; - } else { - return 0 + 'px'; - } - } - - switch (severity) { - case VulnerabilitySeverity.HIGH: - n = this.highCount; - break; - case VulnerabilitySeverity.MEDIUM: - n = this.mediumCount; - break; - case VulnerabilitySeverity.LOW: - n = this.lowCount; - break; - case VulnerabilitySeverity.UNKNOWN: - n = this.unknownCount; - break; - case VulnerabilitySeverity.NONE: - // Show all the left as green bar - n = - m - - (this.highCount + - this.mediumCount + - this.lowCount + - this.unknownCount); - if (n < 0) { - n = 0; - } - break; - default: - n = 0; - break; - } - - let width: number = Math.round((n / m) * MAX_TIP_WIDTH); - if (width > 0 && width < MIN_TIP_WIDTH) { - width = MIN_TIP_WIDTH; - } - - return width + 'px'; - } - - unitText(count: number): string { - if (count > 1) { - return 'VULNERABILITY.PLURAL'; - } - - return 'VULNERABILITY.SINGULAR'; - } - - packageText(count: number): string { - return count > 1 ? 'VULNERABILITY.PACKAGES' : 'VULNERABILITY.PACKAGE'; - } - - getPackageText(count: number): string { - return count > 1 - ? 'VULNERABILITY.GRID.COLUMN_PACKAGES' - : 'VULNERABILITY.GRID.COLUMN_PACKAGE'; - } - - haveText(count: number): string { - return count > 1 ? 'TAG.HAVE' : 'TAG.HAS'; - } - - public get completeTimestamp(): Date { - return this.summary && this.summary.end_time - ? this.summary.end_time - : new Date(); - } - - public get hasHigh(): boolean { - return this.highCount > 0; - } - - public get hasMedium(): boolean { - return this.mediumCount > 0; - } - - public get hasLow(): boolean { - return this.lowCount > 0; - } - - public get hasUnknown(): boolean { - return this.unknownCount > 0; - } - - public get hasNone(): boolean { - return this.noneCount > 0; - } - - public get tipTitle(): string { - return this._tipTitle; - } - - public get highCount(): number { - return this._highCount; - } - - public get mediumCount(): number { - return this._mediumCount; - } - - public get lowCount(): number { - return this._lowCount; - } - - public get unknownCount(): number { - return this._unknownCount; - } - public get noneCount(): number { - return this._noneCount; - } - - public get highSuffix(): string { - return this.unitText(this.highCount); - } - - public get mediumSuffix(): string { - return this.unitText(this.mediumCount); - } - - public get lowSuffix(): string { - return this.unitText(this.lowCount); - } - - public get unknownSuffix(): string { - return this.unitText(this.unknownCount); - } - - public get noneSuffix(): string { - return this.unitText(this.noneCount); - } - - public get maxWidth(): string { - return MAX_TIP_WIDTH + 20 + 'px'; - } -} diff --git a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/scanning.scss b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/scanning.scss index c8e714d5345..5d1f983356e 100644 --- a/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/scanning.scss +++ b/src/portal/src/app/base/project/repository/artifact/vulnerability-scanning/scanning.scss @@ -44,30 +44,6 @@ max-width: 120px; } -.bar-block-high { - background-color: #e64524; -} - -.bar-block-medium { - background-color: orange; -} - -.bar-block-low { - background-color: yellow; -} - -.bar-block-none { - background-color: green; -} - -.bar-block-unknown { - background-color: grey; -} - -.bar-tooltip-font { - font-size: 13px; - color: #fff; -} .bar-tooltip-font-title { font-weight: 600;