feilongDisplay pager template

本节,我们介绍下 内置的 velocity模版, 以及如果需要修改模板的时候,可以使用哪些变量或者属性

1. 内置的feilong-default-pager.vm

feilong pager 默认使用的 feilong-taglib jar 里面的 velocity/feilong-default-pager.vm

内容如下:

	#**
	    这是个示例或者默认的模板,通过这个模板,可以看到哪些变量可以使用
	    每个商城可以使用这个模板,也可以自定义模板来使用
		
		该VM 可以取到两个变量:
		
	    	pagerVMParam	:	包含各种显示数字/链接 参数
	    	i18nMap			:	包含国际化信息
	*#
	<div class="div_feilongPager ${pagerVMParam.skin}">
		##总数
		<span class="span_pagerInfo">${i18nMap.get('feilong-pager.text.totalCount')}${pagerVMParam.totalCount}</span>
		##当前第${pagerVMParam.currentPageNo}页/共${pagerVMParam.allPageNo}页
		<span class="span_pagerInfo" title="${i18nMap.get('feilong-pager.text.current')}${pagerVMParam.currentPageNo}${i18nMap.get('feilong-pager.text.pager')}/${i18nMap.get('feilong-pager.text.total')}${pagerVMParam.allPageNo}${i18nMap.get('feilong-pager.text.pager')}">${pagerVMParam.currentPageNo}/${pagerVMParam.allPageNo}</span>
	
	##第一页不显示首页和上一页
	#if(1 != ${pagerVMParam.currentPageNo})
		<a pageNoValue="${pagerVMParam.prePageNo}" title="${i18nMap.get('feilong-pager.text.goto.pre')}" href="${pagerVMParam.preUrl}">${i18nMap.get('feilong-pager.text.prev')}</a>
	    ##// 如果导航编号里面没有首页 则添加首页
		##// 导航里面 是否有第一页, 如果从开始1索引 则已经包含的首页包含
		
		#if (${pagerVMParam.startIteratorIndex} != 1)
			<a pageNoValue="1" title="${i18nMap.get('feilong-pager.text.goto.first')}" href="${pagerVMParam.firstUrl}">1</a>
		#end
	#end
	
	##开始迭代索引不等于1,并且开始迭代索引不等于2,显示3点
	#if (${pagerVMParam.startIteratorIndex} != 1 && ${pagerVMParam.startIteratorIndex} != 2)
		<span class="color_666">...</span>
	#end
	
	##循环所有的页码 显示导航编号
	#foreach( ${entry} in ${pagerVMParam.iteratorIndexMap.entrySet()} )
		##当前 直接是数字编号
	    #if(${entry.key}==${pagerVMParam.currentPageNo})
			<span class="current">${entry.key}</span>
	    #else
			##不是当前页面
			<a pageNoValue="${entry.key}" title="${i18nMap.get('feilong-pager.text.goto')}${entry.key}${i18nMap.get('feilong-pager.text.pager')}" href="${entry.value}">${entry.key}</a>
	    #end
	#end
	
	##如果最后一个迭代索引不等于总页数,且最后一个迭代索引不等于总也是-1,那么 显示3点
	#set($allPageNoTo1=${pagerVMParam.allPageNo} - 1)
	#if (${pagerVMParam.endIteratorIndex} != ${pagerVMParam.allPageNo} && ${pagerVMParam.endIteratorIndex} != $allPageNoTo1)
		<span class="color_666">...</span>
	#end
	
	##最后一页不显示下一页和末页
	#if(${pagerVMParam.allPageNo}!=${pagerVMParam.currentPageNo})
		## 如果导航编号里面没有尾页 则添加尾页
		##导航里面是否有最后一页, 如果结束的位置是allPageNo 则已经包含的尾页
		#if(${pagerVMParam.endIteratorIndex} != ${pagerVMParam.allPageNo})
			##跳转到最后一页
			<a pageNoValue="$!{pagerVMParam.allPageNo}" title="${i18nMap.get('feilong-pager.text.goto.last')}" href="${pagerVMParam.lastUrl}">$!{pagerVMParam.allPageNo}</a>
		#end
	
		##跳转到下一页
		<a pageNoValue="${pagerVMParam.nextPageNo}" title="${i18nMap.get('feilong-pager.text.goto.next')}" href="${pagerVMParam.nextUrl}">${i18nMap.get('feilong-pager.text.next')}</a>
	#end
	
		<input type="text" value="${pagerVMParam.currentPageNo}" class="feilongGotoInput" pagerUrlTemplateHref="${pagerVMParam.pagerUrlTemplate.href}" templateValue="${pagerVMParam.pagerUrlTemplate.templateValue}" pageParamName="${pagerVMParam.pageParamName}"/>/${pagerVMParam.allPageNo}<button class="pagerButton" value="go">Go</button>
	</div>
	
	<script type="text/javascript">
	    $(function() {
			##快速跳转文本框的回车事件
			$(".feilongGotoInput").keydown( function() { 
				if (event.keyCode == 13) { 
					pagerJump($(this));
				}
			});
			
			##快速跳转按钮的点击事件
			$(".pagerButton").click(function(){
				pagerJump($(".feilongGotoInput"));
			});
	    });
	    
	    function pagerJump(feilongGotoInputJquery){
			var pageNoValue=feilongGotoInputJquery.val();
			console.log(pageNoValue);
			if(""!=pageNoValue&&pageNoValue>0){
				var templateValue=feilongGotoInputJquery.attr("templateValue");
				var pageParamName=feilongGotoInputJquery.attr("pageParamName");
				var pagerUrlTemplateHref=feilongGotoInputJquery.attr("pagerUrlTemplateHref");
				location.href=pagerUrlTemplateHref.replace(pageParamName+"="+templateValue,pageParamName+"="+pageNoValue);
			}
	    }
	</script>

2. 自定义 velocity pager分页模板

有些时候,需要我们定制模板,我们可以在Pager vm模板中使用以下参数:

• PagerVMParam 对象,属性名字 pagerVMParam
• i18nMap对象 (国际化使用的文案),属性名字 i18nMap

2.1 PagerVMParam 对象

对象类型 : com.feilong.taglib.display.pager.command.PagerVMParam

变量名称	说明	类型	since	示例数据
totalCount	数据总数	int	1.0	1024
skin	设定的皮肤	String	1.0	digg
currentPageNo	当前页码	int	1.0	12
allPageNo	总页数	int	1.0	103
prePageNo	上一页页码	int	1.4.0	11
nextPageNo	下一页页码	int	1.4.0	13
pagerType	分页类型	PagerType	1.4.0	REDIRECT
preUrl	上一页链接	String	1.0	/pager?page=7&name=%E9%A3%9E%E5%A4%A9%E5%A5%94%E6%9C%88
nextUrl	下一页链接	String	1.0	/pager?page=9&name=%E9%A3%9E%E5%A4%A9%E5%A5%94%E6%9C%88
firstUrl	第一页的链接	String	1.0	/pager?page=1&name=%E9%A3%9E%E5%A4%A9%E5%A5%94%E6%9C%88
lastUrl	最后一页的链接	String	1.0	/pager?page=1000&name=%E9%A3%9E%E5%A4%A9%E5%A5%94%E6%9C%88
hrefUrlTemplate	链接的模板,以便前端js替换		1.0	/pager?page=-8888888&name=%E9%A3%9E%E5%A4%A9%E5%A5%94%E6%9C%88
startIteratorIndex	开始迭代索引编号	int	1.0	7
endIteratorIndex	结束迭代索引编号	int	1.0	9
iteratorIndexMap	循环 迭代索引map key是编号,value 是页面链接	LinkedHashMap<Integer, String>	1.0	"7": "/pager?page=7&name=%E9%A3%9E%E5%A4%A9%E5%A5%94%E6%9C%88", "8": "/pager?page=8&name=%E9%A3%9E%E5%A4%A9%E5%A5%94%E6%9C%88", "9": "/pager?page=9&name=%E9%A3%9E%E5%A4%A9%E5%A5%94%E6%9C%88"
pageParamName	分页参数名称	String	1.0.6	pageNo
pagerUrlTemplate	分页链接模板	PagerUrlTemplate	1.0.6	"pagerUrlTemplate": { "href": "/pager?page=-88888888&name=%E9%A3%9E%E5%A4%A9%E5%A5%94%E6%9C%88", "templateValue": -88888888 },

2.2 i18nMap对象 (国际化使用的文案)

将 messages/feilong-pager.properties 配置文件的key和value转成了i18nMap对象,可以在vm模板中直接使用配置文件中的参数

示例参见 messages/feilong-pager.properties

3. messages/feilong-pager.properties