tsanie/ui-lib
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

double click spliter to resize column width

Browse Source
This commit is contained in:
Tsanie Lily
2023-04-04 16:09:30 +08:00
parent a2fbb7e78a
commit 3bc258149c
2 changed files with 35 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
lib/ui/grid.js
View File

@@ -604,6 +604,7 @@ class Grid {
const spliter = document.createElement('layer');
spliter.className = 'spliter';
spliter.addEventListener('mousedown', e => this.#onResizeStart(e, col));
spliter.addEventListener('dblclick', e => this.#onAutoResize(e, col));
th.appendChild(spliter);
}
// tooltip
@@ -1129,6 +1130,7 @@ class Grid {
return;
}
attr.resizing = val;
attr.sizing = true;
this.#changeColumnWidth(index, val);
};
attr.mousemove = e => throttle(resizemove, RefreshInterval, this, e);
@@ -1136,11 +1138,14 @@ class Grid {
clearEvents(attr);
const width = attr.resizing;
if (width != null) {
col.autoResize = false;
setTimeout(() => delete attr.resizing);
this.#changeColumnWidth(index, width);
if (typeof this.columnChanged === 'function') {
this.columnChanged(ColumnChangedType.Resize, index, width);
if (attr.sizing) {
delete attr.sizing;
col.autoResize = false;
this.#changeColumnWidth(index, width);
if (typeof this.columnChanged === 'function') {
this.columnChanged(ColumnChangedType.Resize, index, width);
}
}
}
e.stopPropagation();
@@ -1149,6 +1154,29 @@ class Grid {
['mousemove', 'mouseup'].forEach(event => window.addEventListener(event, attr[event]));
}
#onAutoResize(e, col) {
const th = e.currentTarget.parentElement;
const index = indexOfParent(th);
let width = th.querySelector('div:first-child').scrollWidth;
for (let row of this.#refs.bodyContent.children) {
const element = row.children[index].children[0];
const w = element.scrollWidth;
if (w > width) {
width = w;
}
}
if (width < MiniColumnWidth) {
width = MiniColumnWidth;
}
if (width > 0 && width !== col.width) {
width += 12;
this.#changeColumnWidth(index, width);
if (typeof this.columnChanged === 'function') {
this.columnChanged(ColumnChangedType.Resize, index, width);
}
}
}
#onColumnAllChecked(col, flag) {
if (this.#currentSource == null) {
return;