fix issue #2832

src/ui_ng/lib/src/vulnerability-scanning/result-tip.component.ts

@@ -66,9 +66,21 @@ export class ResultTipComponent implements OnInit {
                 }
             });
         }
+        this.translate.get(this.packageText(this.totalPackages)).subscribe((p1: string) => {
+            this.translate.get(this.packageText(this.packagesWithVul)).subscribe((p2: string) => {
+                this.translate.get(this.unitText(this.packagesWithVul)).subscribe((vul: string) => {
                     this.translate.get('VULNERABILITY.CHART.TOOLTIPS_TITLE',
-            { totalVulnerability: this.packagesWithVul, totalPackages: this.totalPackages })
+                        {
+                            totalVulnerability: this.packagesWithVul,
+                            totalPackages: this.totalPackages,
+                            package: p1,
+                            packageExt: p2,
+                            vulnerability: vul
+                        })
                         .subscribe((res: string) => this._tipTitle = res);
+                });
+            });
+        });
     }
 
     tipWidth(severity: VulnerabilitySeverity): string {

src/ui_ng/lib/src/vulnerability-scanning/scanning.css.ts

@@ -46,10 +46,10 @@ export const SCANNING_STYLES: string = `
     background-color: red;
 }
 .bar-block-medium {
-    background-color: orange;
+    background-color: yellow;
 }
 .bar-block-low {
-    background-color: yellow;
+    background-color: orange;
 }
 .bar-block-none {
     background-color: green;
@@ -84,4 +84,7 @@ export const SCANNING_STYLES: string = `
 .refresh-btn:hover {
     color: #007CBB;
 }
+.tip-icon-low {
+    color: orange;
+}
 `; 

src/ui_ng/lib/src/vulnerability-scanning/scanning.html.ts

@@ -13,23 +13,23 @@ export const TIP_COMPONENT_HTML: string = `
             <div class="bar-summary bar-tooltip-fon">
                 <div *ngIf="hasHigh" class="bar-summary-item">
                     <clr-icon shape="exclamation-circle" class="is-error" size="24"></clr-icon>
-                    <span>{{highCount}} {{packageText(highCount) | translate }} {{'VULNERABILITY.SEVERITY.HIGH' | translate }}</span>
+                    <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>
-                    <span>{{mediumCount}} {{packageText(mediumCount) | translate }} {{'VULNERABILITY.SEVERITY.MEDIUM' | translate }}</span>
+                    <span>{{mediumCount}} {{'VULNERABILITY.SEVERITY.MEDIUM' | translate }}</span>
                 </div>
                 <div *ngIf="hasLow" class="bar-summary-item">
-                    <clr-icon shape="info-circle" class="is-info" size="24"></clr-icon>
+                    <clr-icon shape="info-circle" class="tip-icon-low" size="24"></clr-icon>
-                    <span>{{lowCount}} {{packageText(lowCount) | translate }} {{'VULNERABILITY.SEVERITY.LOW' | translate }}</span>
+                    <span>{{lowCount}} {{'VULNERABILITY.SEVERITY.LOW' | translate }}</span>
                 </div>
                 <div *ngIf="hasUnknown" class="bar-summary-item">
                     <clr-icon shape="help" size="20"></clr-icon>
-                    <span>{{unknownCount}} {{packageText(unknownCount) | translate }} {{'VULNERABILITY.SEVERITY.UNKNOWN' | translate }}</span>
+                    <span>{{unknownCount}} {{'VULNERABILITY.SEVERITY.UNKNOWN' | translate }}</span>
                 </div>
                 <div *ngIf="hasNone" class="bar-summary-item">
                     <clr-icon shape="check-circle" class="is-success" size="24"></clr-icon>
-                    <span>{{noneCount}} {{packageText(noneCount) | translate }} {{'VULNERABILITY.SEVERITY.NONE' | translate }}</span>
+                    <span>{{noneCount}} {{'VULNERABILITY.SEVERITY.NONE' | translate }}</span>
                 </div>
             </div>
             <div>

src/ui_ng/package.json

@@ -31,7 +31,7 @@
         "clarity-icons": "^0.9.8",
         "clarity-ui": "^0.9.8",
         "core-js": "^2.4.1",
-        "harbor-ui": "0.3.47",
+        "harbor-ui": "0.3.49",
         "intl": "^1.2.5",
         "mutationobserver-shim": "^0.3.2",
         "ngx-cookie": "^1.0.0",

src/ui_ng/src/i18n/lang/en-us-lang.json

@@ -485,8 +485,8 @@
             "FOOT_OF": "of"
         },
         "CHART": {
-            "SCANNING_TIME": "Scan completed",
+            "SCANNING_TIME": "Scan completed datetime",
-            "TOOLTIPS_TITLE": "This tag has {{totalVulnerability}} package(s) with vulnerabilities across all {{totalPackages}} package(s)."
+            "TOOLTIPS_TITLE": "This image includes {{totalPackages}} {{package}} with {{vulnerability}} in {{totalVulnerability}} of the {{packageExt}}."
         },
         "SEVERITY": {
             "HIGH": "high",
@@ -499,8 +499,8 @@
         "SINGULAR": "Vulnerability",
         "PLURAL": "Vulnerabilities",
         "PLACEHOLDER": "Filter Vulnerabilities",
-        "PACKAGE": "Package with",
+        "PACKAGE": "package",
-        "PACKAGES": "Packages with",
+        "PACKAGES": "packages",
         "SCAN_NOW": "Scan",
         "JOB_LOG_VIEWER": "View Scanning Job Log"
     },

src/ui_ng/src/i18n/lang/es-es-lang.json

@@ -484,8 +484,8 @@
             "FOOT_OF": "of"
         },
         "CHART": {
-            "SCANNING_TIME": "Scan completed",
+            "SCANNING_TIME": "Scan completed datetime",
-            "TOOLTIPS_TITLE": "This tag has {{totalVulnerability}} package(s) with vulnerabilities across all {{totalPackages}} package(s)."
+            "TOOLTIPS_TITLE": "This image includes {{totalPackages}} {{package}} with {{vulnerability}} in {{totalVulnerability}} of the {{packageExt}}."
         },
         "SEVERITY": {
             "HIGH": "high",
@@ -498,8 +498,8 @@
         "SINGULAR": "Vulnerability",
         "PLURAL": "Vulnerabilities",
         "PLACEHOLDER": "Filter Vulnerabilities",
-        "PACKAGE": "Package with",
+        "PACKAGE": "package",
-        "PACKAGES": "Packages with",
+        "PACKAGES": "packages",
         "SCAN_NOW": "Scan",
         "JOB_LOG_VIEWER": "View Scanning Job Log"
     },

src/ui_ng/src/i18n/lang/zh-cn-lang.json

@@ -477,7 +477,7 @@
             "PLACEHOLDER": "没有扫描结果！",
             "COLUMN_ID": "缺陷码",
             "COLUMN_SEVERITY": "严重度",
-            "COLUMN_PACKAGE": "组",
+            "COLUMN_PACKAGE": "组件",
             "COLUMN_VERSION": "当前版本",
             "COLUMN_FIXED": "修复版本",
             "COLUMN_DESCRIPTION": "简介",
@@ -486,7 +486,7 @@
         },
         "CHART": {
             "SCANNING_TIME": "扫描完成",
-            "TOOLTIPS_TITLE": "在此镜像的{{totalPackages}}包中扫描出{{totalVulnerability}}个有缺陷的包。"
+            "TOOLTIPS_TITLE": "在此镜像总共包含{{totalPackages}}{{package}},其中{{totalVulnerability}}个{{packageExt}}含有{{vulnerability}}。"
         },
         "SEVERITY": {
             "HIGH": "严重",
@@ -496,11 +496,11 @@
             "UNKNOWN": "未知",
             "NONE": "无"
         },
-        "SINGULAR": "缺陷",
+        "SINGULAR": "漏洞",
-        "PLURAL": "缺陷",
+        "PLURAL": "漏洞",
-        "PLACEHOLDER": "过滤缺陷",
+        "PLACEHOLDER": "过滤漏洞",
-        "PACKAGE": "个组件有",
+        "PACKAGE": "组件",
-        "PACKAGES": "个组件有",
+        "PACKAGES": "组件",
         "SCAN_NOW": "扫描",
         "JOB_LOG_VIEWER": "查看扫描日志"
     },