vxe-pc-ui
Version:
A vue based PC component library
1 lines • 11.1 kB
JavaScript
Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_log=require("../../ui/src/log"),_select=_interopRequireDefault(require("../../select/src/select")),_numberInput=_interopRequireDefault(require("../../number-input/src/number-input"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxePager",props:{size:{type:String,default:()=>(0,_ui.getConfig)().pager.size||(0,_ui.getConfig)().size},layouts:{type:Array,default:()=>(0,_ui.getConfig)().pager.layouts||["PrevJump","PrevPage","Jump","PageCount","NextPage","NextJump","Sizes","Total"]},currentPage:{type:Number,default:1},loading:Boolean,pageSize:{type:Number,default:()=>(0,_ui.getConfig)().pager.pageSize||10},total:{type:Number,default:0},pagerCount:{type:Number,default:()=>(0,_ui.getConfig)().pager.pagerCount||7},pageSizes:{type:Array,default:()=>(0,_ui.getConfig)().pager.pageSizes||[10,15,20,50,100]},align:{type:String,default:()=>(0,_ui.getConfig)().pager.align},border:{type:Boolean,default:()=>(0,_ui.getConfig)().pager.border},background:{type:Boolean,default:()=>(0,_ui.getConfig)().pager.background},perfect:{type:Boolean,default:()=>(0,_ui.getConfig)().pager.perfect},autoHidden:{type:Boolean,default:()=>(0,_ui.getConfig)().pager.autoHidden},transfer:{type:Boolean,default:()=>(0,_ui.getConfig)().pager.transfer},className:[String,Function],pageSizePlacement:{type:String,default:()=>(0,_ui.getConfig)().pager.pageSizePlacement},iconPrevPage:String,iconJumpPrev:String,iconJumpNext:String,iconNextPage:String,iconJumpMore:String,iconHomePage:String,iconEndPage:String},emits:["update:pageSize","update:currentPage","page-change"],setup(_,e){let{slots:m,emit:u}=e;var a=_xeUtils.default.uniqueId();let g=(0,_ui.useSize)(_).computeSize,p=(0,_vue.inject)("$xeGrid",null),n=(0,_vue.reactive)({inpCurrPage:_.currentPage}),l=(0,_vue.ref)(),t={refElem:l},P=(0,_vue.computed)(()=>s(_.total,_.pageSize)),x=(0,_vue.computed)(()=>{var e=_.pagerCount,a=e<P.value?e-2:e,t=[];for(let e=0;e<a;e++)t.push(e);return t}),d=(0,_vue.computed)(()=>Math.floor((_.pagerCount-2)/2)),i=(0,_vue.computed)(()=>_.pageSizes.map(e=>_xeUtils.default.isNumber(e)?{value:e,label:""+(0,_ui.getI18n)("vxe.pager.pagesize",[e])}:Object.assign({value:"",label:""},e))),h={xID:a,props:_,context:e,getRefMaps:()=>t},o=(e,a,t)=>{u(e,(0,_ui.createEvent)(t,{$pager:h},a))},s=(e,a)=>Math.max(Math.ceil(e/a),1),b=(e,a)=>{u("update:currentPage",a),e&&a!==_.currentPage&&o("page-change",{type:"current",pageSize:_.pageSize,currentPage:a},e)},v=(e,a)=>{u("update:currentPage",e),a&&e!==_.currentPage&&o("page-change",{type:"current",pageSize:_.pageSize,currentPage:e},a)},c=e=>{var e=e.$event,a=e.target,t=_xeUtils.default.toInteger(a.value),r=P.value,r=t<=0?1:r<=t?r:t,t=_xeUtils.default.toValueString(r);a.value=t,n.inpCurrPage=t,v(r,e)},f=e=>{var a=_.currentPage;1<a&&v(1,e)},C=e=>{var a=_.currentPage,t=P.value;a<t&&v(t,e)},E=e=>{var a=_.currentPage,t=P.value;1<a&&v(Math.min(t,Math.max(a-1,1)),e)},y=e=>{var a=_.currentPage,t=P.value;a<t&&v(Math.min(t,a+1),e)},S=e=>{var a=x.value;v(Math.max(_.currentPage-a.length,1),e)},k=e=>{var a=P.value,t=x.value;v(Math.min(_.currentPage+t.length,a),e)},z=e=>{var{value:e,$event:a}=e,e=_xeUtils.default.toNumber(e),t=s(_.total,e);let r=_.currentPage;r>t&&(r=t,u("update:currentPage",t)),u("update:pageSize",e),a&&o("page-change",{type:"size",pageSize:e,currentPage:r},a)},N=e=>{var a=e.$event;_ui.globalEvents.hasKey(a,_ui.GLOBAL_EVENT_KEYS.ENTER)?c(e):_ui.globalEvents.hasKey(a,_ui.GLOBAL_EVENT_KEYS.ARROW_UP)?(a.preventDefault(),y(a)):_ui.globalEvents.hasKey(a,_ui.GLOBAL_EVENT_KEYS.ARROW_DOWN)&&(a.preventDefault(),E(a))},J=()=>{var{currentPage:e,total:a}=_,t=m.home,r=P.value;return t?(0,_vue.h)("span",{class:"vxe-pager--custom-home-btn"},t({$pager:h,total:a,currentPage:e,pageCount:r})):(0,_vue.h)("button",{class:["vxe-pager--home-btn",{"is--disabled":e<=1}],type:"button",title:(0,_ui.getI18n)("vxe.pager.homePageTitle"),onClick:f},[(0,_vue.h)("i",{class:["vxe-pager--btn-icon",_.iconHomePage||(0,_ui.getIcon)().PAGER_HOME]})])},I=()=>{var{currentPage:e,total:a}=_,t=m.prevPage||m["prev-page"],r=P.value;return t?(0,_vue.h)("span",{class:"vxe-pager--custom-prev-btn"},t({$pager:h,total:a,currentPage:e,pageCount:r})):(0,_vue.h)("button",{class:["vxe-pager--prev-btn",{"is--disabled":e<=1}],type:"button",title:(0,_ui.getI18n)("vxe.pager.prevPageTitle"),onClick:E},[(0,_vue.h)("i",{class:["vxe-pager--btn-icon",_.iconPrevPage||(0,_ui.getIcon)().PAGER_PREV_PAGE]})])},M=e=>{var{currentPage:a,total:t}=_,r=m.prevJump||m["prev-jump"],u=P.value;return r?(0,_vue.h)("span",{class:"vxe-pager--custom-jump-prev"},r({$pager:h,total:t,currentPage:a,pageCount:u})):(0,_vue.h)(e||"button",{class:["vxe-pager--jump-prev",{"is--fixed":!e,"is--disabled":a<=1}],type:"button",title:(0,_ui.getI18n)("vxe.pager.prevJumpTitle"),onClick:S},[e?(0,_vue.h)("i",{class:["vxe-pager--jump-more-icon",_.iconJumpMore||(0,_ui.getIcon)().PAGER_JUMP_MORE]}):null,(0,_vue.h)("i",{class:["vxe-pager--jump-icon",_.iconJumpPrev||(0,_ui.getIcon)().PAGER_JUMP_PREV]})])},T=e=>{var{currentPage:a,total:t}=_,r=m.nextJump||m["next-jump"],u=P.value;return r?(0,_vue.h)("span",{class:"vxe-pager--custom-jump-next"},r({$pager:h,total:t,currentPage:a,pageCount:u})):(0,_vue.h)(e||"button",{class:["vxe-pager--jump-next",{"is--fixed":!e,"is--disabled":u<=a}],type:"button",title:(0,_ui.getI18n)("vxe.pager.nextJumpTitle"),onClick:k},[e?(0,_vue.h)("i",{class:["vxe-pager--jump-more-icon",_.iconJumpMore||(0,_ui.getIcon)().PAGER_JUMP_MORE]}):null,(0,_vue.h)("i",{class:["vxe-pager--jump-icon",_.iconJumpNext||(0,_ui.getIcon)().PAGER_JUMP_NEXT]})])},R=()=>{var{currentPage:e,total:a}=_,t=m.nextPage||m["next-page"],r=P.value;return t?(0,_vue.h)("span",{class:"vxe-pager--custom-next-btn"},t({$pager:h,total:a,currentPage:e,pageCount:r})):(0,_vue.h)("button",{class:["vxe-pager--next-btn",{"is--disabled":r<=e}],type:"button",title:(0,_ui.getI18n)("vxe.pager.nextPageTitle"),onClick:y},[(0,_vue.h)("i",{class:["vxe-pager--btn-icon",_.iconNextPage||(0,_ui.getIcon)().PAGER_NEXT_PAGE]})])},j=()=>{var{currentPage:e,total:a}=_,t=m.end,r=P.value;return t?(0,_vue.h)("span",{class:"vxe-pager--custom-end-btn"},t({$pager:h,total:a,currentPage:e,pageCount:r})):(0,_vue.h)("button",{class:["vxe-pager--end-btn",{"is--disabled":r<=e}],type:"button",title:(0,_ui.getI18n)("vxe.pager.endPageTitle"),onClick:C},[(0,_vue.h)("i",{class:["vxe-pager--btn-icon",_.iconEndPage||(0,_ui.getIcon)().PAGER_END]})])},$=e=>{let{currentPage:r,total:a,pagerCount:t}=_;var u=e?m.numberJump||m["number-jump"]:m.number;let n=[],g=P.value;var p=x.value,l=d.value,i=g>t,o=i&&r>l+1,s=i&&r<g-l;let v=[],c=1;return i&&(c=r>=g-l?Math.max(g-p.length+1,1):Math.max(r-l,1)),e&&o&&(v.push(1),n.push((0,_vue.h)("button",{class:"vxe-pager--num-btn",type:"button",onClick:e=>b(e,1)},"1"),M("span"))),p.forEach((e,a)=>{let t=c+a;t<=g&&(v.push(t),n.push((0,_vue.h)("button",{key:t,class:["vxe-pager--num-btn",{"is--active":r===t}],type:"button",onClick:e=>b(e,t)},""+t)))}),e&&s&&(v.push(g),n.push(T("button"),(0,_vue.h)("button",{class:"vxe-pager--num-btn",type:"button",onClick:e=>b(e,g)},g))),u?(0,_vue.h)("span",{class:"vxe-pager--custom-btn-wrapper"},u({$pager:h,total:a,numList:v,currentPage:r,pageCount:g})):(0,_vue.h)("span",{class:"vxe-pager--btn-wrapper"},n)},A=()=>$(!0),U=()=>{var{total:e,currentPage:a,pageSize:t,pageSizePlacement:r,transfer:u}=_,n=m.sizes,g=i.value,p=P.value;return n?(0,_vue.h)("span",{class:"vxe-pager--custom-sizes"},n({$pager:h,total:e,currentPage:a,pageCount:p,pageSize:t,options:g})):(0,_vue.h)(_select.default,{class:"vxe-pager--sizes",modelValue:t,placement:r,transfer:u,options:g,onChange:z})},B=e=>{var a=_.total,t=n.inpCurrPage,r=e?m.fullJump||m["full-jump"]:m.jump,u=P.value;return r?(0,_vue.h)("span",{class:"vxe-pager--custom-jump"},r({$pager:h,total:a,currentPage:t,pageCount:u})):(0,_vue.h)("span",{class:"vxe-pager--jump"},[e?(0,_vue.h)("span",{class:"vxe-pager--goto-text"},(0,_ui.getI18n)("vxe.pager.goto")):null,(0,_vue.h)(_numberInput.default,{class:"vxe-pager--goto",modelValue:n.inpCurrPage,placeholder:(0,_ui.getI18n)("vxe.pager.gotoTitle"),align:"center",type:"integer",max:u,min:1,controls:!1,onKeydown:N,onBlur:c,"onUpdate:modelValue"(e){n.inpCurrPage=e}}),e?(0,_vue.h)("span",{class:"vxe-pager--classifier-text"},(0,_ui.getI18n)("vxe.pager.pageClassifier")):null])},G=()=>B(!0),V=()=>{var{currentPage:e,total:a}=_,t=m.pageCount||m["page-count"],r=P.value;return t?(0,_vue.h)("span",{class:"vxe-pager--custom-count"},t({$pager:h,total:a,currentPage:e,pageCount:r})):(0,_vue.h)("span",{class:"vxe-pager--count"},[(0,_vue.h)("span",{class:"vxe-pager--separator"}),(0,_vue.h)("span",r)])},q=()=>{var{currentPage:e,total:a}=_,t=m.total,r=P.value;return t?(0,_vue.h)("span",{class:"vxe-pager--custom-total"},t({$pager:h,total:a,currentPage:e,pageCount:r})):(0,_vue.h)("span",{class:"vxe-pager--total"},(0,_ui.getI18n)("vxe.pager.total",[a]))};a={dispatchEvent:o,setPageSize(e){return z({value:e}),(0,_vue.nextTick)()},setPageSizeByEvent(e,a){z({value:a,$event:e})},homePage(){return f(),(0,_vue.nextTick)()},homePageByEvent(e){f(e)},endPage(){return C(),(0,_vue.nextTick)()},endPageByEvent(e){C(e)},prevPage(){return E(),(0,_vue.nextTick)()},prevPageByEvent(e){E(e)},nextPage(){return y(),(0,_vue.nextTick)()},nextPageByEvent(e){y(e)},prevJump(){return S(),(0,_vue.nextTick)()},prevJumpByEvent(e){S(e)},nextJump(){return k(),(0,_vue.nextTick)()},nextJumpByEvent(e){k(e)},setCurrentPage(e){e=_xeUtils.default.toNumber(e)||1;return n.inpCurrPage=e,v(e),(0,_vue.nextTick)()},setCurrentPageByEvent(e,a){a=_xeUtils.default.toNumber(a)||1;n.inpCurrPage=a,v(a,e)},jumpPage(e){return(0,_log.warnLog)("vxe.error.delFunc",["[pager] jumpPage","setCurrentPage"]),h.setCurrentPage(e)}},e={handlePrevPage:E,handleNextPage:y,handlePrevJump:S,handleNextJump:k};Object.assign(h,a,e),(0,_vue.watch)(()=>_.currentPage,e=>{n.inpCurrPage=e});return h.renderVN=()=>{var{align:e,layouts:a,className:t}=_;let r=[];var u=g.value,n=P.value;return m.left&&r.push((0,_vue.h)("span",{class:"vxe-pager--left-wrapper"},m.left({$grid:p}))),a.forEach(e=>{let a;switch(e){case"Home":a=J;break;case"PrevJump":a=M;break;case"PrevPage":a=I;break;case"Number":a=$;break;case"JumpNumber":a=A;break;case"NextPage":a=R;break;case"NextJump":a=T;break;case"End":a=j;break;case"Sizes":a=U;break;case"FullJump":a=G;break;case"Jump":a=B;break;case"PageCount":a=V;break;case"Total":a=q}a?r.push(a()):(0,_log.errLog)("vxe.error.notProp",["[pager] layouts -> "+e])}),m.right&&r.push((0,_vue.h)("span",{class:"vxe-pager--right-wrapper"},m.right({$grid:p}))),(0,_vue.h)("div",{ref:l,class:["vxe-pager",t?_xeUtils.default.isFunction(t)?t({$pager:h}):t:"",{["size--"+u]:u,["align--"+e]:e,"is--border":_.border,"is--background":_.background,"is--perfect":_.perfect,"is--hidden":_.autoHidden&&1===n,"is--loading":_.loading}]},[(0,_vue.h)("div",{class:"vxe-pager--wrapper"},r)])},h},render(){return this.renderVN()}});