suomingxiang před 4 měsíci
rodič
revize
d80b62ed06

+ 3
- 0
src/pages/common/js/utils.js Zobrazit soubor

@@ -1,6 +1,9 @@
1 1
 const BASEURL = '/api';
2
+// const BASEURL = 'http://60.205.233.182/api';
2 3
 // const BASEURL = 'http://192.168.1.63:6002/api';
3 4
 
5
+
6
+
4 7
 async function fetchRequest(url, method = 'GET', data = null) {
5 8
     const options = {
6 9
         method: method,

+ 2
- 2
src/pages/common/tpl/footer.tpl Zobrazit soubor

@@ -49,8 +49,8 @@
49 49
             <div class="footerClick">
50 50
                 <a class="h7" href="./socialResponsibility.html"><span>社会责任</span></a>
51 51
                 <span class="icon iconfont icon-arrow-right"></span>
52
-                <div class="footerShow show2"><a class="h7R" href="./socialResponsibility.html"><span>社会公益</span></a>
53
-                <a class="h7R" href="./socialResponsibility.html"><span>绿色转型</span></a></div>
52
+                <div class="footerShow show2"><a class="h7R" href="./socialResponsibility.html#p1"><span>社会公益</span></a>
53
+                <a class="h7R" href="./socialResponsibility.html#p1"><span>绿色转型</span></a></div>
54 54
             </div>
55 55
             <div class="footerClick">
56 56
                 <a class="h7" href="./join.html"><span>加入中泽</span></a>

+ 2
- 2
src/pages/common/tpl/header.tpl Zobrazit soubor

@@ -50,8 +50,8 @@
50 50
                 <a href="./socialResponsibility.html">社会责任</a>
51 51
                 <div class="menuSon">
52 52
                     <div class="menuUp"></div>
53
-                    <a href="./socialResponsibility.html"><span>社会公益</span></a>
54
-                    <a href="./socialResponsibility.html"><span>绿色转型</span></a>
53
+                    <a href="./socialResponsibility.html#p1"><span>社会公益</span></a>
54
+                    <a href="./socialResponsibility.html#p2"><span>绿色转型</span></a>
55 55
                 </div>
56 56
             </div>
57 57
             <div class="menuOne">

+ 1
- 1
src/pages/news/App.js Zobrazit soubor

@@ -13,7 +13,7 @@ export default class App {
13 13
         let common = new Common(document.querySelector('.main'),2)   //导航菜单高亮,0是首页,后面的按顺序添加
14 14
         this.isMobile = isMobile()
15 15
         
16
-        bindDom();
16
+        // bindDom();
17 17
 
18 18
         function bindDom(){
19 19
             const tabs_ul =  document.querySelectorAll(".tabs_li");

+ 3
- 422
src/pages/news/index.html Zobrazit soubor

@@ -48,7 +48,7 @@
48 48
                         <img src="./static/images/news/03.png" alt="">
49 49
                         <div class="banner2_cont">
50 50
                             <div class="txt1">交通运输部、国家发展改革委联合印发
51
-                                《交通物流降本提质增效行动计化》</div>
51
+                                《交通物流降本提质增效行sddsd动计化》</div>
52 52
                             <div class="txt2">2024-11-18</div>
53 53
                             <div class="txt3">《计划》提出,到2027年,交通物流降本提质增效取得显著成效,社会物流总费用与国内生产...</div>
54 54
                             <a href="#">
@@ -66,321 +66,6 @@
66 66
                     <a class="tabs_li">研发创新</a>
67 67
                 </div>
68 68
             </div>
69
-            <div class="news_ul newsShow">
70
-                <div class="news_list">
71
-                    <div class="news_li">
72
-                        <div class="li_left">
73
-                            <div class="timerData">10</div>
74
-                            <div>24-06</div>
75
-                        </div> 
76
-                        <a class="li_cont" href="./articleDetails.html">
77
-                            <div>0中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
78
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
79
-                        </a>
80
-                    </div>
81
-                    <div class="news_li">
82
-                        <div class="li_left">
83
-                            <div class="timerData">10</div>
84
-                            <div>24-06</div>
85
-                        </div> 
86
-                        <a class="li_cont" href="#">
87
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
88
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
89
-                        </a>
90
-                    </div>
91
-                    <div class="news_li">
92
-                        <div class="li_left">
93
-                            <div class="timerData">10</div>
94
-                            <div>24-06</div>
95
-                        </div> 
96
-                        <a class="li_cont" href="#">
97
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
98
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
99
-                        </a>
100
-                    </div>
101
-                    <div class="news_li">
102
-                        <div class="li_left">
103
-                            <div class="timerData">10</div>
104
-                            <div>24-06</div>
105
-                        </div> 
106
-                        <a class="li_cont" href="./articleDetails.html">
107
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
108
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
109
-                        </a>
110
-                    </div>
111
-                    <div class="news_li">
112
-                        <div class="li_left">
113
-                            <div class="timerData">10</div>
114
-                            <div>24-06</div>
115
-                        </div> 
116
-                        <a class="li_cont" href="#">
117
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
118
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
119
-                        </a>
120
-                    </div>
121
-                    <div class="news_li">
122
-                        <div class="li_left">
123
-                            <div class="timerData">10</div>
124
-                            <div>24-06</div>
125
-                        </div> 
126
-                        <a class="li_cont" href="#">
127
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
128
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
129
-                        </a>
130
-                    </div>
131
-                    <div class="news_li">
132
-                        <div class="li_left">
133
-                            <div class="timerData">10</div>
134
-                            <div>24-06</div>
135
-                        </div> 
136
-                        <a class="li_cont" href="./articleDetails.html">
137
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
138
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
139
-                        </a>
140
-                    </div>
141
-                    <div class="news_li">
142
-                        <div class="li_left">
143
-                            <div class="timerData">10</div>
144
-                            <div>24-06</div>
145
-                        </div> 
146
-                        <a class="li_cont" href="#">
147
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
148
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
149
-                        </a>
150
-                    </div>
151
-                    <div class="news_li">
152
-                        <div class="li_left">
153
-                            <div class="timerData">10</div>
154
-                            <div>24-06</div>
155
-                        </div> 
156
-                        <a class="li_cont" href="#">
157
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
158
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
159
-                        </a>
160
-                    </div>
161
-                    <div class="news_li">
162
-                        <div class="li_left">
163
-                            <div class="timerData">10</div>
164
-                            <div>24-06</div>
165
-                        </div> 
166
-                        <a class="li_cont" href="./articleDetails.html">
167
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
168
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
169
-                        </a>
170
-                    </div>
171
-                </div>
172
-                
173
-            </div>
174
-            <div class="news_ul">
175
-                <div class="news_list">
176
-                    <div class="news_li">
177
-                        <div class="li_left">
178
-                            <div class="timerData">10</div>
179
-                            <div>24-06</div>
180
-                        </div> 
181
-                        <a class="li_cont" href="./articleDetails.html">
182
-                            <div>1中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
183
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
184
-                        </a>
185
-                    </div>
186
-                    <div class="news_li">
187
-                        <div class="li_left">
188
-                            <div class="timerData">10</div>
189
-                            <div>24-06</div>
190
-                        </div> 
191
-                        <a class="li_cont" href="#">
192
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
193
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
194
-                        </a>
195
-                    </div>
196
-                    <div class="news_li">
197
-                        <div class="li_left">
198
-                            <div class="timerData">10</div>
199
-                            <div>24-06</div>
200
-                        </div> 
201
-                        <a class="li_cont" href="#">
202
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
203
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
204
-                        </a>
205
-                    </div>
206
-                    <div class="news_li">
207
-                        <div class="li_left">
208
-                            <div class="timerData">10</div>
209
-                            <div>24-06</div>
210
-                        </div> 
211
-                        <a class="li_cont" href="./articleDetails.html">
212
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
213
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
214
-                        </a>
215
-                    </div>
216
-                    <div class="news_li">
217
-                        <div class="li_left">
218
-                            <div class="timerData">10</div>
219
-                            <div>24-06</div>
220
-                        </div> 
221
-                        <a class="li_cont" href="#">
222
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
223
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
224
-                        </a>
225
-                    </div>
226
-                    <div class="news_li">
227
-                        <div class="li_left">
228
-                            <div class="timerData">10</div>
229
-                            <div>24-06</div>
230
-                        </div> 
231
-                        <a class="li_cont" href="#">
232
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
233
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
234
-                        </a>
235
-                    </div>
236
-                    <div class="news_li">
237
-                        <div class="li_left">
238
-                            <div class="timerData">10</div>
239
-                            <div>24-06</div>
240
-                        </div> 
241
-                        <a class="li_cont" href="./articleDetails.html">
242
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
243
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
244
-                        </a>
245
-                    </div>
246
-                    <div class="news_li">
247
-                        <div class="li_left">
248
-                            <div class="timerData">10</div>
249
-                            <div>24-06</div>
250
-                        </div> 
251
-                        <a class="li_cont" href="#">
252
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
253
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
254
-                        </a>
255
-                    </div>
256
-                    <div class="news_li">
257
-                        <div class="li_left">
258
-                            <div class="timerData">10</div>
259
-                            <div>24-06</div>
260
-                        </div> 
261
-                        <a class="li_cont" href="#">
262
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
263
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
264
-                        </a>
265
-                    </div>
266
-                    <div class="news_li">
267
-                        <div class="li_left">
268
-                            <div class="timerData">10</div>
269
-                            <div>24-06</div>
270
-                        </div> 
271
-                        <a class="li_cont" href="./articleDetails.html">
272
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
273
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
274
-                        </a>
275
-                    </div>
276
-                </div>
277
-                
278
-            </div>
279
-            <div class="news_ul">
280
-                <div class="news_list">
281
-                    <div class="news_li">
282
-                        <div class="li_left">
283
-                            <div class="timerData">10</div>
284
-                            <div>24-06</div>
285
-                        </div> 
286
-                        <a class="li_cont" href="./articleDetails.html">
287
-                            <div>2中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
288
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
289
-                        </a>
290
-                    </div>
291
-                    <div class="news_li">
292
-                        <div class="li_left">
293
-                            <div class="timerData">10</div>
294
-                            <div>24-06</div>
295
-                        </div> 
296
-                        <a class="li_cont" href="#">
297
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
298
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
299
-                        </a>
300
-                    </div>
301
-                    <div class="news_li">
302
-                        <div class="li_left">
303
-                            <div class="timerData">10</div>
304
-                            <div>24-06</div>
305
-                        </div> 
306
-                        <a class="li_cont" href="#">
307
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
308
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
309
-                        </a>
310
-                    </div>
311
-                    <div class="news_li">
312
-                        <div class="li_left">
313
-                            <div class="timerData">10</div>
314
-                            <div>24-06</div>
315
-                        </div> 
316
-                        <a class="li_cont" href="./articleDetails.html">
317
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
318
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
319
-                        </a>
320
-                    </div>
321
-                    <div class="news_li">
322
-                        <div class="li_left">
323
-                            <div class="timerData">10</div>
324
-                            <div>24-06</div>
325
-                        </div> 
326
-                        <a class="li_cont" href="#">
327
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
328
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
329
-                        </a>
330
-                    </div>
331
-                    <div class="news_li">
332
-                        <div class="li_left">
333
-                            <div class="timerData">10</div>
334
-                            <div>24-06</div>
335
-                        </div> 
336
-                        <a class="li_cont" href="#">
337
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
338
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
339
-                        </a>
340
-                    </div>
341
-                    <div class="news_li">
342
-                        <div class="li_left">
343
-                            <div class="timerData">10</div>
344
-                            <div>24-06</div>
345
-                        </div> 
346
-                        <a class="li_cont" href="./articleDetails.html">
347
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
348
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
349
-                        </a>
350
-                    </div>
351
-                    <div class="news_li">
352
-                        <div class="li_left">
353
-                            <div class="timerData">10</div>
354
-                            <div>24-06</div>
355
-                        </div> 
356
-                        <a class="li_cont" href="#">
357
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
358
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
359
-                        </a>
360
-                    </div>
361
-                    <div class="news_li">
362
-                        <div class="li_left">
363
-                            <div class="timerData">10</div>
364
-                            <div>24-06</div>
365
-                        </div> 
366
-                        <a class="li_cont" href="#">
367
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
368
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
369
-                        </a>
370
-                    </div>
371
-                    <div class="news_li">
372
-                        <div class="li_left">
373
-                            <div class="timerData">10</div>
374
-                            <div>24-06</div>
375
-                        </div> 
376
-                        <a class="li_cont" href="./articleDetails.html">
377
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
378
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
379
-                        </a>
380
-                    </div>
381
-                </div>
382
-                
383
-            </div>
384 69
             <div class="news_ul">
385 70
                 <div class="news_list">
386 71
                     <div class="news_li">
@@ -389,112 +74,7 @@
389 74
                             <div>24-06</div>
390 75
                         </div> 
391 76
                         <a class="li_cont" href="./articleDetails.html">
392
-                            <div>3中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
393
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
394
-                        </a>
395
-                    </div>
396
-                    <div class="news_li">
397
-                        <div class="li_left">
398
-                            <div class="timerData">10</div>
399
-                            <div>24-06</div>
400
-                        </div> 
401
-                        <a class="li_cont" href="#">
402
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
403
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
404
-                        </a>
405
-                    </div>
406
-                    <div class="news_li">
407
-                        <div class="li_left">
408
-                            <div class="timerData">10</div>
409
-                            <div>24-06</div>
410
-                        </div> 
411
-                        <a class="li_cont" href="#">
412
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
413
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
414
-                        </a>
415
-                    </div>
416
-                    <div class="news_li">
417
-                        <div class="li_left">
418
-                            <div class="timerData">10</div>
419
-                            <div>24-06</div>
420
-                        </div> 
421
-                        <a class="li_cont" href="./articleDetails.html">
422
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
423
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
424
-                        </a>
425
-                    </div>
426
-                    <div class="news_li">
427
-                        <div class="li_left">
428
-                            <div class="timerData">10</div>
429
-                            <div>24-06</div>
430
-                        </div> 
431
-                        <a class="li_cont" href="#">
432
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
433
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
434
-                        </a>
435
-                    </div>
436
-                    <div class="news_li">
437
-                        <div class="li_left">
438
-                            <div class="timerData">10</div>
439
-                            <div>24-06</div>
440
-                        </div> 
441
-                        <a class="li_cont" href="#">
442
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
443
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
444
-                        </a>
445
-                    </div>
446
-                    <div class="news_li">
447
-                        <div class="li_left">
448
-                            <div class="timerData">10</div>
449
-                            <div>24-06</div>
450
-                        </div> 
451
-                        <a class="li_cont" href="./articleDetails.html">
452
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
453
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
454
-                        </a>
455
-                    </div>
456
-                    <div class="news_li">
457
-                        <div class="li_left">
458
-                            <div class="timerData">10</div>
459
-                            <div>24-06</div>
460
-                        </div> 
461
-                        <a class="li_cont" href="#">
462
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
463
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
464
-                        </a>
465
-                    </div>
466
-                    <div class="news_li">
467
-                        <div class="li_left">
468
-                            <div class="timerData">10</div>
469
-                            <div>24-06</div>
470
-                        </div> 
471
-                        <a class="li_cont" href="#">
472
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
473
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
474
-                        </a>
475
-                    </div>
476
-                    <div class="news_li">
477
-                        <div class="li_left">
478
-                            <div class="timerData">10</div>
479
-                            <div>24-06</div>
480
-                        </div> 
481
-                        <a class="li_cont" href="./articleDetails.html">
482
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
483
-                            <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
484
-                        </a>
485
-                    </div>
486
-                </div>
487
-                
488
-            </div>
489
-            <div class="news_ul">
490
-                <div class="news_list">
491
-                    <div class="news_li">
492
-                        <div class="li_left">
493
-                            <div class="timerData">10</div>
494
-                            <div>24-06</div>
495
-                        </div> 
496
-                        <a class="li_cont" href="./articleDetails.html">
497
-                            <div>4中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
77
+                            <div>0中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
498 78
                             <div>为深化城市安全韧性提升行动,推进数字化、网络化、智能化新型城市基础设施建设,打造承受适应能力强、恢复速度快的韧性城市,增强城市风险防控和治理能力,经党...</div>
499 79
                         </a>
500 80
                     </div>
@@ -591,6 +171,7 @@
591 171
                 </div>
592 172
                 
593 173
             </div>
174
+        
594 175
             <div class="news_paging">
595 176
                 <a id="previousPage" class="previousPage">
596 177
                    <span class="icon iconfont icon-jiantou"></span>

+ 305
- 445
src/pages/news/index.less Zobrazit soubor

@@ -35,7 +35,7 @@
35 35
             margin-bottom: 120px;
36 36
             .news_banner{
37 37
                 width: 750px;
38
-                height: 512px;
38
+                height: 523px;
39 39
                 position: relative;
40 40
                 img{
41 41
                     width: 100%;
@@ -84,14 +84,19 @@
84 84
                     font-size: 20px;
85 85
                     color: #333333;
86 86
                     line-height: 30px;
87
-                    padding-bottom: 20px;
88
-                    border-bottom: 1px solid #E7E7E7;
89 87
                     margin-bottom: 20px;
88
+                    display: -webkit-box;        /* 使用 Flexbox 布局 */
89
+                    -webkit-box-orient: vertical; /* 垂直方向排列 */
90
+                    -webkit-line-clamp: 2;      /* 限制显示的行数,这里是3行 */
91
+                    overflow: hidden;            /* 隐藏超出部分 */
92
+                    text-overflow: ellipsis;    
90 93
                 }
91 94
                 .txt2{
92 95
                     font-size: 16px;
93 96
                     color: #333333;
94 97
                     margin-bottom: 20px;
98
+                    border-top: 1px solid #E7E7E7;
99
+                    padding-top: 20px;
95 100
                 }
96 101
                 .txt3{
97 102
                     font-size: 16px;
@@ -108,13 +113,20 @@
108 113
                     color: #333333;
109 114
                     display: flex;
110 115
                     align-items: center;
116
+                    transition: all .2s;
111 117
                     .icon{
112 118
                         transform: rotate(90deg);
113 119
                         display: inline-block;
114 120
                         color: #000000;
115 121
                         font-size: 24px;
116
-                        margin-top: 5px;
117 122
                         margin-left: 5px;
123
+                        transition: all .2s;
124
+                    }
125
+                    &:hover{
126
+                        color: #b81c25;
127
+                        .icon{
128
+                            color: #b81c25;
129
+                        }
118 130
                     }
119 131
                 }
120 132
             }
@@ -168,13 +180,13 @@
168 180
         max-width: 1920px;
169 181
         margin: 0 auto;
170 182
         background: #F6F6F6;
171
-        display: none;
172 183
         .news_list{
173 184
             width: 1300px;
174 185
             margin: 0 auto;
175 186
             .news_li{
176 187
                 display: flex;
177 188
                 align-items: center;
189
+                justify-content: space-between;
178 190
                 padding: 40px 0;
179 191
                 border-bottom:1px solid #DADADA;
180 192
                 transition: all .2s;
@@ -187,7 +199,6 @@
187 199
                     font-size: 12px;
188 200
                     padding: 0px 12px 0;
189 201
                     box-sizing: border-box;
190
-                    margin-right: 30px;
191 202
                     .timerData{
192 203
                       font-size: 26px;
193 204
                       color: #b81c25;
@@ -237,7 +248,7 @@
237 248
                 .li_cont{
238 249
                     font-weight: 400;
239 250
                     transition: all .2s;
240
-
251
+                    width: 93%;
241 252
                     div:nth-child(1){
242 253
                         font-weight: 500;
243 254
                         font-size: 20px;
@@ -371,527 +382,376 @@ a{
371 382
     display: inline-block;
372 383
 }
373 384
 
374
-@media screen and (min-width: 801px) and (max-width: 1400px) {
375
-    // .main{
376
-    //     .content{
377
-    //         width: calc(100% - 60px);
378
-    //         .banner_box{
379
-    //             .news_banner{
380
-    //                 width: 630px;
381
-    //                 height: 413px;
382
-    //                 .news_content{
383
-    //                     border-radius: 12px;
384
-    //                 }
385
-    //             }   
386
-    //             .news_banner2{
387
-    //                 width: 300px;
388
-    //                 img{
389
-    //                     height: 200px;
390
-    //                 }
391
-    //                 .txt1{
392
-    //                     font-size: 16px;
393
-    //                 }
394
-    //                 .txt2{
395
-    //                     font-size: 14px;
396
-    //                 }
397
-    //                 .txt3{
398
-    //                     font-size: 14px;
399
-    //                 }
400
-    //                 a{
401
-    //                     font-size: 14px;
402
-    //                     .icon{
403
-    //                         margin-top: -2px;
404
-    //                         font-size: 18px;
405
-    //                     }
406
-    //                 }
407
-    //             }
408
-    //         }
409
-    //         .tabs_box{
410
-    //             width: calc(100% - 60px);
411
-    //         }
412
-    //     }
413
-    //     .news_ul {
414
-    //         max-width: 100%;
415
-    //         width: calc(100% - 60px);
416
-    //         overflow: hidden;
417
-    //         .news_list{
418
-    //             width: calc(100% - 60px);
419
-    //         }
420
-    //     }
421
-    //     .news_paging{}
422
-    // }
423
-    .main {
424
-        width: 100%;
425
-        padding-top: 14.5vw;
385
+// @media screen and (min-width: 808px) and (max-width: 1180px){
386
+//     .main{
387
+//         .content{
388
+//             width: calc(100% - 60px);
389
+//             .banner_box{
390
+//                 .news_banner{
391
+//                     width: 430px;
392
+//                     height: 213px;
393
+//                     .news_content{
394
+//                         border-radius: 12px;
395
+//                     }
396
+//                 }   
397
+//                 .news_banner2{
398
+//                     width: 300px;
399
+//                     img{
400
+//                         height: 200px;
401
+//                     }
402
+//                     .txt1{
403
+//                         font-size: 16px;
404
+//                     }
405
+//                     .txt2{
406
+//                         font-size: 14px;
407
+//                     }
408
+//                     .txt3{
409
+//                         font-size: 14px;
410
+//                     }
411
+//                     a{
412
+//                         font-size: 14px;
413
+//                         .icon{
414
+//                             margin-top: -2px;
415
+//                             font-size: 18px;
416
+//                         }
417
+//                     }
418
+//                 }
419
+//             }
420
+//             .tabs_box{
421
+//                 width: calc(100% - 60px);
422
+//             }
423
+//         }
424
+//         .news_ul {
425
+//             max-width: 100%;
426
+//             width: calc(100% - 60px);
427
+//             overflow: hidden;
428
+//             .news_list{
429
+//                 width: calc(100% - 60px);
430
+//             }
431
+//         }
432
+//         .news_paging{}
433
+//     }
434
+// }
435
+@media screen and (min-width: 808px) and (max-width: 1400px) {
436
+    .main{
426 437
         .content{
427
-            width: 92vw;
428
-            margin: 0 auto;
429
-            .news_title{
430
-                display: block;
431
-                margin-bottom: 12.5vw;
432
-                padding-top: 50px;
433
-                .title{
434
-                    font-size: 32px;
435
-                    text-align: center;
436
-                }
437
-                .title_screen{
438
-                    margin-top: 10.625vw;
439
-                    .screen_li{
440
-                        width: 44.625vw;
441
-                        height: 9.375vw;
442
-                        font-size: 3.5vw;
443
-                        .screen_box{
444
-                            .screen_box_li{
445
-                                font-size: 3.5vw;
446
-                                height: 8vw;
447
-                                line-height: 8vw;
448
-                            }
449
-                        }
450
-                        svg{
451
-                            width:5.5vw;
452
-                            height: 4vw;
453
-                        }
454
-                    }
455
-                }
456
-            }
438
+            width: calc(100% - 60px);
457 439
             .banner_box{
458
-                display: block;
459
-                margin-bottom: 15vw;
460 440
                 .news_banner{
461
-                    width: 100%;
462
-                    height: auto;
463
-                    margin-bottom: 8vw;
464
-                   
465
-                    img{
466
-                        width: 100%;
467
-                        height: 62.75vw;
468
-                        border-radius: 1.625vw;
469
-                        object-fit: cover;
470
-                    }
471
-                    
441
+                    width: 630px;
442
+                    height: 413px;
472 443
                     .news_content{
473
-                        padding: 3.75vw;
474
-                        display: flex;
475
-                        flex-wrap: wrap;
476
-                        flex-direction: column-reverse;
477
-                        .cont1{
478
-                            font-weight: bold;
479
-                            font-size: 3.75vw;
480
-                            color: #fff;
481
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
482
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
483
-                            -webkit-line-clamp: 2;      /* 限制显示的行数,这里是3行 */
484
-                            overflow: hidden;            /* 隐藏超出部分 */
485
-                            text-overflow: ellipsis;     /* 用省略号表示超出部分 */
486
-                        }
487
-                        .cont2{
488
-                            width: 100%;
489
-                            font-size: 3.375vw;
490
-                            color: #fff;
491
-                            margin-bottom: 2.5vw;
492
-                        }
493
-                        .cont3{
494
-                            font-size: 3.25vw;
495
-                            color: #fff;
496
-                        }
444
+                        border-radius: 12px;
497 445
                     }
498
-                    
499
-                }
446
+                }   
500 447
                 .news_banner2{
501
-                    width: 100%;
502
-                    display: flex;
503
-                    align-items: center;
504
-                    justify-content: space-between;
505
-                    margin-bottom: 10.75vw;
448
+                    width: 300px;
506 449
                     img{
507
-                        width: 45.375vw;
508
-                        height: 34vw;
509
-                        margin-bottom: 0;
510
-                        border-radius: 1.625vw;
511
-                    }
512
-                    .banner2_cont{
513
-                        width: 42.5vw;
450
+                        height: 200px;
514 451
                     }
515 452
                     .txt1{
516
-                        width: 42.5vw;
517
-                        font-size: 3.75vw;
518
-                        display: -webkit-box;           /* 使用 Flexbox 布局 */
519
-                        -webkit-box-orient: vertical;   /* 垂直方向排列 */
520
-                        -webkit-line-clamp: 2;         /* 限制显示的行数,这里是3行 */
521
-                        overflow: hidden;               /* 隐藏超出部分 */
522
-                        text-overflow: ellipsis; 
523
-                        line-height: 1.5;
524
-                        padding-bottom: 0;
525
-                        margin-bottom: 5.375vw;
526
-                        border: 0;
453
+                        font-size: 16px;
527 454
                     }
528 455
                     .txt2{
529
-                        margin-bottom: 5.5vw;
530
-                        font-size: 3.25vw;
531
-                        color: #999999;
456
+                        font-size: 14px;
532 457
                     }
533 458
                     .txt3{
534
-                        display: none;
459
+                        font-size: 14px;
535 460
                     }
536 461
                     a{
537
-                        font-size: 3.325vw;
462
+                        font-size: 14px;
538 463
                         .icon{
539
-                            font-size: 4.325vw;
540
-                            margin-top: 0;
464
+                            margin-top: -2px;
465
+                            font-size: 18px;
541 466
                         }
542 467
                     }
543 468
                 }
544 469
             }
545 470
             .tabs_box{
546
-                width: 100%;
547
-                font-size: 3.75vw;
548
-                display: flex;
549
-                align-items: center;
550
-                justify-content: space-between;
551
-                .tabs_li{
552
-                    margin-right: 0;
553
-                    padding-bottom: 5.625vw;
554
-                }
471
+                width: calc(100% - 60px);
555 472
             }
556 473
         }
557
-        .news_ul{
474
+        .news_ul {
475
+            max-width: 100%;
476
+            // width: calc(100% - 60px);
558 477
             width: 100%;
478
+            padding: 0 30px;
479
+            overflow: hidden;
480
+            box-sizing: border-box;
559 481
             .news_list{
560
-                margin-top: 0;
561
-                width: 100%;
562
-                box-sizing: border-box;
563
-                padding: 0 3.75vw;
564
-                .news_li{
565
-                    padding:5.625vw 0;
566
-                    display: flex;
567
-                    align-items: center;
568
-                    justify-content: space-between;
569
-                    .li_left{
570
-                        width: 16.25vw;
571
-                        height: 16.25vw;
572
-                        margin-right: 0;
573
-                        font-size: 3.5vw;
574
-
575
-                        .timerData{
576
-                            font-size: 3.5vw;
577
-                            padding-top: 3vw;
578
-                            padding-bottom: 2vw;
579
-                        }
580
-                    }
581
-                    .li_cont{
582
-                        width: 71.5vw;
583
-                        div:nth-child(1){
584
-                            font-size: 3.75vw;
585
-                            color: #282828;
586
-                            line-height: 7.5vw;
587
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
588
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
589
-                            -webkit-line-clamp: 1;      /* 限制显示的行数,这里是3行 */
590
-                            overflow: hidden;     
591
-                            font-weight: bold;
592
-                        }
593
-                        div:nth-child(2){
594
-                            width: auto;
595
-                            height: auto;
596
-                            overflow: unset;
597
-                            line-height: 1.5;
598
-                            font-size: 3.25vw;
599
-                            color: #A7A5A5;
600
-                            padding: 0;
601
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
602
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
603
-                            -webkit-line-clamp: 2;      /* 限制显示的行数,这里是3行 */
604
-                            overflow: hidden;     
605
-                        }
606
-                      
607
-                    }
608
-                }
609
-            }
610
-        }
611
-        .news_paging{
612
-            padding-top: 16vw;
613
-            .previousPage{
614
-                width: 40px;
615
-                height: 40px;
616
-                margin-right: 20px;
617
-                box-sizing: border-box;
618
-            }
619
-            .nextPage{
620
-                width: 40px;
621
-                height: 40px;
622
-                margin-left: 3.25vw;
623
-                transition: all 0.2s;
624
-                box-sizing: border-box;
625
-            }
626
-            .pageNum{
627
-                font-size: 3.5vw;
628
-            }
629
-            .ellipsis{
630
-                font-size: 3.5vw;
631
-                padding: 1.875vw 2.5vw;
632
-                // &:hover{
633
-                //     color:#48A038
634
-                // }
482
+                width: calc(100% - 60px);
635 483
             }
636 484
         }
485
+        .news_paging{}
637 486
     }
638
-}
639
-@media screen and (min-width: 1400px) and (max-width: 1600px) {
640
-    // .main{
487
+    // .main {
488
+    //     width: 100%;
489
+    //     padding-top: 14.5vw;
641 490
     //     .content{
642
-    //         width: calc(100% - 60px);
491
+    //         width: 92vw;
492
+    //         margin: 0 auto;
493
+    //         .news_title{
494
+    //             display: block;
495
+    //             margin-bottom: 12.5vw;
496
+    //             padding-top: 50px;
497
+    //             .title{
498
+    //                 font-size: 32px;
499
+    //                 text-align: center;
500
+    //             }
501
+    //             .title_screen{
502
+    //                 margin-top: 10.625vw;
503
+    //                 .screen_li{
504
+    //                     width: 44.625vw;
505
+    //                     height: 9.375vw;
506
+    //                     font-size: 3.5vw;
507
+    //                     .screen_box{
508
+    //                         .screen_box_li{
509
+    //                             font-size: 3.5vw;
510
+    //                             height: 8vw;
511
+    //                             line-height: 8vw;
512
+    //                         }
513
+    //                     }
514
+    //                     svg{
515
+    //                         width:5.5vw;
516
+    //                         height: 4vw;
517
+    //                     }
518
+    //                 }
519
+    //             }
520
+    //         }
643 521
     //         .banner_box{
522
+    //             display: block;
523
+    //             margin-bottom: 15vw;
644 524
     //             .news_banner{
645
-    //                 width: 690px;
646
-    //                 height: 455px;
525
+    //                 width: 100%;
526
+    //                 height: auto;
527
+    //                 margin-bottom: 8vw;
528
+                   
529
+    //                 img{
530
+    //                     width: 100%;
531
+    //                     height: 62.75vw;
532
+    //                     border-radius: 1.625vw;
533
+    //                     object-fit: cover;
534
+    //                 }
535
+                    
647 536
     //                 .news_content{
648
-    //                     border-radius: 12px;
537
+    //                     padding: 3.75vw;
538
+    //                     display: flex;
539
+    //                     flex-wrap: wrap;
540
+    //                     flex-direction: column-reverse;
541
+    //                     .cont1{
542
+    //                         font-weight: bold;
543
+    //                         font-size: 3.75vw;
544
+    //                         color: #fff;
545
+    //                         display: -webkit-box;        /* 使用 Flexbox 布局 */
546
+    //                         -webkit-box-orient: vertical; /* 垂直方向排列 */
547
+    //                         -webkit-line-clamp: 2;      /* 限制显示的行数,这里是3行 */
548
+    //                         overflow: hidden;            /* 隐藏超出部分 */
549
+    //                         text-overflow: ellipsis;     /* 用省略号表示超出部分 */
550
+    //                     }
551
+    //                     .cont2{
552
+    //                         width: 100%;
553
+    //                         font-size: 3.375vw;
554
+    //                         color: #fff;
555
+    //                         margin-bottom: 2.5vw;
556
+    //                     }
557
+    //                     .cont3{
558
+    //                         font-size: 3.25vw;
559
+    //                         color: #fff;
560
+    //                     }
649 561
     //                 }
650
-    //             }   
562
+                    
563
+    //             }
651 564
     //             .news_banner2{
652
-    //                 width: 330px;
565
+    //                 width: 100%;
566
+    //                 display: flex;
567
+    //                 align-items: center;
568
+    //                 justify-content: space-between;
569
+    //                 margin-bottom: 10.75vw;
653 570
     //                 img{
654
-    //                     height: 200px;
571
+    //                     width: 45.375vw;
572
+    //                     height: 34vw;
573
+    //                     margin-bottom: 0;
574
+    //                     border-radius: 1.625vw;
575
+    //                 }
576
+    //                 .banner2_cont{
577
+    //                     width: 42.5vw;
655 578
     //                 }
656 579
     //                 .txt1{
657
-    //                     font-size: 16px;
580
+    //                     width: 42.5vw;
581
+    //                     font-size: 3.75vw;
582
+    //                     display: -webkit-box;           /* 使用 Flexbox 布局 */
583
+    //                     -webkit-box-orient: vertical;   /* 垂直方向排列 */
584
+    //                     -webkit-line-clamp: 2;         /* 限制显示的行数,这里是3行 */
585
+    //                     overflow: hidden;               /* 隐藏超出部分 */
586
+    //                     text-overflow: ellipsis; 
587
+    //                     line-height: 1.5;
588
+    //                     padding-bottom: 0;
589
+    //                     margin-bottom: 5.375vw;
590
+    //                     border: 0;
658 591
     //                 }
659 592
     //                 .txt2{
660
-    //                     font-size: 14px;
593
+    //                     margin-bottom: 5.5vw;
594
+    //                     font-size: 3.25vw;
595
+    //                     color: #999999;
661 596
     //                 }
662 597
     //                 .txt3{
663
-    //                     font-size: 14px;
598
+    //                     display: none;
664 599
     //                 }
665 600
     //                 a{
666
-    //                     font-size: 14px;
601
+    //                     font-size: 3.325vw;
667 602
     //                     .icon{
668
-    //                         margin-top: -2px;
669
-    //                         font-size: 18px;
603
+    //                         font-size: 4.325vw;
604
+    //                         margin-top: 0;
670 605
     //                     }
671 606
     //                 }
672 607
     //             }
673 608
     //         }
674 609
     //         .tabs_box{
675
-    //             width: calc(100% - 60px);
610
+    //             width: 100%;
611
+    //             font-size: 3.75vw;
612
+    //             display: flex;
613
+    //             align-items: center;
614
+    //             justify-content: space-between;
615
+    //             .tabs_li{
616
+    //                 margin-right: 0;
617
+    //                 padding-bottom: 5.625vw;
618
+    //             }
676 619
     //         }
677 620
     //     }
678
-    //     .news_ul {
679
-    //         max-width: 100%;
680
-    //         width: calc(100% - 60px);
681
-    //         overflow: hidden;
621
+    //     .news_ul{
622
+    //         width: 100%;
682 623
     //         .news_list{
683
-    //             width: calc(100% - 60px);
624
+    //             margin-top: 0;
625
+    //             width: 100%;
626
+    //             box-sizing: border-box;
627
+    //             padding: 0 3.75vw;
628
+    //             .news_li{
629
+    //                 padding:5.625vw 0;
630
+    //                 display: flex;
631
+    //                 align-items: center;
632
+    //                 justify-content: space-between;
633
+    //                 .li_left{
634
+    //                     width: 16.25vw;
635
+    //                     height: 16.25vw;
636
+    //                     margin-right: 0;
637
+    //                     font-size: 3.5vw;
638
+
639
+    //                     .timerData{
640
+    //                         font-size: 3.5vw;
641
+    //                         padding-top: 3vw;
642
+    //                         padding-bottom: 2vw;
643
+    //                     }
644
+    //                 }
645
+    //                 .li_cont{
646
+    //                     width: 71.5vw;
647
+    //                     div:nth-child(1){
648
+    //                         font-size: 3.75vw;
649
+    //                         color: #282828;
650
+    //                         line-height: 7.5vw;
651
+    //                         display: -webkit-box;        /* 使用 Flexbox 布局 */
652
+    //                         -webkit-box-orient: vertical; /* 垂直方向排列 */
653
+    //                         -webkit-line-clamp: 1;      /* 限制显示的行数,这里是3行 */
654
+    //                         overflow: hidden;     
655
+    //                         font-weight: bold;
656
+    //                     }
657
+    //                     div:nth-child(2){
658
+    //                         width: auto;
659
+    //                         height: auto;
660
+    //                         overflow: unset;
661
+    //                         line-height: 1.5;
662
+    //                         font-size: 3.25vw;
663
+    //                         color: #A7A5A5;
664
+    //                         padding: 0;
665
+    //                         display: -webkit-box;        /* 使用 Flexbox 布局 */
666
+    //                         -webkit-box-orient: vertical; /* 垂直方向排列 */
667
+    //                         -webkit-line-clamp: 2;      /* 限制显示的行数,这里是3行 */
668
+    //                         overflow: hidden;     
669
+    //                     }
670
+                      
671
+    //                 }
672
+    //             }
673
+    //         }
674
+    //     }
675
+    //     .news_paging{
676
+    //         padding-top: 16vw;
677
+    //         .previousPage{
678
+    //             width: 40px;
679
+    //             height: 40px;
680
+    //             margin-right: 20px;
681
+    //             box-sizing: border-box;
682
+    //         }
683
+    //         .nextPage{
684
+    //             width: 40px;
685
+    //             height: 40px;
686
+    //             margin-left: 3.25vw;
687
+    //             transition: all 0.2s;
688
+    //             box-sizing: border-box;
689
+    //         }
690
+    //         .pageNum{
691
+    //             font-size: 3.5vw;
692
+    //         }
693
+    //         .ellipsis{
694
+    //             font-size: 3.5vw;
695
+    //             padding: 1.875vw 2.5vw;
696
+    //             // &:hover{
697
+    //             //     color:#48A038
698
+    //             // }
684 699
     //         }
685 700
     //     }
686
-    //     .news_paging{}
687 701
     // }
688
-    .main {
689
-        width: 100%;
690
-        padding-top: 14.5vw;
702
+}
703
+@media screen and (min-width: 1400px) and (max-width: 1600px) {
704
+    .main{
691 705
         .content{
692
-            width: 92vw;
693
-            margin: 0 auto;
694
-            .news_title{
695
-                display: block;
696
-                margin-bottom: 12.5vw;
697
-                padding-top: 50px;
698
-                .title{
699
-                    font-size: 32px;
700
-                    text-align: center;
701
-                }
702
-                .title_screen{
703
-                    margin-top: 10.625vw;
704
-                    .screen_li{
705
-                        width: 44.625vw;
706
-                        height: 9.375vw;
707
-                        font-size: 3.5vw;
708
-                        .screen_box{
709
-                            .screen_box_li{
710
-                                font-size: 3.5vw;
711
-                                height: 8vw;
712
-                                line-height: 8vw;
713
-                            }
714
-                        }
715
-                        svg{
716
-                            width:5.5vw;
717
-                            height: 4vw;
718
-                        }
719
-                    }
720
-                }
721
-            }
706
+            width: calc(100% - 60px);
722 707
             .banner_box{
723
-                display: block;
724
-                margin-bottom: 15vw;
725 708
                 .news_banner{
726
-                    width: 100%;
727
-                    height: auto;
728
-                    margin-bottom: 8vw;
729
-                   
730
-                    img{
731
-                        width: 100%;
732
-                        height: 62.75vw;
733
-                        border-radius: 1.625vw;
734
-                        object-fit: cover;
735
-                    }
736
-                    
709
+                    width: 690px;
710
+                    height: 455px;
737 711
                     .news_content{
738
-                        padding: 3.75vw;
739
-                        display: flex;
740
-                        flex-wrap: wrap;
741
-                        flex-direction: column-reverse;
742
-                        .cont1{
743
-                            font-weight: bold;
744
-                            font-size: 3.75vw;
745
-                            color: #fff;
746
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
747
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
748
-                            -webkit-line-clamp: 2;      /* 限制显示的行数,这里是3行 */
749
-                            overflow: hidden;            /* 隐藏超出部分 */
750
-                            text-overflow: ellipsis;     /* 用省略号表示超出部分 */
751
-                        }
752
-                        .cont2{
753
-                            width: 100%;
754
-                            font-size: 3.375vw;
755
-                            color: #fff;
756
-                            margin-bottom: 2.5vw;
757
-                        }
758
-                        .cont3{
759
-                            font-size: 3.25vw;
760
-                            color: #fff;
761
-                        }
712
+                        border-radius: 12px;
762 713
                     }
763
-                    
764
-                }
714
+                }   
765 715
                 .news_banner2{
766
-                    width: 100%;
767
-                    display: flex;
768
-                    align-items: center;
769
-                    justify-content: space-between;
770
-                    margin-bottom: 10.75vw;
716
+                    width: 330px;
771 717
                     img{
772
-                        width: 45.375vw;
773
-                        height: 34vw;
774
-                        margin-bottom: 0;
775
-                        border-radius: 1.625vw;
776
-                    }
777
-                    .banner2_cont{
778
-                        width: 42.5vw;
718
+                        height: 200px;
779 719
                     }
780 720
                     .txt1{
781
-                        width: 42.5vw;
782
-                        font-size: 3.75vw;
783
-                        display: -webkit-box;           /* 使用 Flexbox 布局 */
784
-                        -webkit-box-orient: vertical;   /* 垂直方向排列 */
785
-                        -webkit-line-clamp: 2;         /* 限制显示的行数,这里是3行 */
786
-                        overflow: hidden;               /* 隐藏超出部分 */
787
-                        text-overflow: ellipsis; 
788
-                        line-height: 1.5;
789
-                        padding-bottom: 0;
790
-                        margin-bottom: 5.375vw;
791
-                        border: 0;
721
+                        font-size: 16px;
792 722
                     }
793 723
                     .txt2{
794
-                        margin-bottom: 5.5vw;
795
-                        font-size: 3.25vw;
796
-                        color: #999999;
724
+                        font-size: 14px;
797 725
                     }
798 726
                     .txt3{
799
-                        display: none;
727
+                        font-size: 14px;
800 728
                     }
801 729
                     a{
802
-                        font-size: 3.325vw;
730
+                        font-size: 14px;
803 731
                         .icon{
804
-                            font-size: 4.325vw;
805
-                            margin-top: 0;
732
+                            margin-top: -2px;
733
+                            font-size: 18px;
806 734
                         }
807 735
                     }
808 736
                 }
809 737
             }
810 738
             .tabs_box{
811
-                width: 100%;
812
-                font-size: 3.75vw;
813
-                display: flex;
814
-                align-items: center;
815
-                justify-content: space-between;
816
-                .tabs_li{
817
-                    margin-right: 0;
818
-                    padding-bottom: 5.625vw;
819
-                }
739
+                width: calc(100% - 60px);
820 740
             }
821 741
         }
822
-        .news_ul{
742
+        .news_ul {
743
+            max-width: 100%;
744
+            // width: calc(100% - 60px);
823 745
             width: 100%;
746
+            padding: 0 30px;
747
+            overflow: hidden;
824 748
             .news_list{
825
-                margin-top: 0;
826
-                width: 100%;
827
-                box-sizing: border-box;
828
-                padding: 0 3.75vw;
829
-                .news_li{
830
-                    padding:5.625vw 0;
831
-                    display: flex;
832
-                    align-items: center;
833
-                    justify-content: space-between;
834
-                    .li_left{
835
-                        width: 16.25vw;
836
-                        margin-right: 0;
837
-                    }
838
-                    .li_cont{
839
-                        width: 71.5vw;
840
-                        div:nth-child(1){
841
-                            font-size: 3.75vw;
842
-                            color: #282828;
843
-                            line-height: 7.5vw;
844
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
845
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
846
-                            -webkit-line-clamp: 1;      /* 限制显示的行数,这里是3行 */
847
-                            overflow: hidden;     
848
-                            font-weight: bold;
849
-                        }
850
-                        div:nth-child(2){
851
-                            width: auto;
852
-                            height: auto;
853
-                            overflow: unset;
854
-                            line-height: 1.5;
855
-                            font-size: 3.25vw;
856
-                            color: #A7A5A5;
857
-                            padding: 0;
858
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
859
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
860
-                            -webkit-line-clamp: 2;      /* 限制显示的行数,这里是3行 */
861
-                            overflow: hidden;     
862
-                        }
863
-                      
864
-                    }
865
-                }
866
-            }
867
-        }
868
-        .news_paging{
869
-            padding-top: 16vw;
870
-            .previousPage{
871
-                width: 40px;
872
-                height: 40px;
873
-                margin-right: 20px;
874
-                box-sizing: border-box;
875
-            }
876
-            .nextPage{
877
-                width: 40px;
878
-                height: 40px;
879
-                margin-left: 3.25vw;
880
-                transition: all 0.2s;
881
-                box-sizing: border-box;
882
-            }
883
-            .pageNum{
884
-                font-size: 3.5vw;
885
-            }
886
-            .ellipsis{
887
-                font-size: 3.5vw;
888
-                padding: 1.875vw 2.5vw;
889
-                // &:hover{
890
-                //     color:#48A038
891
-                // }
749
+                width: calc(100% - 60px);
892 750
             }
893 751
         }
752
+        .news_paging{}
894 753
     }
754
+
895 755
 }
896 756
 
897 757
 //移动端样式

+ 2
- 2
src/pages/partyBuilding/index.html Zobrazit soubor

@@ -15,7 +15,7 @@
15 15
 <body>
16 16
     <%= require('../common/tpl/header.tpl') %>
17 17
         <div class="main">
18
-            <div class="content" id="p1">
18
+            <div class="content" >
19 19
                 <div class="news_title wow fadeInUp">党建工作</div>
20 20
             </div>
21 21
             <div class="wow domInUp banner">
@@ -38,7 +38,7 @@
38 38
                   <div class="btn-next btn-nextB"><span class="icon iconfont icon-jiantou"></span></div>
39 39
                 </div>
40 40
             </div>
41
-            <div class="content content2">
41
+            <div class="content content2" id="p1">
42 42
                 <div class="news_title">企业党建</div>
43 43
             </div>
44 44
             <div class="tabs_box">

+ 50
- 0
src/pages/socialResponsibility/App.js Zobrazit soubor

@@ -15,7 +15,57 @@ export default class App {
15 15
         this.num = 0;
16 16
         this.bindDom();
17 17
         // this.fold()
18
+        // 获取当前链接的 hash 部分
19
+        // 监听 hashchange 事件
20
+        window.addEventListener('hashchange', ()=>this.handleHashChange());
21
+
22
+        // 如果需要在页面加载时也获取一次当前 hash
23
+        this.handleHashChange();
24
+       
25
+    }
26
+    // 定义一个函数来处理 hash 变化
27
+    handleHashChange() {
28
+        const hash = window.location.hash; // 获取当前链接的 hash 部分
29
+        const params = hash.substring(1); // 去掉 #
30
+        console.log(params); // 输出变化后的参数
31
+        if(!params) return;
32
+        if(this.getAnchorPoint) {
33
+            this.getAnchorPoint(params)
34
+        }else {
35
+            getAnchorPoint(params)
36
+        }   
37
+    }
38
+
39
+    getAnchorPoint(params){
40
+        const tabs_ul = document.querySelectorAll(".tabs_li");
41
+        const news_ul = document.querySelector(".news_ul");
42
+        const typeCon = document.querySelector(".typeCon");
43
+        tabs_ul.forEach((item,index)=>{
18 44
         
45
+            tabs_ul.forEach((li) => {
46
+                li.classList.remove('tabs_lis');
47
+            });
48
+            if(params == 'p2'){
49
+                tabs_ul[1].classList.add('tabs_lis')
50
+                news_ul.style.display = 'none';
51
+                typeCon.style.display = 'block';
52
+            }else{
53
+                tabs_ul[0].classList.add('tabs_lis')
54
+                news_ul.style.display = 'block';
55
+                typeCon.style.display = 'none';
56
+            }
57
+            // 获取目标元素
58
+            const targetElement = document.querySelector('#tab');
59
+
60
+            // 获取目标元素的位置信息
61
+            if (targetElement) {
62
+                const topPosition = targetElement.getBoundingClientRect().top + window.scrollY;
63
+
64
+                // 滚动到目标元素的位置
65
+                window.scrollTo({ top: topPosition, behavior: 'smooth' });
66
+            }
67
+
68
+        })
19 69
     }
20 70
 
21 71
     bindDom(){

+ 2
- 2
src/pages/socialResponsibility/index.html Zobrazit soubor

@@ -31,8 +31,8 @@
31 31
           </div>
32 32
         </div>
33 33
         <div class="tabs_box" id="tab">
34
-          <div class="tabs_li tabs_lis">社会公益</div>
35
-          <div class="tabs_li">绿色转型</div>
34
+          <div class="tabs_li tabs_lis" data-id="p1">社会公益</div>
35
+          <div class="tabs_li" data-id="p2">绿色转型</div>
36 36
         </div>
37 37
       </div>
38 38
       <div class="news_ul">

+ 1
- 1
src/pages/socialResponsibility/index.less Zobrazit soubor

@@ -72,7 +72,7 @@
72 72
                 color: #231F20;
73 73
                 margin-right: 80px;
74 74
                 cursor: pointer;
75
-                padding-bottom: 30px;
75
+                padding: 30px 0;
76 76
                 transition: all .2s;
77 77
                 border-bottom: 2px solid transparent;
78 78
                 position: relative;

Načítá se…
Zrušit
Uložit