This commit is contained in:
yumoqing 2024-05-08 16:01:23 +08:00
parent 145bf1c6ed
commit b5f89a9a68
6 changed files with 80 additions and 34 deletions

View File

@ -241,24 +241,34 @@ body {
display: flex;
flex-direction: column;
}
.accordion-item:nth-child(odd) {
background-color: #fdfdfd;
}
.accordion-item:nth-child(even) {
background-color: #f9f9f9;
}
.accordion-item-selected {
background-color: #efefef;
}
.accordion-item {
border: 1px solid #ccc;
margin-bottom: 5px;
}
.accordion-item-header {
padding: 10px;
background-color: #eeeeee;
width: auto;
background-color: #f0f0f0;
}
.accordion-item-info {
padding: 10px;
background-color: #f0f0f0;
background-color: #fbfbfb;
cursor: pointer;
width: auto;
height: 50px;
}
.accordion-item-info-selected {
background-color: #e6e6e6;
}
.accordion-item-content {
padding: 10px;
background-color: #ffffff;
}
.llm_msg {

View File

@ -22,13 +22,19 @@ bricks.DataRow = class extends bricks.HBox {
*/
constructor(opts){
super(opts);
// this.set_style('flexShrink', '0');
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){
@ -39,6 +45,11 @@ bricks.DataRow = class extends bricks.HBox {
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)
@ -102,7 +113,12 @@ bricks.DataRow = class extends bricks.HBox {
my_dispatch(e){
this.dispatch(e);
}
build_fields(header){
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){
@ -113,7 +129,7 @@ bricks.DataRow = class extends bricks.HBox {
}
for (var i=0;i<this.fields.length;i++){
var f = this.fields[i]
if (this.exclouded.includes(f.name)){
if (exclouded.includes(f.name)){
continue;
}
var opts = bricks.extend({
@ -121,7 +137,9 @@ bricks.DataRow = class extends bricks.HBox {
}, f);
if (header){
opts.value = f.label || f.name;
}
} else {
opts.value = this.user_data[f.name];
}
var cwidth = cwidths[f.name];
if (cwidth){
opts.cwidth = cwidth;
@ -129,7 +147,7 @@ bricks.DataRow = class extends bricks.HBox {
var f = bricks.get_ViewBuilder(f.uitype);
if (!f) f = bricks.get_ViewBuilder('str');
var w = f(opts);
this.add_widget(w)
cw.add_widget(w)
}
}
}

View File

@ -20,6 +20,7 @@ bricks.DynamicAccordion = class extends bricks.VScrollPanel {
"data_method",
"cache_limit",
"page_rows",
"row_cheight":1.5
"record_view"
"content_rely_on"
"content_rely_value"
@ -33,7 +34,7 @@ bricks.DynamicAccordion = class extends bricks.VScrollPanel {
*/
constructor(opts){
super(opts);
this.element = this.dom_element;
this.row_cheight = opts.row_cheight || 1.5;
// this.set_style('overflow', 'auto');
this.loader = new bricks.PageDataLoader({
url:this.opts.data_url,
@ -115,9 +116,7 @@ bricks.DynamicAccordion = class extends bricks.VScrollPanel {
}
content.set_css('accordion-item-content');
content.hide();
if ( build_content ){
info.bind('click', this.toggle_content.bind(this, info, content, record));
}
info.bind('click', this.line_clicked.bind(this, info, content, record));
item.add_widget(content);
return item;
}
@ -128,8 +127,8 @@ bricks.DynamicAccordion = class extends bricks.VScrollPanel {
}
var w;
var tb = null;
var info = new bricks.AccordionInfo({});
info.data = record;
var info = new bricks.AccordionInfo({cheight:this.cheight});
info.user_data = record;
item.add_widget(info);
tb = this.build_record_toolbar(info, record);
if (! record){
@ -214,16 +213,19 @@ bricks.DynamicAccordion = class extends bricks.VScrollPanel {
var desc = await resp.json();
var w = await bricks.widgetBuild(desc);
if (desc.widgettype == 'Message'){
var d = form.getValue();
var record = bricks.extend(info.data, d);
var w = info.children[0];
info.clear_widgets();
var rtb = w.children[0];
var w = await bricks.widgetBuild(this.record_view, info, record);
w.add_widget(rtb, 0);
info.add_widget(w);
await this.renew_record_view(form, info);
}
}
async renew_record_view(form, info){
var d = form.getValue();
var record = bricks.extend(info.user_data, d);
var w = info.children[0];
info.clear_widgets();
var rtb = w.children[0];
var w = await bricks.widgetBuild(this.record_view, info, record);
w.add_widget(rtb, 0);
info.add_widget(w);
}
delete_record(info, record){
var conform_w = new bricks.Conform({
target:this,
@ -399,6 +401,21 @@ bricks.DynamicAccordion = class extends bricks.VScrollPanel {
this.container.remove_widget(w);
}
}
select_line(info){
if (this.select_row){
this.select_row.unset_css('accordion-item-info-selected');
}
this.select_row = info;
this.select_row.set_css('accordion-item-info-selected');
this.dispatch('row_selected', info);
}
async line_clicked(info, content, record, event){
this.select_line(info);
if(! this.content_view){
return;
}
this.toggle_content(info, content, record, event);
}
async toggle_content(info, content, record, event){
if(! this.content_view){
return;

View File

@ -6,7 +6,7 @@ bricks.Tabular = class extends bricks.DynamicAccordion {
this.get_edit_fields();
}
get_edit_fields(){
var fs = this.record_view_.optiosn.fields;
var fs = this.record_view.options.fields;
this.fields = [];
var exclouded = [];
if (this.record_view.options.editexcloded){
@ -27,15 +27,8 @@ bricks.Tabular = class extends bricks.DynamicAccordion {
if (record){
/* data row
*/
var options = bricks.extend({}, this.record_view.options);
var fields = [];
options.fields.forEach(f => {
var newf = bricks.extend({}, f);
newf.value = record[f.name];
fields.push(newf);
});
var options = bricks.extend({cheight:this.cheight}, this.record_view.options);
var desc = bricks.extend({}, this.record_view);
options.fields = fields;
options.user_data = record;
desc.options = options
var dr = await bricks.widgetBuild(desc, this);
@ -53,6 +46,11 @@ bricks.Tabular = class extends bricks.DynamicAccordion {
item.add_widget(dr);
return dr;
}
async renew_record_view(form, info){
var d = form.getValue();
var record = bricks.extend(info.user_data, d);
info.renew(record);
}
record_event_handle(event_name, record, row, item){
console.log('event_name=', event_name, 'record=', record);
switch(event_name){

View File

@ -171,6 +171,9 @@ bricks.JsWidget = class {
this.set_css(c, remove_flg);
})
}
unset_css(css){
this.dom_element.classList.remove(css);
}
set_css(css, remove_flg){
if (!remove_flg){
this.dom_element.classList.add(css);

View File

@ -1,5 +1,5 @@
{
"widgettype":"DomElement",
"widgettype":"Html",
"options":{
"html":"<p>Test domelement</p>"
}