123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100 |
- export default class RowSelector {
- constructor(options) {
- let _this = this;
- _this.options = $.extend({
- // checkbox css选择器
- checkboxSelector: '',
- // 全选checkbox css选择器
- selectAllSelector: '',
- // 选中效果颜色
- background: 'rgba(255, 255,213,0.4)',
- // 点击行事件
- clickRow: false,
- // 表格选择器
- container: 'table',
- }, options);
- _this.init()
- }
- init() {
- let options = this.options,
- checkboxSelector = options.checkboxSelector,
- $document = $(document),
- selectAll = options.selectAllSelector;
- $(selectAll).on('change', function() {
- $(this).parents(options.container).find(checkboxSelector).prop('checked', this.checked).trigger('change');
- });
- if (options.clickRow) {
- $document.off('click', checkboxSelector).on('click', checkboxSelector, function (e) {
- if (typeof e.cancelBubble != "undefined") {
- e.cancelBubble = true;
- }
- if (typeof e.stopPropagation != "undefined") {
- e.stopPropagation();
- }
- });
- $document.off('click', options.container+' tr').on('click', options.container+' tr', function () {
- $(this).find(checkboxSelector).click();
- });
- }
- $document.off('change', checkboxSelector).on('change', checkboxSelector, function () {
- var tr = $(this).closest('tr');
- if (this.checked) {
- tr.css('background-color', options.background);
- if ($(checkboxSelector + ':checked').length === $(checkboxSelector).length) {
- $(selectAll).prop('checked', true)
- }
- } else {
- tr.css('background-color', '');
- }
- });
- }
- /**
- * 获取选中的主键数组
- *
- * @returns {Array}
- */
- getSelectedKeys() {
- let selected = [];
- $(this.options.checkboxSelector+':checked').each(function() {
- var id = $(this).data('id');
- if (selected.indexOf(id) === -1) {
- selected.push(id);
- }
- });
- return selected;
- }
- /**
- * 获取选中的行数组
- *
- * @returns {Array}
- */
- getSelectedRows() {
- let selected = [];
- $(this.options.checkboxSelector+':checked').each(function() {
- var id = $(this).data('id'), i, exist;
- for (i in selected) {
- if (selected[i].id === id) {
- exist = true
- }
- }
- exist || selected.push({'id': id, 'label': $(this).data('label')})
- });
- return selected;
- }
- }
|