4c91d1e6 by 任超

style:进度条

1 parent de128b7e
1 $(function () { 1 $(function () {
2 layui.use('element', function () { 2 layui.use('element', function () {
3 let element = layui.element; //导航的hover效果、二级菜单等功能,需要依赖element模块 3 let element = layui.element;
4 }); 4 });
5 addTabs('#wssq') 5 addTabs('#wssq')
6 // 业务 6 // 业务
...@@ -20,29 +20,35 @@ $(function () { ...@@ -20,29 +20,35 @@ $(function () {
20 }, 20 },
21 { 21 {
22 name: "身份认证", 22 name: "身份认证",
23 isActive: 0 23 isActive: 1
24 }, 24 },
25 { 25 {
26 name: "资料审核", 26 name: "资料审核",
27 isActive: 0 27 isActive: 1
28 }, 28 },
29 { 29 {
30 name: "线上缴费", 30 name: "线上缴费",
31 isActive: 0 31 isActive: 1
32 }, 32 },
33 { 33 {
34 name: "生成电子证书", 34 name: "生成电子证书",
35 isActive: 0 35 isActive: 2
36 } 36 }
37 ], 37 ],
38 } 38 }
39 39
40 // layui.use('laytpl', function () { 40 layui.use('laytpl', function () {
41 // laytpl = layui.laytpl; 41 laytpl = layui.laytpl;
42 // var getTpl = document.getElementById('progress').innerHTML 42 var getTpl = document.getElementById('progress').innerHTML
43 // , view = document.getElementById('app_progress'); 43 , view = document.getElementById('app_progress');
44 // laytpl(getTpl).render(data, function (html) { 44 laytpl(getTpl).render(data, function (html) {
45 // view.innerHTML = html; 45 view.innerHTML = html;
46 // }); 46 });
47 // }); 47
48 layui.use(['element'], function () {
49 var element = layui.element;
50 //初始化动态元素,一些动态生成的元素如果不设置初始化,将不会有默认的动态效果
51 element.init();
52 });
53 });
48 }) 54 })
......
...@@ -29,52 +29,6 @@ ...@@ -29,52 +29,6 @@
29 </div> 29 </div>
30 <div class="progressBar"> 30 <div class="progressBar">
31 <ul class="app_progress" id="app_progress"> 31 <ul class="app_progress" id="app_progress">
32 <li class="item_proress">
33 <p class="active"></p>
34 <h5>信息效验</h5>
35 </li>
36 <li class="layui-progress">
37 <div class="layui-progress-bar" lay-percent="100%"></div>
38 </li>
39 <li class="item_proress">
40 <p class="active"></p>
41 <h5>填报信息</h5>
42 </li>
43 <li class="layui-progress">
44 <div class="layui-progress-bar" lay-percent="100%"></div>
45 </li>
46 <li class="item_proress">
47 <p class="active"></p>
48 <h5>信息效验</h5>
49 </li>
50 <li class="layui-progress">
51 <div class="layui-progress-bar" lay-percent="100%"></div>
52 </li>
53 <li class="item_proress">
54 <p class="active"></p>
55 <h5>信息效验</h5>
56 </li>
57 <li class="layui-progress">
58 <div class="layui-progress-bar" lay-percent="100%"></div>
59 </li>
60 <li class="item_proress">
61 <p class="active"></p>
62 <h5>信息效验</h5>
63 </li>
64 <li class="layui-progress">
65 <div class="layui-progress-bar" lay-percent="100%"></div>
66 </li>
67 <li class="item_proress">
68 <p class="active"></p>
69 <h5>信息效验</h5>
70 </li>
71 <li class="layui-progress">
72 <div class="layui-progress-bar" lay-percent="100%"></div>
73 </li>
74 <li class="item_proress">
75 <p class="active"></p>
76 <h5>信息效验</h5>
77 </li>
78 </ul> 32 </ul>
79 </div> 33 </div>
80 <div class="certificate_list"> 34 <div class="certificate_list">
...@@ -174,18 +128,36 @@ ...@@ -174,18 +128,36 @@
174 <script id="progress" type="text/html"> 128 <script id="progress" type="text/html">
175 {{# layui.each(d.progressList, function(index, item){ }} 129 {{# layui.each(d.progressList, function(index, item){ }}
176 {{# if(item.isActive==1){ }} 130 {{# if(item.isActive==1){ }}
177 <li> 131 <li class="item_proress">
178 <p class="active"></p> 132 <p class="active"></p>
179 <h5>{{item.name}}</h5> 133 <h5>{{item.name}}</h5>
180 </li> 134 </li>
135 <li class="layui-progress">
136 <div class="layui-progress-bar" lay-percent="100%"></div>
137 </li>
138 {{# } }}
139 {{# if(item.isActive==2){ }}
140 <li class="item_proress">
141 <p class="active"></p>
142 <h5>{{item.name}}</h5>
143 </li>
144 {{# if(index!=(d.progressList.length-1)){ }}
145 <li class="layui-progress">
146 <div class="layui-progress-bar" lay-percent="50%"></div>
147 </li>
148 {{# } }}
181 {{# } }} 149 {{# } }}
182 {{# if(item.isActive==0){ }} 150 {{# if(item.isActive==0){ }}
183 <li> 151 <li class="item_proress">
184 <p></p> 152 <p></p>
185 <h5>{{item.name}}</h5> 153 <h5>{{item.name}}</h5>
186 </li> 154 </li>
155 {{# if(index!=(d.progressList.length-1)){ }}
156 <li class="layui-progress">
157 <div class="layui-progress-bar" lay-percent="0%"></div>
158 </li>
159 {{# } }}
187 {{# } }} 160 {{# } }}
188 {{# }); }} 161 {{# }); }}
189 </script> 162 </script>
190
191 </html> 163 </html>
...\ No newline at end of file ...\ No newline at end of file
......