bricks/bricks/datarow.js
2024-05-14 17:14:30 +08:00

154 lines
3.4 KiB
JavaScript

var bricks = window.bricks || {};
bricks.DataRow = class extends bricks.HBox {
/*
{
toolbar:[
]
fields:[]
css
browserfields{
exclouded:[],
cwidth:{
field:10,
field2:11
}
}
editexclouded:[],
header_css
}
*/
constructor(opts){
super(opts);
this.record_w = null;
}
render_header(editable, checkable){
this.render(editable, checkable, true);
this.set_css('accordion-item-header');
this.editable = editable;
this.checkable = checkable;
}
render_data(editable, checkable){
this.render(editable, checkable, false);
this.set_css('accordion-item-info');
this.editable = editable;
this.checkable = checkable;
}
render(editable, checkable, header){
if (checkable){
var w = new bricks.UiCheck({name:'c',value:false})
this.add_widget(w);
w.bind(changed, this.get_check_state.bind(this));
}
this.build_toolbar(editable, header);
this.build_fields(header);
}
renew(record){
this.user_data = record;
this.record_w.clear_widgets();
this._build_fields(false, this.record_w);
}
get_check_state(e){
d = e.target.getValue()
this.dispatch('checked', d.c)
}
build_toolbar(editable, header){
var tools = [];
var rsvd = ['add', 'update', 'delete'];
if (editable){
if (header){
tools.push({
name:'add',
tip:'add new record',
icon:editable.add_icon || bricks_resource('imgs/add.png')
});
tools.push({
name:'blankicon'
});
} else {
tools.push({
name:'update',
tip:'update current record',
icon:editable.update_icon || bricks_resource('imgs/update.png')
});
tools.push({
name:'delete',
tip:'delete current record',
icon:editable.delete_icon || bricks_resource('imgs/delete.png')
});
}
}
if (header){
if (this.toolbar){
this.toolbar.tools.forEach(t => {
if (! rsvd.includes(t.name))
tools.push({name:'blankicon'});
});
}
} else {
if (this.toolbar){
this.toolbar.tools.forEach(t => {
if (! rsvd.includes(t.name))
tools.push(t)
});
}
}
var toolbar = bricks.extend({cwidth:2.5}, this.toolbar || {});
toolbar.tools = tools;
var w = new bricks.IconBar(toolbar);
this.add_widget(w);
this.toolbar_w = w;
this.event_names = []
for(var i=0;i<tools.length;i++){
if (tools[i].name != 'blankicon'){
this.event_names.push(tools[i].name);
w.bind(tools[i].name, this.my_dispatch(tools[i].name));
}
}
}
my_dispatch(e){
this.dispatch(e);
}
build_fields(header, cw){
this.record_w = new bricks.HBox({height:'auto'});
this.add_widget(this.record_w);
this._build_fields(header, this.record_w);
}
_build_fields(header, cw){
var exclouded = [];
var cwidths = {};
if (this.browserfields && this.browserfields.exclouded){
exclouded = this.browserfields.exclouded;
}
if (this.browserfields && this.browserfields.cwidths){
cwidths = this.browserfields.cwidths;
}
for (var i=0;i<this.fields.length;i++){
var f = this.fields[i]
if (exclouded.includes(f.name)){
continue;
}
var opts = bricks.extend({
margin:'3px'
}, f);
if (header || ! this.user_data){
opts.value = f.label || f.name;
} else {
opts.value = this.user_data[f.name];
}
var cwidth = cwidths[f.name];
if (cwidth){
opts.cwidth = cwidth;
}
var f = bricks.get_ViewBuilder(f.uitype);
if (!f) f = bricks.get_ViewBuilder('str');
var w = f(opts);
cw.add_widget(w)
}
}
}
bricks.Factory.register('DataRow', bricks.DataRow);