e9b92907 by 任超

chore:文件夹结构的变化

1 parent 67dacb75
1 .content_box {
2 width: 1200px;
3 margin: 0 auto;
4 }
...\ No newline at end of file ...\ No newline at end of file
1 /* ----------------------公共样式-------------------------- */
2 .contentBox {
3 width: 1200px;
4 margin: 0 auto;
5 overflow: hidden;
6 }
7 .business_guide {
8 overflow-x: hidden;
9 }
10 .titleActive {
11 color: #006CFF;
12 font-weight: 600;
13 }
14 /* ------------------------------end--------------------------------------- */
15
16 .navigation_crumbs {
17 width: 100%;
18 height: 45px;
19 padding: 10px 0;
20 background: #FAFAFA;
21 border: 1px solid #E6E6E6;
22 }
23 .navigation_crumbs .layui-breadcrumb a:hover {
24 color: #0091FF!important;
25 }
26 /* --------------------导航tab------------------------- */
27 .one_content {
28 border: 1px solid #DEDEDE;;
29 margin-top: 20px!important;
30 }
31 .one_content .layui-tab {
32 margin: -1px;
33 }
34 .one_content .layui-tab-title li {
35 width: 150px;
36 font-weight: 600;
37 color: #6D7278;
38 }
39 .one_content .layui-tab-title .layui-this {
40 color: #4A4A4A;
41 }
42 .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after {
43 border-color: #006CFF;
44 }
45 .layui-tab .layui-tab-brief .layui-this {
46 color: #006CFF;
47 }
48 .layui-tab .layui-tab-brief li {
49 width: 90px;
50 }
51 .online_business {
52 margin-top: 20px;
53 }
54 .online_business h2 {
55 width: 100%;
56 height: 43px;
57 line-height: 43px;
58 background: #FAFAFA;
59 border-radius: 4px;
60 border: 1px solid #DEDEDE;
61 padding-left: 15px;
62 box-sizing: border-box;
63 }
64 .online_list {
65 padding-bottom: 20px;
66 overflow: hidden;
67 }
68 .online_list li{
69 width: 45%!important;
70 float: left;
71 height: 60px;
72 line-height: 60px;
73 border-bottom: 1px dotted #DEDEDE;
74 }
75 .online_list li:nth-child(even) {
76 margin-left: 10%;
77 }
78 .online_list li a{
79 display: block;
80 width: 100%;
81 }
82 .online_list li a:hover span{
83 color: #0091FF;
84 }
85 .online_list li a button {
86 float: right;
87 margin-top: 15px;
88 }
...\ No newline at end of file ...\ No newline at end of file
1 div.subject h2 a:hover {
2 color: #0091FF;
3 }
4
5 div.subject {
6 margin: 0 auto;
7 float: none;
8 clear: both;
9 position: relative;
10 min-width: 1200px;
11 }
12 .contentBox {
13 width: 1200px;
14 margin: 0 auto;
15 overflow: hidden;
16 padding-bottom: 0!important;
17 }
18
19 .one_content {
20 border: 1px solid #DEDEDE;;
21 margin-top: 30px;
22 }
23
24 .one_content .layui-tab {
25 margin: 0;
26 }
27
28 .one_content .layui-tab-title li {
29 width: 100px;
30 font-weight: 600;
31 color: #6D7278;
32 }
33
34 .one_content .layui-tab-title .layui-this {
35 color: #4A4A4A;
36 }
37
38 .layui-tab-brief > .layui-tab-more li.layui-this:after, .layui-tab-brief > .layui-tab-title .layui-this:after {
39 border-color: #006CFF;
40 }
41
42 .layui-tab .layui-tab-brief .layui-this {
43 color: #006CFF;
44 }
45
46 .layui-tab .layui-tab-brief li {
47 width: 90px;
48 }
49
50 .online_business {
51 margin-top: 20px;
52 }
53
54 .online_business h2 {
55 width: 100%;
56 height: 43px;
57 line-height: 43px;
58 background: #FAFAFA;
59 border-radius: 4px;
60 border: 1px solid #DEDEDE;
61 padding-left: 15px;
62 box-sizing: border-box;
63 }
64
65 .online_list {
66 padding-bottom: 20px;
67 overflow: hidden;
68 }
69
70 .online_list li {
71 width: 45% !important;
72 float: left;
73 height: 60px;
74 line-height: 60px;
75 border-bottom: 1px dotted #DEDEDE;
76 }
77
78 .online_list li:nth-child(even) {
79 margin-left: 10%;
80 }
81
82 .online_list li a {
83 display: block;
84 width: 100%;
85 }
86
87 .online_list li a:hover span {
88 color: #0091FF;
89 }
90
91 .online_list li a button {
92 float: right;
93 margin-top: 15px;
94 }
95
96 /* ---------------------------------------------------- */
97 .leftandright {
98 width: 1200px;
99 margin: 0 auto;
100 overflow: hidden;
101 min-height:calc(100vh - 207px);
102 }
103 .right {
104 width: 400px;
105 }
106
107 .left, .right {
108 float: left;
109 }
110
111 .xw {
112 display: block;
113 padding-top: 10px;
114 height: 150px;
115 cursor: pointer;
116 }
117
118 .xw-left {
119 margin-right: 20px;
120 }
121
122 .xw-left img {
123 width: 200px;
124 height: 125px;
125 background: #D8D8D8;
126 }
127
128 .xw-left, .xw-right {
129 float: left;
130 }
131
132 .xw-right {
133 padding-right: 10px;
134 }
135 .leftContainer{
136 border-right: 1px solid #DEDEDE;
137 margin-top: 41px;
138 }
139 .leftContainer li:last-child{
140 border-bottom: 1px solid #DEDEDE;
141 }
142 .left-top {
143 width: 408px;
144 height: 18px;
145 font-size: 18px;
146 font-weight: bold;
147 color: #4A4A4A;
148 line-height: 18px;
149 cursor: pointer;
150 }
151 .left-top:hover {
152 color: #4A4A4A;
153 }
154
155 .left-body {
156 width: 687px;
157 height: 60px;
158 font-size: 14px;
159 font-family: PingFangSC-Regular, PingFang SC;
160 font-weight: 400;
161 color: #6D7278;
162 line-height: 21px;
163 }
164
165 .left-buttom {
166 overflow: hidden;
167 color: #9B9B9B;
168 padding-top: 20px;
169 }
170 .left-buttom .icon{
171 width: 36px;
172 height: 24px;
173 position: relative;
174 top: 6px;
175 }
176 .left-buttom div:nth-child(2) {
177 margin-left: 60px;
178 }
179
180 .left-buttom div {
181 float: left;
182 line-height: 57px
183 }
184 .left-buttom-date {
185 line-height: 57px;
186 float: right !important;
187 margin-right: 20px;
188 }
189
190 #page {
191 margin-top: 20px;
192 text-align: center;
193 }
194
195 .right {
196 width: 200px;
197 margin-top: 36px;
198 margin-left: 15px;
199 }
200
201 .right-top {
202 height: 18px;
203 font-size: 18px;
204 font-weight: 500;
205 color: #4A4A4A;
206 line-height: 18px;
207 }
208 .right-top h2 {
209 font-weight: 600;
210 cursor: pointer;
211 }
212
213 .right-body {
214 display: inline-block;
215 margin-bottom: 20px;
216 }
217
218
219 .tj img {
220 width: 200px;
221 height: 125px;
222 margin-top: 20px;
223 }
224
225 .tj img, .tj span {
226 float: left;
227 }
228
229 .tj-title {
230 width: 203px;
231 font-size: 14px;
232 font-weight: bold;
233 color: #4A4A4A;
234 line-height: 21px;
235 }
236
237 .tj-date {
238 width: 90px;
239 height: 12px;
240 font-size: 12px;
241 font-weight: 400;
242 color: #9B9B9B;
243 line-height: 12px;
244 }
245
246 .right-bottom {
247 border-top: 1px solid #DEDEDE;
248 }
249
250 .right-bottom-top {
251 width: 108px;
252 height: 18px;
253 font-size: 18px;
254 margin-top: 20px;
255 font-weight: bold;
256 color: #4A4A4A;
257 line-height: 18px;
258 }
259
260 .zcfg {
261 margin-top: 20px;
262 display: inline-block;
263 }
264
265 .zcfg div {
266 float: left;
267 }
268
269 .zcfg-top {
270 width: 200px;
271 height: 14px;
272 font-size: 14px;
273 font-weight: bold;
274 color: #4A4A4A;
275 line-height: 14px;
276 }
277
278 .zcfg-body {
279 width: 200px;
280 font-size: 14px;
281 display: inline-block;
282 font-weight: 400;
283 color: #6D7278;
284 line-height: 21px;
285 }
286
287 .zcfg-bottom {
288 width: 90px;
289 height: 12px;
290 font-size: 12px;
291 font-weight: 400;
292 color: #9B9B9B;
293 line-height: 12px;
294 }
1 * {
2 margin: 0;
3 padding: 0;
4 }
5
6 .main { 1 .main {
7 /* padding: 20px;
8 margin-left: 200px;
9 width: 1200px;
10 overflow: hidden;
11 margin: 0 auto;*/
12 overflow: hidden; 2 overflow: hidden;
13 } 3 }
14 4
15 /*================首页 start=====================*/
16 div a {
17 color: #4A4A4A;
18 text-decoration: none;
19 }
20
21 div.subject h2 a:hover { 5 div.subject h2 a:hover {
22 color: #0091FF; 6 color: #0091FF;
23 } 7 }
...@@ -120,6 +104,9 @@ div.subject { ...@@ -120,6 +104,9 @@ div.subject {
120 overflow: hidden; 104 overflow: hidden;
121 min-height:calc(100vh - 207px); 105 min-height:calc(100vh - 207px);
122 } 106 }
107 .leftandright .left {
108 width: 80%;
109 }
123 .right { 110 .right {
124 width: 400px; 111 width: 400px;
125 } 112 }
...@@ -154,7 +141,7 @@ div.subject { ...@@ -154,7 +141,7 @@ div.subject {
154 } 141 }
155 .leftContainer{ 142 .leftContainer{
156 border-right: 1px solid #DEDEDE; 143 border-right: 1px solid #DEDEDE;
157 margin-top: 41px; 144 margin-top: 28px;
158 } 145 }
159 .leftContainer li:last-child{ 146 .leftContainer li:last-child{
160 border-bottom: 1px solid #DEDEDE; 147 border-bottom: 1px solid #DEDEDE;
...@@ -173,19 +160,16 @@ div.subject { ...@@ -173,19 +160,16 @@ div.subject {
173 } 160 }
174 161
175 .left-body { 162 .left-body {
176 width: 687px;
177 height: 60px; 163 height: 60px;
178 font-size: 14px; 164 font-size: 14px;
179 font-family: PingFangSC-Regular, PingFang SC;
180 font-weight: 400; 165 font-weight: 400;
181 color: #6D7278; 166 color: #6D7278;
182 line-height: 21px; 167 line-height: 25px;
183 } 168 }
184 169
185 .left-buttom { 170 .left-buttom {
186 overflow: hidden; 171 overflow: hidden;
187 color: #9B9B9B; 172 color: #9B9B9B;
188 padding-top: 20px;
189 } 173 }
190 .left-buttom .icon{ 174 .left-buttom .icon{
191 width: 36px; 175 width: 36px;
...@@ -223,7 +207,7 @@ div.subject { ...@@ -223,7 +207,7 @@ div.subject {
223 font-size: 18px; 207 font-size: 18px;
224 font-weight: 500; 208 font-weight: 500;
225 color: #4A4A4A; 209 color: #4A4A4A;
226 line-height: 18px; 210 line-height: 0;
227 } 211 }
228 .right-top h2 { 212 .right-top h2 {
229 font-weight: 600; 213 font-weight: 600;
......
1 $(function () {
2 var title = undefined
3 var bus = undefined
4 layui.use('element', function () {
5 let element = layui.element; //导航的hover效果、二级菜单等功能,需要依赖element模块
6 //监听导航点击
7 element.on('nav(demo)', function (elem) {
8 layer.msg(elem.text());
9 });
10 });
11 addTabs('#wssq')
12 title = GetQueryString('title')
13 bus = GetQueryString('bus')
14 console.log(title, bus)
15 $('.name_title h2').text(title)
16 $('.name_title p').text(bus)
17 function GetQueryString(name) {
18 var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
19 var r = window.location.search.substr(1).match(reg);
20 if (r != null) return decodeURIComponent(r[2]);
21 return null;
22 }
23 })
...\ No newline at end of file ...\ No newline at end of file
...@@ -41,10 +41,10 @@ document.writeln(" </div>"); ...@@ -41,10 +41,10 @@ document.writeln(" </div>");
41 document.writeln(" <div class=\'navigation\'>"); 41 document.writeln(" <div class=\'navigation\'>");
42 document.writeln(" <ul class=\'layui-nav layui-bg-blue\' lay-filter=\'\'>"); 42 document.writeln(" <ul class=\'layui-nav layui-bg-blue\' lay-filter=\'\'>");
43 document.writeln(" <li id='index' class=\'layui-nav-item\'><a href=\'"+localhostPaht+"/index.html\' title=\'首页\'>首页</a></li>"); 43 document.writeln(" <li id='index' class=\'layui-nav-item\'><a href=\'"+localhostPaht+"/index.html\' title=\'首页\'>首页</a></li>");
44 document.writeln(" <li id='news' class=\'layui-nav-item\'><a href=\'"+localhostPaht+"/staticViews/xwdt/index.html\' title=\'新闻动态\'>新闻动态</a></li> "); 44 document.writeln(" <li id='news' class=\'layui-nav-item\'><a href=\'"+localhostPaht+"/staticViews/xwdt.html\' title=\'新闻动态\'>新闻动态</a></li> ");
45 document.writeln(" <li id='zcfg' class=\'layui-nav-item\'><a href=\'"+localhostPaht+"/staticViews/zcfg/index.html\' title=\'政策法规\'>政策法规</a></li>"); 45 document.writeln(" <li id='zcfg' class=\'layui-nav-item\'><a href=\'"+localhostPaht+"/staticViews/zcfg.html\' title=\'政策法规\'>政策法规</a></li>");
46 document.writeln(" <li id='bszn' class=\'layui-nav-item\'><a href=\'"+localhostPaht+"/staticViews/bszn/index.html\'>办事指南</a></li>"); 46 document.writeln(" <li id='bszn' class=\'layui-nav-item\'><a href=\'"+localhostPaht+"/staticViews/bszn.html\' title=\'办事指南\'>办事指南</a></li>");
47 document.writeln(" <li id='business' class=\'layui-nav-item\'><a href=\'\'>网上申请</a></li>"); 47 document.writeln(" <li id='wssq' class=\'layui-nav-item\'><a href=\'"+localhostPaht+"/staticViews/wssq/index.html\' title=\'网上申请\'>网上申请</a></li>");
48 document.writeln(" <li class=\'layui-nav-item\'>"); 48 document.writeln(" <li class=\'layui-nav-item\'>");
49 document.writeln(" <a href=\'javascript:;\'>查验中心</a>"); 49 document.writeln(" <a href=\'javascript:;\'>查验中心</a>");
50 document.writeln(" <dl class=\'layui-nav-child\'>"); 50 document.writeln(" <dl class=\'layui-nav-child\'>");
......
1 $(function () {
2 layui.use('element', function () {
3 let element = layui.element; //导航的hover效果、二级菜单等功能,需要依赖element模块
4 //监听导航点击
5 element.on('nav(demo)', function (elem) {
6 layer.msg(elem.text());
7 });
8 });
9 addTabs('#wssq')
10
11
12 // 业务
13 //config的设置是全局的
14 layui.config({
15 base: './js/'
16 }).extend({ //设定模块别名
17 common: 'common'
18 });
19
20 layui.use(['form', 'common'], function () {
21 var common = layui.common,
22 form = layui.form;
23 //三级地址联动
24 common.showCity('province', 'city');
25 //区域选择
26 form.on('select(selectCity)', function (data) {
27 return false;
28 });
29 });
30 })
...\ No newline at end of file ...\ No newline at end of file
1 <!DOCTYPE html
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">
4 <head>
5 <style>
6 </style>
7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
8 <title>立即办理-校验</title>
9 <script type="text/javascript" src="../staticJs/head.js"></script>
10 <link rel="stylesheet" type="text/css" href="../staticCss/bljy.css">
11 </head>
12 <body>
13 <div class="navigation_crumbs">
14 <div class="contentBox">
15 <span class="layui-breadcrumb">
16 <a href="../../index.html">首页</a>
17 <a href="../wssq/index.html">网上申请</a>
18 <a><cite>在线申请</cite></a>
19 </span>
20 </div>
21 <div class="content_box">
22 <div class="name_title">
23 <h2></h2>
24 <p></p>
25 </div>
26 </div>
27 </div>
28 </body>
29 <script type="text/javascript" src="../staticJs/common.js"></script>
30 <script type="text/javascript" src="../staticJs/down.js"></script>
31 <script type="text/javascript" src="../staticJs/bljy.js"></script>
32 </html>
...\ No newline at end of file ...\ No newline at end of file
1 .online_application {
2 min-height:calc(100vh - 196px);
3 width: 1200px;
4 margin: 0 auto;
5 padding: 20px 0;
6 }
7 .selectCity {
8 width: 1200px;
9 margin: 0 auto;
10 }
11 .selectCity h2 {
12 display: inline-block;
13 margin-right: 9px;
14 }
15 .area_list_content {
16 overflow: hidden;
17 margin-top: 20px;
18 width: 100%;
19 }
20 .area_list_content h2 {
21 display: inline-block;
22 float: left;
23 margin-right: 12px;
24 }
25 .selectCity .area_list {
26 width: 95%;
27 float: left;
28 }
29 .selectCity .area_list li {
30 display: inline-block;
31 width: 100px;
32 height: 32px;
33 border-radius: 3px;
34 background-color: #01AAED;
35 margin-right: 10px;
36 color: #fff;
37 text-align: center;
38 line-height: 32px;
39 margin-bottom: 10px;
40 cursor: pointer;
41 }
42 .selectCity .area_list li:hover {
43 background-color: #5FB878;
44 }
45 .active1 {
46 background-color: #5FB878!important;
47 }
48 .business {
49 padding: 15px;
50 box-sizing: border-box;
51 overflow: hidden;
52 margin-top: 10px;
53 }
54 .online_processing , .online_examination{
55 width: 49%;
56 background-color: #fff;
57 border-radius: 10px;
58 height: 300px;
59 box-sizing: border-box;
60 padding: 15px;
61 }
62 .list_title{
63 height: 36px;
64 line-height: 36px;
65 border-radius: 5px;
66 }
67 .list_title h2 {
68 margin-left: 10px;
69 }
70 .online_processing {
71 float: left;
72 }
73 .online_examination {
74 float: right;
75 }
76 .item_list li{
77 margin: 25px 0;
78 cursor: pointer;
79 }
80 .item_list li p{
81 display: inline-block;
82 }
83 .item_list li p:hover {
84 color: #0091FF;
85 }
86 .item_list .button{
87 float: right;
88 }
...\ No newline at end of file ...\ No newline at end of file
1 <!DOCTYPE html
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">
4 <head>
5 <style>
6 </style>
7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
8 <title>网上申请</title>
9 <script type="text/javascript" src="../../staticJs/head.js"></script>
10 <link rel="stylesheet" type="text/css" href="css/index.css">
11 </head>
12 <body>
13 <div class="navigation_crumbs">
14 <div class="contentBox">
15 <span class="layui-breadcrumb">
16 <a href="../../index.html">首页</a>
17 <a><cite>网上申请</cite></a>
18 </span>
19 </div>
20 </div>
21 <div class="online_application">
22 <div class="selectCity">
23 <form class="layui-form">
24 <h2 class="title"></h2>
25 <div class="layui-inline layui-select-default" style="margin-right: 10px;">
26 <select name="province" class="Pselected" data-area="浙江省"" lay-filter=" province">
27 <option value="">选择省</option>
28 </select>
29 </div>
30 <h2></h2>
31 <div class="layui-inline selected layui-select-default">
32 <select name="city" class="Cselected" data-area="杭州市" lay-filter="selectCity">
33 <option value="">选择市</option>
34 </select>
35 </div>
36 </form>
37 <div class="area_list_content">
38 <h2></h2>
39 <ul class="area_list">
40 <li>新城区</li>
41 <li>新城区</li>
42 <li>新城区</li>
43 <li>新城区</li>
44 <li>新城区</li>
45 <li>新城区</li>
46 <li>新城区</li>
47 <li>新城区</li>
48 <li>新城区</li>
49 <li>新城区</li>
50 <li>新城区</li>
51 <li>新城区</li>
52 <li>新城区</li>
53 <li>新城区</li>
54 <li>新城区</li>
55 </ul>
56 </div>
57 </div>
58 <!-- ------------业务办理--------------- -->
59 <div class="business layui-bg-gray">
60 <div class="online_processing">
61 <div class="list_title layui-bg-gray">
62 <h2>预告类</h2>
63 </div>
64 <ul class="item_list">
65 <li>
66 <p>预售商品房抵押登记</p>
67 <div class="button">
68 <button type="button" class="layui-btn layui-btn-normal layui-btn-sm">立即办理</button>
69 <button type="button" class="layui-btn layui-btn-primary layui-btn-sm">网上申请</button>
70 </div>
71 </li>
72 <li>
73 <p>商品房抵押登记</p>
74 <div class="button">
75 <button type="button" class="layui-btn layui-btn-normal layui-btn-sm">立即办理</button>
76 <button type="button" class="layui-btn layui-btn-primary layui-btn-sm">网上申请</button>
77 </div>
78 </li>
79 </ul>
80
81 <div class="list_title layui-bg-gray">
82 <h2>转移类</h2>
83 </div>
84 <ul class="item_list">
85 <li>
86 <p>商品房转移登记</p>
87 <div class="button">
88 <button type="button" class="layui-btn layui-btn-normal layui-btn-sm">立即办理</button>
89 <button type="button" class="layui-btn layui-btn-primary layui-btn-sm">网上申请</button>
90 </div>
91 </li>
92 </ul>
93 </div>
94 <div class="online_examination">
95 <div class="list_title layui-bg-gray">
96 <h2>预告类</h2>
97 </div>
98 <ul class="item_list">
99 <li>
100 <p>预售商品房抵押登记</p>
101 <div class="button">
102 <button type="button" class="layui-btn layui-btn-normal layui-btn-sm">
103 <a href='../bljy/index.html?title=预告类&bus=预售商品房抵押登记'>立即办理</a>
104 </button>
105 <button type="button" class="layui-btn layui-btn-primary layui-btn-sm">网上申请</button>
106 </div>
107 </li>
108 <li>
109 <p>商品房抵押登记</p>
110 <div class="button">
111 <button type="button" class="layui-btn layui-btn-normal layui-btn-sm">立即办理</button>
112 <button type="button" class="layui-btn layui-btn-primary layui-btn-sm">网上申请</button>
113 </div>
114 </li>
115 </ul>
116
117 <div class="list_title layui-bg-gray">
118 <h2>转移类</h2>
119 </div>
120 <ul class="item_list">
121 <li>
122 <p>商品房转移登记</p>
123 <div class="button">
124 <button type="button" class="layui-btn layui-btn-normal layui-btn-sm">立即办理</button>
125 <button type="button" class="layui-btn layui-btn-primary layui-btn-sm">网上申请</button>
126 </div>
127 </li>
128 </ul>
129 </div>
130 </div>
131 </div>
132 </body>
133 <script type="text/javascript" src="../../staticJs/common.js"></script>
134 <script type="text/javascript" src="../../staticJs/down.js"></script>
135 <script type="text/javascript" src="./js/city-picker.js"></script>
136 <script type="text/javascript" src="../../staticJs/bljy.js"></script>
137 </html>
...\ No newline at end of file ...\ No newline at end of file
This diff could not be displayed because it is too large.
1 /**
2 * @authors Mzong(mzong121491@gmail.com)
3 * @date 2019-01-18 11:15
4 * @requires layui
5 * @version $1.1.0$
6 */
7 layui.define("layer", function(exports){
8 //提示:模块也可以依赖其它模块,如:layui.define('layer', callback);
9 var $ = layui.jquery,
10 form = layui.form;
11 // 返回的对象
12 var returnObj = {
13 /**
14 * 省市县三级联动
15 *
16 * @param { string } [form] [form是layui.form对象]
17 * @param {string} [province] [省容器的name名字 ]
18 * eg:<select name="province">
19 * @param {string} [city] [省容器的name名字]
20 * @param {string} [district] [县容器的name名字]
21 * @return {undefined} [无返回值]
22 */
23 showCity: function(province, city, district) {
24 //AreaData是地址传过来的json对象
25 var AreaData = $.rawCitiesData;
26 // console.log(999, AreaData) // 接口请求数据
27 if("undefined" == typeof AreaData) {
28 layer.open({
29 title: '系统提示'
30 ,content: '调用showCity之前请引入地址数据'
31 });
32 return;
33 }
34 var htmlProvince = '',
35 htmlCity = '',
36 htmlDistrict = '',
37 cityData = '',
38 districtData = '',
39 $province = $('select[name='+province+']'),
40 $city = $('select[name='+city+']'),
41 $district = $('select[name='+district+']'),
42 provVal = $province.attr('data-area') || '', // 省默认值
43 cityVal = $city.attr('data-area') || '', // 市默认值
44 distVal = $district.attr('data-area') || ''; // 县默认值
45 $province.find('option').not(':first').remove();
46 $city.find('option').not(':first').remove();
47 $district.find('option').not(':first').remove();
48 form.render('select');
49
50 // 加载省数据
51 loadProvince();
52 function loadProvince() {
53 AreaData.forEach(function(v, i) {
54 htmlProvince += '<option value='+v.code+'>'+v.name+'</option>';
55 });
56 $province.append(htmlProvince);
57
58 // 默认选中省
59 defaultSelect($province, provVal, function(code) {
60 cityData = findPlace(AreaData, code);
61 loadCity(cityData, true);
62 });
63
64 form.render('select');
65
66 }
67
68 // 加载城市数据
69 function loadCity(city, hasDefault) {
70 $city.find('option').not(':first').remove();
71 htmlCity = '';
72 var city = city || [];
73 city.forEach(function(v, i) {
74 htmlCity += '<option value='+v.code+'>'+v.name+'</option>';
75 });
76 $city.append(htmlCity);
77
78 // 默认加载才执行,手动选中不执行
79 if (hasDefault) {
80 // 默认选中城市
81 defaultSelect($city, cityVal, function(code) {
82 // console.log(code)
83 // 加载默认城市数据
84 districtData = findPlace(cityData, code);
85 loadDistrict(districtData, true);
86 });
87 }
88
89 form.render('select');
90 }
91
92 // 加载县数据
93 function loadDistrict(districtData, hasDefault) {
94 $district.find('option').not(':first').remove();
95 htmlDistrict = '';
96 var districtData = districtData || [];
97 districtData.forEach(function(v, i) {
98 htmlDistrict += '<option value='+v.code+'>'+v.name+'</option>';
99 });
100 $district.append(htmlDistrict);
101
102 if (hasDefault) {
103 // 默认选中县
104 defaultSelect($district, distVal);
105 }
106
107 form.render('select');
108 }
109
110 // 查找地点数据
111 function findPlace(data, code) {
112 var resData = [];
113 data.forEach(function(v, i) {
114 if (v.code === code) {
115 resData = v.sub
116 }
117 });
118
119 return resData;
120 }
121
122 /*
123 * 查找默认选中项
124 * @param {object} jq元素
125 * @param {string} 默认值
126 * @param {function} 回调函数
127 */
128 function defaultSelect($el, SelectVal, callback) {
129 $('option', $el).each(function(i, el) {
130 var $this = $(this);
131 var optVal = $this.html();
132 var code;
133 if (optVal == SelectVal) {
134 $this.attr("selected", true);
135 code = $this.val();
136 // 加载默认城市数据
137 callback && callback(code);
138 }
139 });
140 }
141
142 // 省选择
143 form.on('select('+province+')', function(data) {
144 var code = data.value;
145 // console.log(data.elem); //得到select原始DOM对象
146 // console.log(code); //得到被选中的值
147 if (code != '') {
148
149 cityData = findPlace(AreaData, code);
150
151 loadCity(cityData);
152 loadDistrict();
153
154 } else {
155 loadCity();
156 loadDistrict();
157 }
158 // console.log(data.othis); //得到美化后的DOM对象
159 });
160 // 市选择
161 form.on('select('+city+')', function(data){
162 var code = data.value;
163 if (code != '') {
164
165 districtData = findPlace(cityData, code);
166
167 loadDistrict(districtData);
168 // console.log(data.elem); //得到select原始DOM对象
169 } else {
170 loadDistrict();
171 }
172 // console.log(data.othis); //得到美化后的DOM对象
173 });
174 form.on('select('+district+')', function(data){
175 // console.log(data.elem); //得到select原始DOM对象
176 // console.log(data.value); //得到被选中的值
177 // console.log(data.othis); //得到美化后的DOM对象
178 });
179 },
180 /**
181 * 获取省市县数据
182 *
183 * @param { object } [address] [address eg:广东省广州市天河区]
184 * @return {object} [address][根据code码返回地址名称]
185 */
186 getCity: function(address) {
187 //AreaData是地址传过来的json对象
188 var AreaData = $.rawCitiesData;
189 if("undefined" == typeof AreaData) {
190 layer.open({
191 title: '系统提示'
192 ,content: '调用getCity之前请引入地址数据'
193 });
194 return;
195 }
196 var province = address.province,
197 city = address.city,
198 district = address.district,
199 provinceName = '',
200 cityName = '',
201 districtName = '';
202
203 function findIndex(arr, target) {
204 return arr.findIndex(function(v, i) {
205 return target == v.code;
206 })
207 }
208
209 if (province) {
210 var findProvinceIndex = findIndex(AreaData, province);
211 provinceName = AreaData[findProvinceIndex].name;
212 }
213
214 if (province && city) {
215 var findCityIndex = findIndex(AreaData[findProvinceIndex].sub, city);
216 cityName = AreaData[findProvinceIndex].sub[findCityIndex].name;
217 }
218
219 if (province && city && district) {
220 var findDistrictIndex = findIndex(AreaData[findProvinceIndex].sub[findCityIndex].sub, district);
221
222 districtName = AreaData[findProvinceIndex].sub[findCityIndex].sub[findDistrictIndex].name;
223 }
224
225 return {
226 provinceName: provinceName,
227 cityName: cityName,
228 districtName: districtName
229 }
230 }
231 }
232
233 // exports module
234 exports('common', returnObj);
235 });
...@@ -6,14 +6,14 @@ ...@@ -6,14 +6,14 @@
6 </style> 6 </style>
7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
8 <title>新闻动态</title> 8 <title>新闻动态</title>
9 <script type="text/javascript" src="../../staticJs/head.js"></script> 9 <script type="text/javascript" src="../staticJs/head.js"></script>
10 <link rel="stylesheet" type="text/css" href="css/index.css"> 10 <link rel="stylesheet" type="text/css" href="../staticCss/xwdt.css">
11 </head> 11 </head>
12 <body> 12 <body>
13 <div class="navigation_crumbs"> 13 <div class="navigation_crumbs">
14 <div class="contentBox"> 14 <div class="contentBox">
15 <span class="layui-breadcrumb"> 15 <span class="layui-breadcrumb">
16 <a href="../../index.html">首页</a> 16 <a href="../index.html">首页</a>
17 <a><cite>新闻动态</cite></a> 17 <a><cite>新闻动态</cite></a>
18 </span> 18 </span>
19 </div> 19 </div>
...@@ -127,7 +127,7 @@ ...@@ -127,7 +127,7 @@
127 <a class="left-top" title="前三季度主要指标由负转正 中国经济持续稳定恢复" href="./../xwxq/index.html" target="_blank"> 127 <a class="left-top" title="前三季度主要指标由负转正 中国经济持续稳定恢复" href="./../xwxq/index.html" target="_blank">
128 前三季度主要指标由负转正 中国经济持续稳定恢复 128 前三季度主要指标由负转正 中国经济持续稳定恢复
129 </a> 129 </a>
130 <a class="xw" href="./../xwxq/index.html" target="_blank"> 130 <a class="xw" href="./xwxq/index.html" target="_blank">
131 <div class="xw-left"> 131 <div class="xw-left">
132 <img 132 <img
133 src="https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1938529415,777611275&fm=26&gp=0.jpg"> 133 src="https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1938529415,777611275&fm=26&gp=0.jpg">
...@@ -216,7 +216,7 @@ ...@@ -216,7 +216,7 @@
216 </div> 216 </div>
217 </div> 217 </div>
218 </body> 218 </body>
219 <script type="text/javascript" src="../../staticJs/common.js"></script> 219 <script type="text/javascript" src="../staticJs/common.js"></script>
220 <script type="text/javascript" src="../../staticJs/down.js"></script> 220 <script type="text/javascript" src="../staticJs/down.js"></script>
221 <script type="text/javascript" src="../../staticJs/xwdt.js"></script> 221 <script type="text/javascript" src="../staticJs/xwdt.js"></script>
222 </html> 222 </html>
...\ No newline at end of file ...\ No newline at end of file
......
1 <!DOCTYPE html
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">
4
5 <head>
6 <style>
7 </style>
8 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
9 <title>政策法规</title>
10 <script type="text/javascript" src="../staticJs/head.js"></script>
11 <link rel="stylesheet" type="text/css" href="../staticCss/zcfg.css">
12 </head>
13
14 <body>
15 <div class="navigation_crumbs">
16 <div class="contentBox">
17 <span class="layui-breadcrumb">
18 <a href="../index.html">首页</a>
19 <a><cite>政策法规</cite></a>
20 </span>
21 </div>
22 </div>
23 <div class="leftandright">
24 <div class="left">
25 <ul class="leftContainer">
26 <li>
27 <a class="left-top" title="前三季度主要指标由负转正 中国经济持续稳定恢复" href="./../xwxq/index.html" target="_blank">
28 前三季度主要指标由负转正 中国经济持续稳定恢复
29 </a>
30 <a class="xw" href="./../xwxq/index.html" target="_blank">
31 <div class="xw-right">
32 <div class="left-body">
33 10月21日,农业农村部举行新闻发布会,介绍2020年前三季度农业农村经济形式,农业农村部总经济师,发展
34 划司司长魏白刚介绍,今年农业收来之不易,农业农村经济保持了持续向好、稳中有进的态势,粮食丰收已成定局,预计产量达到历史最高水平
35 </div>
36 <div class="left-buttom">
37 <div>
38 <svg class="icon svg-icon" aria-hidden="true">
39 <use xlink:href="#iconchakan"></use>
40 </svg>
41 <span>123</span>
42 </div>
43 <div>
44 <svg class="icon svg-icon" aria-hidden="true">
45 <use xlink:href="#iconpinglun"></use>
46 </svg>
47 <span>456</span>
48 </div>
49 <div class="left-buttom-date">
50 2020-12-27
51 </div>
52 </div>
53 </div>
54 </a>
55 </li>
56 <li>
57 <a class="left-top" title="前三季度主要指标由负转正 中国经济持续稳定恢复" href="./../xwxq/index.html" target="_blank">
58 前三季度主要指标由负转正 中国经济持续稳定恢复
59 </a>
60 <a class="xw" href="./../xwxq/index.html" target="_blank">
61 <div class="xw-right">
62 <div class="left-body">
63 10月21日,农业农村部举行新闻发布会,介绍2020年前三季度农业农村经济形式,农业农村部总经济师,发展
64 划司司长魏白刚介绍,今年农业收来之不易,农业农村经济保持了持续向好、稳中有进的态势,粮食丰收已成定局,预计产量达到历史最高水平
65 </div>
66 <div class="left-buttom">
67 <div>
68 <svg class="icon svg-icon" aria-hidden="true">
69 <use xlink:href="#iconchakan"></use>
70 </svg>
71 <span>123</span>
72 </div>
73 <div>
74 <svg class="icon svg-icon" aria-hidden="true">
75 <use xlink:href="#iconpinglun"></use>
76 </svg>
77 <span>456</span>
78 </div>
79 <div class="left-buttom-date">
80 2020-12-27
81 </div>
82 </div>
83 </div>
84 </a>
85 </li>
86 </ul>
87 <div id="page"></div>
88 </div>
89 <div class="right">
90 <div class="right-top">
91 <h2>政策法规推荐</h2>
92 </div>
93 <ul class="right-bottom">
94 <li class="zcfg">
95 <div class="zcfg-top">
96 <span>爬山虎国土空间规划信息化解决</span>
97 </div>
98 <div class="zcfg-body">
99 <span>10月21日,农业农村部举行新闻发布会,介绍2020年前三季度农业农村经济形势。</span>
100 </div>
101 <div class="zcfg-bottom">
102 <span>2020-10-28</span>
103 </div>
104 </li>
105 <li class="zcfg">
106 <div class="zcfg-top">
107 <span>爬山虎国土空间规划信息化解决</span>
108 </div>
109 <div class="zcfg-body">
110 <span>10月21日,农业农村部举行新闻发布会,介绍2020年前三季度农业农村经济形势。</span>
111 </div>
112 <div class="zcfg-bottom">
113 <span>2020-10-28</span>
114 </div>
115 </li>
116 </ul>
117 </div>
118 </div>
119 </body>
120 <script type="text/javascript" src="../staticJs/common.js"></script>
121 <script type="text/javascript" src="../staticJs/down.js"></script>
122 <script type="text/javascript" src="../staticJs/zcfg.js"></script>
123
124 </html>
...\ No newline at end of file ...\ No newline at end of file