[Cherry-pick]Fix ui issues found in testing-day-round-2 (#17358)

Fix ui issues found in testing-day-round-2

Signed-off-by: AllForNothing <sshijun@vmware.com>

src/portal/src/app/base/left-side-nav/clearing-job/audit-log-purge/history/purge-history.component.ts

@@ -5,7 +5,6 @@ import {
     ConfirmationButtons,
     ConfirmationState,
     ConfirmationTargets,
-    REFRESH_TIME_DIFFERENCE,
 } from 'src/app/shared/entities/shared.const';
 import { ErrorHandler } from 'src/app/shared/units/error-handler/error-handler';
 import {
@@ -16,7 +15,12 @@ import {
     setPageSizeToLocalStorage,
 } from 'src/app/shared/units/utils';
 import { PurgeService } from '../../../../../../../ng-swagger-gen/services/purge.service';
-import { JOB_STATUS, NO, YES } from '../../clearing-job-interfact';
+import {
+    JOB_STATUS,
+    NO,
+    REFRESH_STATUS_TIME_DIFFERENCE,
+    YES,
+} from '../../clearing-job-interfact';
 import { ConfirmationMessage } from '../../../../global-confirmation-dialog/confirmation-message';
 import { ConfirmationDialogService } from '../../../../global-confirmation-dialog/confirmation-dialog.service';
 import { ExecHistory } from '../../../../../../../ng-swagger-gen/models/exec-history';
@@ -159,8 +163,8 @@ export class PurgeHistoryComponent implements OnInit, OnDestroy {
                     // to avoid some jobs not finished.
                     if (!this.timerDelay) {
                         this.timerDelay = timer(
-                            REFRESH_TIME_DIFFERENCE,
+                            REFRESH_STATUS_TIME_DIFFERENCE,
-                            REFRESH_TIME_DIFFERENCE
+                            REFRESH_STATUS_TIME_DIFFERENCE
                         ).subscribe(() => {
                             let count: number = 0;
                             this.jobs.forEach(job => {

src/portal/src/app/base/left-side-nav/clearing-job/audit-log-purge/set-job/set-job.component.html

@@ -8,7 +8,7 @@
         </div>
         <div class="clr-col">
             <div class="clr-row">
-                <div class="clr-col-4">
+                <div class="p-06 mr-2">
                     <span class="mr-1 font-style">{{
                         'CLEARANCES.LAST_COMPLETED' | translate
                     }}</span>
@@ -31,7 +31,7 @@
                         </ng-container>
                     </span>
                 </div>
-                <div class="clr-col">
+                <div class="p-06">
                     <span class="mr-1 font-style" *ngIf="nextScheduledTime">{{
                         'CLEARANCES.NEXT_SCHEDULED_TIME' | translate
                     }}</span>

src/portal/src/app/base/left-side-nav/clearing-job/audit-log-purge/set-job/set-job.component.scss

@@ -46,3 +46,8 @@
 .pt {
     padding-right: 1rem;
 }
+
+.p-06 {
+    padding-left: .6rem;
+    padding-right: .6rem;
+}

src/portal/src/app/base/left-side-nav/clearing-job/gc-page/gc/gc-history/gc-history.component.ts

@@ -5,7 +5,6 @@ import {
     ConfirmationButtons,
     ConfirmationState,
     ConfirmationTargets,
-    REFRESH_TIME_DIFFERENCE,
 } from '../../../../../../shared/entities/shared.const';
 import { GcService } from '../../../../../../../../ng-swagger-gen/services/gc.service';
 import {
@@ -18,7 +17,12 @@ import {
 import { ClrDatagridStateInterface } from '@clr/angular';
 import { finalize } from 'rxjs/operators';
 import { GCHistory } from '../../../../../../../../ng-swagger-gen/models/gchistory';
-import { JOB_STATUS, NO, YES } from '../../../clearing-job-interfact';
+import {
+    JOB_STATUS,
+    NO,
+    REFRESH_STATUS_TIME_DIFFERENCE,
+    YES,
+} from '../../../clearing-job-interfact';
 import { ConfirmationMessage } from '../../../../../global-confirmation-dialog/confirmation-message';
 import { ConfirmationDialogService } from '../../../../../global-confirmation-dialog/confirmation-dialog.service';
 
@@ -161,8 +165,8 @@ export class GcHistoryComponent implements OnInit, OnDestroy {
                     // to avoid some jobs not finished.
                     if (!this.timerDelay) {
                         this.timerDelay = timer(
-                            REFRESH_TIME_DIFFERENCE,
+                            REFRESH_STATUS_TIME_DIFFERENCE,
-                            REFRESH_TIME_DIFFERENCE
+                            REFRESH_STATUS_TIME_DIFFERENCE
                         ).subscribe(() => {
                             let count: number = 0;
                             this.jobs.forEach(job => {

src/portal/src/app/base/left-side-nav/clearing-job/gc-page/gc/gc.component.html

@@ -8,7 +8,7 @@
         </div>
         <div class="clr-col">
             <div class="clr-row">
-                <div class="clr-col-4">
+                <div class="p-06 mr-2">
                     <span class="mr-1 font-style">{{
                         'CLEARANCES.LAST_COMPLETED' | translate
                     }}</span>
@@ -31,7 +31,7 @@
                         </ng-container>
                     </span>
                 </div>
-                <div class="clr-col">
+                <div class="p-06">
                     <span class="mr-1 font-style" *ngIf="nextScheduledTime">{{
                         'CLEARANCES.NEXT_SCHEDULED_TIME' | translate
                     }}</span>

src/portal/src/app/base/left-side-nav/clearing-job/gc-page/gc/gc.component.scss

@@ -30,3 +30,8 @@
     justify-content: center;
     align-items: center;
 }
+
+.p-06 {
+    padding-left: .6rem;
+    padding-right: .6rem;
+}

src/portal/src/app/base/project/project-detail/project-detail.component.html

@@ -49,7 +49,7 @@
         <div class="card" *ngIf="hasQuotaReadPermission">
             <div class="card-block container">
                 <div class="head">
-                    {{ 'STATISTICS.STORAGE_USED' | translate }}
+                    {{ 'QUOTA.QUOTA_USED' | translate }}
                 </div>
                 <div class="storage-used font-weight-700">
                     <div *ngIf="projectQuota">

src/portal/src/i18n/lang/de-de-lang.json

@@ -1184,7 +1184,8 @@
         "UNLIMITED": "unlimitiert",
         "INVALID_INPUT": "ungültige Eingabe",
         "PLACEHOLDER": "Es konnten keine Begrenzungen gefunden werden",
-        "FILTER_PLACEHOLDER": "Suche nach Name (genaue Übereinstimmung)"
+        "FILTER_PLACEHOLDER": "Suche nach Name (genaue Übereinstimmung)",
+        "QUOTA_USED": "Quota used"
     },
     "WEEKLY": {
         "MONDAY": "Montag",

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

@@ -1184,7 +1184,8 @@
         "UNLIMITED": "unlimited",
         "INVALID_INPUT": "invalid input",
         "PLACEHOLDER": "We couldn't find any project quotas",
-        "FILTER_PLACEHOLDER": "Search by name(exact match)"
+        "FILTER_PLACEHOLDER": "Search by name(exact match)",
+        "QUOTA_USED": "Quota used"
     },
     "WEEKLY": {
         "MONDAY": "Monday",

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

@@ -1186,7 +1186,8 @@
         "UNLIMITED": "unlimited",
         "INVALID_INPUT": "invalid input",
         "PLACEHOLDER": "We couldn't find any project quotas",
-        "FILTER_PLACEHOLDER": "Search by name(exact match)"
+        "FILTER_PLACEHOLDER": "Search by name(exact match)",
+        "QUOTA_USED": "Quota used"
     },
     "WEEKLY": {
         "MONDAY": "Monday",

src/portal/src/i18n/lang/fr-fr-lang.json

@@ -1158,7 +1158,8 @@
         "UNLIMITED": "Illimité",
         "INVALID_INPUT": "Saisie non valide",
         "PLACEHOLDER": "Nous n'avons trouvé aucun quota de projet !",
-        "FILTER_PLACEHOLDER": "Chercher par nom (correspondance exacte)"
+        "FILTER_PLACEHOLDER": "Chercher par nom (correspondance exacte)",
+        "QUOTA_USED": "Quota used"
     },
     "WEEKLY": {
         "MONDAY": "Lundi",

src/portal/src/i18n/lang/pt-br-lang.json

@@ -1177,7 +1177,8 @@
         "UNLIMITED": "∞",
         "INVALID_INPUT": "valor inválido",
         "PLACEHOLDER": "Nenhuma limite encontrado nos projetos",
-        "FILTER_PLACEHOLDER": "Buscar pelo nome (exato)"
+        "FILTER_PLACEHOLDER": "Buscar pelo nome (exato)",
+        "QUOTA_USED": "Quota used"
     },
     "WEEKLY": {
         "MONDAY": "Segunda Feira",

src/portal/src/i18n/lang/tr-tr-lang.json

@@ -1184,7 +1184,8 @@
         "UNLIMITED": "sınırsız",
         "INVALID_INPUT": "geçersiz giriş",
         "PLACEHOLDER": "We couldn't find any project quotas",
-        "FILTER_PLACEHOLDER": "Search by name(exact match)"
+        "FILTER_PLACEHOLDER": "Search by name(exact match)",
+        "QUOTA_USED": "Quota used"
     },
     "WEEKLY": {
         "MONDAY": "Pazartesi",

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

@@ -1185,7 +1185,8 @@
         "UNLIMITED": "不设限",
         "INVALID_INPUT": "输入错误",
         "PLACEHOLDER": "我们找不到任何可以配置定额的项目",
-        "FILTER_PLACEHOLDER": "按名称查找（完全匹配）"
+        "FILTER_PLACEHOLDER": "按名称查找（完全匹配）",
+        "QUOTA_USED": "已使用的配额"
     },
     "WEEKLY": {
         "MONDAY": "周一",

src/portal/src/i18n/lang/zh-tw-lang.json

@@ -1180,7 +1180,8 @@
     "UNLIMITED": "不設限",
     "INVALID_INPUT": "輸入錯誤",
     "PLACEHOLDER": "我們找不到任何可以配置定額的項目",
-    "FILTER_PLACEHOLDER": "Search by name(exact match)"
+    "FILTER_PLACEHOLDER": "Search by name(exact match)",
+    "QUOTA_USED": "Quota used"
   },
   "WEEKLY":{
     "MONDAY": "週一",