+
diff --git a/src/portal/src/app/base/left-side-nav/replication/replication/create-edit-rule/create-edit-rule.component.scss b/src/portal/src/app/base/left-side-nav/replication/replication/create-edit-rule/create-edit-rule.component.scss
index 481cbd95e..88bee0293 100644
--- a/src/portal/src/app/base/left-side-nav/replication/replication/create-edit-rule/create-edit-rule.component.scss
+++ b/src/portal/src/app/base/left-side-nav/replication/replication/create-edit-rule/create-edit-rule.component.scss
@@ -19,10 +19,6 @@ h4 {
font-size: 12px;
}
-.inputWidth {
- width: 270px;
-}
-
.endpointSelect {
width: 270px;
margin-right: 10px;
@@ -38,34 +34,10 @@ h4 {
margin-left: 10px;
}
-.filterSelect label {
- width: 190px;
-}
-
-.filterSelect label input {
- width: 100%;
-}
-
-.pull-left {
- float: left;
-}
-
.padLeft0 {
padding-left: 0;
}
-.width-70 {
- display: inline-block;
- width: 70px;
- margin-right: 10px;
-}
-
-.width-115 {
- display: inline-block;
- width: 115px;
- margin-right: 10px;
-}
-
.schedule-style {
display: inline-block;
}
@@ -164,7 +136,7 @@ h4 {
clr-modal {
::ng-deep div.modal-dialog {
- width: 29rem;
+ width: 32rem;
}
}
@@ -200,25 +172,6 @@ clr-modal {
width: 100%;
}
-.loading-center {
- display: block;
- text-align: center;
-}
-
-.width-315 {
- display: flex;
- align-items: center;
- width:315px;
-}
-
-.mr-t-10 {
- margin-top: 10px;
-}
-
-.resource-box {
- display: inline-block;
- width: 190px;
-}
.form-cron {
padding-left:3.8rem;
}
@@ -266,9 +219,6 @@ clr-modal {
outline: none;
border-bottom: 1px solid rgb(154, 154, 154);
}
-.labelDiv {
- padding-left: 26px;
-}
.ellipsis {
margin-left: 0.2rem;
font-size: 16px;
@@ -280,30 +230,40 @@ clr-modal {
justify-content: space-between;
}
-.select-width {
- min-width:11rem;
-}
.flex {
display: flex;
}
.sub-label {
- display: inline-block;
- width: 100px;
- margin-right: 10px;
+ flex: 0 0 5rem;
}
.clr-control-label {
width: 8.6rem;
}
-.count {
- width: 34px;
- margin-left: 10px;
-}
+
.des-tooltip {
- margin-left: 10px;
-}
-.count-type {
- width: 158px;
+ margin-left: 0.5rem;
}
+
:host::ng-deep.flatten {
width: 23rem!important;
}
+
+.width-input {
+ width: 17rem;
+}
+
+.width-name-resource {
+ flex: 0 0 12rem;
+ width: 12rem;
+}
+
+.width-match-exclude {
+ width: 5rem;
+}
+
+.width-tag-label {
+ width: 6rem;
+}
+.right-align {
+ transform: translateX(-4.3rem) translateY(1.25rem)!important;
+}
diff --git a/src/portal/src/app/base/left-side-nav/replication/replication/create-edit-rule/create-edit-rule.component.ts b/src/portal/src/app/base/left-side-nav/replication/replication/create-edit-rule/create-edit-rule.component.ts
index 6a599f6a1..14459e5aa 100644
--- a/src/portal/src/app/base/left-side-nav/replication/replication/create-edit-rule/create-edit-rule.component.ts
+++ b/src/portal/src/app/base/left-side-nav/replication/replication/create-edit-rule/create-edit-rule.component.ts
@@ -35,7 +35,7 @@ import { RegistryService } from "../../../../../../../ng-swagger-gen/services/re
import { Registry } from "../../../../../../../ng-swagger-gen/models/registry";
import { Label } from "../../../../../../../ng-swagger-gen/models/label";
import { LabelService } from "../../../../../../../ng-swagger-gen/services/label.service";
-import { Flatten_I18n_MAP, Flatten_Level } from "../../replication";
+import { Decoration, Flatten_I18n_MAP, Flatten_Level } from "../../replication";
const PREFIX: string = '0 ';
const PAGE_SIZE: number = 100;
@@ -98,12 +98,7 @@ export class CreateEditRuleComponent implements OnInit, OnDestroy {
this.repService.getRegistryInfo(id)
.pipe(finalize(() => (this.onGoing = false)))
.subscribe(adapter => {
- this.supportedFilters = adapter.supported_resource_filters;
- this.supportedFilters.forEach(element => {
- this.filters.push(this.initFilter(element.type));
- });
- this.supportedTriggers = adapter.supported_triggers;
- this.ruleForm.get("trigger").get("type").setValue(this.supportedTriggers[0]);
+ this.setFilterAndTrigger(adapter);
}, (error: any) => {
this.inlineAlert.showInlineError(error);
});
@@ -315,14 +310,21 @@ export class CreateEditRuleComponent implements OnInit, OnDestroy {
const filterFGs = filters.map(filter => {
if (filter.type === FilterType.LABEL) {
let fbLabel = this.fb.group({
- type: FilterType.LABEL
+ type: FilterType.LABEL,
+ decoration: filter.decoration || Decoration.MATCHES
});
let filterLabel = this.fb.array(filter.value);
fbLabel.setControl('value', filterLabel);
return fbLabel;
- } else {
- return this.fb.group(filter);
}
+ if (filter.type === FilterType.TAG) {
+ return this.fb.group({
+ type: FilterType.TAG,
+ decoration: filter.decoration || Decoration.MATCHES,
+ value: filter.value
+ });
+ }
+ return this.fb.group(filter);
});
const filterFormArray = this.fb.array(filterFGs);
this.ruleForm.setControl("filters", filterFormArray);
@@ -331,10 +333,20 @@ export class CreateEditRuleComponent implements OnInit, OnDestroy {
initFilter(name: string) {
if (name === FilterType.LABEL) {
const labelArray = this.fb.array([]);
- const labelControl = this.fb.group({type: name});
+ const labelControl = this.fb.group({
+ type: name,
+ decoration: Decoration.MATCHES
+ });
labelControl.setControl('value', labelArray);
return labelControl;
}
+ if (name === FilterType.TAG) {
+ return this.fb.group({
+ type: name,
+ decoration: Decoration.MATCHES,
+ value: ''
+ });
+ }
return this.fb.group({
type: name,
value: ''
@@ -381,7 +393,7 @@ export class CreateEditRuleComponent implements OnInit, OnDestroy {
let filters: any = copyRuleForm.filters;
// remove the filters which user not set.
for (let i = filters.length - 1; i >= 0; i--) {
- if (filters[i].value === "" || (filters[i].value instanceof Array
+ if (!filters[i].value || (filters[i].value instanceof Array
&& filters[i].value.length === 0)) {
copyRuleForm.filters.splice(i, 1);
}
@@ -455,7 +467,7 @@ export class CreateEditRuleComponent implements OnInit, OnDestroy {
this.repService.getRegistryInfo(srcRegistryId)
.pipe(finalize(() => (this.onGoing = false)))
.subscribe(adapter => {
- this.setFilterAndTrigger(adapter, ruleInfo);
+ this.setFilterAndTrigger(adapter);
this.updateRuleFormAndCopyUpdateForm(ruleInfo);
}, (error: any) => {
this.inlineAlert.showInlineError(error);
@@ -471,6 +483,11 @@ export class CreateEditRuleComponent implements OnInit, OnDestroy {
.subscribe(adapter => {
this.setFilterAndTrigger(adapter);
this.copyUpdateForm = clone(this.ruleForm.value);
+ if (this.supportedFilterLabels && this.supportedFilterLabels.length) {
+ this.supportedFilterLabels.forEach((label, index) => {
+ label.select = false;
+ });
+ }
}, (error: any) => {
this.inlineAlert.showInlineError(error);
});
@@ -479,9 +496,8 @@ export class CreateEditRuleComponent implements OnInit, OnDestroy {
}
}
- setFilterAndTrigger(adapter, ruleInfo?) {
+ setFilterAndTrigger(adapter) {
this.supportedFilters = adapter.supported_resource_filters;
- this.setFilter([]);
this.supportedFilters.forEach(element => {
this.filters.push(this.initFilter(element.type));
});
diff --git a/src/portal/src/app/shared/services/interface.ts b/src/portal/src/app/shared/services/interface.ts
index b48c5e50e..cb4408e3d 100644
--- a/src/portal/src/app/shared/services/interface.ts
+++ b/src/portal/src/app/shared/services/interface.ts
@@ -49,6 +49,7 @@ export interface PingEndpoint extends Base {
export interface Filter {
type: string;
style: string;
+ decoration?: string;
values?: string[];
}