bugfix
This commit is contained in:
parent
624a299c19
commit
2df5098bd7
@ -13,50 +13,89 @@ bricks.Menu = class extends bricks.VBox {
|
||||
this.dom_element.style.position = "absolute";
|
||||
this.dom_element.style.backgroundColor = options.bgcolor || "white";
|
||||
this.dom_element.style.zIndex = "1000";
|
||||
this.create_children(this.dom_element, this.opts.items);
|
||||
this.create_children(this, this.opts.items);
|
||||
this.bind('click', this.menu_clicked);
|
||||
}
|
||||
create_submenu_container(){
|
||||
let cp = document.createElement('div');
|
||||
cp.style.marginLeft = "15px";
|
||||
cp.style.display = 'none';
|
||||
let cp = new bricks.VBox({});
|
||||
cp.set_style('marginLeft', "15px");
|
||||
cp.set_style('display', 'none');
|
||||
return cp;
|
||||
}
|
||||
async menu_clicked(event){
|
||||
let mit = event.target;
|
||||
if (mit.children.length > 0){
|
||||
for (var i=0;i<mit.children.length; i++){
|
||||
if (mit.children[i].style.display == 'none'){
|
||||
mit.children[i].style.display = "";
|
||||
let e = event.target;
|
||||
var item = e.bricks_widget;
|
||||
console.log('menu_clicked(): item=', item, item.opts, item.url);
|
||||
if (!item.url){
|
||||
console.log('itme.url is null');
|
||||
return;
|
||||
}
|
||||
var t = bricks.getWidgetById(this.target);
|
||||
if (t){
|
||||
var desc = {
|
||||
"widgettype":"urlwidget",
|
||||
"options":{
|
||||
"url":item.url
|
||||
}
|
||||
}
|
||||
var w = await bricks.widgetBuild(desc, this);
|
||||
if (w){
|
||||
t.clear_widgets();
|
||||
t.add_widget(w);
|
||||
} else {
|
||||
mit.children[i].style.display = 'none';
|
||||
console.log('menu_clicked():widgetBuild() failed', desc);
|
||||
}
|
||||
} else {
|
||||
console.log('menu_clicked():', this.target, 'not found')
|
||||
}
|
||||
}
|
||||
return
|
||||
}
|
||||
bricks.debug('item clicked');
|
||||
}
|
||||
create_children(p, items){
|
||||
bricks.debug('create_children():items=', items, 'p=', p);
|
||||
create_children(w, items){
|
||||
for (let i=0;i<items.length;i++){
|
||||
let item = items[i];
|
||||
let menu_item = this.create_menuitem(item);
|
||||
p.appendChild(menu_item);
|
||||
let subw = this.create_menuitem(item);
|
||||
w.add_widget(subw);
|
||||
if (item.hasOwnProperty('items')){
|
||||
let cp = this.create_submenu_container();
|
||||
menu_item.appendChild(cp);
|
||||
this.create_children(cp, item.items);
|
||||
let w1 = this.create_submenu_container();
|
||||
subw.add_widget(w1);
|
||||
this.create_children(w1, item.items);
|
||||
subw.bind('click', this.toggle_hide.bind(this));
|
||||
} else {
|
||||
subw.bind('click', this.menu_clicked.bind(this))
|
||||
}
|
||||
}
|
||||
}
|
||||
create_menuitem(item){
|
||||
let i18n = bricks.app.i18n;
|
||||
bricks.debug('i18n=', i18n);
|
||||
let e = document.createElement('div');
|
||||
e.textContent = i18n._(item.label || item.name);
|
||||
// e.description = item
|
||||
bricks.debug('create_menuitem():item=', item, 'obj=', e);
|
||||
return e;
|
||||
var w = new bricks.HBox({});
|
||||
var iw, tw;
|
||||
if (item.icon){
|
||||
iw = new bricks.Icon({url:item.icon});
|
||||
} else {
|
||||
iw = new bricks.BlankIcon({});
|
||||
}
|
||||
w.add_widget(iw);
|
||||
tw = new bricks.Text({
|
||||
otext:item.label,
|
||||
i18n:true,
|
||||
wrap:true,
|
||||
haligin:'left'
|
||||
});
|
||||
tw.set_css('filler');
|
||||
w.add_widget(tw);
|
||||
for (var k in item){
|
||||
if (item.hasOwnProperty(k)){
|
||||
w[k] = item[k];
|
||||
}
|
||||
}
|
||||
iw.bind('click', this.regen_menuitem_event.bind(this, w));
|
||||
tw.bind('click', this.regen_menuitem_event.bind(this, w));
|
||||
iw.menuitem = w;
|
||||
tw.menuitem = w;
|
||||
return w;
|
||||
}
|
||||
regen_menuitem_event(item, event){
|
||||
console.log('regen_menuitem_event()', item);
|
||||
item.dispatch('click', item);
|
||||
event.stopPropagation();
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -178,9 +178,8 @@ bricks.ModalForm = class extends bricks.Modal {
|
||||
bl, bc, br )
|
||||
title:
|
||||
description:
|
||||
dataurl:
|
||||
submit_url:
|
||||
fields:
|
||||
user_data:
|
||||
}
|
||||
*/
|
||||
constructor(opts){
|
||||
@ -191,12 +190,18 @@ bricks.ModalForm = class extends bricks.Modal {
|
||||
var opts = {
|
||||
title:this.opts.title,
|
||||
description:this.opts.description,
|
||||
dataurl:this.opts.dataurl,
|
||||
submit_url:this.opts.submit_url,
|
||||
fields:this.opts.fields
|
||||
}
|
||||
this.form = new bricks.Form(opts);
|
||||
this.form.bind('submit', this.dismiss.bind(this));
|
||||
this.add_widget(this.form);
|
||||
this.form.bind('submit', this.form_submitted.bind(this));
|
||||
this.form.bind('cancel', this.dismiss.bind(this))
|
||||
this.open();
|
||||
}
|
||||
form_submitted(){
|
||||
var d = this.form.getValue();
|
||||
this.dispatch('submit', d)
|
||||
this.dismiss();
|
||||
}
|
||||
}
|
||||
bricks.Factory.register('Modal', bricks.Modal);
|
||||
|
@ -34,6 +34,12 @@ bricks.TreeNode = class extends bricks.VBox {
|
||||
this.container.hide();
|
||||
}
|
||||
}
|
||||
getValue(){
|
||||
return this.data;
|
||||
}
|
||||
get_id(){
|
||||
return this.data[this.tree.idField];
|
||||
}
|
||||
selected(flg){
|
||||
if (flg){
|
||||
this.str_w.set_css('selected');
|
||||
@ -82,6 +88,11 @@ bricks.TreeNode = class extends bricks.VBox {
|
||||
this.trigle.bind('state_changed', this.toggleExpandCollapse.bind(this));
|
||||
widget.add_widget(this.trigle);
|
||||
}
|
||||
if (this.tree.checkable){
|
||||
this.check_w = new bricks.Check({name:'check'});
|
||||
widget.add_widget(this.check_w);
|
||||
this.check_w.bind('changed', this.tree.node_checked.bind(this.tree, this))
|
||||
}
|
||||
var dtype = this.data[this.tree.opts.typeField];
|
||||
var icon = objget(TypeIcons, dtype);
|
||||
if (!icon && this.tree.opts.default_type){
|
||||
@ -95,8 +106,7 @@ bricks.TreeNode = class extends bricks.VBox {
|
||||
});
|
||||
widget.add_widget(img);
|
||||
var txt = this.data[this.tree.opts.textField];
|
||||
widget.add_widget(
|
||||
this.str_w = new bricks.Text({text:txt}));
|
||||
this.str_w = new bricks.Text({text:txt});
|
||||
this.input = new bricks.UiStr({name:'text', value:txt});
|
||||
this.input.bind('blur', this.edit_handle.bind(this));
|
||||
widget.add_widget(this.str_w);
|
||||
@ -153,6 +163,7 @@ bricks.Tree = class extends bricks.VScrollPanel {
|
||||
this.multitype_tree = this.opts.multitype_tree||false;
|
||||
this.selected_node = null;
|
||||
this.create_toolbar();
|
||||
this.checked_nodes = [];
|
||||
this.container = new bricks.VBox({
|
||||
"width":"100%",
|
||||
"height":"auto",
|
||||
@ -161,26 +172,74 @@ bricks.Tree = class extends bricks.VScrollPanel {
|
||||
this.add_widget(this.container);
|
||||
this.data_id = null;
|
||||
if (this.opts.dataurl){
|
||||
schedule_once(0.01, this.get_children_data.bind(this, this));
|
||||
}
|
||||
schedule_once(this.get_children_data.bind(this, this), 0.1);
|
||||
} else {
|
||||
this.create_node_children(this, this.opts.data);
|
||||
}
|
||||
}
|
||||
create_toolbar(){
|
||||
var toolbar = bricks.extend({}, this.toolbar);
|
||||
var tools = [];
|
||||
if (toolbar.tools){
|
||||
toolbar.tools.forEach(f => tools.push(f));
|
||||
}
|
||||
if (this.editable){
|
||||
tools.push({icon:bricks_resource('imgs/add.png'), name:'add'});
|
||||
tools.push({icon:bricks_resource('imgs/update.png'), name:'update'});
|
||||
tools.push({icon:bricks_resource('imgs/delete.png'), name:'delete'});
|
||||
}
|
||||
if (tools.length == 0){
|
||||
return;
|
||||
}
|
||||
toolbar.tools = tools;
|
||||
this.toolbar_w = new bricks.IconBar(toolbar);
|
||||
this.add_widget(this.toolbar_w);
|
||||
this.toolbar_w.bind('add', this.add_new_node.bind(this));
|
||||
this.toolbar_w.bind('delete', this.delete.bind(this));
|
||||
this.toolbar_w.bind('delete', this.delete_node.bind(this));
|
||||
this.toolbar_w.bind('update', this.update_node.bind(this));
|
||||
}
|
||||
async add_new_node(){
|
||||
var w = new bricks.ModalForm({
|
||||
target:this,
|
||||
"width":"80%",
|
||||
"height":"80%",
|
||||
title:'add new node',
|
||||
fields:this.editable.fields
|
||||
});
|
||||
w.bind('submit', this.new_node_inputed.bind(this))
|
||||
}
|
||||
|
||||
async new_node_inputed(event){
|
||||
var d = event.params;
|
||||
var node = this;
|
||||
if (this.selected_node){
|
||||
d[this.parentField] = this.selected+node.get_id();
|
||||
node = this.selected_node;
|
||||
}
|
||||
var jc = new bricks.HttpJson()
|
||||
var desc = jc.post(this.editable.add_url, {params:d});
|
||||
if (desc.widgettype == 'Message'){
|
||||
var data = desc.options.user_data;
|
||||
this.build_subnode(node, data);
|
||||
}
|
||||
var w = await bricks.widgetBuild(desc, this);
|
||||
}
|
||||
async create_tree_nodes(node, records){
|
||||
for (var i=0;i<records.length;i++){
|
||||
this.build_subnode(node, records[i]);
|
||||
}
|
||||
}
|
||||
build_subnode(node, data){
|
||||
var n = new bricks.TreeNode(this, node, data);
|
||||
node.container.add_widget(n);
|
||||
}
|
||||
|
||||
async delete_node(){
|
||||
}
|
||||
|
||||
async update_node(){
|
||||
}
|
||||
|
||||
async get_children_data(node){
|
||||
var jcall = bricks.jcall;
|
||||
var d = await jcall(this.opts.dataurl,{
|
||||
@ -194,6 +253,7 @@ bricks.Tree = class extends bricks.VScrollPanel {
|
||||
}
|
||||
}
|
||||
create_node_children(node, data){
|
||||
if(!data) return;
|
||||
for (var i=0; i<data.length; i++){
|
||||
var n = new bricks.TreeNode(this, node, data[i]);
|
||||
node.container.add_widget(n);
|
||||
@ -201,16 +261,35 @@ bricks.Tree = class extends bricks.VScrollPanel {
|
||||
}
|
||||
node_click_handle(node, event){
|
||||
if (this.selected_node == node){
|
||||
this.selected_node.selected(false);
|
||||
this.selected_node = node;
|
||||
this.node_selected(false);
|
||||
} else {
|
||||
if (this.selected_node){
|
||||
this.selected_node.selected(false);
|
||||
this.node_selected(this.selected_node, false);
|
||||
}
|
||||
this.selected_node = node;
|
||||
node.selected(true);
|
||||
this.node_selected(node, true);
|
||||
}
|
||||
}
|
||||
node_selected(node, flag){
|
||||
node.selected(flag);
|
||||
var d = {
|
||||
node:node,
|
||||
data:node.getValue(),
|
||||
id:node.get_id(),
|
||||
selected:flag
|
||||
}
|
||||
this.dispatch('node_selected', node);
|
||||
}
|
||||
async node_checked(node, event){
|
||||
var cb = event.target.bricks_widget;
|
||||
var stat = cb.getValue().check;
|
||||
var d = {
|
||||
node:node,
|
||||
data:node.getValue(),
|
||||
id: node.get_id(),
|
||||
check_stat:stat
|
||||
}
|
||||
this.dispatch('check_changed', d);
|
||||
}
|
||||
}
|
||||
/*
|
||||
|
Loading…
Reference in New Issue
Block a user