import Vue from 'vue/dist/vue.esm' import matestackEventHub from '../../event_hub' import queryParamsHelper from '../../helpers/query_params_helper' import componentMixin from '../mixin'
const componentDef = {
mixins: [componentMixin], data: function(){ return { currentLimit: null, currentOffset: null, currentFilteredCount: null, currentBaseCount: null } }, methods: { next: function(){ if (this.currentTo() < this.currentCount()){ this.currentOffset += this.currentLimit var url = queryParamsHelper.updateQueryParams(this.props["id"] + "-offset", this.currentOffset) window.history.pushState({matestackApp: true, url: url}, null, url); matestackEventHub.$emit(this.props["id"] + "-update") } }, previous: function(){ if ((this.currentOffset - this.currentLimit)*-1 != this.currentLimit){ if((this.currentOffset - this.currentLimit) < 0){ this.currentOffset = 0 } else { this.currentOffset -= this.currentLimit } var url = queryParamsHelper.updateQueryParams(this.props["id"] + "-offset", this.currentOffset) window.history.pushState({matestackApp: true, url: url}, null, url); matestackEventHub.$emit(this.props["id"] + "-update") } }, currentTo: function(){ var to = parseInt(this.currentOffset) + parseInt(this.currentLimit) if (to > parseInt(this.currentCount())){ return this.currentCount(); } else { return to; } }, currentCount: function(){ if (this.currentFilteredCount != null || this.currentFilteredCount != undefined){ return this.currentFilteredCount; } else { return this.currentBaseCount; } }, goToPage: function(page){ this.currentOffset = parseInt(this.currentLimit) * (parseInt(page)-1) var url = queryParamsHelper.updateQueryParams(this.props["id"] + "-offset", this.currentOffset) window.history.pushState({matestackApp: true, url: url}, null, url); matestackEventHub.$emit(this.props["id"] + "-update") } }, mounted: function(){ if(queryParamsHelper.getQueryParam(this.props["id"] + "-offset") != null){ this.currentOffset = parseInt(queryParamsHelper.getQueryParam(this.props["id"] + "-offset")) } else { if(this.props["init_offset"] != undefined){ this.currentOffset = this.props["init_offset"] } else { this.currentOffset = 0 } } if(queryParamsHelper.getQueryParam(this.props["id"] + "-limit") != null){ this.currentOffset = parseInt(queryParamsHelper.getQueryParam(this.props["id"] + "-limit")) } else { if(this.props["init_limit"] != undefined){ this.currentLimit = this.props["init_limit"] } else { this.currentLimit = 10 } } if(this.props["filtered_count"] != undefined){ this.currentFilteredCount = this.props["filtered_count"] if(this.currentOffset >= this.currentFilteredCount){ this.previous() } } if(this.props["base_count"] != undefined){ this.currentBaseCount = this.props["base_count"] if(this.currentOffset >= this.currentBaseCount){ this.previous() } } }
}
let component = Vue.component('matestack-ui-core-collection-content', componentDef)
export default componentDef