/** * 自适应宽度的表格 * * Created by GUY on 2016/2/3. * @class BI.AdaptiveTable * @extends BI.Widget */ BI.AdaptiveTable = BI.inherit(BI.Widget, { _const: { perColumnSize: 100 }, _defaultConfig: function () { return BI.extend(BI.AdaptiveTable.superclass._defaultConfig.apply(this, arguments), { baseCls: "bi-adaptive-table", el: { type: "bi.resizable_table" }, isNeedResize: true, isNeedFreeze: false, // 是否需要冻结单元格 freezeCols: [], // 冻结的列号,从0开始,isNeedFreeze为true时生效 isNeedMerge: false, // 是否需要合并单元格 mergeCols: [], // 合并的单元格列号 mergeRule: BI.emptyFn, columnSize: [], minColumnSize: [], maxColumnSize: [], headerRowSize: 25, rowSize: 25, regionColumnSize: [], header: [], items: [], // 二维数组 // 交叉表头 crossHeader: [], crossItems: [] }); }, _init: function () { BI.AdaptiveTable.superclass._init.apply(this, arguments); var self = this, o = this.options; var data = this._digest(); this.table = BI.createWidget(o.el, { type: "bi.resizable_table", element: this, width: o.width, height: o.height, isNeedResize: o.isNeedResize, isResizeAdapt: false, isNeedFreeze: o.isNeedFreeze, freezeCols: data.freezeCols, isNeedMerge: o.isNeedMerge, mergeCols: o.mergeCols, mergeRule: o.mergeRule, columnSize: data.columnSize, headerRowSize: o.headerRowSize, rowSize: o.rowSize, regionColumnSize: data.regionColumnSize, header: o.header, items: o.items, // 交叉表头 crossHeader: o.crossHeader, crossItems: o.crossItems }); this.table.on(BI.Table.EVENT_TABLE_SCROLL, function () { self.fireEvent(BI.Table.EVENT_TABLE_SCROLL, arguments); }); this.table.on(BI.Table.EVENT_TABLE_AFTER_REGION_RESIZE, function () { o.regionColumnSize = this.getRegionColumnSize(); self._populate(); self.table.populate(); self.fireEvent(BI.Table.EVENT_TABLE_AFTER_REGION_RESIZE, arguments); }); this.table.on(BI.Table.EVENT_TABLE_AFTER_COLUMN_RESIZE, function () { o.columnSize = this.getColumnSize(); self._populate(); self.table.populate(); self.fireEvent(BI.Table.EVENT_TABLE_AFTER_COLUMN_RESIZE, arguments); }); }, _getFreezeColLength: function () { var o = this.options; return o.isNeedFreeze === true ? BI.clamp(o.freezeCols.length, 0, o.columnSize.length) : 0; }, _digest: function () { var o = this.options; var columnSize = o.columnSize.slice(); var regionColumnSize = o.regionColumnSize.slice(); var freezeCols = o.freezeCols.slice(); var regionSize = o.regionColumnSize[0]; var freezeColLength = this._getFreezeColLength(); if (!regionSize || regionSize > o.width - 10 || regionSize < 10) { var rs = BI.sum(columnSize, function (i, size) { if (i < freezeColLength) { return size; } return 0; }); regionSize = BI.clamp(rs, 1 / 5 * o.width, 4 / 5 * o.width); } if (freezeColLength === 0) { regionSize = 0; } if (freezeCols.length >= columnSize.length) { freezeCols = []; } if (!BI.isNumber(columnSize[0])) { columnSize = o.minColumnSize.slice(); } var summaryFreezeColumnSize = 0, summaryColumnSize = 0; BI.each(columnSize, function (i, size) { if (i < freezeColLength) { summaryFreezeColumnSize += size; } summaryColumnSize += size; }); if (freezeColLength > 0) { columnSize[freezeColLength - 1] = BI.clamp(regionSize - (summaryFreezeColumnSize - columnSize[freezeColLength - 1]), o.minColumnSize[freezeColLength - 1] || 10, o.maxColumnSize[freezeColLength - 1] || Number.MAX_VALUE); } if (columnSize.length > 0) { columnSize[columnSize.length - 1] = BI.clamp(o.width - BI.GridTableScrollbar.SIZE - regionSize - (summaryColumnSize - summaryFreezeColumnSize - columnSize[columnSize.length - 1]), o.minColumnSize[columnSize.length - 1] || 10, o.maxColumnSize[columnSize.length - 1] || Number.MAX_VALUE); } regionColumnSize[0] = regionSize; return { freezeCols: freezeCols, columnSize: columnSize, regionColumnSize: regionColumnSize }; }, _populate: function () { var o = this.options; var data = this._digest(); o.regionColumnSize = data.regionColumnSize; o.columnSize = data.columnSize; this.table.setColumnSize(data.columnSize); this.table.setRegionColumnSize(data.regionColumnSize); this.table.attr("freezeCols", data.freezeCols); }, setWidth: function (width) { BI.AdaptiveTable.superclass.setWidth.apply(this, arguments); this.table.setWidth(width); }, setHeight: function (height) { BI.AdaptiveTable.superclass.setHeight.apply(this, arguments); this.table.setHeight(height); }, setColumnSize: function (columnSize) { this.options.columnSize = columnSize; }, getColumnSize: function () { return this.table.getColumnSize(); }, setRegionColumnSize: function (regionColumnSize) { this.options.regionColumnSize = regionColumnSize; }, getRegionColumnSize: function () { return this.table.getRegionColumnSize(); }, setVerticalScroll: function (scrollTop) { this.table.setVerticalScroll(scrollTop); }, setLeftHorizontalScroll: function (scrollLeft) { this.table.setLeftHorizontalScroll(scrollLeft); }, setRightHorizontalScroll: function (scrollLeft) { this.table.setRightHorizontalScroll(scrollLeft); }, getVerticalScroll: function () { return this.table.getVerticalScroll(); }, getLeftHorizontalScroll: function () { return this.table.getLeftHorizontalScroll(); }, getRightHorizontalScroll: function () { return this.table.getRightHorizontalScroll(); }, attr: function (key, value) { var v = BI.AdaptiveTable.superclass.attr.apply(this, arguments); if (key === "freezeCols") { return v; } return this.table.attr.apply(this.table, arguments); }, restore: function () { this.table.restore(); }, populate: function (items) { var self = this, o = this.options; this._populate(); this.table.populate.apply(this.table, arguments); }, destroy: function () { this.table.destroy(); BI.AdaptiveTable.superclass.destroy.apply(this, arguments); } }); BI.shortcut("bi.adaptive_table", BI.AdaptiveTable);