/** @name Edo.navigators.PagingBar @class @description 分页组件,配合表格组件使用 @extend Edo.containers.Box */ Edo.navigators.PagingBar = function(config){ Edo.navigators.PagingBar.superclass.constructor.call(this); /** @name Edo.navigators.PagingBar#beforepaging @event @description 分页前事件 @property {Number} index 分页索引 @property {Number} size 每页分页数 @property {Object} params 分页参数对象 */ /** @name Edo.navigators.PagingBar#paging @event @description 分页前事件 @property {Number} index 分页索引 @property {Number} size 每页分页数 @property {Object} params 分页参数对象 */ }; Edo.navigators.PagingBar.extend(Edo.containers.Box,{ elCls: 'e-pagingbar e-box e-ct e-div', /** @name Edo.navigators.PagingBar#size @property @type Number @default 20 @description 每页多少行记录 */ size: 20, /** @name Edo.navigators.PagingBar#index @property @type Number @default 0 @description 页码 */ index: 0, /** @name Edo.navigators.PagingBar#total @property @type Number @description 总记录数 */ total: -1, /** @name Edo.navigators.PagingBar#totalPage @property @type Number @description 总页码数 */ totalPage: -1, loading: false, /** @name Edo.navigators.PagingBar#autoPaging @property @type Boolean @default false @description 创建后是否自动激发分页动作 */ autoPaging: false, //创建成功,自动激发分页 totalTpl: '第 / <%=this.totalPage%>页, 每页条, 共<%=this.total%>条', layout: 'horizontal', layout: 'horizontal', border: [0,0,0,0], padding: [0,0,0,0], /** @name Edo.navigators.PagingBar#barVisible @property @type Boolean @default true @description 是否显示分页操作按钮 */ barVisible: true, /** @name Edo.navigators.PagingBar#infoVisible @property @type Boolean @default true @description 是否显示分页信息 */ infoVisible: true, _setSize: function(v){ this.size = v; }, init: function(){ var pager = this; this.set({ verticalAlign: 'middle', 'children': [ { name: 'barct', type: 'ct',layout: 'horizontal', horizontalGap: 0,verticalAlign: 'middle', height:'100%', children: [ { type: 'button', name: 'first', defaultHeight: 16, icon: 'e-page-first', onclick: this.doFirst.bind(this) }, { type: 'button', name: 'pre', defaultHeight: 16, icon: 'e-page-pre', onclick: this.doPre.bind(this) }, { type: 'button', name: 'next', defaultHeight: 16, icon: 'e-page-next', onclick: this.doNext.bind(this) }, { type: 'button', name: 'last', defaultHeight: 16, icon: 'e-page-last', onclick: this.doLast.bind(this) } ] }, { type: 'button', name: 'refresh', defaultHeight: 16, icon: 'e-icon-refresh', onclick: this.doRefresh.bind(this) }, { type: 'button', name: 'nowait', defaultHeight: 16, icon: 'e-page-nowait' }, { type: 'space', name: 'space', width: '100%' }, { name: 'infoct', type: 'ct',layout: 'horizontal', verticalAlign: 'middle', children: [ // { // type: 'text', // name: 'index', // textStyle: 'text-align:center', // text: '1', // width: 25, // ontextchange: function(e){ // // var index = parseInt(this.text); // // if(isNaN(index)){ // // alert("只能输入数字"); // // this.set('text', pager.index); // // return; // // } // // pager.change(index); // } // }, { type: 'label', name: 'view' } ] } ] }); Edo.navigators.PagingBar.superclass.init.apply(this, arguments); var sf = this; function get(name){ return Edo.getByName(name, sf)[0]; } var btns = this.children; this.firstBtn = get("first"); this.preBtn = get("pre"); this.nextBtn = get("next"); this.lastBtn = get("last"); this.refreshBtn = get("refresh"); this.loadBtn = get("nowait"); //this.indexText = get("index"); //this.sizeText = get("size"); this.viewText = get("view"); // this.barCt = get('barct'); this.infoCt = get('infoct'); this.space = get('space'); this.barCt.set('visible', this.barVisible); this.infoCt.set('visible', this.infoVisible); if(this.autoPaging){ this.change.defer(this.padingDelay, this); } }, padingDelay: 100, doFirst: function(e){ this.change(0); }, doPre: function(e){ this.change(this.index-1); }, doNext: function(e){ this.change(this.index+1); }, doLast: function(e){ this.change(this.totalPage-1); }, doRefresh: function(e){ this.change(); }, /** @name Edo.navigators.PagingBar#change @function @param {Number} index 页码 @param {Number} size 每页记录数 @param {Object} params 分页参数 @description 列配置 */ change: function(index, size, params){ index = parseInt(index); size = parseInt(size); var e = { type: 'beforepaging', source: this, index: Edo.isValue(index) ? index : this.index, size: Edo.isValue(size) ? size : this.size, params: params } if(this.fireEvent('beforepaging', e) !== false){ this.index = e.index; this.size = e.size; this.compute(); this.loading = true; this.refresh(); e.type = 'paging'; this.fireEvent('paging', e); } }, compute: function(index, size, total){ if(Edo.isValue(index)) this.index = index; if(Edo.isValue(size)) this.size = size; if(Edo.isValue(total)) this.total = total; this.totalPage = parseInt(this.total / this.size) + (this.total % this.size ? 1 : 0); //this.totalPage -= 1; if(this.index >= this.totalPage-1){ this.index = this.totalPage - 1; } if(this.index < 0) this.index = 0; }, /** @name Edo.navigators.PagingBar#refresh @function @param {Number} total 总记录数 @description 更新分页状态信息 */ refresh: function(total){ if(Edo.isValue(total)){ this.total = total; } //根据当前的分页数据,更新按钮状态(可用/不可用等..) this.compute(); //loading if(this.inited) { this.firstBtn.set('enable', this.index != 0); this.preBtn.set('enable', this.index != 0); this.nextBtn.set('enable', !(this.totalPage == 0) && this.index != this.totalPage-1); this.lastBtn.set('enable', !(this.totalPage == 0) && this.index != this.totalPage-1); this.viewText.set('text', ''); this.viewText.set('text', new Edo.util.Template(this.totalTpl).run(this)); this.loadBtn.set('icon', this.loading ? 'e-page-wait' : 'e-page-nowait'); this.loading = false; } } }); Edo.navigators.PagingBar.regType('pagingbar'); Edo.navigators.PagingBar.prototype.refreshView = Edo.navigators.PagingBar.prototype.refresh;