vassili/seitime-frappe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Merge pull request #30045 from iamejaaz/child-table-lagging

Browse source
This commit is contained in:
Suraj Shetty 2025-01-27 13:07:00 +05:30 • committed by GitHub
commit 00914da9ce
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 30 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
frappe/public/js/frappe/form/grid.js
View file

@ -41,6 +41,31 @@ export default class Grid {
this.is_grid = true;
this.debounced_refresh = this.refresh.bind(this);
this.debounced_refresh = frappe.utils.debounce(this.debounced_refresh, 100);
this.setup_tab_listeners();
}
setup_tab_listeners() {
$(".nav-link").on("shown.bs.tab", () => {
this.handle_scroll_bar();
});
}
handle_scroll_bar() {
frappe.utils.sleep(500).then(() => {
let grid_body_width = this.wrapper.find(".grid-body").width();
let grid_scroll_bar = this.wrapper.find(".grid-scroll-bar");
let grid_scroll_bar_rows = this.wrapper.find(".grid-scroll-bar-rows");
grid_scroll_bar.width(this.form_grid.width());
grid_scroll_bar_rows.width(grid_body_width);
grid_scroll_bar.on("scroll", (event) => {
// Sync the form grid's left position with the scroll bar
this.form_grid.css("position", "relative");
this.form_grid.css("left", -$(event.currentTarget).scrollLeft() + "px");
});
});
}
get perm() {
@ -172,6 +197,8 @@ export default class Grid {
this.form_grid.on("touchend", () => {
isTouchScrolling = false;
});
this.handle_scroll_bar();
}
this.setup_add_row();

49
frappe/public/js/frappe/form/grid_row.js
View file

@ -10,7 +10,6 @@ export default class GridRow {
this.columns_list = [];
this.row_check_html = '<input type="checkbox" class="grid-row-check">';
this.make();
this.setup_tab_listeners();
}
make() {
let me = this;
@ -409,12 +408,14 @@ export default class GridRow {
this.columns = {};
this.update_user_settings_for_grid();
this.grid_settings_dialog.hide();
this.grid.handle_scroll_bar();
});
this.grid_settings_dialog.set_secondary_action_label(__("Reset to default"));
this.grid_settings_dialog.set_secondary_action(() => {
this.reset_user_settings_for_grid();
this.grid_settings_dialog.hide();
this.grid.handle_scroll_bar();
});
}
@ -987,8 +988,6 @@ export default class GridRow {
$col.field_area = $('<div class="field-area"></div>').appendTo($col).toggle(false);
$col.static_area = $('<div class="static-area ellipsis"></div>').appendTo($col).html(txt);
this.handle_scroll_bar();
// set title attribute to see full label for columns in the heading row
if (!this.doc) {
$col.attr("title", txt);
@ -1004,50 +1003,6 @@ export default class GridRow {
return $col;
}
handle_scroll_bar() {
$(document).ready(function () {
let $scrollBar = $(".grid-scroll-bar");
let form_grid = $(".form-grid");
let grid_scroll_bar_rows = $(".grid-scroll-bar-rows");
let parent_field_name = "";
let grid_width = 0;
let grid_body_width = 0;
form_grid.each((grid_index, grid) => {
parent_field_name = $(grid)
.closest("[data-fieldname][data-fieldtype]")
.attr("data-fieldname");
grid_width = $($(grid)[0]).width();
grid_body_width = $(
'div[data-fieldname="' + parent_field_name + '"] .grid-body'
).width();
$('div[data-fieldname="' + parent_field_name + '"] .grid-scroll-bar').width(
grid_width
);
$('div[data-fieldname="' + parent_field_name + '"] .grid-scroll-bar-rows').width(
grid_body_width
);
});
// Make sure the grid container is scrollable
$scrollBar.on("scroll", function (event) {
grid_scroll_bar_rows = $(event.currentTarget).closest(".grid-scroll-bar-rows");
var scroll_left = $(this).scrollLeft();
// Sync the form grid's left position with the scroll bar
form_grid.css("position", "relative");
form_grid.css("left", -scroll_left + "px");
});
});
}
setup_tab_listeners() {
$(".nav-link").on("shown.bs.tab", () => {
this.handle_scroll_bar();
});
}
activate() {
this.toggle_editable_row(true);
return this;

2
frappe/public/scss/common/grid.scss
View file

@ -625,7 +625,7 @@
}
.grid-static-col.col-xs-4 {
flex: 1 0 200px;
width: 200;
width: 200px;
}
.grid-static-col.col-xs-5 {
flex: 1 0 250px;