-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathvue-tiny-pagination.esm.js
1 lines (1 loc) · 4.85 KB
/
vue-tiny-pagination.esm.js
1
function install(t){install.installed||(install.installed=!0,t.component("TinyPagination",TinyPagination))}!function(){if("undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],e=document.createElement("style"),n='@charset "UTF-8"; .tiny-pagination { font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; display: flex; list-style: none; margin: .2rem 0; padding: .2rem 0; } .tiny-pagination .page-item { margin: .2rem .05rem; } .tiny-pagination .page-item span { display: inline-block; padding: .2rem .2rem; } .tiny-pagination .page-item a { border-radius: .1rem; color: #667189; display: inline-block; padding: .2rem .4rem; text-decoration: none; } .tiny-pagination .page-item a:focus, .tiny-pagination .page-item a:hover { color: #5755d9; } .tiny-pagination .page-item.disabled a { cursor: default; opacity: .5; pointer-events: none; } .tiny-pagination .page-item.active a { background: #5755d9; color: #fff; } .tiny-pagination .page-item.page-prev, .tiny-pagination .page-item.page-next { flex: 1 0 50%; } .tiny-pagination .page-item.page-next { text-align: right; } .tiny-pagination .page-item .page-item-title { margin: 0; } .tiny-pagination .page-item .page-item-subtitle { margin: 0; opacity: .5; } .tiny-pagination .tiny-form-select { -webkit-appearance: none; -moz-appearance: none; appearance: none; text-transform: lowercase; border: .05rem solid #caced7; border-radius: .1rem; font-size: .8rem; height: 1.8rem; line-height: 1rem; outline: none; padding: .35rem .4rem; vertical-align: middle; width: 100%; } .tiny-pagination .tiny-form-select:focus { border-color: #5755d9; box-shadow: 0 0 0 0.1rem rgba(87, 85, 217, 0.2); } .tiny-pagination .tiny-form-select:not([multiple]):not([size]) { background: #fff url(\'data:image/svg+xml;charset=utf8,%3Csvg%20xmlns="http://www.w3.org/2000/svg"…path%20fill="%23667189"%20d="M2%200L0%202h4zm0%205L0%203h4z"/%3E%3C/svg%3E\') no-repeat right 0.35rem center/0.4rem 0.5rem; padding-right: 1.2rem; } ';e.type="text/css",e.styleSheet?e.styleSheet.cssText=n:e.appendChild(document.createTextNode(n)),t.appendChild(e)}}();var TinyPagination={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"vue-tiny-pagination"},[n("ul",{staticClass:"tiny-pagination",class:t.customClass},[n("li",{staticClass:"page-item",class:t.classFirstPage},[n("a",{staticClass:"btn-prev-page",attrs:{href:"#"},on:{click:function(e){e.preventDefault(),t.lastPage(e)}}},[t._v(t._s(t.translation.prev))])]),t._v(" "),n("li",{staticClass:"page-item"},[n("span",[t._v(t._s(t.titlePage))])]),t._v(" "),n("li",{staticClass:"page-item",class:t.classLastPage},[n("a",{staticClass:"btn-next-page",attrs:{href:"#"},on:{click:function(e){e.preventDefault(),t.nextPage(e)}}},[t._v(t._s(t.translation.next))])]),t._v(" "),t.showLimit?n("li",{staticClass:"page-item"},[n("select",{directives:[{name:"model",rawName:"v-model",value:t.currentLimit,expression:"currentLimit"}],staticClass:"tiny-form-select",on:{change:[function(e){var n=Array.prototype.filter.call(e.target.options,function(t){return t.selected}).map(function(t){return"_value"in t?t._value:t.value});t.currentLimit=e.target.multiple?n:n[0]},t.onLimitChange]}},t._l(t.limits,function(e,i){return n("option",{key:i,domProps:{value:e}},[t._v(t._s(e)+"/"+t._s(t.translation.title))])}))]):t._e()])])},staticRenderFns:[],name:"TinyPagination",props:{total:{type:Number,required:!0},page:{type:Number,default:1},lang:{type:String,default:"en"},customClass:{type:String},limits:{type:Array,default:function(){return[10,15,20,50,100]}},showLimit:{type:Boolean,default:!0}},data:function(){return{version:"0.2.1",currentPage:1,currentLimit:10,translations:{en:{prev:"Previous",title:"Page",next:"Next"},es:{prev:"Anterior",title:"Página",next:"Siguiente"}},availableLanguages:["en","es"]}},created:function(){this.currentPage=this.page},computed:{translation:function(){return this.availableLanguages.includes(this.lang)?this.translations[this.lang]:this.translations.en},totalPages:function(){return Math.ceil(this.total/this.currentLimit)},titlePage:function(){return this.translation.title+" "+this.currentPage},classFirstPage:function(){return{disabled:1===this.currentPage,"c-not-allowed":!0}},classLastPage:function(){return{disabled:this.currentPage===this.totalPages,"c-not-allowed":!0}}},methods:{nextPage:function(){this.currentPage!==this.totalPages&&(this.currentPage+=1)},lastPage:function(){this.currentPage>1&&(this.currentPage-=1)},onLimitChange:function(){this.currentPage=1}},watch:{currentPage:function(t){this.$emit("tiny:change-page",{page:t})},currentLimit:function(t){this.$emit("tiny:change-limit",{limit:t})}}},plugin={install:install},GlobalVue=null;"undefined"!=typeof window?GlobalVue=window.Vue:"undefined"!=typeof global&&(GlobalVue=global.Vue),GlobalVue&&GlobalVue.use(plugin);export default plugin;export{install,TinyPagination};