1. 先把数据计算生成百分比
public JsonResult add(@Validated(ValidateConfig.ADD.class)SecKillDevice secKillDevice, HttpServletRequest request) { //首先循环 获取当前选取的商家list for (int m = 0;m <= merchantList.size()-1; m++){ //计算百分比 商家数 / ((商家总数-1)* 100%) = 进度条的百分比 减一是因为m从0开始计算 Double aDouble = m/((merchantList.size()-1) * 0.01); int intValue=aDouble.intValue(); Integer bfb=Integer.valueOf(intValue); //将进度值存储到session中 request.getSession().setAttribute("processValue", bfb); } return new JsonResult().success("success"); }
2. 从session将执行进度值取出来并返回给用户
1秒请求一次
public Object getProcess(HttpServletRequest request) { //从session将执行进度值取出来并返回给用户 Object obj = request.getSession().getAttribute("processValue"); return obj; }
3.前端页面,为了关闭添加页面以后继续可以保存进度条进度,所以在后面加了判断,前端为 layui框架
//定义定时器 var timer; //轮询请求进度数据 getProcessvalue:function(){ //1秒请求一次进度条的数据 timer = setInterval(function () { $.post('/ad/secKillDevice/getProcess.json',function(data){ $('.layui-progress').show(); //显示进度条 //更新进度条 element.progress('demo', data+'%'); // 这个是列表页面的判断逻辑,因为为了加载页面的时候,继续保存进度条的进度 // 如果进度条百分之百 或者 百分之0 不在调用后台轮询接口 关闭定时器, 隐藏进度条 if (data == 0 || data == 100){<br> //清空定时器 clearInterval(timer); $('.layui-progress').hide(); return; } }); }, 1000); },
4.html div样式
1 <div class="layui-progress layui-progress-big" lay-filter="demo" lay-showPercent="true"> 2 <div class="layui-progress-bar" lay-percent="0%"></div> 3 </div>
仅供参考!!