This commit is contained in:
yumoqing 2024-02-25 12:31:02 +08:00
parent 1fff530118
commit 96821a2b01
9 changed files with 209 additions and 29 deletions

View File

@ -73,17 +73,17 @@ bricks.widgetBuild = async function(desc, widget){
if (! widget){ if (! widget){
widget = bricks.Body; widget = bricks.Body;
} }
const klassname = desc.widgettype; var klassname = desc.widgettype;
var base_url = null; var base_url = widget.baseURI;
if (klassname == 'urlwidget'){ while (klassname == 'urlwidget'){
let url = absurl(desc.options.url, widget); let url = absurl(desc.options.url, widget);
base_url = url; base_url = url;
let method = desc.options.method || 'GET'; let method = desc.options.method || 'GET';
let opts = desc.options.params || {}; let opts = desc.options.params || {};
var jcall = bricks.jcall; var jcall = bricks.jcall;
desc = await jcall(url, { "method":method, "params":opts}); var desc1 = await jcall(url, { "method":method, "params":opts});
} else { desc = desc1;
base_url = widget.baseURI; klassname = desc.widgettype;
} }
let klass = bricks.Factory.get(desc.widgettype); let klass = bricks.Factory.get(desc.widgettype);
if (! klass){ if (! klass){

View File

@ -5,7 +5,7 @@ SOURCES=" factory.js uitypesdef.js utils.js i18n.js widget.js \
input.js registerfunction.js button.js accordion.js \ input.js registerfunction.js button.js accordion.js \
tree.js multiple_state_image.js form.js message.js \ tree.js multiple_state_image.js form.js message.js \
paging.js datagrid.js dataviewer.js \ paging.js datagrid.js dataviewer.js \
miniform.js wterm.js " miniform.js wterm.js dynamicaccordion.js "
echo ${SOURCES} echo ${SOURCES}
cat ${SOURCES} > ../dist/bricks.js cat ${SOURCES} > ../dist/bricks.js
# uglifyjs --compress --mangle -- ../dist/bricks.js > ../dist/bricks.min.js # uglifyjs --compress --mangle -- ../dist/bricks.js > ../dist/bricks.min.js

View File

@ -1,8 +1,10 @@
html, html,
body { body {
height: 100%; height: 100%;
width: 100%;
margin: 0; margin: 0;
overflow: auto; overflow: auto;
display: flex;
} }
.griddata { .griddata {
@ -66,8 +68,7 @@ body {
.vcontainer { .vcontainer {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height:100%; // overflow:auto;
scroll:auto;
} }
.vbox { .vbox {
@ -78,8 +79,7 @@ body {
.hcontainer { .hcontainer {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
width:100%; // overflow:auto;
scroll:auto;
} }
.hbox { .hbox {
@ -93,7 +93,7 @@ body {
.filler, .hfiller, .vfiller { .filler, .hfiller, .vfiller {
flex: auto; flex: auto;
scroll:auto; // overflow:auto;
} }
.vfiller .vbox:last-child { .vfiller .vbox:last-child {
@ -252,3 +252,22 @@ div[tooltip] {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
/* Flex 布局 */
.accordion {
display: flex;
flex-direction: column;
}
.accordion-item {
border: 1px solid #ccc;
margin-bottom: 5px;
}
.accordion-item-header {
padding: 10px;
background-color: #f0f0f0;
cursor: pointer;
}
.accordion-item-content {
padding: 10px;
background-color: #ffffff;
}

View File

@ -54,7 +54,7 @@ bricks.DataViewer = class extends bricks.VScrollPanel {
} }
} }
add_row = async function(row, direction){ add_row = async function(row, direction){
var s = obj_fmtstr(row, this.viewer_tmpl); var s = bricks.obj_fmtstr(row, this.viewer_tmpl);
var desc = JSON.parse(s); var desc = JSON.parse(s);
var w = await bricks.widgetBuild(desc, this); var w = await bricks.widgetBuild(desc, this);
if (! w){ if (! w){

View File

@ -72,9 +72,18 @@ bricks.VBox = class extends bricks.Layout {
} }
} }
bricks.Filler = class extends bricks.Layout {
constructor(options){
super(options);
this.set_style('flexGrow', 1);
this.set_style('overflow', 'auto');
}
}
bricks.VFiller = class extends bricks.Layout { bricks.VFiller = class extends bricks.Layout {
constructor(options){ constructor(options){
super(options); super(options);
this.set_css('vfiller'); this.set_css('vfiller');
} }
} }
@ -95,6 +104,7 @@ bricks.HFiller = class extends bricks.Layout {
bricks.Factory.register('HBox', bricks.HBox); bricks.Factory.register('HBox', bricks.HBox);
bricks.Factory.register('VBox', bricks.VBox); bricks.Factory.register('VBox', bricks.VBox);
bricks.Factory.register('Filler', bricks.Filler);
bricks.Factory.register('HFiller', bricks.HFiller); bricks.Factory.register('HFiller', bricks.HFiller);
bricks.Factory.register('VFiller', bricks.VFiller); bricks.Factory.register('VFiller', bricks.VFiller);

View File

@ -4,7 +4,6 @@ bricks.TreeNode = class extends bricks.VBox {
var opts = { var opts = {
width:'100%', width:'100%',
height:'auto', height:'auto',
overflow:'hidden'
} }
super(opts); super(opts);
this.tree = tree; this.tree = tree;
@ -17,8 +16,7 @@ bricks.TreeNode = class extends bricks.VBox {
this.params['type'] = this.data[this.tree.opts.typeField]; this.params['type'] = this.data[this.tree.opts.typeField];
} }
var n = new bricks.HBox({ var n = new bricks.HBox({
height:'auto', height:this.tree.row_height,
overflow:'hidden',
width:'100%' width:'100%'
}) })
n.dom_element.style.margin = bricks.app.charsize * 0.2; n.dom_element.style.margin = bricks.app.charsize * 0.2;
@ -27,7 +25,7 @@ bricks.TreeNode = class extends bricks.VBox {
this.node_widget = n; this.node_widget = n;
this.create_node_content(n); this.create_node_content(n);
if (! this.data.is_leaf) { if (! this.data.is_leaf) {
this.container = new bricks.VBox({height:'auto', overflow:'hidden'}); this.container = new bricks.VBox({height:'auto'});
this.add_widget(this.container); this.add_widget(this.container);
this.container.dom_element.style.marginLeft = bricks.app.charsize + 'px'; this.container.dom_element.style.marginLeft = bricks.app.charsize + 'px';
if (this.data.children){ if (this.data.children){
@ -155,7 +153,11 @@ bricks.Tree = class extends bricks.VScrollPanel {
this.multitype_tree = this.opts.multitype_tree||false; this.multitype_tree = this.opts.multitype_tree||false;
this.selected_node = null; this.selected_node = null;
this.create_toolbar(); this.create_toolbar();
this.container = this; this.container = new bricks.VBox({
"width":"100%",
"height":"auto",
"overflow":"auto"
});
this.add_widget(this.container); this.add_widget(this.container);
this.data_id = null; this.data_id = null;
if (this.opts.dataurl){ if (this.opts.dataurl){

View File

@ -136,7 +136,7 @@ var objget = function(obj, key, defval){
return defval; return defval;
} }
var obj_fmtstr = function(obj, fmt){ bricks.obj_fmtstr = function(obj, fmt){
/* fmt like /* fmt like
'my name is ${name}, ${age=}' 'my name is ${name}, ${age=}'
'${name:}, ${age=}' '${name:}, ${age=}'
@ -201,7 +201,7 @@ var archorize = function(ele,archor){
'x':x, 'x':x,
'y':y 'y':y
} }
var tsf = obj_fmtstr(o, 'translateY(-${y}) translateX(-${x})'); var tsf = bricks.obj_fmtstr(o, 'translateY(-${y}) translateX(-${x})');
console.log('archorize(): tsf=', tsf); console.log('archorize(): tsf=', tsf);
ele.style.transform = tsf; ele.style.transform = tsf;
ele.style.position = "absolute"; ele.style.position = "absolute";
@ -307,3 +307,18 @@ bricks.playResponseAudio = async function(response, target){
widget.set_url(url); widget.set_url(url);
widget.play(); widget.play();
} }
bricks.widgetBuildWithData = async function(desc_tmpl, from_widget, data){
if (!desc_tmpl){
console.log('bricks.widgetBuildWithData():data=', data, 'desc_tmpl=', desc_tmpl);
}
var s = bricks.obj_fmtstr(data, desc_tmpl);
var desc = JSON.parse(s);
var w = await bricks.widgetBuild(desc, from_widget);
if (! w){
console.log(desc, 'widgetBuild() failed...........');
return;
}
w.row_data = data;
return w;
}

View File

@ -181,6 +181,13 @@ bricks.JsWidget = class {
hide(){ hide(){
this.dom_element.style.display = 'none' this.dom_element.style.display = 'none'
} }
toggle_hide(){
if (this.dom_element.style.display == 'none'){
this.show();
} else {
this.hide();
}
}
bind(eventname, handler){ bind(eventname, handler){
this.dom_element.addEventListener(eventname, handler); this.dom_element.addEventListener(eventname, handler);
} }

View File

@ -48,14 +48,42 @@
"id":13, "id":13,
"text":"node13", "text":"node13",
"is_leaf":true "is_leaf":true
}
]
}, },
{ {
"id":2, "id":14,
"text":"node2", "text":"node14",
"is_leaf":false, "is_leaf":true
"children":[ },
{
"id":15,
"text":"node15",
"is_leaf":true
},
{
"id":16,
"text":"node16",
"is_leaf":true
},
{
"id":17,
"text":"node17",
"is_leaf":true
},
{
"id":18,
"text":"node18",
"is_leaf":true
},
{
"id":19,
"text":"node19",
"is_leaf":true
},
{
"id":20,
"text":"node20",
"is_leaf":true
},
{ {
"id":21, "id":21,
"text":"node21", "text":"node21",
@ -70,14 +98,113 @@
"id":23, "id":23,
"text":"node23", "text":"node23",
"is_leaf":true "is_leaf":true
},
{
"id":24,
"text":"node24",
"is_leaf":true
},
{
"id":25,
"text":"node25",
"is_leaf":true
},
{
"id":26,
"text":"node26",
"is_leaf":true
},
{
"id":27,
"text":"node27",
"is_leaf":true
},
{
"id":28,
"text":"node28",
"is_leaf":true
},
{
"id":29,
"text":"node29",
"is_leaf":true
},
{
"id":30,
"text":"node30",
"is_leaf":true
},
{
"id":31,
"text":"node31",
"is_leaf":true
},
{
"id":32,
"text":"node32",
"is_leaf":true
},
{
"id":33,
"text":"node33",
"is_leaf":true
},
{
"id":34,
"text":"node34",
"is_leaf":true
},
{
"id":35,
"text":"node35",
"is_leaf":true
},
{
"id":36,
"text":"node36",
"is_leaf":true
}
]
},
{
"id":2,
"text":"node2",
"is_leaf":false,
"children":[
{
"id":221,
"text":"node221",
"is_leaf":true
},
{
"id":222,
"text":"node222",
"is_leaf":true
},
{
"id":223,
"text":"node223",
"is_leaf":true
} }
] ]
}, },
{ {
"id":3, "id":3,
"text":"node3", "text":"node3",
"is_leaf":false,
"children":[
{
"id":"3-1",
"text":"node3112",
"is_leaf":true
},
{
"id":"3-2",
"text":"node313",
"is_leaf":true "is_leaf":true
} }
] ]
} }
]
}
} }