style:样式修改
Showing
4 changed files
with
87 additions
and
43 deletions
| ... | @@ -22,10 +22,7 @@ | ... | @@ -22,10 +22,7 @@ |
| 22 | } | 22 | } |
| 23 | .next_button { | 23 | .next_button { |
| 24 | text-align: center; | 24 | text-align: center; |
| 25 | margin: 10px 0; | 25 | margin: 30px 0 100px 0; |
| 26 | } | ||
| 27 | .next_button a { | ||
| 28 | color: #ffffff; | ||
| 29 | } | 26 | } |
| 30 | .no_info { | 27 | .no_info { |
| 31 | text-align: center; | 28 | text-align: center; | ... | ... |
| ... | @@ -8,4 +8,52 @@ $(function () { | ... | @@ -8,4 +8,52 @@ $(function () { |
| 8 | }); | 8 | }); |
| 9 | addTabs('#wssq') | 9 | addTabs('#wssq') |
| 10 | // 业务 | 10 | // 业务 |
| 11 | // 进度条 | ||
| 12 | var data = { | ||
| 13 | 'progressList': [ | ||
| 14 | { | ||
| 15 | stepName: "信息效验", | ||
| 16 | stepState: 2 //0:未办理 1:正在办理 2:已办理 | ||
| 17 | }, | ||
| 18 | { | ||
| 19 | stepName: "填报信息", | ||
| 20 | stepState: 2 | ||
| 21 | }, | ||
| 22 | { | ||
| 23 | stepName: "完税核税", | ||
| 24 | stepState: 1 | ||
| 25 | }, | ||
| 26 | { | ||
| 27 | stepName: "身份认证", | ||
| 28 | stepState: 0 | ||
| 29 | }, | ||
| 30 | { | ||
| 31 | stepName: "资料审核", | ||
| 32 | stepState: 0 | ||
| 33 | }, | ||
| 34 | { | ||
| 35 | stepName: "线上缴费", | ||
| 36 | stepState: 0 | ||
| 37 | }, | ||
| 38 | { | ||
| 39 | stepName: "生成电子证书", | ||
| 40 | stepState: 0 | ||
| 41 | } | ||
| 42 | ], | ||
| 43 | } | ||
| 44 | |||
| 45 | layui.use('laytpl', function () { | ||
| 46 | laytpl = layui.laytpl; | ||
| 47 | var getTpl = document.getElementById('progress').innerHTML | ||
| 48 | , view = document.getElementById('app_progress'); | ||
| 49 | laytpl(getTpl).render(data, function (html) { | ||
| 50 | view.innerHTML = html; | ||
| 51 | }); | ||
| 52 | |||
| 53 | layui.use(['element'], function () { | ||
| 54 | var element = layui.element; | ||
| 55 | //初始化动态元素,一些动态生成的元素如果不设置初始化,将不会有默认的动态效果 | ||
| 56 | element.init(); | ||
| 57 | }); | ||
| 58 | }); | ||
| 11 | }) | 59 | }) | ... | ... |
| 1 | <!DOCTYPE html | 1 | <!DOCTYPE html |
| 2 | PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | 2 | PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| 3 | <html xmlns="http://www.w3.org/1999/xhtml"> | 3 | <html xmlns="http://www.w3.org/1999/xhtml"> |
| 4 | |||
| 5 | <head> | 4 | <head> |
| 6 | <style> | 5 | <style> |
| 7 | </style> | 6 | </style> |
| ... | @@ -27,42 +26,10 @@ | ... | @@ -27,42 +26,10 @@ |
| 27 | <h2>转移类</h2> | 26 | <h2>转移类</h2> |
| 28 | <p>商品房转移买卖转移登记</p> | 27 | <p>商品房转移买卖转移登记</p> |
| 29 | </div> | 28 | </div> |
| 30 | <ul class="app_progress"> | 29 | <div class="progressBar"> |
| 31 | <li class="selected"> | 30 | <ul class="app_progress" id="app_progress"> |
| 32 | <span>1</span> | ||
| 33 | 信息效验 | ||
| 34 | </li> | ||
| 35 | <div class="line"></div> | ||
| 36 | <li class="selected"> | ||
| 37 | <span>2</span> | ||
| 38 | 填报信息 | ||
| 39 | </li> | ||
| 40 | <div class="line"></div> | ||
| 41 | <li class="active"> | ||
| 42 | <span>3</span> | ||
| 43 | 完税核税 | ||
| 44 | </li> | ||
| 45 | <div class="line"></div> | ||
| 46 | <li> | ||
| 47 | <span>4</span> | ||
| 48 | 身份认证 | ||
| 49 | </li> | ||
| 50 | <div class="line"></div> | ||
| 51 | <li> | ||
| 52 | <span>5</span> | ||
| 53 | 资料审核 | ||
| 54 | </li> | ||
| 55 | <div class="line"></div> | ||
| 56 | <li> | ||
| 57 | <span>6</span> | ||
| 58 | 线上缴费 | ||
| 59 | </li> | ||
| 60 | <div class="line"></div> | ||
| 61 | <li> | ||
| 62 | <span>7</span> | ||
| 63 | 生成电子证书 | ||
| 64 | </li> | ||
| 65 | </ul> | 31 | </ul> |
| 32 | </div> | ||
| 66 | <div class="query_results"> | 33 | <div class="query_results"> |
| 67 | <!-- <div class="no_info"> | 34 | <!-- <div class="no_info"> |
| 68 | <h2>温馨提示:未检测到完税信息!</h2> | 35 | <h2>温馨提示:未检测到完税信息!</h2> |
| ... | @@ -198,5 +165,39 @@ | ... | @@ -198,5 +165,39 @@ |
| 198 | <script type="text/javascript" src="../staticJs/common.js"></script> | 165 | <script type="text/javascript" src="../staticJs/common.js"></script> |
| 199 | <script type="text/javascript" src="../staticJs/down.js"></script> | 166 | <script type="text/javascript" src="../staticJs/down.js"></script> |
| 200 | <script type="text/javascript" src="../staticJs/yyws.js"></script> | 167 | <script type="text/javascript" src="../staticJs/yyws.js"></script> |
| 201 | 168 | <script id="progress" type="text/html"> | |
| 169 | {{# layui.each(d.progressList, function(index, item){ }} | ||
| 170 | {{# if(item.stepState==2){ }} | ||
| 171 | <li class="item_proress"> | ||
| 172 | <p class="active"></p> | ||
| 173 | <h5>{{item.stepName}}</h5> | ||
| 174 | </li> | ||
| 175 | <li class="layui-progress"> | ||
| 176 | <div class="layui-progress-bar" lay-percent="100%"></div> | ||
| 177 | </li> | ||
| 178 | {{# } }} | ||
| 179 | {{# if(item.stepState==1){ }} | ||
| 180 | <li class="item_proress"> | ||
| 181 | <p class="active"></p> | ||
| 182 | <h5>{{item.stepName}}</h5> | ||
| 183 | </li> | ||
| 184 | {{# if(index!=(d.progressList.length-1)){ }} | ||
| 185 | <li class="layui-progress"> | ||
| 186 | <div class="layui-progress-bar" lay-percent="50%"></div> | ||
| 187 | </li> | ||
| 188 | {{# } }} | ||
| 189 | {{# } }} | ||
| 190 | {{# if(item.stepState==0){ }} | ||
| 191 | <li class="item_proress"> | ||
| 192 | <p></p> | ||
| 193 | <h5>{{item.stepName}}</h5> | ||
| 194 | </li> | ||
| 195 | {{# if(index!=(d.progressList.length-1)){ }} | ||
| 196 | <li class="layui-progress"> | ||
| 197 | <div class="layui-progress-bar" lay-percent="0%"></div> | ||
| 198 | </li> | ||
| 199 | {{# } }} | ||
| 200 | {{# } }} | ||
| 201 | {{# }); }} | ||
| 202 | </script> | ||
| 202 | </html> | 203 | </html> |
| ... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
| 1 | <!DOCTYPE html | 1 | <!DOCTYPE html |
| 2 | PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | 2 | PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| 3 | <html xmlns="http://www.w3.org/1999/xhtml"> | 3 | <html xmlns="http://www.w3.org/1999/xhtml"> |
| 4 | |||
| 5 | <head> | 4 | <head> |
| 6 | <style> | 5 | <style> |
| 7 | </style> | 6 | </style> |
| ... | @@ -236,5 +235,4 @@ | ... | @@ -236,5 +235,4 @@ |
| 236 | {{# } }} | 235 | {{# } }} |
| 237 | {{# }); }} | 236 | {{# }); }} |
| 238 | </script> | 237 | </script> |
| 239 | |||
| 240 | </html> | 238 | </html> |
| ... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
-
Please register or sign in to post a comment