UNPKG

ant-design-vue

Version:

An enterprise-class UI design language and Vue-based implementation

164 lines (145 loc) 5.09 kB
'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _babelHelperVueJsxMergeProps = require('babel-helper-vue-jsx-merge-props'); var _babelHelperVueJsxMergeProps2 = _interopRequireDefault(_babelHelperVueJsxMergeProps); var _extends2 = require('babel-runtime/helpers/extends'); var _extends3 = _interopRequireDefault(_extends2); var _vueTypes = require('../../_util/vue-types'); var _vueTypes2 = _interopRequireDefault(_vueTypes); var _utils = require('./utils'); var _BaseTable = require('./BaseTable'); var _BaseTable2 = _interopRequireDefault(_BaseTable); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; } exports['default'] = { name: 'BodyTable', props: { fixed: _vueTypes2['default'].oneOfType([_vueTypes2['default'].string, _vueTypes2['default'].bool]), columns: _vueTypes2['default'].array.isRequired, tableClassName: _vueTypes2['default'].string.isRequired, handleBodyScroll: _vueTypes2['default'].func.isRequired, handleWheel: _vueTypes2['default'].func.isRequired, getRowKey: _vueTypes2['default'].func.isRequired, expander: _vueTypes2['default'].object.isRequired, isAnyColumnsFixed: _vueTypes2['default'].bool }, inject: { table: { 'default': function _default() { return {}; } } }, render: function render() { var h = arguments[0]; var _table = this.table, prefixCls = _table.prefixCls, scroll = _table.scroll; var columns = this.columns, fixed = this.fixed, tableClassName = this.tableClassName, getRowKey = this.getRowKey, handleBodyScroll = this.handleBodyScroll, handleWheel = this.handleWheel, expander = this.expander, isAnyColumnsFixed = this.isAnyColumnsFixed; var _table2 = this.table, useFixedHeader = _table2.useFixedHeader, saveRef = _table2.saveRef; var bodyStyle = (0, _extends3['default'])({}, this.table.bodyStyle); var innerBodyStyle = {}; if (scroll.x || fixed) { bodyStyle.overflowX = bodyStyle.overflowX || 'scroll'; // Fix weired webkit render bug // https://github.com/ant-design/ant-design/issues/7783 bodyStyle.WebkitTransform = 'translate3d (0, 0, 0)'; } if (scroll.y) { // maxHeight will make fixed-Table scrolling not working // so we only set maxHeight to body-Table here var maxHeight = bodyStyle.maxHeight || scroll.y; maxHeight = typeof maxHeight === 'number' ? maxHeight + 'px' : maxHeight; if (fixed) { innerBodyStyle.maxHeight = maxHeight; innerBodyStyle.overflowY = bodyStyle.overflowY || 'scroll'; } else { bodyStyle.maxHeight = maxHeight; } bodyStyle.overflowY = bodyStyle.overflowY || 'scroll'; useFixedHeader = true; // Add negative margin bottom for scroll bar overflow bug var scrollbarWidth = (0, _utils.measureScrollbar)({ direction: 'vertical' }); if (scrollbarWidth > 0 && fixed) { bodyStyle.marginBottom = '-' + scrollbarWidth + 'px'; bodyStyle.paddingBottom = '0px'; } } var baseTable = h(_BaseTable2['default'], { attrs: { tableClassName: tableClassName, hasHead: !useFixedHeader, hasBody: true, fixed: fixed, columns: columns, expander: expander, getRowKey: getRowKey, isAnyColumnsFixed: isAnyColumnsFixed } }); if (fixed && columns.length) { var refName = void 0; if (columns[0].fixed === 'left' || columns[0].fixed === true) { refName = 'fixedColumnsBodyLeft'; } else if (columns[0].fixed === 'right') { refName = 'fixedColumnsBodyRight'; } delete bodyStyle.overflowX; delete bodyStyle.overflowY; return h( 'div', { key: 'bodyTable', 'class': prefixCls + '-body-outer', style: (0, _extends3['default'])({}, bodyStyle) }, [h( 'div', (0, _babelHelperVueJsxMergeProps2['default'])([{ 'class': prefixCls + '-body-inner', style: innerBodyStyle }, { directives: [{ name: 'ant-ref', value: saveRef(refName) }] }, { on: { 'wheel': handleWheel, 'scroll': handleBodyScroll } }]), [baseTable] )] ); } // Should provides `tabIndex` if use scroll to enable keyboard scroll var useTabIndex = scroll && (scroll.x || scroll.y); return h( 'div', (0, _babelHelperVueJsxMergeProps2['default'])([{ attrs: { tabIndex: useTabIndex ? -1 : undefined }, key: 'bodyTable', 'class': prefixCls + '-body', style: bodyStyle }, { directives: [{ name: 'ant-ref', value: saveRef('bodyTable') }] }, { on: { 'wheel': handleWheel, 'scroll': handleBodyScroll } }]), [baseTable] ); } };