UNPKG

buefy

Version:

Lightweight UI components for Vue.js based on Bulma

878 lines (782 loc) 32.7 kB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var __chunk_1 = require('./chunk-9f6a8079.js'); var __chunk_2 = require('./chunk-59b91990.js'); require('./chunk-545f01b1.js'); require('./chunk-c146745e.js'); var __chunk_5 = require('./chunk-60061aa8.js'); var __chunk_6 = require('./chunk-13e039f5.js'); var __chunk_9 = require('./chunk-96ce35a2.js'); var __chunk_13 = require('./chunk-1b1231ce.js'); var __chunk_18 = require('./chunk-876befa8.js'); var __chunk_20 = require('./chunk-3dffe6e7.js'); var _components; var script = { name: 'BTableMobileSort', components: (_components = {}, __chunk_1._defineProperty(_components, __chunk_13.Select.name, __chunk_13.Select), __chunk_1._defineProperty(_components, __chunk_5.Icon.name, __chunk_5.Icon), _components), props: { currentSortColumn: Object, isAsc: Boolean, columns: Array, placeholder: String }, data: function data() { return { mobileSort: this.currentSortColumn }; }, computed: { showPlaceholder: function showPlaceholder() { var _this = this; return !this.columns || !this.columns.some(function (column) { return column === _this.mobileSort; }); } }, watch: { mobileSort: function mobileSort(column) { if (this.currentSortColumn === column) return; this.$emit('sort', column); }, currentSortColumn: function currentSortColumn(column) { this.mobileSort = column; } }, methods: { sort: function sort() { this.$emit('sort', this.mobileSort); } } }; /* script */ const __vue_script__ = script; /* template */ var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"field table-mobile-sort"},[_c('div',{staticClass:"field has-addons"},[_c('b-select',{attrs:{"expanded":""},model:{value:(_vm.mobileSort),callback:function ($$v) {_vm.mobileSort=$$v;},expression:"mobileSort"}},[(_vm.placeholder)?[_c('option',{directives:[{name:"show",rawName:"v-show",value:(_vm.showPlaceholder),expression:"showPlaceholder"}],attrs:{"selected":"","disabled":"","hidden":""},domProps:{"value":{}}},[_vm._v("\n "+_vm._s(_vm.placeholder)+"\n ")])]:_vm._e(),_vm._v(" "),_vm._l((_vm.columns),function(column,index){return (column.sortable)?_c('option',{key:index,domProps:{"value":column}},[_vm._v("\n "+_vm._s(column.label)+"\n ")]):_vm._e()})],2),_vm._v(" "),_c('div',{staticClass:"control"},[_c('button',{staticClass:"button is-primary",on:{"click":_vm.sort}},[_c('b-icon',{directives:[{name:"show",rawName:"v-show",value:(_vm.currentSortColumn === _vm.mobileSort),expression:"currentSortColumn === mobileSort"}],class:{ 'is-desc': !_vm.isAsc },attrs:{"icon":"arrow-up","size":"is-small","both":""}})],1)])],1)])}; var __vue_staticRenderFns__ = []; /* style */ const __vue_inject_styles__ = undefined; /* scoped */ const __vue_scope_id__ = undefined; /* module identifier */ const __vue_module_identifier__ = undefined; /* functional template */ const __vue_is_functional_template__ = false; /* style inject */ /* style inject SSR */ var TableMobileSort = __chunk_6.__vue_normalize__( { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ }, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, undefined, undefined ); // // // // // // // // // var script$1 = { name: 'BTableColumn', props: { label: String, customKey: [String, Number], field: String, meta: [String, Number, Boolean, Function, Object, Array], width: [Number, String], numeric: Boolean, centered: Boolean, sortable: Boolean, visible: { type: Boolean, default: true }, customSort: Function, internal: Boolean // Used internally by Table }, data: function data() { return { newKey: this.customKey || this.label }; }, computed: { rootClasses: function rootClasses() { return { 'has-text-right': this.numeric && !this.centered, 'has-text-centered': this.centered }; } }, methods: { addRefToTable: function addRefToTable() { var _this = this; if (!this.$parent.$data._isTable) { this.$destroy(); throw new Error('You should wrap bTableColumn on a bTable'); } if (this.internal) return; // Since we're using scoped prop the columns gonna be multiplied, // this finds when to stop based on the newKey property. var repeated = this.$parent.newColumns.some(function (column) { return column.newKey === _this.newKey; }); !repeated && this.$parent.newColumns.push(this); } }, beforeMount: function beforeMount() { this.addRefToTable(); }, beforeUpdate: function beforeUpdate() { this.addRefToTable(); }, beforeDestroy: function beforeDestroy() { var index = this.$parent.newColumns.map(function (column) { return column.newKey; }).indexOf(this.newKey); if (index >= 0) { this.$parent.newColumns.splice(index, 1); } } }; /* script */ const __vue_script__$1 = script$1; /* template */ var __vue_render__$1 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.visible)?_c('td',{class:_vm.rootClasses,attrs:{"data-label":_vm.label}},[_vm._t("default")],2):_vm._e()}; var __vue_staticRenderFns__$1 = []; /* style */ const __vue_inject_styles__$1 = undefined; /* scoped */ const __vue_scope_id__$1 = undefined; /* module identifier */ const __vue_module_identifier__$1 = undefined; /* functional template */ const __vue_is_functional_template__$1 = false; /* style inject */ /* style inject SSR */ var TableColumn = __chunk_6.__vue_normalize__( { render: __vue_render__$1, staticRenderFns: __vue_staticRenderFns__$1 }, __vue_inject_styles__$1, __vue_script__$1, __vue_scope_id__$1, __vue_is_functional_template__$1, __vue_module_identifier__$1, undefined, undefined ); var _components$1; var script$2 = { name: 'BTable', components: (_components$1 = {}, __chunk_1._defineProperty(_components$1, __chunk_9.Checkbox.name, __chunk_9.Checkbox), __chunk_1._defineProperty(_components$1, __chunk_5.Icon.name, __chunk_5.Icon), __chunk_1._defineProperty(_components$1, __chunk_18.Pagination.name, __chunk_18.Pagination), __chunk_1._defineProperty(_components$1, __chunk_20.SlotComponent.name, __chunk_20.SlotComponent), __chunk_1._defineProperty(_components$1, TableMobileSort.name, TableMobileSort), __chunk_1._defineProperty(_components$1, TableColumn.name, TableColumn), _components$1), props: { data: { type: Array, default: function _default() { return []; } }, columns: { type: Array, default: function _default() { return []; } }, bordered: Boolean, striped: Boolean, narrowed: Boolean, hoverable: Boolean, loading: Boolean, detailed: Boolean, checkable: Boolean, headerCheckable: { type: Boolean, default: true }, checkboxPosition: { type: String, default: 'left', validator: function validator(value) { return ['left', 'right'].indexOf(value) >= 0; } }, selected: Object, focusable: Boolean, customIsChecked: Function, isRowCheckable: { type: Function, default: function _default() { return true; } }, checkedRows: { type: Array, default: function _default() { return []; } }, mobileCards: { type: Boolean, default: true }, defaultSort: [String, Array], defaultSortDirection: { type: String, default: 'asc' }, sortIcon: { type: String, default: 'arrow-up' }, sortIconSize: { type: String, default: 'is-small' }, paginated: Boolean, currentPage: { type: Number, default: 1 }, perPage: { type: [Number, String], default: 20 }, showDetailIcon: { type: Boolean, default: true }, paginationSimple: Boolean, paginationSize: String, paginationPosition: { type: String, default: 'bottom', validator: function validator(value) { return ['bottom', 'top', 'both'].indexOf(value) >= 0; } }, backendSorting: Boolean, rowClass: { type: Function, default: function _default() { return ''; } }, openedDetailed: { type: Array, default: function _default() { return []; } }, hasDetailedVisible: { type: Function, default: function _default() { return true; } }, detailKey: { type: String, default: '' }, customDetailRow: { type: Boolean, default: false }, backendPagination: Boolean, total: { type: [Number, String], default: 0 }, iconPack: String, mobileSortPlaceholder: String, customRowKey: String, draggable: { type: Boolean, defualt: false }, ariaNextLabel: String, ariaPreviousLabel: String, ariaPageLabel: String, ariaCurrentLabel: String }, data: function data() { return { getValueByPath: __chunk_2.getValueByPath, newColumns: __chunk_1._toConsumableArray(this.columns), visibleDetailRows: this.openedDetailed, newData: this.data, newDataTotal: this.backendPagination ? this.total : this.data.length, newCheckedRows: __chunk_1._toConsumableArray(this.checkedRows), newCurrentPage: this.currentPage, currentSortColumn: {}, isAsc: true, firstTimeSort: true, // Used by first time initSort _isTable: true // Used by TableColumn }; }, computed: { /** * return if detailed row tabled * will be with chevron column & icon or not */ showDetailRowIcon: function showDetailRowIcon() { return this.detailed && this.showDetailIcon; }, tableClasses: function tableClasses() { return { 'is-bordered': this.bordered, 'is-striped': this.striped, 'is-narrow': this.narrowed, 'has-mobile-cards': this.mobileCards, 'is-hoverable': (this.hoverable || this.focusable) && this.visibleData.length }; }, /** * Splitted data based on the pagination. */ visibleData: function visibleData() { if (!this.paginated) return this.newData; var currentPage = this.newCurrentPage; var perPage = this.perPage; if (this.newData.length <= perPage) { return this.newData; } else { var start = (currentPage - 1) * perPage; var end = parseInt(start, 10) + parseInt(perPage, 10); return this.newData.slice(start, end); } }, visibleColumns: function visibleColumns() { if (!this.newColumns) return this.newColumns; return this.newColumns.filter(function (column) { return column.visible || column.visible === undefined; }); }, /** * Check if all rows in the page are checked. */ isAllChecked: function isAllChecked() { var _this = this; var validVisibleData = this.visibleData.filter(function (row) { return _this.isRowCheckable(row); }); if (validVisibleData.length === 0) return false; var isAllChecked = validVisibleData.some(function (currentVisibleRow) { return __chunk_2.indexOf(_this.newCheckedRows, currentVisibleRow, _this.customIsChecked) < 0; }); return !isAllChecked; }, /** * Check if all rows in the page are checkable. */ isAllUncheckable: function isAllUncheckable() { var _this2 = this; var validVisibleData = this.visibleData.filter(function (row) { return _this2.isRowCheckable(row); }); return validVisibleData.length === 0; }, /** * Check if has any sortable column. */ hasSortablenewColumns: function hasSortablenewColumns() { return this.newColumns.some(function (column) { return column.sortable; }); }, /** * Return total column count based if it's checkable or expanded */ columnCount: function columnCount() { var count = this.newColumns.length; count += this.checkable ? 1 : 0; count += this.detailed ? 1 : 0; return count; } }, watch: { /** * When data prop change: * 1. Update internal value. * 2. Reset newColumns (thead), in case it's on a v-for loop. * 3. Sort again if it's not backend-sort. * 4. Set new total if it's not backend-paginated. */ data: function data(value) { var _this3 = this; // Save newColumns before resetting var newColumns = this.newColumns; this.newColumns = []; this.newData = value; // Prevent table from being headless, data could change and created hook // on column might not trigger this.$nextTick(function () { if (!_this3.newColumns.length) _this3.newColumns = newColumns; }); if (!this.backendSorting) { this.sort(this.currentSortColumn, true); } if (!this.backendPagination) { this.newDataTotal = value.length; } }, /** * When Pagination total change, update internal total * only if it's backend-paginated. */ total: function total(newTotal) { if (!this.backendPagination) return; this.newDataTotal = newTotal; }, /** * When checkedRows prop change, update internal value without * mutating original data. */ checkedRows: function checkedRows(rows) { this.newCheckedRows = __chunk_1._toConsumableArray(rows); }, columns: function columns(value) { this.newColumns = __chunk_1._toConsumableArray(value); }, newColumns: function newColumns(value) { this.checkSort(); }, /** * When the user wants to control the detailed rows via props. * Or wants to open the details of certain row with the router for example. */ openedDetailed: function openedDetailed(expandedRows) { this.visibleDetailRows = expandedRows; }, currentPage: function currentPage(newVal) { this.newCurrentPage = newVal; } }, methods: { /** * Sort an array by key without mutating original data. * Call the user sort function if it was passed. */ sortBy: function sortBy(array, key, fn, isAsc) { var sorted = []; // Sorting without mutating original data if (fn && typeof fn === 'function') { sorted = __chunk_1._toConsumableArray(array).sort(function (a, b) { return fn(a, b, isAsc); }); } else { sorted = __chunk_1._toConsumableArray(array).sort(function (a, b) { // Get nested values from objects var newA = __chunk_2.getValueByPath(a, key); var newB = __chunk_2.getValueByPath(b, key); // sort boolean type if (typeof newA === 'boolean' && typeof newB === 'boolean') { return isAsc ? newA - newB : newB - newA; } if (!newA && newA !== 0) return 1; if (!newB && newB !== 0) return -1; if (newA === newB) return 0; newA = typeof newA === 'string' ? newA.toUpperCase() : newA; newB = typeof newB === 'string' ? newB.toUpperCase() : newB; return isAsc ? newA > newB ? 1 : -1 : newA > newB ? -1 : 1; }); } return sorted; }, /** * Sort the column. * Toggle current direction on column if it's sortable * and not just updating the prop. */ sort: function sort(column) { var updatingData = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; if (!column || !column.sortable) return; if (!updatingData) { this.isAsc = column === this.currentSortColumn ? !this.isAsc : this.defaultSortDirection.toLowerCase() !== 'desc'; } if (!this.firstTimeSort) { this.$emit('sort', column.field, this.isAsc ? 'asc' : 'desc'); } if (!this.backendSorting) { this.newData = this.sortBy(this.newData, column.field, column.customSort, this.isAsc); } this.currentSortColumn = column; }, /** * Check if the row is checked (is added to the array). */ isRowChecked: function isRowChecked(row) { return __chunk_2.indexOf(this.newCheckedRows, row, this.customIsChecked) >= 0; }, /** * Remove a checked row from the array. */ removeCheckedRow: function removeCheckedRow(row) { var index = __chunk_2.indexOf(this.newCheckedRows, row, this.customIsChecked); if (index >= 0) { this.newCheckedRows.splice(index, 1); } }, /** * Header checkbox click listener. * Add or remove all rows in current page. */ checkAll: function checkAll() { var _this4 = this; var isAllChecked = this.isAllChecked; this.visibleData.forEach(function (currentRow) { _this4.removeCheckedRow(currentRow); if (!isAllChecked) { if (_this4.isRowCheckable(currentRow)) { _this4.newCheckedRows.push(currentRow); } } }); this.$emit('check', this.newCheckedRows); this.$emit('check-all', this.newCheckedRows); // Emit checked rows to update user variable this.$emit('update:checkedRows', this.newCheckedRows); }, /** * Row checkbox click listener. * Add or remove a single row. */ checkRow: function checkRow(row) { if (!this.isRowChecked(row)) { this.newCheckedRows.push(row); } else { this.removeCheckedRow(row); } this.$emit('check', this.newCheckedRows, row); // Emit checked rows to update user variable this.$emit('update:checkedRows', this.newCheckedRows); }, /** * Row click listener. * Emit all necessary events. */ selectRow: function selectRow(row, index) { this.$emit('click', row); if (this.selected === row) return; // Emit new and old row this.$emit('select', row, this.selected); // Emit new row to update user variable this.$emit('update:selected', row); }, /** * Paginator change listener. */ pageChanged: function pageChanged(page) { this.newCurrentPage = page > 0 ? page : 1; this.$emit('page-change', this.newCurrentPage); this.$emit('update:currentPage', this.newCurrentPage); }, /** * Toggle to show/hide details slot */ toggleDetails: function toggleDetails(obj) { var found = this.isVisibleDetailRow(obj); if (found) { this.closeDetailRow(obj); this.$emit('details-close', obj); } else { this.openDetailRow(obj); this.$emit('details-open', obj); } // Syncs the detailed rows with the parent component this.$emit('update:openedDetailed', this.visibleDetailRows); }, openDetailRow: function openDetailRow(obj) { var index = this.handleDetailKey(obj); this.visibleDetailRows.push(index); }, closeDetailRow: function closeDetailRow(obj) { var index = this.handleDetailKey(obj); var i = this.visibleDetailRows.indexOf(index); this.visibleDetailRows.splice(i, 1); }, isVisibleDetailRow: function isVisibleDetailRow(obj) { var index = this.handleDetailKey(obj); var result = this.visibleDetailRows.indexOf(index) >= 0; return result; }, isActiveDetailRow: function isActiveDetailRow(row) { return this.detailed && !this.customDetailRow && this.isVisibleDetailRow(row); }, isActiveCustomDetailRow: function isActiveCustomDetailRow(row) { return this.detailed && this.customDetailRow && this.isVisibleDetailRow(row); }, /** * When the detailKey is defined we use the object[detailKey] as index. * If not, use the object reference by default. */ handleDetailKey: function handleDetailKey(index) { var key = this.detailKey; return !key.length ? index : index[key]; }, checkPredefinedDetailedRows: function checkPredefinedDetailedRows() { var defaultExpandedRowsDefined = this.openedDetailed.length > 0; if (defaultExpandedRowsDefined && !this.detailKey.length) { throw new Error('If you set a predefined opened-detailed, you must provide a unique key using the prop "detail-key"'); } }, /** * Call initSort only first time (For example async data). */ checkSort: function checkSort() { if (this.newColumns.length && this.firstTimeSort) { this.initSort(); this.firstTimeSort = false; } else if (this.newColumns.length) { if (this.currentSortColumn.field) { for (var i = 0; i < this.newColumns.length; i++) { if (this.newColumns[i].field === this.currentSortColumn.field) { this.currentSortColumn = this.newColumns[i]; break; } } } } }, /** * Check if footer slot has custom content. */ hasCustomFooterSlot: function hasCustomFooterSlot() { if (this.$slots.footer.length > 1) return true; var tag = this.$slots.footer[0].tag; if (tag !== 'th' && tag !== 'td') return false; return true; }, /** * Check if bottom-left slot exists. */ hasBottomLeftSlot: function hasBottomLeftSlot() { return typeof this.$slots['bottom-left'] !== 'undefined'; }, /** * Table arrow keys listener, change selection. */ pressedArrow: function pressedArrow(pos) { if (!this.visibleData.length) return; var index = this.visibleData.indexOf(this.selected) + pos; // Prevent from going up from first and down from last index = index < 0 ? 0 : index > this.visibleData.length - 1 ? this.visibleData.length - 1 : index; this.selectRow(this.visibleData[index]); }, /** * Focus table element if has selected prop. */ focus: function focus() { if (!this.focusable) return; this.$el.querySelector('table').focus(); }, /** * Initial sorted column based on the default-sort prop. */ initSort: function initSort() { var _this5 = this; if (!this.defaultSort) return; var sortField = ''; var sortDirection = this.defaultSortDirection; if (Array.isArray(this.defaultSort)) { sortField = this.defaultSort[0]; if (this.defaultSort[1]) { sortDirection = this.defaultSort[1]; } } else { sortField = this.defaultSort; } this.newColumns.forEach(function (column) { if (column.field === sortField) { _this5.isAsc = sortDirection.toLowerCase() !== 'desc'; _this5.sort(column, true); } }); }, /** * Emits drag start event */ handleDragStart: function handleDragStart(event, row, index) { this.$emit('dragstart', { event: event, row: row, index: index }); }, /** * Emits drop event */ handleDrop: function handleDrop(event, row, index) { this.$emit('drop', { event: event, row: row, index: index }); }, /** * Emits drag over event */ handleDragOver: function handleDragOver(event, row, index) { this.$emit('dragover', { event: event, row: row, index: index }); }, /** * Emits drag leave event */ handleDragLeave: function handleDragLeave(event, row, index) { this.$emit('dragleave', { event: event, row: row, index: index }); } }, mounted: function mounted() { this.checkPredefinedDetailedRows(); this.checkSort(); } }; /* script */ const __vue_script__$2 = script$2; /* template */ var __vue_render__$2 = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"b-table",class:{ 'is-loading': _vm.loading }},[(_vm.mobileCards && _vm.hasSortablenewColumns)?_c('b-table-mobile-sort',{attrs:{"current-sort-column":_vm.currentSortColumn,"is-asc":_vm.isAsc,"columns":_vm.newColumns,"placeholder":_vm.mobileSortPlaceholder},on:{"sort":function (column) { return _vm.sort(column); }}}):_vm._e(),_vm._v(" "),(_vm.paginated && (_vm.paginationPosition === 'top' || _vm.paginationPosition === 'both'))?_c('div',{staticClass:"top level"},[_c('div',{staticClass:"level-left"},[_vm._t("top-left")],2),_vm._v(" "),_c('div',{staticClass:"level-right"},[(_vm.paginated)?_c('div',{staticClass:"level-item"},[_c('b-pagination',{attrs:{"icon-pack":_vm.iconPack,"total":_vm.newDataTotal,"per-page":_vm.perPage,"simple":_vm.paginationSimple,"size":_vm.paginationSize,"current":_vm.newCurrentPage,"aria-next-label":_vm.ariaNextLabel,"aria-previous-label":_vm.ariaPreviousLabel,"aria-page-label":_vm.ariaPageLabel,"aria-current-label":_vm.ariaCurrentLabel},on:{"change":_vm.pageChanged}})],1):_vm._e()])]):_vm._e(),_vm._v(" "),_c('div',{staticClass:"table-wrapper"},[_c('table',{staticClass:"table",class:_vm.tableClasses,attrs:{"tabindex":!_vm.focusable ? false : 0},on:{"keydown":[function($event){if(!('button' in $event)&&_vm._k($event.keyCode,"up",38,$event.key)){ return null; }if($event.target !== $event.currentTarget){ return null; }$event.preventDefault();_vm.pressedArrow(-1);},function($event){if(!('button' in $event)&&_vm._k($event.keyCode,"down",40,$event.key)){ return null; }if($event.target !== $event.currentTarget){ return null; }$event.preventDefault();_vm.pressedArrow(1);}]}},[(_vm.newColumns.length)?_c('thead',[_c('tr',[(_vm.showDetailRowIcon)?_c('th',{attrs:{"width":"40px"}}):_vm._e(),_vm._v(" "),(_vm.checkable && _vm.checkboxPosition === 'left')?_c('th',{staticClass:"checkbox-cell"},[(_vm.headerCheckable)?[_c('b-checkbox',{attrs:{"value":_vm.isAllChecked,"disabled":_vm.isAllUncheckable},nativeOn:{"change":function($event){_vm.checkAll($event);}}})]:_vm._e()],2):_vm._e(),_vm._v(" "),_vm._l((_vm.visibleColumns),function(column,index){return _c('th',{key:index,class:{ 'is-current-sort': _vm.currentSortColumn === column, 'is-sortable': column.sortable },style:({ width: column.width === undefined ? null : column.width + 'px' }),on:{"click":function($event){$event.stopPropagation();_vm.sort(column);}}},[_c('div',{staticClass:"th-wrap",class:{ 'is-numeric': column.numeric, 'is-centered': column.centered }},[(column.$scopedSlots && column.$scopedSlots.header)?[_c('b-slot-component',{attrs:{"component":column,"scoped":true,"name":"header","tag":"span","props":{ column: column, index: index }}})]:(_vm.$scopedSlots.header)?[_vm._t("header",null,{column:column,index:index})]:[_vm._v(_vm._s(column.label))],_vm._v(" "),_c('b-icon',{directives:[{name:"show",rawName:"v-show",value:(_vm.currentSortColumn === column),expression:"currentSortColumn === column"}],class:{ 'is-desc': !_vm.isAsc },attrs:{"icon":_vm.sortIcon,"pack":_vm.iconPack,"both":"","size":_vm.sortIconSize}})],2)])}),_vm._v(" "),(_vm.checkable && _vm.checkboxPosition === 'right')?_c('th',{staticClass:"checkbox-cell"},[(_vm.headerCheckable)?[_c('b-checkbox',{attrs:{"value":_vm.isAllChecked,"disabled":_vm.isAllUncheckable},nativeOn:{"change":function($event){_vm.checkAll($event);}}})]:_vm._e()],2):_vm._e()],2)]):_vm._e(),_vm._v(" "),(_vm.visibleData.length)?_c('tbody',[_vm._l((_vm.visibleData),function(row,index){return [_c('tr',{key:_vm.customRowKey ? row[_vm.customRowKey] : index,class:[_vm.rowClass(row, index), { 'is-selected': row === _vm.selected, 'is-checked': _vm.isRowChecked(row), }],attrs:{"draggable":_vm.draggable},on:{"click":function($event){_vm.selectRow(row);},"dblclick":function($event){_vm.$emit('dblclick', row);},"mouseenter":function($event){_vm.$emit('mouseenter', row);},"mouseleave":function($event){_vm.$emit('mouseleave', row);},"contextmenu":function($event){_vm.$emit('contextmenu', row, $event);},"dragstart":function($event){_vm.handleDragStart($event, row, index);},"drop":function($event){_vm.handleDrop($event, row, index);},"dragover":function($event){_vm.handleDragOver($event, row, index);},"dragleave":function($event){_vm.handleDragLeave($event, row, index);}}},[(_vm.showDetailRowIcon)?_c('td',{staticClass:"chevron-cell"},[(_vm.hasDetailedVisible(row))?_c('a',{attrs:{"role":"button"},on:{"click":function($event){$event.stopPropagation();_vm.toggleDetails(row);}}},[_c('b-icon',{class:{'is-expanded': _vm.isVisibleDetailRow(row)},attrs:{"icon":"chevron-right","pack":_vm.iconPack,"both":""}})],1):_vm._e()]):_vm._e(),_vm._v(" "),(_vm.checkable && _vm.checkboxPosition === 'left')?_c('td',{staticClass:"checkbox-cell"},[_c('b-checkbox',{attrs:{"disabled":!_vm.isRowCheckable(row),"value":_vm.isRowChecked(row)},nativeOn:{"change":function($event){_vm.checkRow(row);},"click":function($event){$event.stopPropagation();}}})],1):_vm._e(),_vm._v(" "),(_vm.$scopedSlots.default)?_vm._t("default",null,{row:row,index:index}):_vm._l((_vm.newColumns),function(column){return _c('BTableColumn',_vm._b({key:column.field,attrs:{"internal":""}},'BTableColumn',column,false),[(column.renderHtml)?_c('span',{domProps:{"innerHTML":_vm._s(_vm.getValueByPath(row, column.field))}}):[_vm._v("\n "+_vm._s(_vm.getValueByPath(row, column.field))+"\n ")]],2)}),_vm._v(" "),(_vm.checkable && _vm.checkboxPosition === 'right')?_c('td',{staticClass:"checkbox-cell"},[_c('b-checkbox',{attrs:{"disabled":!_vm.isRowCheckable(row),"value":_vm.isRowChecked(row)},nativeOn:{"change":function($event){_vm.checkRow(row);},"click":function($event){$event.stopPropagation();}}})],1):_vm._e()],2),_vm._v(" "),(_vm.isActiveDetailRow(row))?_c('tr',{staticClass:"detail"},[_c('td',{attrs:{"colspan":_vm.columnCount}},[_c('div',{staticClass:"detail-container"},[_vm._t("detail",null,{row:row,index:index})],2)])]):_vm._e(),_vm._v(" "),(_vm.isActiveCustomDetailRow(row))?_vm._t("detail",null,{row:row,index:index}):_vm._e()]})],2):_c('tbody',[_c('tr',{staticClass:"is-empty"},[_c('td',{attrs:{"colspan":_vm.columnCount}},[_vm._t("empty")],2)])]),_vm._v(" "),(_vm.$slots.footer !== undefined)?_c('tfoot',[_c('tr',{staticClass:"table-footer"},[(_vm.hasCustomFooterSlot())?_vm._t("footer"):_c('th',{attrs:{"colspan":_vm.columnCount}},[_vm._t("footer")],2)],2)]):_vm._e()])]),_vm._v(" "),((_vm.checkable && _vm.hasBottomLeftSlot()) || (_vm.paginated && (_vm.paginationPosition === 'bottom' || _vm.paginationPosition === 'both')))?_c('div',{staticClass:"level"},[_c('div',{staticClass:"level-left"},[_vm._t("bottom-left")],2),_vm._v(" "),_c('div',{staticClass:"level-right"},[(_vm.paginated)?_c('div',{staticClass:"level-item"},[_c('b-pagination',{attrs:{"icon-pack":_vm.iconPack,"total":_vm.newDataTotal,"per-page":_vm.perPage,"simple":_vm.paginationSimple,"size":_vm.paginationSize,"current":_vm.newCurrentPage,"aria-next-label":_vm.ariaNextLabel,"aria-previous-label":_vm.ariaPreviousLabel,"aria-page-label":_vm.ariaPageLabel,"aria-current-label":_vm.ariaCurrentLabel},on:{"change":_vm.pageChanged}})],1):_vm._e()])]):_vm._e()],1)}; var __vue_staticRenderFns__$2 = []; /* style */ const __vue_inject_styles__$2 = undefined; /* scoped */ const __vue_scope_id__$2 = undefined; /* module identifier */ const __vue_module_identifier__$2 = undefined; /* functional template */ const __vue_is_functional_template__$2 = false; /* style inject */ /* style inject SSR */ var Table = __chunk_6.__vue_normalize__( { render: __vue_render__$2, staticRenderFns: __vue_staticRenderFns__$2 }, __vue_inject_styles__$2, __vue_script__$2, __vue_scope_id__$2, __vue_is_functional_template__$2, __vue_module_identifier__$2, undefined, undefined ); var Plugin = { install: function install(Vue) { __chunk_6.registerComponent(Vue, Table); __chunk_6.registerComponent(Vue, TableColumn); } }; __chunk_6.use(Plugin); exports.Table = Table; exports.TableColumn = TableColumn; exports.default = Plugin;