#476 basic radio buttons widget

This commit is contained in:
Denys Vuika
2016-07-26 15:32:10 +01:00
parent 0ac3236414
commit 9a0a5caddd
7 changed files with 88 additions and 5 deletions

View File

@@ -34,6 +34,9 @@
<div *ngSwitchCase="'hyperlink'">
<hyperlink-widget [field]="field"></hyperlink-widget>
</div>
<div *ngSwitchCase="'radio-buttons'">
<radio-buttons-widget [field]="field"></radio-buttons-widget>
</div>
<div *ngSwitchDefault>
<span>UNKNOWN WIDGET TYPE: {{field.type}}</span>
</div>

View File

@@ -25,6 +25,7 @@ import { CheckboxWidget } from './../checkbox/checkbox.widget';
import { MultilineTextWidget } from './../multiline-text/multiline-text.widget';
import { DropdownWidget } from './../dropdown/dropdown.widget';
import { HyperlinkWidget } from './../hyperlink/hyperlink.widget';
import { RadioButtonsWidget } from './../radio-buttons/radio-buttons.widget';
declare let __moduleName: string;
declare var componentHandler;
@@ -41,7 +42,8 @@ declare var componentHandler;
CheckboxWidget,
MultilineTextWidget,
DropdownWidget,
HyperlinkWidget
HyperlinkWidget,
RadioButtonsWidget
]
})
export class ContainerWidget implements AfterViewInit {

View File

@@ -25,3 +25,4 @@ export * from './checkbox/checkbox.widget';
export * from './multiline-text/multiline-text.widget';
export * from './dropdown/dropdown.widget';
export * from './hyperlink/hyperlink.widget';
export * from './radio-buttons/radio-buttons.widget';

View File

@@ -0,0 +1 @@
.radio-buttons-widget {}

View File

@@ -0,0 +1,14 @@
<div class="radio-buttons-widget">
<div *ngFor="let opt of field.options">
<label [attr.for]="opt.id" class="mdl-radio mdl-js-radio">
<input type="radio"
[checked]="field.value === opt.id"
[attr.id]="opt.id"
[attr.name]="field.id"
[attr.value]="opt.id"
class="mdl-radio__button"
(click)="field.value = opt.id">
<span class="mdl-radio__label">{{opt.name}}</span>
</label>
</div>
</div>

View File

@@ -0,0 +1,32 @@
/*!
* @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 } from '@angular/core';
import { WidgetComponent } from './../widget.component';
declare let __moduleName: string;
declare var componentHandler;
@Component({
moduleId: __moduleName,
selector: 'radio-buttons-widget',
templateUrl: './radio-buttons.widget.html',
styleUrls: ['./radio-buttons.widget.css']
})
export class RadioButtonsWidget extends WidgetComponent {
}

View File

@@ -27,6 +27,7 @@ export class FormFieldTypes {
static GROUP: string = 'group';
static DROPDOWN: string = 'dropdown';
static HYPERLINK: string = 'hyperlink';
static RADIO_BUTTONS: string = 'radio-buttons';
}
export class FormWidgetModel {
@@ -121,7 +122,7 @@ export class FormFieldModel extends FormWidgetModel {
let value = json.value;
/*
This is needed due to Activiti reading dropdown values as string
This is needed due to Activiti issue related to reading dropdown values as value string
but saving back as object: { id: <id>, name: <name> }
*/
// TODO: needs review
@@ -131,6 +132,21 @@ export class FormFieldModel extends FormWidgetModel {
}
}
/*
This is needed due to Activiti issue related to reading radio button values as value string
but saving back as object: { id: <id>, name: <name> }
*/
if (json.type === FormFieldTypes.RADIO_BUTTONS) {
// Activiti has a bug with default radio button value,
// so try resolving current one with a fallback to first entry
let entry: FormFieldOption[] = this.options.filter(opt => opt.id === value);
if (entry.length > 0) {
value = entry[0].id;
} else if (this.options.length > 0) {
value = this.options[0].id;
}
}
return value;
}
@@ -148,7 +164,21 @@ export class FormFieldModel extends FormWidgetModel {
this.form.values[this.id] = entry[0];
}
}
} else {
}
/*
This is needed due to Activiti issue related to reading radio button values as value string
but saving back as object: { id: <id>, name: <name> }
*/
else if (this.type === FormFieldTypes.RADIO_BUTTONS) {
let entry: FormFieldOption[] = this.options.filter(opt => opt.id === this.value);
if (entry.length > 0) {
this.form.values[this.id] = entry[0];
} else if (this.options.length > 0) {
this.form.values[this.id] = this.options[0].id;
}
}
// default value resolver
else {
this.form.values[this.id] = this.value;
}
}