JSP数据分页导出下载显示进度条样式
1、思路
分页数据查询,同时缓存设置进度(为当前取出数据点总数据比例)
2、界面进度条为异步请求缓存比例
3、代码
css:
body{
position:relative;
}
.mask{
position:absolute;
left:0px;
top:0px;
height:100%;
width:100%;
background-color:#eee;
display:none;
filter:alpha(opacity=50);/*IE滤镜,透明度50%*/
-moz-opacity:0.5;/*Firefox私有,透明度50%*/
opacity:0.9;/*其他,透明度50%*/
z-index:999;
}
.out{
margin:auto;
margin-top:20%;
text-align:center;
height:30px;
width:500px;
background-color:#fff;
border:1pxsolidred;
position:relative;
}
.in{
position:absolute;
left:-1px;
top:0px;
height:28px;
width:0px;
background-color:red;
}
.num{
position:absolute;
left:0px;
top:0px;
height:30px;
line-height:30px;
width:500px;
text-align:center;
position:relative;
}
js:
$(function(){
$(.donwload).click(function(){
varulr=----;
varkey=newDate().getTime();
url+="?key="+key;
downloadFile(url);
process(key);
});
});
functiondownloadFile(url){
try{
varelemIF=document.createElement("iframe")
elemIF.style.display="none";
document.body.appendChild(elemIF);
elemIF.src=url;
}catch(e){
}
}
functionprocess(key){
$.ajax({
type:'GET',
url:----------,
async:true,
success:function(data){
if(data){
data=parseFloat(data).toFixed(2);
$(".in").css("width",(data/100*500)+"px");
$(".num").text(data+"%");
if(data>=100){
setTimeout(function(){
$(".mask").hide();
},3000);
}else{
setTimeout(function(){
process(key);
},1000);
}
}
},
error:function(){
}
});
}
downaction
try{
redisTemplate.opsForValue().set("down_process_"+qm.getKey(),0.1);
inti=0;
while(true){
qm.getPage().setNowPage(i++);
qm.getPage().setPageSize(100);
Pagedbpage=取当前页数据
List<>list=(List<>)dbpage.getResult();
if(list!=null&&list.size()>0){
if(list.size()<100){
redisTemplate.opsForValue().set("down_process_"+qm.getKey(),100);
}else{
doubleprocess=i*100.0/dbpage.getTotalCount()*100;
if(process<0.1)process=0.1d;
redisTemplate.opsForValue().set("down_process_"+qm.getKey(),process);
}
}
logger.info("-------value:"+redisTemplate.opsForValue().get("down_process_"+qm.getKey()));
if(list==null||list.size()<100){
redisTemplate.opsForValue().set("down_process_"+qm.getKey(),100);
break;
}
logger.info("-------value:"+redisTemplate.opsForValue().get("down_process_"+qm.getKey()));
continue;
}
}catch(){
}finally{
redisTemplate.opsForValue().set("down_process_"+qm.getKey(),100);
redisTemplate.expire("down_process_"+qm.getKey(),5,TimeUnit.MINUTES);
}
publicdoubleprocess(HttpServletRequestrequest,HttpServletResponseresponse,@PathVariable(value="key")Stringkey)throwsIOException{
Doubleprocess=0.1d;
try{
inti=0;
while(true){
if(i>=2){
process=100d;
break;
}
i++;
if(redisTemplate.opsForValue().get("down_process_"+key)==null){
Thread.currentThread().sleep(1000l);
continue;
}else{
process=Double.valueOf(redisTemplate.opsForValue().get("down_process_"+key).toString());
break;
}
}
}catch(Exceptione){
process=0.1d;
e.printStackTrace();
}finally{
returnprocess;
}
}
以上所述是小编给大家介绍的JSP数据分页导出下载显示进度条样式,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持!