summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2/components/dynamic-element
diff options
context:
space:
mode:
authorMichael Lando <ml636r@att.com>2017-06-11 14:22:02 +0300
committerMichael Lando <ml636r@att.com>2017-06-11 17:48:32 +0300
commitb3d4898d9e8452ea0b8d848c048e712d43b8d9a3 (patch)
tree0609319203be13f6c29ccbe24cb39c9d64f90095 /catalog-ui/src/app/ng2/components/dynamic-element
parentaf9929df75604ce407d0ca542b200630164e0ae6 (diff)
[SDC-29] rebase continue work to align source
Change-Id: I218f1c5ee23fb2c8314f1c70921d3ad8682c10f4 Signed-off-by: Michael Lando <ml636r@att.com>
Diffstat (limited to 'catalog-ui/src/app/ng2/components/dynamic-element')
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.component.ts21
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.module.ts4
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/checkbox/ui-element-checkbox.component.html2
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.html2
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.ts3
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.html2
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.ts3
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.html15
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.less17
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.ts21
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.html4
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.ts3
-rw-r--r--catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/ui-element-base.component.ts1
13 files changed, 78 insertions, 20 deletions
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.component.ts
index de5965e488..84ac46c4cf 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.component.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.component.ts
@@ -4,6 +4,7 @@ import { UiElementDropDownComponent, DropdownValue } from './elements-ui/dropdow
import { UiElementInputComponent } from './elements-ui/input/ui-element-input.component';
import {UiElementPopoverInputComponent} from "./elements-ui/popover-input/ui-element-popover-input.component";
import {ValidationConfiguration} from "app/models";
+import {UiElementIntegerInputComponent} from "./elements-ui/integer-input/ui-element-integer-input.component";
@Component({
selector: 'dynamic-element',
@@ -13,7 +14,8 @@ import {ValidationConfiguration} from "app/models";
UiElementInputComponent,
UiElementDropDownComponent,
UiElementCheckBoxComponent,
- UiElementPopoverInputComponent
+ UiElementPopoverInputComponent,
+ UiElementIntegerInputComponent
]
})
export class DynamicElementComponent {
@@ -21,6 +23,7 @@ export class DynamicElementComponent {
@ViewChild('target', { read: ViewContainerRef }) target: any;
@Input() type: any;
@Input() name: string;
+ @Input() readonly:boolean;
value:any;
// Two way binding for value (need to write the "Change" word like this)
@@ -50,17 +53,16 @@ export class DynamicElementComponent {
// Factory to create component based on type or peroperty name.
switch(this.type) {
case 'list':
- case 'integer':
- this.createComponent(UiElementInputComponent);
+ case 'integer':
+ this.createComponent(UiElementIntegerInputComponent);
this.cmpRef.instance.pattern = this.validation.validationPatterns.integer;
break;
case 'string':
- switch(this.name.toUpperCase()) {
- case 'SUBNETPOOLID':
- this.createComponent(UiElementPopoverInputComponent);
- break;
- default:
- this.createComponent(UiElementInputComponent);
+ if (this.name.toUpperCase().indexOf("SUBNETPOOLID") !== -1) {
+ this.createComponent(UiElementPopoverInputComponent);
+ }
+ else {
+ this.createComponent(UiElementInputComponent);
}
break;
case 'boolean':
@@ -84,6 +86,7 @@ export class DynamicElementComponent {
this.cmpRef.instance.name = this.name;
this.cmpRef.instance.type = this.type;
this.cmpRef.instance.value = this.value;
+ this.cmpRef.instance.readonly = this.readonly;
}
// Subscribe to change event of of ui-element-basic and fire event to change the value
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.module.ts b/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.module.ts
index 18b044bc9d..f53b8616ac 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.module.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/dynamic-element.module.ts
@@ -8,6 +8,7 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms'
import { UiElementPopoverInputComponent } from "./elements-ui/popover-input/ui-element-popover-input.component";
import {PopoverModule} from "../popover/popover.module";
import {TooltipModule} from "../tooltip/tooltip.module";
+import {UiElementIntegerInputComponent} from "./elements-ui/integer-input/ui-element-integer-input.component";
@NgModule({
declarations: [
@@ -15,7 +16,8 @@ import {TooltipModule} from "../tooltip/tooltip.module";
UiElementInputComponent,
UiElementCheckBoxComponent,
UiElementDropDownComponent,
- UiElementPopoverInputComponent
+ UiElementPopoverInputComponent,
+ UiElementIntegerInputComponent
],
imports: [
BrowserModule,
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/checkbox/ui-element-checkbox.component.html b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/checkbox/ui-element-checkbox.component.html
index 2ad3d8e94a..a3e28c5f0b 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/checkbox/ui-element-checkbox.component.html
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/checkbox/ui-element-checkbox.component.html
@@ -1 +1 @@
-<input #{{name}} [(ngModel)]="value" type="checkbox" (change)="onSave(value)" />
+<input #{{name}} [(ngModel)]="value" type="checkbox" (change)="onSave(value)" [ngClass]="{'disabled':readonly}"/>
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.html b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.html
index 589d00e42d..bfb927af71 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.html
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.html
@@ -1,3 +1,3 @@
-<select name='{{name}}' [(ngModel)]="value" #t (change)="onSave()">
+<select name='{{name}}' [(ngModel)]="value" #t (change)="onSave()" [ngClass]="{'disabled':readonly}">
<option *ngFor="let ddvalue of values" [value]="ddvalue.value">{{ddvalue.label}}</option>
</select>
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.ts
index 208bf54983..b1fb37a186 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/dropdown/ui-element-dropdown.component.ts
@@ -18,7 +18,6 @@ export class DropdownValue {
styleUrls: ['./ui-element-dropdown.component.less'],
})
export class UiElementDropDownComponent extends UiElementBase implements UiElementBaseInterface {
-
@Input()
values: DropdownValue[];
@@ -27,7 +26,7 @@ export class UiElementDropDownComponent extends UiElementBase implements UiEleme
}
onSave() {
- this.baseEmitter.emit(this.value);
+ this.baseEmitter.emit(JSON.parse(this.value));
}
}
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.html b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.html
index 00fea65b72..814ebfd28b 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.html
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.html
@@ -10,4 +10,6 @@
[pattern]="pattern"
[formControl]="control"
tooltip="{{value}}"
+ [readonly]="readonly"
+ [ngClass]="{'disabled':readonly}"
/>
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.ts
index 5a14d8f206..2d64d9b713 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/input/ui-element-input.component.ts
@@ -1,4 +1,4 @@
-import { Component, ViewChild, ElementRef, ContentChildren } from '@angular/core';
+import {Component, ViewChild, ElementRef, ContentChildren, Input} from '@angular/core';
import { BrowserModule } from '@angular/platform-browser'
import { UiElementBase, UiElementBaseInterface } from './../ui-element-base.component';
@@ -8,7 +8,6 @@ import { UiElementBase, UiElementBaseInterface } from './../ui-element-base.comp
styleUrls: ['./ui-element-input.component.less'],
})
export class UiElementInputComponent extends UiElementBase implements UiElementBaseInterface {
-
constructor() {
super();
this.pattern = this.validation.validationPatterns.comment;
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.html b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.html
new file mode 100644
index 0000000000..e5518d453f
--- /dev/null
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.html
@@ -0,0 +1,15 @@
+<input
+ class="value-input"
+ [ngClass]="{'error': control.invalid}"
+ type="text"
+ [name]="name"
+ [(ngModel)]="value"
+ (change)="onSave()"
+ [attr.maxlength]="validation.propertyValue.max"
+ [attr.minlength]="validation.propertyValue.min"
+ [pattern]="pattern"
+ [formControl]="control"
+ tooltip="{{value}}"
+ [readonly]="readonly"
+ [ngClass]="{'disabled':readonly}"
+/>
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.less b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.less
new file mode 100644
index 0000000000..8073c3858e
--- /dev/null
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.less
@@ -0,0 +1,17 @@
+@import '../../../../../../assets/styles/variables';
+
+/deep/ ui-element-integer-input {
+
+ input {
+ text-indent: 6px;
+ border: solid 1px @main_color_o;
+ }
+
+ .error {
+ border: solid 1px @func_color_q;
+ color: @func_color_q;
+ outline: none;
+ box-sizing: border-box;
+ }
+
+}
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.ts
new file mode 100644
index 0000000000..d42c80a89e
--- /dev/null
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/integer-input/ui-element-integer-input.component.ts
@@ -0,0 +1,21 @@
+import {Component, ViewChild, ElementRef, ContentChildren, Input} from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser'
+import { UiElementBase, UiElementBaseInterface } from './../ui-element-base.component';
+
+@Component({
+ selector: 'ui-element-integer-input',
+ templateUrl: './ui-element-integer-input.component.html',
+ styleUrls: ['./ui-element-integer-input.component.less'],
+})
+export class UiElementIntegerInputComponent extends UiElementBase implements UiElementBaseInterface {
+ constructor() {
+ super();
+ this.pattern = this.validation.validationPatterns.comment;
+ }
+
+ onSave() {
+ if (!this.control.invalid){
+ this.baseEmitter.emit(JSON.parse(this.value));
+ }
+ }
+}
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.html b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.html
index 5adceb49a0..3bd51b4e36 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.html
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.html
@@ -4,10 +4,10 @@
type="text"
[ngClass]="{'error': control.invalid}"
[name]="name"
- [value]="value"
+ [value]="value!=undefined?value:''"
disabled
/>
- <button [popover]="popoverForm">Edit</button>
+ <button [popover]="popoverForm" [ngClass]="{'disabled':readonly}">Edit</button>
</div>
<popover-content #popoverForm [title]="name" [buttons]="buttonsArray" [placement]="'top'" [closeOnClickOutside]="true">
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.ts
index 7300417686..84dd884d1f 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/popover-input/ui-element-popover-input.component.ts
@@ -1,4 +1,4 @@
-import {Component, ViewChild, ElementRef} from '@angular/core';
+import {Component, ViewChild, ElementRef, Input} from '@angular/core';
import {UiElementBase, UiElementBaseInterface} from "../ui-element-base.component";
import {ButtonsModelMap, ButtonModel} from "app/models";
import { PopoverContentComponent } from "app/ng2/components/popover/popover-content.component"
@@ -10,7 +10,6 @@ import { PopoverComponent } from "app/ng2/components/popover/popover.component"
styleUrls: ['./ui-element-popover-input.component.less']
})
export class UiElementPopoverInputComponent extends UiElementBase implements UiElementBaseInterface {
-
@ViewChild('textArea') textArea: ElementRef;
@ViewChild('popoverForm') popoverContentComponent: PopoverContentComponent;
diff --git a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/ui-element-base.component.ts b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/ui-element-base.component.ts
index b60271f6f0..fa2be1048c 100644
--- a/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/ui-element-base.component.ts
+++ b/catalog-ui/src/app/ng2/components/dynamic-element/elements-ui/ui-element-base.component.ts
@@ -25,6 +25,7 @@ export class UiElementBase {
protected type: string;
protected value: any;
protected pattern: any;
+ protected readonly:boolean;
constructor() {
//this.control = new FormControl('', [Validators.required]);