import { warn } from '../util/debug'

export default {
  name: 'paginate',
  props: {
    name: {
      type: String,
      required: true
    },
    list: {
      type: Array,
      required: true
    },
    per: {
      type: Number,
      default: 3,
      validator (value) {
        return value > 0
      }
    },
    tag: {
      type: String,
      default: 'ul'
    },
    class: {
      type: String
    }
  },
  data () {
    return {}
  },
  computed: {
    currentPage: {
      get () {
        if (this.$parent.paginate[this.name]) {
          return this.$parent.paginate[this.name].page
        }
      },
      set (page) {
        this.$parent.paginate[this.name].page = page
      }
    }
  },
  mounted () {
    if (this.per <= 0) {
      warn(`<paginate name="${this.name}"> 'per' prop can't be 0 or less.`, this.$parent)
    }
    if (!this.$parent.paginate[this.name]) {
      warn(`'${this.name}' is not registered in 'paginate' array.`, this.$parent)
      return
    }
    this.paginateList()
  },
  watch: {
    currentPage () {
      this.paginateList()
    },
    list () {
      // On list change, refresh the paginated list
      this.currentPage = 0
      this.paginateList()
    },
    per () {
      this.currentPage = 0
      this.paginateList()
    }
  },
  methods: {
    paginateList () {
      const index = this.currentPage * this.per
      const paginatedList = this.list.slice(index, index + this.per)
      this.$parent.paginate[this.name].list = paginatedList
    },
    goToPage (page) {
      const maxPage = Math.ceil(this.list.length / this.per)
      if (page > maxPage) {
        warn(`You cannot go to page ${page}. The last page is ${maxPage}.`, this.$parent)
        return
      }
      this.currentPage = page - 1
    }
  },
  render (h) {
    const className = this.class ? this.class : ''
    return h(this.tag, { class: className }, this.$slots.default)
  }
}
@@ -368,47 +368,8 @@
 ul'%0A
-    %7D,%0A    class: %7B%0A      type: String%0A
     
@@ -1753,59 +1753,8 @@
 ) %7B%0A
-    const className = this.class ? this.class : ''%0A
     
@@ -1777,26 +1777,8 @@
 g, %7B
- class: className 
 %7D, t
@@ -1802,8 +1802,9 @@
 t)%0A  %7D%0A%7D
+%0A

remove custom class prop from Paginate (fix #51)