Last active
June 2, 2020 19:26
-
-
Save phansch/9b4e170b60cddf7b50d5a7587cb63367 to your computer and use it in GitHub Desktop.
vue-tables-2 pagination on top and bottom
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {Event, ServerTable} from 'vue-tables-2'; | |
import Vue from 'vue/dist/vue.esm'; | |
var template = require('template.js')('server'); | |
Vue.use(ServerTable, options, false, template); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
module.exports = function (source) { | |
return function (h) { | |
var rows = require('vue-tables-2/compiled/template/rows')(h, this); | |
var normalFilter = require('vue-tables-2/compiled/template/normal-filter')(h, this); | |
var dropdownPagination = require('vue-tables-2/compiled/template/dropdown-pagination')(h, this); | |
var columnFilters = require('vue-tables-2/compiled/template/column-filters')(h, this); | |
var footerHeadings = require('vue-tables-2/compiled/template/footer-headings')(h, this); | |
var noResults = require('vue-tables-2/compiled/template/no-results')(h, this); | |
var pagination = require('vue-tables-2/compiled/template/pagination')(h, this); | |
var dropdownPaginationCount = require('vue-tables-2/compiled/template/dropdown-pagination-count')(h, this); | |
var headings = require('vue-tables-2/compiled/template/headings')(h, this); | |
var perPage = require('vue-tables-2/compiled/template/per-page')(h, this); | |
var columnsDropdown = require('vue-tables-2/compiled/template/columns-dropdown')(h, this); | |
var beforeFilters = this.$slots.beforeFilters ? this.$slots.beforeFilters : ''; | |
var afterFilters = this.$slots.afterFilters ? this.$slots.afterFilters : ''; | |
var beforeBody = this.$slots.beforeBody ? this.$slots.beforeBody : ''; | |
var prependBody = this.$slots.prependBody ? this.$slots.prependBody : ''; | |
var appendBody = this.$slots.appendBody ? this.$slots.appendBody : ''; | |
var afterBody = this.$slots.afterBody ? this.$slots.afterBody : ''; | |
var beforeTable = this.$slots.beforeTable ? this.$slots.beforeTable : ''; | |
var prependFilterContainer = this.$slots.prependFilterContainer ? this.$slots.prependFilterContainer : ''; | |
var appendFilterContainer = this.$slots.appendFilterContainer ? this.$slots.appendFilterContainer : ''; | |
var prependLimitContainer = this.$slots.prependLimitContainer ? this.$slots.prependLimitContainer : ''; | |
var appendLimitContainer = this.$slots.appendLimitContainer ? this.$slots.appendLimitContainer : ''; | |
return h( | |
'div', | |
{ 'class': "VueTables VueTables--" + this.source }, | |
// Pagination one | |
[pagination, beforeTable, h( | |
'div', | |
{ 'class': 'table-responsive' }, | |
[h( | |
'table', | |
{ 'class': 'VueTables__table table ' + this.opts.skin }, | |
[h( | |
'thead', | |
null, | |
[h( | |
'tr', | |
null, | |
[headings] | |
), beforeFilters, columnFilters, afterFilters] | |
), footerHeadings, beforeBody, h( | |
'tbody', | |
null, | |
[prependBody, noResults, rows, appendBody] | |
), afterBody] | |
), h( | |
'div', | |
{ 'class': 'table-footer' }, | |
// Pagination two | |
[pagination, prependLimitContainer, perPage, appendLimitContainer, pagination, columnsDropdown] | |
)] | |
)] | |
); | |
}; | |
}; |
did not work today as they change the code. I will try to make a working code
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
hi , you can to do that?