style:样式
Showing
10 changed files
with
150 additions
and
106 deletions
... | @@ -43,7 +43,7 @@ | ... | @@ -43,7 +43,7 @@ |
43 | } | 43 | } |
44 | .submitbutton { | 44 | .submitbutton { |
45 | text-align: center; | 45 | text-align: center; |
46 | margin: 30px 0 60px 0; | 46 | margin: 50px 0; |
47 | } | 47 | } |
48 | .layui-form-item button { | 48 | .layui-form-item button { |
49 | width: 120px; | 49 | width: 120px; |
... | @@ -172,3 +172,49 @@ | ... | @@ -172,3 +172,49 @@ |
172 | text-align: center; | 172 | text-align: center; |
173 | margin: 50px 0 100px 0; | 173 | margin: 50px 0 100px 0; |
174 | } | 174 | } |
175 | .input_search { | ||
176 | margin-top: 60px; | ||
177 | } | ||
178 | /* ------------------弹框样式-------------------- */ | ||
179 | .layui-layer-dialog { | ||
180 | margin-top: -1.5%; | ||
181 | } | ||
182 | .successInfo , .seizureInfo{ | ||
183 | background-color: #44D7B6; | ||
184 | width: 140%; | ||
185 | margin-left: -20px; | ||
186 | padding-left: 10px; | ||
187 | box-sizing: border-box; | ||
188 | color: #ffffff; | ||
189 | } | ||
190 | .seizureInfo { | ||
191 | background-color: #F26363; | ||
192 | opacity: 0.8; | ||
193 | } | ||
194 | .layui-layer-btn { | ||
195 | position: relative; | ||
196 | top: 50px; | ||
197 | left: -89px; | ||
198 | } | ||
199 | .layui-layer-btn0 { | ||
200 | width: 120px!important; | ||
201 | height: 42px!important; | ||
202 | text-align: center; | ||
203 | line-height: 42px!important; | ||
204 | font-size: 16px; | ||
205 | } | ||
206 | .layui-layer-content { | ||
207 | height: auto!important; | ||
208 | } | ||
209 | .dialog_con li { | ||
210 | line-height: 36px; | ||
211 | color: #303030; | ||
212 | font-size: 14px!important; | ||
213 | } | ||
214 | .dialog_con li span { | ||
215 | color: #9B9B9B; | ||
216 | display: inline-block; | ||
217 | width: 85px; | ||
218 | text-align: right; | ||
219 | margin-right: 10px; | ||
220 | } | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
1 | /* ------------------------公共头部和尾部css------------------------------------ */ | 1 | /* ------------------------公共头部和尾部css------------------------------------ */ |
2 | /* layer confim */ | 2 | |
3 | .layui-layer-btn .layui-layer-btn0 { | ||
4 | background-color: #F7B500!important; | ||
5 | color: #fff!important; | ||
6 | border: 1px solid #F7B500!important; | ||
7 | } | ||
8 | .layui-layer-btn .layui-layer-btn1 { | ||
9 | border-color: #1E9FFF; | ||
10 | background-color: #1E9FFF; | ||
11 | color: #fff; | ||
12 | } | ||
13 | .layui-icon-search { | 3 | .layui-icon-search { |
14 | color: #6D7278; | 4 | color: #6D7278; |
15 | } | 5 | } |
... | @@ -280,3 +270,17 @@ div.footer .system_service ul li a:hover { | ... | @@ -280,3 +270,17 @@ div.footer .system_service ul li a:hover { |
280 | color: #CBCBCB; | 270 | color: #CBCBCB; |
281 | margin-top: 5px; | 271 | margin-top: 5px; |
282 | } | 272 | } |
273 | |||
274 | /* ------------layui 弹框样式---------------- */ | ||
275 | .layui-layer-ico { | ||
276 | background: none!important; | ||
277 | position: relative; | ||
278 | } | ||
279 | .layui-layer-ico::after { | ||
280 | content: '\2716'; | ||
281 | position: absolute; | ||
282 | left: 0; | ||
283 | top: -5px; | ||
284 | font-size: 14px; | ||
285 | color: #fff; | ||
286 | } | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
staticCss/layuiDialog.css
0 → 100644
1 | .progressBar { | 1 | .progressBar { |
2 | padding-top: 20px; | 2 | padding-top: 30px; |
3 | color: #4A4A4A; | 3 | color: #4A4A4A; |
4 | position: relative; | 4 | position: relative; |
5 | margin: 30px 0 50px 0; | 5 | width: 93%; |
6 | width: 95%; | 6 | margin: 0 auto; |
7 | } | 7 | } |
8 | .app_progress { | 8 | .app_progress { |
9 | display: flex; | 9 | display: flex; |
10 | width: 106%; | 10 | width: 100%; |
11 | } | 11 | } |
12 | .app_progress li { | 12 | .app_progress li { |
13 | display: inline-block; | 13 | display: inline-block; |
... | @@ -35,7 +35,6 @@ | ... | @@ -35,7 +35,6 @@ |
35 | } | 35 | } |
36 | .item_proress { | 36 | .item_proress { |
37 | position: relative; | 37 | position: relative; |
38 | width: 50px!important; | ||
39 | z-index: 10; | 38 | z-index: 10; |
40 | } | 39 | } |
41 | .app_progress li p{ | 40 | .app_progress li p{ |
... | @@ -92,3 +91,18 @@ | ... | @@ -92,3 +91,18 @@ |
92 | .next_button a:hover { | 91 | .next_button a:hover { |
93 | color: #ffffff; | 92 | color: #ffffff; |
94 | } | 93 | } |
94 | |||
95 | /* ------------中间内容区域------------- */ | ||
96 | .content_area { | ||
97 | background: #FFFFFF; | ||
98 | box-shadow: 0px 4px 16px 0px rgba(40, 120, 254, 0.24); | ||
99 | -webkit-box-shadow: 0px 4px 16px 0px rgba(40, 120, 254, 0.24); | ||
100 | -moz-box-shadow: 0px 4px 16px 0px rgba(40, 120, 254, 0.24); | ||
101 | border-radius: 6px; | ||
102 | box-sizing: border-box; | ||
103 | padding: 20px; | ||
104 | margin-top: 10px; | ||
105 | } | ||
106 | .progressBar_con { | ||
107 | text-align: center; | ||
108 | } | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
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 | // 业务 |
... | @@ -18,7 +18,7 @@ $(function () { | ... | @@ -18,7 +18,7 @@ $(function () { |
18 | }); | 18 | }); |
19 | 19 | ||
20 | //监听提交 | 20 | //监听提交 |
21 | form.on('submit(demo1)', function (data) { | 21 | form.on('submit(submit)', function (data) { |
22 | layer.alert(JSON.stringify(data.field), { | 22 | layer.alert(JSON.stringify(data.field), { |
23 | title: '最终的提交信息' | 23 | title: '最终的提交信息' |
24 | }) | 24 | }) |
... | @@ -73,4 +73,49 @@ $(function () { | ... | @@ -73,4 +73,49 @@ $(function () { |
73 | element.init(); | 73 | element.init(); |
74 | }); | 74 | }); |
75 | }); | 75 | }); |
76 | |||
77 | // 结果弹框 | ||
78 | $('.reset').click(function () { | ||
79 | successResult() | ||
80 | // seizureResult() | ||
81 | }) | ||
82 | |||
76 | }) | 83 | }) |
84 | function successResult() { | ||
85 | layui.use('layer', function () { | ||
86 | layer.open({ | ||
87 | title: '<p class="system_prompt successInfo">房屋状态:正常</p>', | ||
88 | area: ['370px', '335px'], | ||
89 | scrollbar: false, | ||
90 | content:'<ul class="dialog_con">' | ||
91 | + '<li><span>姓名:</span>任超</li>' | ||
92 | + '<li><span>身份证号:</span>610124193335522</li>' | ||
93 | + '<li><span>联系电话:</span>18740677386</li>' | ||
94 | + '<li><span>产权证号:</span>89897987987987</li>' | ||
95 | + '<li><span>坐落:</span>西安市雁塔区南二环西段</li>' | ||
96 | + '<li><span>面积:</span>2000</li>' | ||
97 | + '<li><span>合同备案号:</span>9798798798798</li>' | ||
98 | + '</ul>' | ||
99 | }); | ||
100 | }) | ||
101 | |||
102 | } | ||
103 | |||
104 | function seizureResult() { | ||
105 | layui.use('layer', function () { | ||
106 | layer.open({ | ||
107 | title: '<p class="system_prompt seizureInfo">房屋状态:正常</p>', | ||
108 | area: ['370px', '335px'], | ||
109 | scrollbar: false, | ||
110 | content:'<ul class="dialog_con">' | ||
111 | + '<li><span>姓名:</span>任超</li>' | ||
112 | + '<li><span>身份证号:</span>610124193335522</li>' | ||
113 | + '<li><span>联系电话:</span>18740677386</li>' | ||
114 | + '<li><span>产权证号:</span>89897987987987</li>' | ||
115 | + '<li><span>坐落:</span>西安市雁塔区南二环西段</li>' | ||
116 | + '<li><span>面积:</span>2000</li>' | ||
117 | + '<li><span>合同备案号:</span>9798798798798</li>' | ||
118 | + '</ul>' | ||
119 | }); | ||
120 | }) | ||
121 | } | ... | ... |
... | @@ -14,6 +14,7 @@ $(function () { | ... | @@ -14,6 +14,7 @@ $(function () { |
14 | var layer = layui.layer; | 14 | var layer = layui.layer; |
15 | layer.confirm('本人承诺所填的预约信息属实,如有虚假,将承担法律责任', { | 15 | layer.confirm('本人承诺所填的预约信息属实,如有虚假,将承担法律责任', { |
16 | title: '真实准确的承诺', | 16 | title: '真实准确的承诺', |
17 | scrollbar: false, | ||
17 | btn: ['不同意', '同意进入下一步'] //按钮 | 18 | btn: ['不同意', '同意进入下一步'] //按钮 |
18 | }, function () { | 19 | }, function () { |
19 | layer.closeAll(); | 20 | layer.closeAll(); | ... | ... |
... | @@ -18,23 +18,23 @@ | ... | @@ -18,23 +18,23 @@ |
18 | <span class="layui-breadcrumb"> | 18 | <span class="layui-breadcrumb"> |
19 | <a href="../../index.html">首页</a> | 19 | <a href="../../index.html">首页</a> |
20 | <a href="./wssq.html">网上申请</a> | 20 | <a href="./wssq.html">网上申请</a> |
21 | <a><cite>在线申请</cite></a> | 21 | <a><cite>信息校验</cite></a> |
22 | </span> | 22 | </span> |
23 | </div> | 23 | </div> |
24 | </div> | 24 | </div> |
25 | <div class="content_box"> | 25 | <div class="content_box"> |
26 | <div class="name_title"> | 26 | <div class="name_title"> |
27 | <h2>商品房</h2> | 27 | <h2>商品房</h2> |
28 | <p>转移登记</p> | 28 | <p>商品房转移买卖登记(个人)</p> |
29 | </div> | 29 | </div> |
30 | <div class="content_area"> | ||
31 | <div class="progressBar_con"> | ||
30 | <div class="progressBar"> | 32 | <div class="progressBar"> |
31 | <ul class="app_progress" id="app_progress"> | 33 | <ul class="app_progress" id="app_progress"> |
32 | </ul> | 34 | </ul> |
33 | </div> | 35 | </div> |
34 | <div class="input_search"> | ||
35 | <div class="form_title"> | ||
36 | <h2>信息校验</h2> | ||
37 | </div> | 36 | </div> |
37 | <div class="input_search"> | ||
38 | <form class="layui-form" action=""> | 38 | <form class="layui-form" action=""> |
39 | <div class="layui-form-item"> | 39 | <div class="layui-form-item"> |
40 | <div class="layui-inline"> | 40 | <div class="layui-inline"> |
... | @@ -65,90 +65,11 @@ | ... | @@ -65,90 +65,11 @@ |
65 | <div class="layui-input-block submitbutton"> | 65 | <div class="layui-input-block submitbutton"> |
66 | <button type="reset" class="layui-btn layui-btn-primary reset">重 置</button> | 66 | <button type="reset" class="layui-btn layui-btn-primary reset">重 置</button> |
67 | <button type="submit" class="layui-btn layui-btn-normal submit" lay-submit="" | 67 | <button type="submit" class="layui-btn layui-btn-normal submit" lay-submit="" |
68 | lay-filter="demo1">查询</button> | 68 | lay-filter="submit">查询</button> |
69 | </div> | 69 | </div> |
70 | </div> | 70 | </div> |
71 | </form> | 71 | </form> |
72 | </div> | 72 | </div> |
73 | <div class="seach_result"> | ||
74 | <!-- <div class="no_data">暂无数据</div> --> | ||
75 | <ul class="appointment_list"> | ||
76 | <li> | ||
77 | <div class="item_content"> | ||
78 | <div class="item_title overdue"> | ||
79 | <h3>正常</h3> | ||
80 | <p> | ||
81 | 查看 | ||
82 | <i class="layui-icon layui-icon-right"></i> | ||
83 | </p> | ||
84 | </div> | ||
85 | <ul class="item_info"> | ||
86 | <li> | ||
87 | <span>预约人:</span> | ||
88 | <p>任超</p> | ||
89 | </li> | ||
90 | <li> | ||
91 | <span>办事大厅:</span> | ||
92 | <p>米香园办事大厅</p> | ||
93 | </li> | ||
94 | <li> | ||
95 | <span>办理业务类型:</span> | ||
96 | <p>二手房交易</p> | ||
97 | <a href="">办事指南</a> | ||
98 | </li> | ||
99 | <li> | ||
100 | <span>预约日期:</span> | ||
101 | <p>2020-12-56 上午 16:13</p> | ||
102 | </li> | ||
103 | <li> | ||
104 | <span>预约流水号:</span> | ||
105 | <p>897987987987</p> | ||
106 | </li> | ||
107 | </ul> | ||
108 | <a class="cancel_reservation">取消预约</a> | ||
109 | </div> | ||
110 | </li> | ||
111 | <li> | ||
112 | <div class="item_content"> | ||
113 | <div class="item_title cancel"> | ||
114 | <h3>正常</h3> | ||
115 | <p> | ||
116 | 查看 | ||
117 | <i class="layui-icon layui-icon-right"></i> | ||
118 | </p> | ||
119 | </div> | ||
120 | <ul class="item_info"> | ||
121 | <li> | ||
122 | <span>预约人:</span> | ||
123 | <p>任超</p> | ||
124 | </li> | ||
125 | <li> | ||
126 | <span>办事大厅:</span> | ||
127 | <p>米香园办事大厅</p> | ||
128 | </li> | ||
129 | <li> | ||
130 | <span>办理业务类型:</span> | ||
131 | <p>二手房交易</p> | ||
132 | <a href="">办事指南</a> | ||
133 | </li> | ||
134 | <li> | ||
135 | <span>预约日期:</span> | ||
136 | <p>2020-12-56 上午 16:13</p> | ||
137 | </li> | ||
138 | <li> | ||
139 | <span>预约流水号:</span> | ||
140 | <p>897987987987</p> | ||
141 | </li> | ||
142 | </ul> | ||
143 | <a class="cancel_reservation">取消预约</a> | ||
144 | </div> | ||
145 | </li> | ||
146 | </ul> | ||
147 | <div class="next_button"> | ||
148 | <button type="button" class="layui-btn layui-btn-normal"> | ||
149 | <a href="./tbxx.html">下一步</a> | ||
150 | </button> | ||
151 | </div> | ||
152 | </div> | 73 | </div> |
153 | </div> | 74 | </div> |
154 | </body> | 75 | </body> | ... | ... |
... | @@ -54,7 +54,7 @@ | ... | @@ -54,7 +54,7 @@ |
54 | <div class="layui-progress-bar" lay-percent="100%"></div> | 54 | <div class="layui-progress-bar" lay-percent="100%"></div> |
55 | </div> | 55 | </div> |
56 | <li> | 56 | <li> |
57 | <p class="active"></p> | 57 | <p class="activeing"></p> |
58 | <h5> | 58 | <h5> |
59 | 预约结果 | 59 | 预约结果 |
60 | </h5> | 60 | </h5> | ... | ... |
... | @@ -10,6 +10,7 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD | ... | @@ -10,6 +10,7 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD |
10 | <link rel="stylesheet" href="../staticCss/swiper-bundle.min.css"> | 10 | <link rel="stylesheet" href="../staticCss/swiper-bundle.min.css"> |
11 | <link rel="stylesheet" type="text/css" href="../staticCss/progressBar.css"> | 11 | <link rel="stylesheet" type="text/css" href="../staticCss/progressBar.css"> |
12 | <link rel="stylesheet" type="text/css" href="../staticCss/yysj.css"> | 12 | <link rel="stylesheet" type="text/css" href="../staticCss/yysj.css"> |
13 | <link rel="stylesheet" type="text/css" href="../staticCss/layuiDialog.css"> | ||
13 | </head> | 14 | </head> |
14 | 15 | ||
15 | 16 | ||
... | @@ -47,7 +48,7 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD | ... | @@ -47,7 +48,7 @@ PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD |
47 | <div class="layui-progress-bar" lay-percent="100%"></div> | 48 | <div class="layui-progress-bar" lay-percent="100%"></div> |
48 | </div> | 49 | </div> |
49 | <li> | 50 | <li> |
50 | <p class="active"></p> | 51 | <p class="activeing"></p> |
51 | <h5> | 52 | <h5> |
52 | 预约时间 | 53 | 预约时间 |
53 | </h5> | 54 | </h5> | ... | ... |
... | @@ -11,6 +11,7 @@ | ... | @@ -11,6 +11,7 @@ |
11 | <link rel="stylesheet" type="text/css" href="../staticCss/yyxz.css"> | 11 | <link rel="stylesheet" type="text/css" href="../staticCss/yyxz.css"> |
12 | <link rel="stylesheet" type="text/css" href="../staticCss/progressBar.css"> | 12 | <link rel="stylesheet" type="text/css" href="../staticCss/progressBar.css"> |
13 | <link rel="stylesheet" type="text/css" href="../staticCss/layuiedit.css"> | 13 | <link rel="stylesheet" type="text/css" href="../staticCss/layuiedit.css"> |
14 | <link rel="stylesheet" type="text/css" href="../staticCss/layuiDialog.css"> | ||
14 | </head> | 15 | </head> |
15 | 16 | ||
16 | <body> | 17 | <body> | ... | ... |
-
Please register or sign in to post a comment