/**
* 表格checkbox行选择器
*
* @file 表格checkbox行选择器
* @author Brian Li(lbxxlht@163.com)
*
* 宿主fire的事件:
* select
*
* 暴露的API:
* .selectRow(rowIndex, isSelect)
* .getSelected()
*/
var define = typeof define === 'function' && define.amd ? define : function (factory) {
typeof module === 'object' ? (module.exports = factory(require)) : '';
};
define(function (require) {
var util = require('../core/util');
var Plugin = require('../core/plugin');
// public /////////////////////////////////////////////////////////////////
/**
* 构造函数
*
* @constructor
* @param {Object} param 初始化对象
* @param {boolean} param.changeSelectStyle 选中行后时候改变背景色
*/
function TableCheckboxSelector(param) {
if (!(this instanceof TableCheckboxSelector)) {
return new TableCheckboxSelector(param);
}
param = param || {};
this.changeSelectStyle = param.changeSelectStyle;
this.required = ['TableHeader'];
this.selected = [];
this.selectAll = false;
Plugin.call(this, param);
}
util.inherit(TableCheckboxSelector, Plugin);
/**
* @override
*
* @param {Object} param 宿主UI初始化时的参数引用,***操作请小心***
* @return {boolean} 是否初始化成功
*/
TableCheckboxSelector.prototype.load = function (param) {
param.pluginSkin = util.joinClassName(param.pluginSkin, 'table-checkbox-selector');
param.tpl = extendTPL(param.tpl);
util.appendHandler(param, 'click', mouseHandler);
extendAPI(this.host, this);
return true;
};
/**
* @override
*
* 宿主渲染完成后回调
*/
TableCheckboxSelector.prototype.hostRendered = function () {
this.selectAll = false;
this.selected = [];
};
/**
* 选择行
*
* @param {number} index 行索引,-1表示全选
*/
TableCheckboxSelector.prototype.select = function (index) {
var container = $(this.host.container);
var selectAllCheckbox = container.find('input[data-ui-select-index="-1"]')[0];
if (index === -1) {
var selectedAll = this.selectAll = !this.selectAll;
this.selected = [];
container.find('.selector input').each(function () {
this.checked = selectedAll ? 'checked' : false;
});
if (this.changeSelectStyle) {
container.find('.tr')[selectedAll ? 'addClass' : 'removeClass']('row-selected-background');
}
if (this.selectAll) {
selectAllCheckbox.indeterminate = false;
for (var i = 0; i < this.host.datasource.length; i++) {
this.selected.push(i);
}
}
}
else {
var checkbox = container.find('input[data-ui-select-index="' + index + '"]')[0];
checkbox.checked = this.selected.indexOf(index) < 0 ? 'checked' : false;
this.selected[this.selected.indexOf(index) < 0 ? 'push' : 'remove'](index);
if (this.changeSelectStyle) {
var action = checkbox.checked ? 'addClass' : 'removeClass';
container.find('[data-ui-row="' + index + '"].tr')[action]('row-selected-background');
}
}
if (this.selected.length < this.host.datasource.length) {
this.selectAll = false;
selectAllCheckbox.checked = false;
selectAllCheckbox.indeterminate = this.selected.length > 0;
}
this.host.fire('select', {row: this.selected});
};
// private /////////////////////////////////////////////////////////////////
/**
* 扩展宿主对象API
*
* @param {Table} table table实例
* @param {TableSorter} selector TableSelector实例
*/
function extendAPI(table, selector) {
table.selectRow = function (rowIndex, isSelected) {
var index = parseInt(rowIndex, 10);
if (
(isNaN(index) || index < -1 || index >= table.datasource.length)
|| (isSelected && selector.selected.indexOf(index) > -1)
|| (!isSelected && selector.selected.indexOf(index) < 0)
) {
return;
}
selector.select(index);
};
table.getSelected = function () {
if (selector.selectAll) {
return -1;
}
var result = [];
var datasource = table.datasource;
for (var i = 0; i < selector.selected.length; i++) {
result.push(datasource[selector.selected[i]]);
}
return result;
};
}
/**
* 对模版进行扩充
*
* @param {Array.<string>} tpl 原始模板
* @return {Array.<string>} 扩展后的模板
*/
function extendTPL(tpl, content, close) {
var picker = new util.Picker(tpl);
picker.find('.table-head').head([
'<td class="selector" data-ui-cmd="select" data-ui-select-index="-1">',
'<input type="checkbox" data-ui-cmd="select" data-ui-select-index="-1"/>',
'</td>'
]);
picker.find('.tr').head([
'<td class="selector" data-ui-cmd="select" data-ui-select-index="{{=n}}">',
'<input data-ui-cmd="select" data-ui-select-index="{{=n}}" type="checkbox"/>',
'</td>'
]);
return picker.export();
}
/**
* 处理一切鼠标事件
*
* @param {Event} evt 鼠标事件句柄
*/
function mouseHandler(evt) {
var dataset = util.getDataset(evt.target);
if (dataset.uiCmd !== 'select') {
return;
}
this.plugin.TableCheckboxSelector.select(parseInt(dataset.uiSelectIndex, 10));
}
return TableCheckboxSelector;
});
|