/* Be aware that component extension is not as classes inheritance.
In this case, Vue merges both the parent and child component options creating a new mixed object.
For the case of the mounted and destroyed hook, both the parent’s and children’s are kept and they
will be called in inheritance order, from parent to children.

 https://vueschool.io/articles/vuejs-tutorials/reusing-logic-in-vue-components/
 */

/*  hooks order 
 1) extension
 2) mixins
 3) component
 */


export default {
    data() {
        return {
            sorting: {
                sortby: "created",
                sortorder: undefined, //  asc || none
            },
            pagination: {
                pages: 0,
                total: 0,
                page: 1,
                offset: 0, // page * per_page
                limit: 10, //per_page
            },

        }
    },
    methods: {
        resetPagination() {
            this.pagination = {
                pages: 0,
                total: 0,
                page: 1,
                offset: 0,
                limit: 10,
            };
        },
        pageChanged(paging) {
            let page = paging.pageNumber;
            page -= 1;
            this.pagination.offset = page * paging.limit;
            this.pagination.limit = paging.limit;
            this.pagination.page = paging.pageNumber;

        },
        pageLimitChanged(paging) {
            this.resetPagination();
            this.pagination.limit = paging.limit;

        },
        sortChanged(sorting) {
                // keep limit status.
            // reset page and offset values.
            this.pagination.page = this.pagination.offset = 0;
            this.sorting = sorting;

        },
    },
};