| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203 |
- Ext.define('Ext.overrides.grid.feature.Summary', {
- override: 'Ext.grid.feature.Summary',
- // override
- fixed: undefined,
- fixedSummaryCls: Ext.baseCSSPrefix + 'fixed-summary',
- init: function (grid) {
- var me = this,
- view = me.view,
- dock = me.dock,
- fixed = me.fixed;
- me.callParent([grid]);
- // when 'fixed' is true, 'dock' must be a defined value, default 'bottom'
- if(fixed) {
- dock = me.dock = dock || 'bottom';
- }
- if (dock) {
- grid.addBodyCls(me.panelBodyCls + dock);
- grid.headerCt.on({
- add: me.onStoreUpdate,
- // we need to fire onStoreUpdate afterlayout for docked items
- // to re-run the renderSummaryRow on show/hide columns.
- afterlayout: me.onStoreUpdate,
- remove: me.onStoreUpdate,
- scope: me
- });
- grid.on({
- beforerender: function () {
- var tableCls = [me.summaryTableCls];
- if (view.columnLines) {
- tableCls[tableCls.length] = view.ownerCt.colLinesCls;
- }
- me.summaryBar = grid.addDocked({
- childEls: ['innerCt', 'item'],
- renderTpl: [
- '<div id="{id}-innerCt" data-ref="innerCt" role="presentation">',
- '<table id="{id}-item" data-ref="item" cellPadding="0" cellSpacing="0" class="' + tableCls.join(' ') + '">',
- '<tr class="' + me.summaryRowCls + '"></tr>',
- '</table>',
- '</div>'
- ],
- scrollable: {
- x: false,
- y: false
- },
- hidden: !me.showSummaryRow,
- itemId: 'summaryBar',
- cls: [me.dockedSummaryCls, me.dockedSummaryCls + '-' + dock, (fixed ? me.fixedSummaryCls : '')],
- xtype: 'component',
- dock: dock,
- weight: 10000000
- })[0];
- },
- afterrender: function () {
- grid.getView().getScrollable().addPartner(me.summaryBar.getScrollable(), 'x');
- me.onStoreUpdate();
- me.columnSizer = me.summaryBar.el;
- },
- single: true
- });
- } else {
- if (grid.bufferedRenderer) {
- me.wrapsItem = true;
- view.addRowTpl(me.fullSummaryTpl).summaryFeature = me;
- view.on('refresh', me.onViewRefresh, me);
- } else {
- me.wrapsItem = false;
- me.view.addFooterFn(me.renderSummaryRow);
- }
- }
- grid.headerCt.on({
- afterlayout: me.afterHeaderCtLayout,
- scope: me
- });
- grid.ownerGrid.on({
- beforereconfigure: me.onBeforeReconfigure,
- columnmove: me.onStoreUpdate,
- scope: me
- });
- me.bindStore(grid, grid.getStore());
- },
- onStoreUpdate: function () {
- var me = this,
- view = me.view,
- selector = me.summaryRowSelector,
- dock = me.dock,
- fixed = me.fixed,
- record, newRowDom, oldRowDom, newCellDoms, p;
- if (!view.rendered) {
- return;
- }
- record = me.createSummaryRecord(view);
- newRowDom = Ext.fly(view.createRowElement(record, -1)).down(selector, true);
- if (!newRowDom) {
- return;
- }
- if(fixed) {
- newCellDoms = newRowDom.children;
- for(let i = newCellDoms.length - 1; i >= 0 ; i--) {
- let innerText = newCellDoms[i].innerText.trim();
- if(innerText.length === 0) {
- newRowDom.removeChild(newCellDoms[i])
- }else {
- newCellDoms[i].style.removeProperty('width');
- }
- }
- }
- // Summary row is inside the docked summaryBar Component
- if (dock) {
- p = me.summaryBar.item.dom.firstChild;
- oldRowDom = p.firstChild;
- p.insertBefore(newRowDom, oldRowDom);
- p.removeChild(oldRowDom);
- }
- // Summary row is a regular row in a THEAD inside the View.
- // Downlinked through the summary record's ID
- else {
- oldRowDom = view.el.down(selector, true);
- p = oldRowDom && oldRowDom.parentNode;
- if (p) {
- p.removeChild(oldRowDom);
- }
- // We're always inserting the new summary row into the last rendered row,
- // unless no rows exist. In that case we will be appending to the special
- // placeholder in the node container.
- p = view.getRow(view.all.last());
- if (p) {
- p = p.parentElement;
- }
- // View might not have nodeContainer yet.
- else {
- p = me.getSummaryRowPlaceholder(view);
- p = p && p.tBodies && p.tBodies[0];
- }
- if (p) {
- p.appendChild(newRowDom);
- }
- }
- },
- // Synchronize column widths in the docked summary Component or the inline summary row
- // depending on whether we are docked or not.
- afterHeaderCtLayout: function (headerCt) {
- var me = this,
- view = me.view,
- columns = view.getVisibleColumnManager().getColumns(),
- column,
- len = columns.length,
- i,
- summaryEl,
- el, width, innerCt;
- if (me.showSummaryRow && view.refreshCounter) {
- if(me.fixed) {
- return;
- }
- if (me.dock) {
- summaryEl = me.summaryBar.el;
- width = headerCt.getTableWidth();
- innerCt = me.summaryBar.innerCt;
- // Stretch the innerCt of the summary bar upon headerCt layout
- me.summaryBar.item.setWidth(width);
- // headerCt's tooNarrow flag is set by its layout if the columns overflow.
- // Must not measure+set in after layout phase, this is a write phase.
- if (headerCt.tooNarrow) {
- width += Ext.getScrollbarSize().width;
- }
- innerCt.setWidth(width);
- } else {
- summaryEl = Ext.fly(Ext.fly(view.getNodeContainer()).down('.' + me.summaryItemCls, true));
- }
- // If the layout was in response to a clearView, there'll be no summary element
- if (summaryEl) {
- for (i = 0; i < len; i++) {
- column = columns[i];
- el = summaryEl.down(view.getCellSelector(column), true);
- if (el) {
- Ext.fly(el).setWidth(column.width || (column.lastBox ? column.lastBox.width : 100));
- }
- }
- }
- }
- },
- });
|