diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.css b/ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.css new file mode 100644 index 0000000000..1162c3ac64 --- /dev/null +++ b/ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.css @@ -0,0 +1,20 @@ +.amount-widget { + width: 100%; +} + + +.amount-widget__invalid .mdl-textfield__input { + border-color: #d50000; +} + +.amount-widget__invalid .mdl-textfield__label { + color: #d50000; +} + +.amount-widget__invalid .mdl-textfield__label:after { + background-color: #d50000; +} + +.amount-widget__invalid .mdl-textfield__error { + visibility: visible !important; +} diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.html b/ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.html new file mode 100644 index 0000000000..773504db8f --- /dev/null +++ b/ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.html @@ -0,0 +1,13 @@ +
+ + + {{field.validationSummary}} +
diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.ts b/ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.ts new file mode 100644 index 0000000000..43cde7fe97 --- /dev/null +++ b/ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.ts @@ -0,0 +1,60 @@ +/*! + * @license + * Copyright 2016 Alfresco Software, Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { Component, ElementRef, OnInit } from '@angular/core'; +import { WidgetComponent } from './../widget.component'; + +declare let __moduleName: string; + +@Component({ + moduleId: __moduleName, + selector: 'amount-widget', + templateUrl: './amount.widget.html', + styleUrls: ['./amount.widget.css'] +}) +export class AmountWidget extends WidgetComponent implements OnInit { + + currency: string = '$'; + + constructor(private elementRef: ElementRef) { + super(); + } + + ngOnInit() { + if (this.field && this.field.currency) { + this.currency = this.field.currency; + } + } + + setupMaterialComponents(componentHandler: any): boolean { + // workaround for MDL issues with dynamic components + if (componentHandler) { + componentHandler.upgradeAllRegistered(); + if (this.elementRef && this.hasValue()) { + let el = this.elementRef.nativeElement; + let container = el.querySelector('.mdl-textfield'); + if (container) { + container.MaterialTextfield.change(this.field.value); + } + } + + return true; + } + return false; + } + +} diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.html b/ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.html index 49c5f5dce7..d111f90745 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.html +++ b/ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.html @@ -59,6 +59,9 @@
+
+ +
UNKNOWN WIDGET TYPE: {{field.type}}
diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-types.ts b/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-types.ts index 2c06b4bb17..f673b8cea3 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-types.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-types.ts @@ -32,6 +32,7 @@ export class FormFieldTypes { static BOOLEAN: string = 'boolean'; static NUMBER: string = 'integer'; static DATE: string = 'date'; + static AMOUNT: string = 'amount'; static READONLY_TYPES: string[] = [ FormFieldTypes.HYPERLINK, diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-validator.ts b/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-validator.ts index 995a41084c..0b6c13aa9f 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-validator.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-validator.ts @@ -38,7 +38,8 @@ export class RequiredFieldValidator implements FormFieldValidator { FormFieldTypes.PEOPLE, FormFieldTypes.FUNCTIONAL_GROUP, FormFieldTypes.RADIO_BUTTONS, - FormFieldTypes.UPLOAD + FormFieldTypes.UPLOAD, + FormFieldTypes.AMOUNT ]; isSupported(field: FormFieldModel): boolean { @@ -79,7 +80,8 @@ export class RequiredFieldValidator implements FormFieldValidator { export class NumberFieldValidator implements FormFieldValidator { private supportedTypes = [ - FormFieldTypes.NUMBER + FormFieldTypes.NUMBER, + FormFieldTypes.AMOUNT ]; static isNumber(value: any): boolean { @@ -262,7 +264,8 @@ export class MaxLengthFieldValidator implements FormFieldValidator { export class MinValueFieldValidator implements FormFieldValidator { private supportedTypes = [ - FormFieldTypes.NUMBER + FormFieldTypes.NUMBER, + FormFieldTypes.AMOUNT ]; isSupported(field: FormFieldModel): boolean { @@ -290,7 +293,8 @@ export class MinValueFieldValidator implements FormFieldValidator { export class MaxValueFieldValidator implements FormFieldValidator { private supportedTypes = [ - FormFieldTypes.NUMBER + FormFieldTypes.NUMBER, + FormFieldTypes.AMOUNT ]; isSupported(field: FormFieldModel): boolean { diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field.model.ts b/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field.model.ts index ae71b5b30f..2f9d12c89d 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field.model.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field.model.ts @@ -43,6 +43,7 @@ export class FormFieldModel extends FormWidgetModel { private _readOnly: boolean = false; private _isValid: boolean = true; + // model members fieldType: string; id: string; name: string; @@ -69,7 +70,10 @@ export class FormFieldModel extends FormWidgetModel { displayText: string; isVisible: boolean = true; visibilityCondition: WidgetVisibilityModel = null; + enableFractions: boolean = false; + currency: string = null; + // advanced members emptyOption: FormFieldOption; validationSummary: string; validators: FormFieldValidator[] = []; @@ -142,6 +146,8 @@ export class FormFieldModel extends FormWidgetModel { this.hyperlinkUrl = json.hyperlinkUrl; this.displayText = json.displayText; this.visibilityCondition = json.visibilityCondition; + this.enableFractions = json.enableFractions; + this.currency = json.currency; this._value = this.parseValue(json); } @@ -199,7 +205,7 @@ export class FormFieldModel extends FormWidgetModel { } /* - This is needed due to Activiti desplaying/editing dates in d-M-YYYY format + This is needed due to Activiti displaying/editing dates in d-M-YYYY format but storing on server in ISO8601 format (i.e. 2013-02-04T22:44:30.652Z) */ if (json.type === FormFieldTypes.DATE) { @@ -269,6 +275,12 @@ export class FormFieldModel extends FormWidgetModel { this.form.values[this.id] = null; } break; + case FormFieldTypes.NUMBER: + this.form.values[this.id] = parseInt(this.value); + break; + case FormFieldTypes.AMOUNT: + this.form.values[this.id] = parseFloat(this.value); + break; default: if (!FormFieldTypes.isReadOnlyType(this.type)) { this.form.values[this.id] = this.value; diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/index.ts b/ng2-components/ng2-activiti-form/src/components/widgets/index.ts index ec4c30f78c..200ecf6631 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/index.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/index.ts @@ -33,6 +33,7 @@ import { TypeaheadWidget } from './typeahead/typeahead.widget'; import { FunctionalGroupWidget } from './functional-group/functional-group.widget'; import { PeopleWidget } from './people/people.widget'; import { DateWidget } from './date/date.widget'; +import { AmountWidget } from './amount/amount.widget'; // core export * from './widget.component'; @@ -58,6 +59,7 @@ export * from './typeahead/typeahead.widget'; export * from './functional-group/functional-group.widget'; export * from './people/people.widget'; export * from './date/date.widget'; +export * from './amount/amount.widget'; export const WIDGET_DIRECTIVES: any[] = [ TabsWidget, @@ -76,5 +78,6 @@ export const WIDGET_DIRECTIVES: any[] = [ TypeaheadWidget, FunctionalGroupWidget, PeopleWidget, - DateWidget + DateWidget, + AmountWidget ];