inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-19 17:14:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #835 from Alfresco/dev-denys-634

Browse Source 
#634 Amount widget for Activiti Form
This commit is contained in:
Mario Romano 2016-10-04 11:19:17 +02:00 committed by GitHub
commit cf2f37c41b
8 changed files with 122 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.css Normal file
View File

@ -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;
}

13
ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.html Normal file
View File

@ -0,0 +1,13 @@
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label amount-widget"
[class.amount-widget__invalid]="!field.isValid">
<input class="mdl-textfield__input"
type="text"
pattern="-?[0-9]*(\.[0-9]+)?"
[attr.id]="field.id"
[attr.required]="isRequired()"
[(ngModel)]="field.value"
(ngModelChange)="checkVisibility(field)"
[disabled]="field.readOnly">
<label class="mdl-textfield__label" [attr.for]="field.id">{{field.name}}, {{currency}}</label>
<span *ngIf="field.validationSummary" class="mdl-textfield__error">{{field.validationSummary}}</span>
</div>

60
ng2-components/ng2-activiti-form/src/components/widgets/amount/amount.widget.ts Normal file
View File

@ -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;
}
}

3
ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.html
View File

@ -59,6 +59,9 @@
<div *ngSwitchCase="'date'">
<date-widget [field]="field" (fieldChanged)="fieldChanged($event);"></date-widget>
</div>
<div *ngSwitchCase="'amount'">
<amount-widget [field]="field" (fieldChanged)="fieldChanged($event);"></amount-widget>
</div>
<div *ngSwitchDefault>
<span>UNKNOWN WIDGET TYPE: {{field.type}}</span>
</div>

1
ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-types.ts
View File

@ -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,

12
ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-validator.ts
View File

@ -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 {

14
ng2-components/ng2-activiti-form/src/components/widgets/core/form-field.model.ts
View File

@ -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 = <WidgetVisibilityModel> json.visibilityCondition;
this.enableFractions = <boolean>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, 10);
break;
case FormFieldTypes.AMOUNT:
this.form.values[this.id] = this.enableFractions ? parseFloat(this.value) : parseInt(this.value, 10);
break;
default:
if (!FormFieldTypes.isReadOnlyType(this.type)) {
this.form.values[this.id] = this.value;

5
ng2-components/ng2-activiti-form/src/components/widgets/index.ts
View File

@ -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
];