Fix replication ui relate issues

Signed-off-by: FangyuanCheng <fangyuanc@vmware.com>

src/portal/lib/src/create-edit-rule/create-edit-rule.component.html

@@ -21,10 +21,12 @@
         <!-- replication mode -->
         <div class="form-group form-group-override">
           <label class="form-group-label-override">{{'REPLICATION.REPLI_MODE' | translate}}</label>
-          <div class="radio" style="display:inherit;">
+          <div class="radio-inline" [class.disabled]="policyId >= 0">
-            <input class="mode-base" type="radio" id="push_base" name="replicationMode" [value]=true  [disabled]="!(policyId<0)" [(ngModel)]="isPushMode" (change)="modeChange()" [ngModelOptions]="{standalone: true}">
+            <input type="radio" id="push_base" name="replicationMode" [value]=true  [disabled]="policyId >= 0" [(ngModel)]="isPushMode" (change)="modeChange()" [ngModelOptions]="{standalone: true}">
             <label for="push_base">Push-based</label>
-            <input class="mode-base" type="radio" id="pull_base" name="replicationMode" [value]=false [disabled]="!(policyId<0)" [(ngModel)]="isPushMode" [ngModelOptions]="{standalone: true}">
+          </div>
+          <div class="radio-inline" [class.disabled]="policyId >= 0">          
+            <input type="radio" id="pull_base" name="replicationMode" [value]=false [disabled]="policyId >= 0" [(ngModel)]="isPushMode" [ngModelOptions]="{standalone: true}">
             <label for="pull_base">Pull-based</label>
           </div>
         </div>
@@ -57,6 +59,7 @@
                 </label>
                 <div class="select inline-block" *ngIf="supportedFilters[i]?.style==='radio'">
                   <select  formControlName="value" #selectedValue id="{{i}}" name="{{supportedFilters[i]?.type}}">
+                    <option value=""></option>
                     <option *ngFor="let value of supportedFilters[i]?.values;" value="{{value}}">{{value}}</option>
                   </select>
                 </div>

src/portal/lib/src/create-edit-rule/create-edit-rule.component.scss

@@ -245,6 +245,4 @@ clr-modal {
 .form-cron {
     padding-left:3.8rem;
 }
-.mode-base {
+
-    z-index: -1;
-}

src/portal/lib/src/create-edit-rule/create-edit-rule.component.spec.ts

@@ -49,8 +49,8 @@ describe("CreateEditRuleComponent (inline template)", () => {
       src_registry: {id: 2},
       src_namespaces: ["name1", "name2"],
       trigger: {
-        kind: "Manual",
+        type: "Manual",
-        schedule_param: {}
+        trigger_settings: {}
       },
       filters: [],
       deletion: false,
@@ -162,8 +162,8 @@ describe("CreateEditRuleComponent (inline template)", () => {
     src_registry: {id: 10 },
     dest_registry: {id: 0 },
     trigger: {
-      kind: "Manual",
+      type: "Manual",
-      schedule_param: {}
+      trigger_settings: {}
     },
     filters: [],
     deletion: false,

src/portal/lib/src/create-edit-rule/create-edit-rule.component.ts

@@ -221,6 +221,8 @@ export class CreateEditRuleComponent implements OnInit, OnDestroy {
       this.isPushMode = true;
     }
     setTimeout(() => {
+      // There is no trigger_setting type when the harbor is upgraded from the old version.
+      rule.trigger.trigger_settings = rule.trigger.trigger_settings ? rule.trigger.trigger_settings : {cron: ''};
       this.ruleForm.reset({
         name: rule.name,
         description: rule.description,

src/portal/lib/src/endpoint/endpoint.component.ts

@@ -94,7 +94,6 @@ export class EndpointComponent implements OnInit, OnDestroy {
         private translateService: TranslateService,
         private operationService: OperationService,
         private ref: ChangeDetectorRef) {
-        this.forceRefreshView(1000);
     }
 
     ngOnInit(): void {
@@ -119,6 +118,7 @@ export class EndpointComponent implements OnInit, OnDestroy {
             .subscribe(targets => {
                 this.targets = targets || [];
                 this.loading = false;
+                this.forceRefreshView(1000);
             }, error => {
                 this.errorHandler.error(error);
                 this.loading = false;

src/portal/lib/src/list-replication-rule/list-replication-rule.component.spec.ts

@@ -24,7 +24,7 @@ describe('ListReplicationRuleComponent (inline template)', () => {
         "name": "sync_01",
         "description": "",
         "filters": null,
-        "trigger": {"kind": "Manual", "schedule_param": null},
+        "trigger": {"type": "Manual", "trigger_settings": null},
         "error_job_count": 2,
         "deletion": false,
         "src_namespaces": ["name1", "name2"],
@@ -37,7 +37,7 @@ describe('ListReplicationRuleComponent (inline template)', () => {
           "name": "sync_02",
           "description": "",
           "filters": null,
-          "trigger": {"kind": "Manual", "schedule_param": null},
+          "trigger": {"type": "Manual", "trigger_settings": null},
           "error_job_count": 2,
           "deletion": false,
           "src_namespaces": ["name1", "name2"],

src/portal/lib/src/replication/replication.component.spec.ts

@@ -34,7 +34,7 @@ describe('Replication Component (inline template)', () => {
           "name": "sync_01",
           "description": "",
           "filters": null,
-          "trigger": {"kind": "Manual", "schedule_param": null},
+          "trigger": {"type": "Manual", "trigger_settings": null},
           "error_job_count": 2,
           "deletion": false,
           "src_registry": {id: 3},
@@ -47,7 +47,7 @@ describe('Replication Component (inline template)', () => {
           "name": "sync_02",
           "description": "",
           "filters": null,
-          "trigger": {"kind": "Manual", "schedule_param": null},
+          "trigger": {"type": "Manual", "trigger_settings": null},
           "error_job_count": 2,
           "deletion": false,
           "dest_registry": {id: 5},

src/portal/lib/src/service/interface.ts

@@ -126,15 +126,15 @@ export class Filter {
 }
 
 export class Trigger {
-  kind: string;
+  type: string;
-  schedule_param:
+  trigger_settings:
     | any
     | {
       [key: string]: any | any[];
     };
-  constructor(kind: string, param: any | { [key: string]: any | any[] }) {
+  constructor(type: string, param: any | { [key: string]: any | any[] }) {
-    this.kind = kind;
+    this.type = type;
-    this.schedule_param = param;
+    this.trigger_settings = param;
   }
 }