style:样式
Showing
6 changed files
with
259 additions
and
140 deletions
... | @@ -8,35 +8,52 @@ $(function () { | ... | @@ -8,35 +8,52 @@ $(function () { |
8 | }); | 8 | }); |
9 | addTabs('#wssq') | 9 | addTabs('#wssq') |
10 | // 业务 | 10 | // 业务 |
11 | $('.feachBtn').click(function () { | 11 | // 业务 |
12 | var tel = $("#tel").val(); | 12 | var data = { |
13 | //正则表达式 | 13 | 'progressList': [ |
14 | var reg = /(1[3-9]\d{9}$)/; | 14 | { |
15 | if (!reg.test(tel)) { | 15 | stepName: "信息效验", |
16 | layui.use('layer', function(){ | 16 | stepState: 2 //0:未办理 1:正在办理 2:已办理 |
17 | var layer = layui.layer; | 17 | }, |
18 | layer.msg("请输入正确格式的手机号码", { | 18 | { |
19 | icon: 5 | 19 | stepName: "填报信息", |
20 | }); | 20 | stepState: 2 |
21 | }); | 21 | }, |
22 | return false; | 22 | { |
23 | } else { | 23 | stepName: "完税核税", |
24 | let count = 5; | 24 | stepState: 2 |
25 | $('.feachBtn').attr('disabled', true); | 25 | }, |
26 | $('.feachBtn').css({ | 26 | { |
27 | background: '#eee', | 27 | stepName: "身份认证", |
28 | color: '#707070', | 28 | stepState: 1 |
29 | }); | 29 | }, |
30 | count--; | 30 | { |
31 | countDown = setInterval(() => { | 31 | stepName: "资料审核", |
32 | count--; | 32 | stepState: 0 |
33 | $('.feachBtn').text(count + '秒后可重新获取'); | 33 | }, |
34 | if (count === 0) { | 34 | { |
35 | $('.feachBtn').text('重新发送').removeAttr('disabled'); | 35 | stepName: "线上缴费", |
36 | clearInterval(countDown); | 36 | stepState: 0 |
37 | } | 37 | }, |
38 | }, 1000); | 38 | { |
39 | $('.feachBtn').text(count + '秒后可重新获取'); | 39 | stepName: "生成电子证书", |
40 | } | 40 | stepState: 0 |
41 | }) | 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 | }); | ||
42 | }) | 59 | }) | ... | ... |
... | @@ -4,4 +4,51 @@ $(function () { | ... | @@ -4,4 +4,51 @@ $(function () { |
4 | }); | 4 | }); |
5 | addTabs('#wssq') | 5 | addTabs('#wssq') |
6 | // 业务 | 6 | // 业务 |
7 | var data = { | ||
8 | 'progressList': [ | ||
9 | { | ||
10 | stepName: "信息效验", | ||
11 | stepState: 2 //0:未办理 1:正在办理 2:已办理 | ||
12 | }, | ||
13 | { | ||
14 | stepName: "填报信息", | ||
15 | stepState: 2 | ||
16 | }, | ||
17 | { | ||
18 | stepName: "完税核税", | ||
19 | stepState: 2 | ||
20 | }, | ||
21 | { | ||
22 | stepName: "身份认证", | ||
23 | stepState: 2 | ||
24 | }, | ||
25 | { | ||
26 | stepName: "资料审核", | ||
27 | stepState: 2 | ||
28 | }, | ||
29 | { | ||
30 | stepName: "线上缴费", | ||
31 | stepState: 1 | ||
32 | }, | ||
33 | { | ||
34 | stepName: "生成电子证书", | ||
35 | stepState: 0 | ||
36 | } | ||
37 | ], | ||
38 | } | ||
39 | |||
40 | layui.use('laytpl', function () { | ||
41 | laytpl = layui.laytpl; | ||
42 | var getTpl = document.getElementById('progress').innerHTML | ||
43 | , view = document.getElementById('app_progress'); | ||
44 | laytpl(getTpl).render(data, function (html) { | ||
45 | view.innerHTML = html; | ||
46 | }); | ||
47 | |||
48 | layui.use(['element'], function () { | ||
49 | var element = layui.element; | ||
50 | //初始化动态元素,一些动态生成的元素如果不设置初始化,将不会有默认的动态效果 | ||
51 | element.init(); | ||
52 | }); | ||
53 | }); | ||
7 | }) | 54 | }) |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -8,4 +8,51 @@ $(function () { | ... | @@ -8,4 +8,51 @@ $(function () { |
8 | }); | 8 | }); |
9 | addTabs('#wssq') | 9 | addTabs('#wssq') |
10 | // 业务 | 10 | // 业务 |
11 | var data = { | ||
12 | 'progressList': [ | ||
13 | { | ||
14 | stepName: "信息效验", | ||
15 | stepState: 2 //0:未办理 1:正在办理 2:已办理 | ||
16 | }, | ||
17 | { | ||
18 | stepName: "填报信息", | ||
19 | stepState: 2 | ||
20 | }, | ||
21 | { | ||
22 | stepName: "完税核税", | ||
23 | stepState: 2 | ||
24 | }, | ||
25 | { | ||
26 | stepName: "身份认证", | ||
27 | stepState: 2 | ||
28 | }, | ||
29 | { | ||
30 | stepName: "资料审核", | ||
31 | stepState: 1 | ||
32 | }, | ||
33 | { | ||
34 | stepName: "线上缴费", | ||
35 | stepState: 0 | ||
36 | }, | ||
37 | { | ||
38 | stepName: "生成电子证书", | ||
39 | stepState: 0 | ||
40 | } | ||
41 | ], | ||
42 | } | ||
43 | |||
44 | layui.use('laytpl', function () { | ||
45 | laytpl = layui.laytpl; | ||
46 | var getTpl = document.getElementById('progress').innerHTML | ||
47 | , view = document.getElementById('app_progress'); | ||
48 | laytpl(getTpl).render(data, function (html) { | ||
49 | view.innerHTML = html; | ||
50 | }); | ||
51 | |||
52 | layui.use(['element'], function () { | ||
53 | var element = layui.element; | ||
54 | //初始化动态元素,一些动态生成的元素如果不设置初始化,将不会有默认的动态效果 | ||
55 | element.init(); | ||
56 | }); | ||
57 | }); | ||
11 | }) | 58 | }) | ... | ... |
... | @@ -27,43 +27,10 @@ | ... | @@ -27,43 +27,10 @@ |
27 | <h2>转移类</h2> | 27 | <h2>转移类</h2> |
28 | <p>商品房转移买卖转移登记</p> | 28 | <p>商品房转移买卖转移登记</p> |
29 | </div> | 29 | </div> |
30 | <ul class="app_progress"> | 30 | <div class="progressBar"> |
31 | <li class="selected"> | 31 | <ul class="app_progress" id="app_progress"> |
32 | <span>1</span> | 32 | </ul> |
33 | 信息效验 | 33 | </div> |
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="selected"> | ||
42 | <span>3</span> | ||
43 | 完税核税 | ||
44 | </li> | ||
45 | <div class="line"></div> | ||
46 | <li class="active"> | ||
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> | ||
66 | |||
67 | <div class="info_query"> | 34 | <div class="info_query"> |
68 | <div class="nav_title"> | 35 | <div class="nav_title"> |
69 | <h2>买方</h2> | 36 | <h2>买方</h2> |
... | @@ -82,4 +49,39 @@ | ... | @@ -82,4 +49,39 @@ |
82 | <script type="text/javascript" src="../staticJs/common.js"></script> | 49 | <script type="text/javascript" src="../staticJs/common.js"></script> |
83 | <script type="text/javascript" src="../staticJs/down.js"></script> | 50 | <script type="text/javascript" src="../staticJs/down.js"></script> |
84 | <script type="text/javascript" src="../staticJs/sfrz.js"></script> | 51 | <script type="text/javascript" src="../staticJs/sfrz.js"></script> |
52 | <script id="progress" type="text/html"> | ||
53 | {{# layui.each(d.progressList, function(index, item){ }} | ||
54 | {{# if(item.stepState==2){ }} | ||
55 | <li class="item_proress"> | ||
56 | <p class="active"></p> | ||
57 | <h5>{{item.stepName}}</h5> | ||
58 | </li> | ||
59 | <li class="layui-progress"> | ||
60 | <div class="layui-progress-bar" lay-percent="100%"></div> | ||
61 | </li> | ||
62 | {{# } }} | ||
63 | {{# if(item.stepState==1){ }} | ||
64 | <li class="item_proress"> | ||
65 | <p class="active"></p> | ||
66 | <h5>{{item.stepName}}</h5> | ||
67 | </li> | ||
68 | {{# if(index!=(d.progressList.length-1)){ }} | ||
69 | <li class="layui-progress"> | ||
70 | <div class="layui-progress-bar" lay-percent="50%"></div> | ||
71 | </li> | ||
72 | {{# } }} | ||
73 | {{# } }} | ||
74 | {{# if(item.stepState==0){ }} | ||
75 | <li class="item_proress"> | ||
76 | <p></p> | ||
77 | <h5>{{item.stepName}}</h5> | ||
78 | </li> | ||
79 | {{# if(index!=(d.progressList.length-1)){ }} | ||
80 | <li class="layui-progress"> | ||
81 | <div class="layui-progress-bar" lay-percent="0%"></div> | ||
82 | </li> | ||
83 | {{# } }} | ||
84 | {{# } }} | ||
85 | {{# }); }} | ||
86 | </script> | ||
85 | </html> | 87 | </html> |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -27,42 +27,10 @@ | ... | @@ -27,42 +27,10 @@ |
27 | <h2>转移类</h2> | 27 | <h2>转移类</h2> |
28 | <p>商品房转移买卖转移登记</p> | 28 | <p>商品房转移买卖转移登记</p> |
29 | </div> | 29 | </div> |
30 | <ul class="app_progress"> | 30 | <div class="progressBar"> |
31 | <li class="selected"> | 31 | <ul class="app_progress" id="app_progress"> |
32 | <span>1</span> | 32 | </ul> |
33 | 信息效验 | 33 | </div> |
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="selected"> | ||
42 | <span>3</span> | ||
43 | 完税核税 | ||
44 | </li> | ||
45 | <div class="line"></div> | ||
46 | <li class="selected"> | ||
47 | <span>4</span> | ||
48 | 身份认证 | ||
49 | </li> | ||
50 | <div class="line"></div> | ||
51 | <li class="selected"> | ||
52 | <span>5</span> | ||
53 | 资料审核 | ||
54 | </li> | ||
55 | <div class="line"></div> | ||
56 | <li class="active"> | ||
57 | <span>6</span> | ||
58 | 线上缴费 | ||
59 | </li> | ||
60 | <div class="line"></div> | ||
61 | <li> | ||
62 | <span>7</span> | ||
63 | 生成电子证书 | ||
64 | </li> | ||
65 | </ul> | ||
66 | <!-- ------------------开始支付----------------- --> | 34 | <!-- ------------------开始支付----------------- --> |
67 | <div class="audit_progress"> | 35 | <div class="audit_progress"> |
68 | <h2>您的申请已提交,工作人员会在15个工作日内完成审核!</h2> | 36 | <h2>您的申请已提交,工作人员会在15个工作日内完成审核!</h2> |
... | @@ -146,4 +114,39 @@ | ... | @@ -146,4 +114,39 @@ |
146 | <script type="text/javascript" src="../staticJs/common.js"></script> | 114 | <script type="text/javascript" src="../staticJs/common.js"></script> |
147 | <script type="text/javascript" src="../staticJs/down.js"></script> | 115 | <script type="text/javascript" src="../staticJs/down.js"></script> |
148 | <script type="text/javascript" src="../staticJs/xsjf.js"></script> | 116 | <script type="text/javascript" src="../staticJs/xsjf.js"></script> |
117 | <script id="progress" type="text/html"> | ||
118 | {{# layui.each(d.progressList, function(index, item){ }} | ||
119 | {{# if(item.stepState==2){ }} | ||
120 | <li class="item_proress"> | ||
121 | <p class="active"></p> | ||
122 | <h5>{{item.stepName}}</h5> | ||
123 | </li> | ||
124 | <li class="layui-progress"> | ||
125 | <div class="layui-progress-bar" lay-percent="100%"></div> | ||
126 | </li> | ||
127 | {{# } }} | ||
128 | {{# if(item.stepState==1){ }} | ||
129 | <li class="item_proress"> | ||
130 | <p class="active"></p> | ||
131 | <h5>{{item.stepName}}</h5> | ||
132 | </li> | ||
133 | {{# if(index!=(d.progressList.length-1)){ }} | ||
134 | <li class="layui-progress"> | ||
135 | <div class="layui-progress-bar" lay-percent="50%"></div> | ||
136 | </li> | ||
137 | {{# } }} | ||
138 | {{# } }} | ||
139 | {{# if(item.stepState==0){ }} | ||
140 | <li class="item_proress"> | ||
141 | <p></p> | ||
142 | <h5>{{item.stepName}}</h5> | ||
143 | </li> | ||
144 | {{# if(index!=(d.progressList.length-1)){ }} | ||
145 | <li class="layui-progress"> | ||
146 | <div class="layui-progress-bar" lay-percent="0%"></div> | ||
147 | </li> | ||
148 | {{# } }} | ||
149 | {{# } }} | ||
150 | {{# }); }} | ||
151 | </script> | ||
149 | </html> | 152 | </html> |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -27,42 +27,10 @@ | ... | @@ -27,42 +27,10 @@ |
27 | <h2>转移类</h2> | 27 | <h2>转移类</h2> |
28 | <p>商品房转移买卖转移登记</p> | 28 | <p>商品房转移买卖转移登记</p> |
29 | </div> | 29 | </div> |
30 | <ul class="app_progress"> | 30 | <div class="progressBar"> |
31 | <li class="selected"> | 31 | <ul class="app_progress" id="app_progress"> |
32 | <span>1</span> | 32 | </ul> |
33 | 信息效验 | 33 | </div> |
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="selected"> | ||
42 | <span>3</span> | ||
43 | 完税核税 | ||
44 | </li> | ||
45 | <div class="line"></div> | ||
46 | <li class="selected"> | ||
47 | <span>4</span> | ||
48 | 身份认证 | ||
49 | </li> | ||
50 | <div class="line"></div> | ||
51 | <li class="active"> | ||
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> | ||
66 | <div class="audit_progress"> | 34 | <div class="audit_progress"> |
67 | <h2>您的申请已提交,工作人员会在15个工作日内完成审核!</h2> | 35 | <h2>您的申请已提交,工作人员会在15个工作日内完成审核!</h2> |
68 | <p> | 36 | <p> |
... | @@ -158,4 +126,39 @@ | ... | @@ -158,4 +126,39 @@ |
158 | <script type="text/javascript" src="../staticJs/common.js"></script> | 126 | <script type="text/javascript" src="../staticJs/common.js"></script> |
159 | <script type="text/javascript" src="../staticJs/down.js"></script> | 127 | <script type="text/javascript" src="../staticJs/down.js"></script> |
160 | <script type="text/javascript" src="../staticJs/zlsh.js"></script> | 128 | <script type="text/javascript" src="../staticJs/zlsh.js"></script> |
129 | <script id="progress" type="text/html"> | ||
130 | {{# layui.each(d.progressList, function(index, item){ }} | ||
131 | {{# if(item.stepState==2){ }} | ||
132 | <li class="item_proress"> | ||
133 | <p class="active"></p> | ||
134 | <h5>{{item.stepName}}</h5> | ||
135 | </li> | ||
136 | <li class="layui-progress"> | ||
137 | <div class="layui-progress-bar" lay-percent="100%"></div> | ||
138 | </li> | ||
139 | {{# } }} | ||
140 | {{# if(item.stepState==1){ }} | ||
141 | <li class="item_proress"> | ||
142 | <p class="active"></p> | ||
143 | <h5>{{item.stepName}}</h5> | ||
144 | </li> | ||
145 | {{# if(index!=(d.progressList.length-1)){ }} | ||
146 | <li class="layui-progress"> | ||
147 | <div class="layui-progress-bar" lay-percent="50%"></div> | ||
148 | </li> | ||
149 | {{# } }} | ||
150 | {{# } }} | ||
151 | {{# if(item.stepState==0){ }} | ||
152 | <li class="item_proress"> | ||
153 | <p></p> | ||
154 | <h5>{{item.stepName}}</h5> | ||
155 | </li> | ||
156 | {{# if(index!=(d.progressList.length-1)){ }} | ||
157 | <li class="layui-progress"> | ||
158 | <div class="layui-progress-bar" lay-percent="0%"></div> | ||
159 | </li> | ||
160 | {{# } }} | ||
161 | {{# } }} | ||
162 | {{# }); }} | ||
163 | </script> | ||
161 | </html> | 164 | </html> |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
-
Please register or sign in to post a comment