diff --git a/src/Squidex/app/features/schemas/pages/schema/types/boolean-ui.component.html b/src/Squidex/app/features/schemas/pages/schema/types/boolean-ui.component.html index ef8db15a7..7d99dc6ce 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/boolean-ui.component.html +++ b/src/Squidex/app/features/schemas/pages/schema/types/boolean-ui.component.html @@ -30,4 +30,14 @@ +
+
+
+ + +
+
+
\ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/types/boolean-ui.component.ts b/src/Squidex/app/features/schemas/pages/schema/types/boolean-ui.component.ts index 5eb3aadcd..7336ef71a 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/boolean-ui.component.ts +++ b/src/Squidex/app/features/schemas/pages/schema/types/boolean-ui.component.ts @@ -23,13 +23,17 @@ export class BooleanUIComponent implements OnInit { public properties: BooleanFieldPropertiesDto; public ngOnInit() { - this.editForm.addControl('editor', + this.editForm.setControl('editor', new FormControl(this.properties.editor, [ Validators.required ])); - this.editForm.addControl('placeholder', + + this.editForm.setControl('placeholder', new FormControl(this.properties.placeholder, [ Validators.maxLength(100) ])); + + this.editForm.setControl('inlineEditable', + new FormControl(this.properties.inlineEditable)); } } \ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/types/boolean-validation.component.html b/src/Squidex/app/features/schemas/pages/schema/types/boolean-validation.component.html index 6a68e0180..f90e71d7f 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/boolean-validation.component.html +++ b/src/Squidex/app/features/schemas/pages/schema/types/boolean-validation.component.html @@ -10,11 +10,14 @@ -
- - -
- +
+
+
+ + +
\ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/types/boolean-validation.component.ts b/src/Squidex/app/features/schemas/pages/schema/types/boolean-validation.component.ts index b6839be87..7dbc279be 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/boolean-validation.component.ts +++ b/src/Squidex/app/features/schemas/pages/schema/types/boolean-validation.component.ts @@ -26,9 +26,12 @@ export class BooleanValidationComponent implements OnInit { public showDefaultValue: Observable; public ngOnInit() { - this.editForm.addControl('defaultValue', + this.editForm.setControl('defaultValue', new FormControl(this.properties.defaultValue)); + this.editForm.setControl('inlineEditable', + new FormControl(this.properties.inlineEditable)); + this.showDefaultValue = this.editForm.controls['isRequired'].valueChanges .startWith(this.properties.isRequired) diff --git a/src/Squidex/app/features/schemas/pages/schema/types/date-time-ui.component.ts b/src/Squidex/app/features/schemas/pages/schema/types/date-time-ui.component.ts index 5a5152f6e..97a0855fd 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/date-time-ui.component.ts +++ b/src/Squidex/app/features/schemas/pages/schema/types/date-time-ui.component.ts @@ -28,11 +28,12 @@ export class DateTimeUIComponent implements OnInit { public hideAllowedValues: Observable; public ngOnInit() { - this.editForm.addControl('editor', + this.editForm.setControl('editor', new FormControl(this.properties.editor, [ Validators.required ])); - this.editForm.addControl('placeholder', + + this.editForm.setControl('placeholder', new FormControl(this.properties.placeholder, [ Validators.maxLength(100) ])); diff --git a/src/Squidex/app/features/schemas/pages/schema/types/date-time-validation.component.ts b/src/Squidex/app/features/schemas/pages/schema/types/date-time-validation.component.ts index 15f133f45..4ff7d6be2 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/date-time-validation.component.ts +++ b/src/Squidex/app/features/schemas/pages/schema/types/date-time-validation.component.ts @@ -29,20 +29,20 @@ export class DateTimeValidationComponent implements OnInit { public calculatedDefaultValues = ['Now', 'Today']; public ngOnInit() { - this.editForm.addControl('calculatedDefaultValue', + this.editForm.setControl('calculatedDefaultValue', new FormControl(this.properties.calculatedDefaultValue)); - this.editForm.addControl('maxValue', + this.editForm.setControl('maxValue', new FormControl(this.properties.maxValue, [ ValidatorsEx.validDateTime() ])); - this.editForm.addControl('minValue', + this.editForm.setControl('minValue', new FormControl(this.properties.minValue, [ ValidatorsEx.validDateTime() ])); - this.editForm.addControl('defaultValue', + this.editForm.setControl('defaultValue', new FormControl(this.properties.defaultValue, [ ValidatorsEx.validDateTime() ])); diff --git a/src/Squidex/app/features/schemas/pages/schema/types/geolocation-ui.component.ts b/src/Squidex/app/features/schemas/pages/schema/types/geolocation-ui.component.ts index 14883cf52..a5de1bf68 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/geolocation-ui.component.ts +++ b/src/Squidex/app/features/schemas/pages/schema/types/geolocation-ui.component.ts @@ -23,7 +23,7 @@ export class GeolocationUIComponent implements OnInit { public properties: GeolocationFieldPropertiesDto; public ngOnInit() { - this.editForm.addControl('editor', + this.editForm.setControl('editor', new FormControl(this.properties.editor, [ Validators.required ])); diff --git a/src/Squidex/app/features/schemas/pages/schema/types/number-ui.component.html b/src/Squidex/app/features/schemas/pages/schema/types/number-ui.component.html index 3dc5ae6cf..fba63c8d1 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/number-ui.component.html +++ b/src/Squidex/app/features/schemas/pages/schema/types/number-ui.component.html @@ -51,4 +51,14 @@
+
+
+
+ + +
+
+
\ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/types/number-ui.component.ts b/src/Squidex/app/features/schemas/pages/schema/types/number-ui.component.ts index f63f9dac5..30342c35d 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/number-ui.component.ts +++ b/src/Squidex/app/features/schemas/pages/schema/types/number-ui.component.ts @@ -17,7 +17,8 @@ import { FloatConverter, NumberFieldPropertiesDto } from 'shared'; templateUrl: 'number-ui.component.html' }) export class NumberUIComponent implements OnDestroy, OnInit { - private editorSubscription: Subscription; + private hideAllowedValuesSubscription: Subscription; + private hideInlineEditableSubscription: Subscription; @Input() public editForm: FormGroup; @@ -28,33 +29,52 @@ export class NumberUIComponent implements OnDestroy, OnInit { public converter = new FloatConverter(); public hideAllowedValues: Observable; + public hideInlineEditable: Observable; public ngOnDestroy() { - this.editorSubscription.unsubscribe(); + this.hideAllowedValuesSubscription.unsubscribe(); + this.hideInlineEditableSubscription.unsubscribe(); } public ngOnInit() { - this.editForm.addControl('editor', + this.editForm.setControl('editor', new FormControl(this.properties.editor, [ Validators.required ])); - this.editForm.addControl('placeholder', + + this.editForm.setControl('placeholder', new FormControl(this.properties.placeholder, [ Validators.maxLength(100) ])); - this.editForm.addControl('allowedValues', + + this.editForm.setControl('allowedValues', new FormControl(this.properties.allowedValues, [])); + this.editForm.setControl('inlineEditable', + new FormControl(this.properties.inlineEditable)); + this.hideAllowedValues = this.editForm.controls['editor'].valueChanges .startWith(this.properties.editor) - .map(x => !x || x === 'Input' || x === 'Textarea'); + .map(x => !(x && (x === 'Radio' || x === 'Dropdown'))); + + this.hideInlineEditable = + this.editForm.controls['editor'].valueChanges + .startWith(this.properties.editor) + .map(x => !(x && (x === 'Input' || x === 'Dropdown'))); - this.editorSubscription = + this.hideAllowedValuesSubscription = this.hideAllowedValues.subscribe(isSelection => { if (isSelection) { this.editForm.controls['allowedValues'].setValue(undefined); } }); + + this.hideInlineEditableSubscription = + this.hideInlineEditable.subscribe(isSelection => { + if (isSelection) { + this.editForm.controls['inlineEditable'].setValue(false); + } + }); } } \ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/types/number-validation.component.ts b/src/Squidex/app/features/schemas/pages/schema/types/number-validation.component.ts index e8801a593..6e076e127 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/number-validation.component.ts +++ b/src/Squidex/app/features/schemas/pages/schema/types/number-validation.component.ts @@ -26,13 +26,13 @@ export class NumberValidationComponent implements OnInit { public showDefaultValue: Observable; public ngOnInit() { - this.editForm.addControl('maxValue', + this.editForm.setControl('maxValue', new FormControl(this.properties.maxValue)); - this.editForm.addControl('minValue', + this.editForm.setControl('minValue', new FormControl(this.properties.minValue)); - this.editForm.addControl('defaultValue', + this.editForm.setControl('defaultValue', new FormControl(this.properties.defaultValue)); this.showDefaultValue = diff --git a/src/Squidex/app/features/schemas/pages/schema/types/string-ui.component.html b/src/Squidex/app/features/schemas/pages/schema/types/string-ui.component.html index 4114db13d..d64264d0d 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/string-ui.component.html +++ b/src/Squidex/app/features/schemas/pages/schema/types/string-ui.component.html @@ -72,4 +72,14 @@ +
+
+
+ + +
+
+
\ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/types/string-ui.component.ts b/src/Squidex/app/features/schemas/pages/schema/types/string-ui.component.ts index d11c4effd..157b66cfe 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/string-ui.component.ts +++ b/src/Squidex/app/features/schemas/pages/schema/types/string-ui.component.ts @@ -17,7 +17,8 @@ import { StringFieldPropertiesDto } from 'shared'; templateUrl: 'string-ui.component.html' }) export class StringUIComponent implements OnDestroy, OnInit { - private editorSubscription: Subscription; + private hideAllowedValuesSubscription: Subscription; + private hideInlineEditableSubscription: Subscription; @Input() public editForm: FormGroup; @@ -26,9 +27,11 @@ export class StringUIComponent implements OnDestroy, OnInit { public properties: StringFieldPropertiesDto; public hideAllowedValues: Observable; + public hideInlineEditable: Observable; public ngOnDestroy() { - this.editorSubscription.unsubscribe(); + this.hideAllowedValuesSubscription.unsubscribe(); + this.hideInlineEditableSubscription.unsubscribe(); } public ngOnInit() { @@ -45,17 +48,31 @@ export class StringUIComponent implements OnDestroy, OnInit { this.editForm.setControl('allowedValues', new FormControl(this.properties.allowedValues)); + this.editForm.setControl('inlineEditable', + new FormControl(this.properties.inlineEditable)); + this.hideAllowedValues = this.editForm.controls['editor'].valueChanges .startWith(this.properties.editor) - .map(x => !x || x === 'Input' || x === 'TextArea' || x === 'RichText' || x === 'Markdown'); - - this.editorSubscription = - this.hideAllowedValues - .subscribe(isSelection => { - if (isSelection) { - this.editForm.controls['allowedValues'].setValue(undefined); - } - }); + .map(x => !(x && (x === 'Radio' || x === 'Dropdown'))); + + this.hideInlineEditable = + this.editForm.controls['editor'].valueChanges + .startWith(this.properties.editor) + .map(x => !(x && (x === 'Input' || x === 'Dropdown' || x === 'Slug'))); + + this.hideAllowedValuesSubscription = + this.hideAllowedValues.subscribe(isSelection => { + if (isSelection) { + this.editForm.controls['allowedValues'].setValue(undefined); + } + }); + + this.hideInlineEditableSubscription = + this.hideInlineEditable.subscribe(isSelection => { + if (isSelection) { + this.editForm.controls['inlineEditable'].setValue(false); + } + }); } } \ No newline at end of file diff --git a/src/Squidex/app/features/schemas/pages/schema/types/string-validation.component.ts b/src/Squidex/app/features/schemas/pages/schema/types/string-validation.component.ts index c7e593132..fde5f8edf 100644 --- a/src/Squidex/app/features/schemas/pages/schema/types/string-validation.component.ts +++ b/src/Squidex/app/features/schemas/pages/schema/types/string-validation.component.ts @@ -64,14 +64,14 @@ export class StringValidationComponent implements OnDestroy, OnInit { .startWith(this.properties.isRequired) .map(x => !x); - this.showPatternMessage = - this.editForm.controls['pattern'].value && this.editForm.controls['pattern'].value.trim().length > 0; - this.showPatternSuggestions = this.editForm.controls['pattern'].valueChanges .startWith('') .map(x => !x || x.trim().length === 0); + this.showPatternMessage = + this.editForm.controls['pattern'].value && this.editForm.controls['pattern'].value.trim().length > 0; + this.patternSubscription = this.editForm.controls['pattern'].valueChanges .subscribe((value: string) => { diff --git a/src/Squidex/app/shared/services/schemas.service.ts b/src/Squidex/app/shared/services/schemas.service.ts index b6f2a684c..08bdbd7a6 100644 --- a/src/Squidex/app/shared/services/schemas.service.ts +++ b/src/Squidex/app/shared/services/schemas.service.ts @@ -355,7 +355,7 @@ export class StringFieldPropertiesDto extends FieldPropertiesDto { constructor(label: string | null, hints: string | null, placeholder: string | null, isRequired: boolean, isListField: boolean, - public readonly isInlineEditable: boolean, + public readonly inlineEditable: boolean, public readonly editor: string, public readonly defaultValue?: string, public readonly pattern?: string, @@ -416,7 +416,7 @@ export class NumberFieldPropertiesDto extends FieldPropertiesDto { constructor(label: string | null, hints: string | null, placeholder: string | null, isRequired: boolean, isListField: boolean, - public readonly isInlineEditable: boolean, + public readonly inlineEditable: boolean, public readonly editor: string, public readonly defaultValue?: number, public readonly maxValue?: number, @@ -525,7 +525,7 @@ export class BooleanFieldPropertiesDto extends FieldPropertiesDto { constructor(label: string | null, hints: string | null, placeholder: string | null, isRequired: boolean, isListField: boolean, - public readonly isInlineEditable: boolean, + public readonly inlineEditable: boolean, public readonly editor: string, public readonly defaultValue?: boolean ) {