📄 gridview.js
字号:
}else if(this.forceFit){
this.fitColumns(true, false);
}else if(this.grid.autoExpandColumn){
this.autoExpand(true);
}
this.renderUI();
},
/* --------------------------------- Model Events and Handlers --------------------------------*/
// private
initData : function(ds, cm){
if(this.ds){
this.ds.un("load", this.onLoad, this);
this.ds.un("datachanged", this.onDataChange, this);
this.ds.un("add", this.onAdd, this);
this.ds.un("remove", this.onRemove, this);
this.ds.un("update", this.onUpdate, this);
this.ds.un("clear", this.onClear, this);
}
if(ds){
ds.on("load", this.onLoad, this);
ds.on("datachanged", this.onDataChange, this);
ds.on("add", this.onAdd, this);
ds.on("remove", this.onRemove, this);
ds.on("update", this.onUpdate, this);
ds.on("clear", this.onClear, this);
}
this.ds = ds;
if(this.cm){
this.cm.un("configchange", this.onColConfigChange, this);
this.cm.un("widthchange", this.onColWidthChange, this);
this.cm.un("headerchange", this.onHeaderChange, this);
this.cm.un("hiddenchange", this.onHiddenChange, this);
this.cm.un("columnmoved", this.onColumnMove, this);
this.cm.un("columnlockchange", this.onColumnLock, this);
}
if(cm){
delete this.lastViewWidth;
cm.on("configchange", this.onColConfigChange, this);
cm.on("widthchange", this.onColWidthChange, this);
cm.on("headerchange", this.onHeaderChange, this);
cm.on("hiddenchange", this.onHiddenChange, this);
cm.on("columnmoved", this.onColumnMove, this);
cm.on("columnlockchange", this.onColumnLock, this);
}
this.cm = cm;
},
// private
onDataChange : function(){
this.refresh();
this.updateHeaderSortState();
this.syncFocusEl(0);
},
// private
onClear : function(){
this.refresh();
this.syncFocusEl(0);
},
// private
onUpdate : function(ds, record){
this.refreshRow(record);
},
// private
onAdd : function(ds, records, index){
this.insertRows(ds, index, index + (records.length-1));
},
// private
onRemove : function(ds, record, index, isUpdate){
if(isUpdate !== true){
this.fireEvent("beforerowremoved", this, index, record);
}
this.removeRow(index);
if(isUpdate !== true){
this.processRows(index);
this.applyEmptyText();
this.fireEvent("rowremoved", this, index, record);
}
},
// private
onLoad : function(){
this.scrollToTop();
},
// private
onColWidthChange : function(cm, col, width){
this.updateColumnWidth(col, width);
},
// private
onHeaderChange : function(cm, col, text){
this.updateHeaders();
},
// private
onHiddenChange : function(cm, col, hidden){
this.updateColumnHidden(col, hidden);
},
// private
onColumnMove : function(cm, oldIndex, newIndex){
this.indexMap = null;
var s = this.getScrollState();
this.refresh(true);
this.restoreScroll(s);
this.afterMove(newIndex);
},
// private
onColConfigChange : function(){
delete this.lastViewWidth;
this.indexMap = null;
this.refresh(true);
},
/* -------------------- UI Events and Handlers ------------------------------ */
// private
initUI : function(grid){
grid.on("headerclick", this.onHeaderClick, this);
},
// private
initEvents : function(){
},
// private
onHeaderClick : function(g, index){
if(this.headersDisabled || !this.cm.isSortable(index)){
return;
}
g.stopEditing(true);
g.store.sort(this.cm.getDataIndex(index));
},
// private
onRowOver : function(e, t){
var row;
if((row = this.findRowIndex(t)) !== false){
this.addRowClass(row, "x-grid3-row-over");
}
},
// private
onRowOut : function(e, t){
var row;
if((row = this.findRowIndex(t)) !== false && !e.within(this.getRow(row), true)){
this.removeRowClass(row, "x-grid3-row-over");
}
},
// private
handleWheel : function(e){
e.stopPropagation();
},
// private
onRowSelect : function(row){
this.addRowClass(row, "x-grid3-row-selected");
},
// private
onRowDeselect : function(row){
this.removeRowClass(row, "x-grid3-row-selected");
},
// private
onCellSelect : function(row, col){
var cell = this.getCell(row, col);
if(cell){
this.fly(cell).addClass("x-grid3-cell-selected");
}
},
// private
onCellDeselect : function(row, col){
var cell = this.getCell(row, col);
if(cell){
this.fly(cell).removeClass("x-grid3-cell-selected");
}
},
// private
onColumnSplitterMoved : function(i, w){
this.userResized = true;
var cm = this.grid.colModel;
cm.setColumnWidth(i, w, true);
if(this.forceFit){
this.fitColumns(true, false, i);
this.updateAllColumnWidths();
}else{
this.updateColumnWidth(i, w);
this.syncHeaderScroll();
}
this.grid.fireEvent("columnresize", i, w);
},
// private
handleHdMenuClick : function(item){
var index = this.hdCtxIndex;
var cm = this.cm, ds = this.ds;
switch(item.id){
case "asc":
ds.sort(cm.getDataIndex(index), "ASC");
break;
case "desc":
ds.sort(cm.getDataIndex(index), "DESC");
break;
default:
index = cm.getIndexById(item.id.substr(4));
if(index != -1){
if(item.checked && cm.getColumnsBy(this.isHideableColumn, this).length <= 1){
this.onDenyColumnHide();
return false;
}
cm.setHidden(index, item.checked);
}
}
return true;
},
// private
isHideableColumn : function(c){
return !c.hidden && !c.fixed;
},
// private
beforeColMenuShow : function(){
var cm = this.cm, colCount = cm.getColumnCount();
this.colMenu.removeAll();
for(var i = 0; i < colCount; i++){
if(cm.config[i].fixed !== true && cm.config[i].hideable !== false){
this.colMenu.add(new Ext.menu.CheckItem({
id: "col-"+cm.getColumnId(i),
text: cm.getColumnHeader(i),
checked: !cm.isHidden(i),
hideOnClick:false,
disabled: cm.config[i].hideable === false
}));
}
}
},
// private
handleHdDown : function(e, t){
if(Ext.fly(t).hasClass('x-grid3-hd-btn')){
e.stopEvent();
var hd = this.findHeaderCell(t);
Ext.fly(hd).addClass('x-grid3-hd-menu-open');
var index = this.getCellIndex(hd);
this.hdCtxIndex = index;
var ms = this.hmenu.items, cm = this.cm;
ms.get("asc").setDisabled(!cm.isSortable(index));
ms.get("desc").setDisabled(!cm.isSortable(index));
this.hmenu.on("hide", function(){
Ext.fly(hd).removeClass('x-grid3-hd-menu-open');
}, this, {single:true});
this.hmenu.show(t, "tl-bl?");
}
},
// private
handleHdOver : function(e, t){
var hd = this.findHeaderCell(t);
if(hd && !this.headersDisabled){
this.activeHd = hd;
this.activeHdIndex = this.getCellIndex(hd);
var fly = this.fly(hd);
this.activeHdRegion = fly.getRegion();
if(!this.cm.isMenuDisabled(this.activeHdIndex)){
fly.addClass("x-grid3-hd-over");
this.activeHdBtn = fly.child('.x-grid3-hd-btn');
if(this.activeHdBtn){
this.activeHdBtn.dom.style.height = (hd.firstChild.offsetHeight-1)+'px';
}
}
}
},
// private
handleHdMove : function(e, t){
if(this.activeHd && !this.headersDisabled){
var hw = this.splitHandleWidth || 5;
var r = this.activeHdRegion;
var x = e.getPageX();
var ss = this.activeHd.style;
if(x - r.left <= hw && this.cm.isResizable(this.activeHdIndex-1)){
ss.cursor = Ext.isAir ? 'move' : Ext.isSafari ? 'e-resize' : 'col-resize'; // col-resize not always supported
}else if(r.right - x <= (!this.activeHdBtn ? hw : 2) && this.cm.isResizable(this.activeHdIndex)){
ss.cursor = Ext.isAir ? 'move' : Ext.isSafari ? 'w-resize' : 'col-resize';
}else{
ss.cursor = '';
}
}
},
// private
handleHdOut : function(e, t){
var hd = this.findHeaderCell(t);
if(hd && (!Ext.isIE || !e.within(hd, true))){
this.activeHd = null;
this.fly(hd).removeClass("x-grid3-hd-over");
hd.style.cursor = '';
}
},
// private
hasRows : function(){
var fc = this.mainBody.dom.firstChild;
return fc && fc.className != 'x-grid-empty';
},
// back compat
bind : function(d, c){
this.initData(d, c);
}
});
// private
// This is a support class used internally by the Grid components
Ext.grid.GridView.SplitDragZone = function(grid, hd){
this.grid = grid;
this.view = grid.getView();
this.marker = this.view.resizeMarker;
this.proxy = this.view.resizeProxy;
Ext.grid.GridView.SplitDragZone.superclass.constructor.call(this, hd,
"gridSplitters" + this.grid.getGridEl().id, {
dragElId : Ext.id(this.proxy.dom), resizeFrame:false
});
this.scroll = false;
this.hw = this.view.splitHandleWidth || 5;
};
Ext.extend(Ext.grid.GridView.SplitDragZone, Ext.dd.DDProxy, {
b4StartDrag : function(x, y){
this.view.headersDisabled = true;
var h = this.view.mainWrap.getHeight();
this.marker.setHeight(h);
this.marker.show();
this.marker.alignTo(this.view.getHeaderCell(this.cellIndex), 'tl-tl', [-2, 0]);
this.proxy.setHeight(h);
var w = this.cm.getColumnWidth(this.cellIndex);
var minw = Math.max(w-this.grid.minColumnWidth, 0);
this.resetConstraints();
this.setXConstraint(minw, 1000);
this.setYConstraint(0, 0);
this.minX = x - minw;
this.maxX = x + 1000;
this.startPos = x;
Ext.dd.DDProxy.prototype.b4StartDrag.call(this, x, y);
},
handleMouseDown : function(e){
var t = this.view.findHeaderCell(e.getTarget());
if(t){
var xy = this.view.fly(t).getXY(), x = xy[0], y = xy[1];
var exy = e.getXY(), ex = exy[0], ey = exy[1];
var w = t.offsetWidth, adjust = false;
if((ex - x) <= this.hw){
adjust = -1;
}else if((x+w) - ex <= this.hw){
adjust = 0;
}
if(adjust !== false){
this.cm = this.grid.colModel;
var ci = this.view.getCellIndex(t);
if(adjust == -1){
if (ci + adjust < 0) {
return;
}
while(this.cm.isHidden(ci+adjust)){
--adjust;
if(ci+adjust < 0){
return;
}
}
}
this.cellIndex = ci+adjust;
this.split = t.dom;
if(this.cm.isResizable(this.cellIndex) && !this.cm.isFixed(this.cellIndex)){
Ext.grid.GridView.SplitDragZone.superclass.handleMouseDown.apply(this, arguments);
}
}else if(this.view.columnDrag){
this.view.columnDrag.callHandleMouseDown(e);
}
}
},
endDrag : function(e){
this.marker.hide();
var v = this.view;
var endX = Math.max(this.minX, e.getPageX());
var diff = endX - this.startPos;
v.onColumnSplitterMoved(this.cellIndex, this.cm.getColumnWidth(this.cellIndex)+diff);
setTimeout(function(){
v.headersDisabled = false;
}, 50);
},
autoOffset : function(){
this.setDelta(0,0);
}
});
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -