85 lines
1.6 KiB
JavaScript
85 lines
1.6 KiB
JavaScript
var bricks = window.bricks || {};
|
|
bricks.MiniForm = class extends bricks.HBox {
|
|
/*
|
|
{
|
|
defaultname:
|
|
label_width:
|
|
input_width:
|
|
params:
|
|
"fields":[
|
|
{
|
|
name:
|
|
label:
|
|
icon:
|
|
uitype:
|
|
uiparams:
|
|
}
|
|
...
|
|
]
|
|
}
|
|
*/
|
|
constructor(opts){
|
|
opts.width = 'auto';
|
|
opts.height = 'auto';
|
|
super(opts);
|
|
this.build();
|
|
}
|
|
build(){
|
|
var name = this.opts.defaultname;
|
|
if (!name){
|
|
name = this.opts.fields[0].name;
|
|
}
|
|
this.build_options();
|
|
this.build_widgets(name);
|
|
}
|
|
build_widgets(name){
|
|
if (this.input){
|
|
this.input.unbind('input', this.input_handle.bind(this));
|
|
}
|
|
this.clear_widgets();
|
|
this.add_widget(this.choose);
|
|
var f = this.opts.fields.find( i => i.name==name);
|
|
var desc = objcopy(f);
|
|
desc.width = 'auto';
|
|
var i = Input.factory(desc);
|
|
i.bind('input', this.input_handle.bind(this));
|
|
this.add_widget(i);
|
|
this.input = i;
|
|
}
|
|
build_options(){
|
|
var desc = {
|
|
width:"90px",
|
|
name:"name",
|
|
uitype:"code",
|
|
valueField:'name',
|
|
textField:'label',
|
|
data:this.opts.fields
|
|
};
|
|
var w = Input.factory(desc);
|
|
w.bind('changed', this.change_input.bind(this));
|
|
this.choose = w;
|
|
this.add_widget(w);
|
|
}
|
|
show_options(e){
|
|
bricks.debug('show_options() called ...');
|
|
this.choose.show();
|
|
}
|
|
change_input(e){
|
|
var name = this.choose.value;
|
|
this.build_widgets(name);
|
|
}
|
|
input_handle(e){
|
|
var d = this.getValue();
|
|
bricks.debug('input_handle() ..', d);
|
|
this.dispatch('input', d);
|
|
}
|
|
getValue(){
|
|
var d = this.opts.params || {};
|
|
var v = this.input.getValue();
|
|
bricks.extend(d, v);
|
|
return d;
|
|
}
|
|
}
|
|
|
|
bricks.Factory.register('MiniForm', bricks.MiniForm);
|