Commit c1ad09c9f241fb2cd9e06132a88f8ea596a17d5e

Authored by DESKTOP-QHAFKU5\iceling
1 parent cd0c59aa

商品界面优化

components/diy_goodsGroup/diy_goodsGroup.wxml
... ... @@ -44,9 +44,9 @@
44 44 <block wx:if="{{card_field}}">
45 45 <!-- 等级价>0 -->
46 46 <block wx:if="{{item[card_field]>0}}">
47   - <view class="money flex" >
  47 + <view class="money flex ai_and">
48 48 <!-- 办卡价 -->
49   - <view class="flex xc-wc ">
  49 + <view class="flex xc-wc ai_and">
50 50 <view class="fs24 wz_red">¥</view>
51 51 <view class="fs35 wz_red">{{filter.toFix(item[card_field],2)}}</view>
52 52 <view class="card_bg"><image src="{{url}}/miniapp/images/plus/dj_icon.png"></image><view class="card_name">{{card_name}}</view></view>
... ... @@ -95,7 +95,7 @@
95 95 </view>
96 96 <view class="flex" style="line-height: 28rpx;" >
97 97 <!-- 等级价 -->
98   - <view class="price flex">
  98 + <view class="price flex ai_and">
99 99 <view class="fs22">¥</view>
100 100 <view class="fs28">{{filter.toFix(g_filter.get_card_price(item,card_list,0),2)}}</view>
101 101 <view class="card_bg"> <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>{{g_filter.get_card_price(item,card_list,1)}}</view>
... ... @@ -183,7 +183,7 @@
183 183 <block wx:if="{{item[card_field]>0}}">
184 184 <view class="money flex" >
185 185 <!-- 办卡价 -->
186   - <view class="flex xc-wc">
  186 + <view class="flex xc-wc ai_and">
187 187 <view class="fs24 wz_red">¥</view>
188 188 <view class="fs35 wz_red">{{filter.toFix(item[card_field],2)}}</view>
189 189 <view class="card_bg"><image src="{{url}}/miniapp/images/plus/dj_icon.png"></image><view class="card_name">{{card_name}}</view></view>
... ... @@ -232,7 +232,7 @@
232 232 </view>
233 233 <view class="flex" style="line-height: 28rpx;" >
234 234 <!-- 等级价 -->
235   - <view class="price flex">
  235 + <view class="price flex ai_and">
236 236 <view class="fs22">¥</view>
237 237 <view class="fs28">{{filter.toFix(g_filter.get_card_price(item,card_list,0),2)}}</view>
238 238 <view class="card_bg"> <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>{{g_filter.get_card_price(item,card_list,1)}}</view>
... ... @@ -319,7 +319,7 @@
319 319 <block wx:if="{{item[card_field]>0}}">
320 320 <view class="money flex" >
321 321 <!-- 办卡价 -->
322   - <view class="flex xc-wc">
  322 + <view class="flex xc-wc ai_and">
323 323 <view class="fs24 wz_red">¥</view>
324 324 <view class="fs35 wz_red">{{filter.toFix(item[card_field],2)}}</view>
325 325 <view class="card_bg"><image src="{{url}}/miniapp/images/plus/dj_icon.png"></image><view class="card_name">{{card_name}}</view></view>
... ... @@ -368,7 +368,7 @@
368 368 </view>
369 369 <view class="flex" style="line-height: 28rpx;" >
370 370 <!-- 等级价 -->
371   - <view class="price flex">
  371 + <view class="price flex ai_and">
372 372 <view class="fs22">¥</view>
373 373 <view class="fs28">{{filter.toFix(g_filter.get_card_price(item,card_list,0),2)}}</view>
374 374 <view class="card_bg"> <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>{{g_filter.get_card_price(item,card_list,1)}}</view>
... ... @@ -450,7 +450,7 @@
450 450 <block wx:if="{{item[card_field]>0}}">
451 451 <view class="money flex" >
452 452 <!-- 办卡价 -->
453   - <view class="flex xc-wc">
  453 + <view class="flex xc-wc ai_and">
454 454 <view class="fs24 wz_red">¥</view>
455 455 <view class="fs35 wz_red">{{filter.toFix(item[card_field],2)}}</view>
456 456 <view class="card_bg"><image src="{{url}}/miniapp/images/plus/dj_icon.png"></image><view class="card_name">{{card_name}}</view></view>
... ... @@ -499,7 +499,7 @@
499 499 </view>
500 500 <view class="flex" style="line-height: 28rpx;" >
501 501 <!-- 等级价 -->
502   - <view class="price flex">
  502 + <view class="price flex ai_and">
503 503 <view class="fs22">¥</view>
504 504 <view class="fs28">{{filter.toFix(g_filter.get_card_price(item,card_list,0),2)}}</view>
505 505 <view class="card_bg"> <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>{{g_filter.get_card_price(item,card_list,1)}}</view>
... ...
components/diy_goodsGroup/diy_goodsGroup.wxss
1 1 /* pages/diy_zs/diy_zs.wxss */
2   -.zwp_3{ margin-top: 10rpx}
3   -.zs_goods{
  2 +
  3 +.zwp_3 {
  4 + margin-top: 10rpx;
  5 +}
  6 +
  7 +.zs_goods {
4 8 width: 700rpx;
5 9 border: 1rpx #ddd solid;
6 10 margin-bottom: 10rpx;
7 11 margin: 0 auto;
8   -
9 12 }
10   -.s1_gk_a1{
  13 +
  14 +.s1_gk_a1 {
11 15 display: inline;
12 16 width: auto;
13 17 height: auto;
14 18 }
15   -.clear{ clear: both;}
16   -.zs_top{
  19 +
  20 +.clear {
  21 + clear: both;
  22 +}
  23 +
  24 +.zs_top {
17 25 width: 100%;
18 26 min-height: 700rpx;
19 27 margin: 0 auto;
20   - margin-bottom:30rpx;
  28 + margin-bottom: 30rpx;
21 29 display: flex;
22 30 }
23 31  
... ... @@ -27,66 +35,62 @@
27 35 margin: 1rpx auto;
28 36 }
29 37  
30   -.zs_center{
31   - width: 100%;
32   - min-height: 200rpx;
33   - font-size: 28rpx;
34   - color: #333;
35   - text-align: left;
36   - margin-left: 25rpx;
37   - padding: 0 10rpx;
  38 +.zs_center {
  39 + width: 100%;
  40 + min-height: 200rpx;
  41 + font-size: 28rpx;
  42 + color: #333;
  43 + text-align: left;
  44 + margin-left: 25rpx;
  45 + padding: 0 10rpx;
38 46 }
39 47  
40   -.zs_wz1{
  48 +.zs_wz1 {
41 49 overflow: hidden;
42   - text-overflow: ellipsis;
43   - margin-bottom:10rpx;
44   - font-size:28rpx;
45   - white-space: nowrap;
46   - width: 640rpx
  50 + text-overflow: ellipsis;
  51 + margin-bottom: 10rpx;
  52 + font-size: 28rpx;
  53 + white-space: nowrap;
  54 + width: 640rpx;
47 55 }
48 56  
49   -
50   -.zs_wz2{
  57 +.zs_wz2 {
51 58 overflow: hidden;
52   - text-overflow: ellipsis;
53   - margin-bottom:10rpx;
54   -font-size:28rpx;
55   - white-space: nowrap;
  59 + text-overflow: ellipsis;
  60 + margin-bottom: 10rpx;
  61 + font-size: 28rpx;
  62 + white-space: nowrap;
56 63 }
57 64  
58   -.zs_wz3{
  65 +.zs_wz3 {
59 66 overflow: hidden;
60   - text-overflow: ellipsis;
61   - margin-bottom:10rpx;
62   -font-size:28rpx;
63   - white-space: nowrap;
  67 + text-overflow: ellipsis;
  68 + margin-bottom: 10rpx;
  69 + font-size: 28rpx;
  70 + white-space: nowrap;
64 71 }
65 72  
66   -.zs_wz4{
  73 +.zs_wz4 {
67 74 overflow: hidden;
68   - text-overflow: ellipsis;
69   - margin-bottom:10rpx;
70   -font-size:28rpx;
71   - white-space: nowrap;
  75 + text-overflow: ellipsis;
  76 + margin-bottom: 10rpx;
  77 + font-size: 28rpx;
  78 + white-space: nowrap;
72 79 }
73 80  
74   -.zs_wz5{
  81 +.zs_wz5 {
75 82 overflow: hidden;
76   - text-overflow: ellipsis;
77   - font-size:30rpx;
78   - white-space: nowrap;
  83 + text-overflow: ellipsis;
  84 + font-size: 30rpx;
  85 + white-space: nowrap;
79 86 }
80 87  
81   -.wz_red{
82   -
83   - color: #C4182E;
84   - font-size: 32rpx;
  88 +.wz_red {
  89 + color: #c4182e;
  90 + font-size: 32rpx;
85 91 }
86 92  
87   -
88   -
89   -.zs_t1{
  93 +.zs_t1 {
90 94 width: 56rpx;
91 95 height: 56rpx;
92 96 position: absolute;
... ... @@ -94,8 +98,7 @@ font-size:28rpx;
94 98 top: 10rpx;
95 99 }
96 100  
97   -
98   -.zs_t2{
  101 +.zs_t2 {
99 102 width: 56rpx;
100 103 height: 56rpx;
101 104 position: absolute;
... ... @@ -103,7 +106,7 @@ font-size:28rpx;
103 106 top: 10rpx;
104 107 }
105 108  
106   -.zs_t3{
  109 +.zs_t3 {
107 110 width: 56rpx;
108 111 height: 56rpx;
109 112 position: absolute;
... ... @@ -111,8 +114,7 @@ font-size:28rpx;
111 114 bottom: 10rpx;
112 115 }
113 116  
114   -
115   -.zs_t4{
  117 +.zs_t4 {
116 118 width: 56rpx;
117 119 height: 56rpx;
118 120 position: absolute;
... ... @@ -120,167 +122,157 @@ font-size:28rpx;
120 122 bottom: 10rpx;
121 123 }
122 124  
123   -
124   -
125   -.zs_goods_xiao_bottom{
  125 +.zs_goods_xiao_bottom {
126 126 width: 100%;
127 127 min-height: 300rpx;
128   -
129 128 display: flex;
130 129 border-bottom: 2rpx #eee solid;
131 130 padding: 10rpx;
132 131 background-color: white;
133   -
134 132 }
135 133  
136   -.zs_goods_xiao{
  134 +.zs_goods_xiao {
137 135 width: 100%;
138 136 min-height: 300rpx;
139   -
140 137 display: flex;
141 138 /* border-bottom: 2rpx #eee solid; */
142 139 padding: 10rpx;
143 140 background-color: white;
144 141 }
145 142  
146   -.zs_top_x{
  143 +.zs_top_x {
147 144 width: 400rpx;
148 145 height: 318rpx;
149   - margin-top: 20rpx;
  146 + margin-top: 20rpx;
150 147 display: flex;
151 148 }
152 149  
153 150 .zs_t_img_x {
154   - width: 290rpx;
  151 + width: 290rpx;
155 152 height: 290rpx;
156 153 margin-left: 20rpx;
157   -
158 154 }
159 155  
160   -.zs_center_x{
161   -
  156 +.zs_center_x {
162 157 width: 100%;
163 158 min-height: 200rpx;
164 159 font-size: 28rpx;
165 160 color: #333;
166 161 text-align: left;
167 162 margin-top: 30rpx;
168   - padding: 0 10rpx;
  163 + padding: 0 10rpx;
169 164 }
170 165  
171   -.zs_wz1_x{
  166 +.zs_wz1_x {
172 167 overflow: hidden;
173   - text-overflow: ellipsis;
174   - margin-bottom:10rpx;
175   -font-size:28rpx;
176   - white-space: nowrap;
177   - width: 80%;
  168 + text-overflow: ellipsis;
  169 + margin-bottom: 10rpx;
  170 + font-size: 28rpx;
  171 + white-space: nowrap;
  172 + width: 80%;
178 173 }
179 174  
180   -
181   -.zs_wz2_x{
  175 +.zs_wz2_x {
182 176 overflow: hidden;
183   - text-overflow: ellipsis;
184   - margin-bottom:10rpx;
185   -font-size:28rpx;
186   - white-space: nowrap;
  177 + text-overflow: ellipsis;
  178 + margin-bottom: 10rpx;
  179 + font-size: 28rpx;
  180 + white-space: nowrap;
187 181 }
188 182  
189   -.zs_wz3_x{
  183 +.zs_wz3_x {
190 184 overflow: hidden;
191   - text-overflow: ellipsis;
192   - margin-bottom:10rpx;
193   -font-size:28rpx;
194   - white-space: nowrap;
  185 + text-overflow: ellipsis;
  186 + margin-bottom: 10rpx;
  187 + font-size: 28rpx;
  188 + white-space: nowrap;
195 189 }
196 190  
197   -.zs_wz4_x{
  191 +.zs_wz4_x {
198 192 overflow: hidden;
199   - text-overflow: ellipsis;
200   - margin-bottom:10rpx;
201   -font-size:28rpx;
202   - white-space: nowrap;
  193 + text-overflow: ellipsis;
  194 + margin-bottom: 10rpx;
  195 + font-size: 28rpx;
  196 + white-space: nowrap;
203 197 }
204 198  
205   -.zs_wz5_x{
  199 +.zs_wz5_x {
206 200 overflow: hidden;
207   - text-overflow: ellipsis;
208   - font-size:30rpx;
209   - white-space: nowrap;
  201 + text-overflow: ellipsis;
  202 + font-size: 30rpx;
  203 + white-space: nowrap;
210 204 }
211 205  
212   -.wz_red{
213   - color: #C4182E;
214   - font-size: 32rpx;
  206 +.wz_red {
  207 + color: #c4182e;
  208 + font-size: 32rpx;
215 209 }
216 210  
217   -.del{
218   - font-size: 24rpx;
219   - color: #999;
220   - text-decoration: line-through;
221   - margin-top: 8rpx;
  211 +.del {
  212 + font-size: 24rpx;
  213 + color: #999;
  214 + text-decoration: line-through;
  215 + margin-top: 8rpx;
222 216 }
223 217  
224   -.zs_t1_x{
  218 +.zs_t1_x {
225 219 width: 56rpx;
226 220 height: 56rpx;
227 221 position: relative;
228 222 right: 62rpx;
229   -top: 6rpx;
  223 + top: 6rpx;
230 224 }
231 225  
232   -.zs_t1_x1{
233   - width: 56rpx;
  226 +.zs_t1_x1 {
  227 + width: 56rpx;
234 228 height: 56rpx;
235 229 position: relative;
236 230 right: 285rpx;
237   -top: 6rpx;
  231 + top: 6rpx;
238 232 }
239 233  
240   -.zs_t1_x2{
241   - width: 56rpx;
  234 +.zs_t1_x2 {
  235 + width: 56rpx;
242 236 height: 56rpx;
243 237 position: relative;
244 238 right: 56rpx;
245   -top: 234rpx;
  239 + top: 234rpx;
246 240 }
247 241  
248   -
249   -.zs_t1_x3{
250   - width: 56rpx;
  242 +.zs_t1_x3 {
  243 + width: 56rpx;
251 244 height: 56rpx;
252 245 position: relative;
253 246 right: 288rpx;
254   -top: 234rpx;
  247 + top: 234rpx;
255 248 }
256 249  
257 250 /*1列2个*/
258 251  
259   -.zs_goods_ban{
  252 +.zs_goods_ban {
260 253 width: 100%;
261 254 min-height: 300rpx;
262 255 }
263 256  
264   -.zs_goods_wai_ban{
  257 +.zs_goods_wai_ban {
265 258 display: flex;
266 259 /* padding-left: 2rpx; */
267 260 margin-bottom: 12rpx;
268 261 width: 48.5%;
269 262 float: left;
270 263 background: #fff;
271   - margin-left: 1%
  264 + margin-left: 1%;
272 265 }
273 266  
274   -
275   -.zs_goods_2l{
  267 +.zs_goods_2l {
276 268 width: 94%;
277 269 min-height: 300rpx;
278 270 /* border: 2rpx #ddd solid; */
279 271 margin: 0 auto;
280   - padding: 2rpx;
  272 + padding: 2rpx;
281 273 }
282 274  
283   -.zs_top_2l{
  275 +.zs_top_2l {
284 276 width: 340rpx;
285 277 height: 340rpx;
286 278 }
... ... @@ -290,73 +282,70 @@ top: 234rpx;
290 282 border: none;
291 283 }
292 284  
293   -
294 285 .zs_t_img_2l {
295 286 width: 100%;
296 287 height: 100%;
297 288 margin: 0 auto;
298 289 }
299 290  
300   -.zs_center_2l{
  291 +.zs_center_2l {
301 292 width: 100%;
302 293 min-height: 200rpx;
303 294 font-size: 28rpx;
304 295 color: #333;
305 296 text-align: left;
306   - padding: 0 10rpx;
  297 + padding: 0 10rpx;
307 298 }
308 299  
309   -.zs_wz1_2l{
  300 +.zs_wz1_2l {
310 301 overflow: hidden;
311 302 text-overflow: ellipsis;
312   - margin-bottom:10rpx;
313   - font-size:30rpx;
  303 + margin-bottom: 10rpx;
  304 + font-size: 30rpx;
314 305 white-space: nowrap;
315 306 margin-top: 10rpx;
316 307 }
317 308  
318   -
319   -.zs_wz2_2l{
  309 +.zs_wz2_2l {
320 310 overflow: hidden;
321 311 text-overflow: ellipsis;
322   - margin-bottom:10rpx;
323   - font-size:30rpx;
  312 + margin-bottom: 10rpx;
  313 + font-size: 30rpx;
324 314 white-space: nowrap;
325 315 margin-top: 10rpx;
326 316 height: 80rpx;
327   - line-height: 40rpx
  317 + line-height: 40rpx;
328 318 }
329 319  
330   -.zs_wz3_2l{
  320 +.zs_wz3_2l {
331 321 overflow: hidden;
332 322 text-overflow: ellipsis;
333   - margin-bottom:10rpx;
334   - font-size:30rpx;
  323 + margin-bottom: 10rpx;
  324 + font-size: 30rpx;
335 325 white-space: nowrap;
336 326 margin-top: 10rpx;
337 327 }
338 328  
339   -.zs_wz4_2l{
  329 +.zs_wz4_2l {
340 330 overflow: hidden;
341 331 text-overflow: ellipsis;
342   - margin-bottom:10rpx;
343   - font-size:30rpx;
  332 + margin-bottom: 10rpx;
  333 + font-size: 30rpx;
344 334 white-space: nowrap;
345 335 margin-top: 10rpx;
346 336 }
347 337  
348   -.zs_wz5_2l{
  338 +.zs_wz5_2l {
349 339 overflow: hidden;
350 340 text-overflow: ellipsis;
351   - font-size:30rpx;
  341 + font-size: 30rpx;
352 342 white-space: nowrap;
353 343 margin-top: 10rpx;
354 344 }
355 345  
356   -
357   -
358 346 /*---俩列图片位置---*/
359   -.zs_t1_2l{
  347 +
  348 +.zs_t1_2l {
360 349 width: 56rpx;
361 350 height: 56rpx;
362 351 position: absolute;
... ... @@ -364,7 +353,7 @@ top: 234rpx;
364 353 top: 10rpx;
365 354 }
366 355  
367   -.zs_t2_2l{
  356 +.zs_t2_2l {
368 357 width: 56rpx;
369 358 height: 56rpx;
370 359 position: absolute;
... ... @@ -372,16 +361,15 @@ top: 234rpx;
372 361 top: 10rpx;
373 362 }
374 363  
375   -.zs_t3_2l{
  364 +.zs_t3_2l {
376 365 width: 56rpx;
377 366 height: 56rpx;
378 367 position: absolute;
379   - left: 0rpx;
  368 + left: 0rpx;
380 369 bottom: 10rpx;
381 370 }
382 371  
383   -
384   -.zs_t4_2l{
  372 +.zs_t4_2l {
385 373 width: 56rpx;
386 374 height: 56rpx;
387 375 position: absolute;
... ... @@ -389,23 +377,22 @@ top: 234rpx;
389 377 bottom: 10rpx;
390 378 }
391 379  
392   -
393   -
394 380 /*一个3列*/
395   -.zs_goods_wai_san{
  381 +
  382 +.zs_goods_wai_san {
396 383 width: 230rpx;
397 384 display: flex;
398 385 margin-left: 10rpx;
399 386 float: left;
400 387 margin-bottom: 8rpx;
401   - background-color:white;
  388 + background-color: white;
402 389 }
403 390  
404   -.zs_goods_san{
  391 +.zs_goods_san {
405 392 width: 240rpx;
406   -
407 393 }
408   -.zs_goods_3l{
  394 +
  395 +.zs_goods_3l {
409 396 width: 240rpx;
410 397 min-height: 300rpx;
411 398 border: 2rpx #ddd solid;
... ... @@ -413,19 +400,19 @@ top: 234rpx;
413 400 padding: 2rpx;
414 401 }
415 402  
416   -.zs_top_3l{
  403 +.zs_top_3l {
417 404 width: 232rpx;
418   - height: 232rpx;
  405 + height: 232rpx;
419 406 }
420 407  
421 408 .zs_t_img_3l {
422   - width:232rpx;
  409 + width: 232rpx;
423 410 height: 232rpx;
424 411 margin: 0 auto;
425 412 background-color: bisque;
426 413 }
427 414  
428   -.zs_center_3l{
  415 +.zs_center_3l {
429 416 width: 100%;
430 417 min-height: 200rpx;
431 418 font-size: 28rpx;
... ... @@ -434,52 +421,48 @@ top: 234rpx;
434 421 padding: 0 10rpx;
435 422 }
436 423  
437   -.zs_wz1_3l{
438   -
439   - margin-bottom:10rpx;
440   - font-size:30rpx;
  424 +.zs_wz1_3l {
  425 + margin-bottom: 10rpx;
  426 + font-size: 30rpx;
441 427 height: 80rpx;
442 428 width: 220rpx;
443   -
444   - overflow: hidden;
445   - text-overflow: ellipsis;
446   - display: -webkit-box;
447   - -webkit-box-orient: vertical;
448   - -webkit-line-clamp: 2;
  429 + overflow: hidden;
  430 + text-overflow: ellipsis;
  431 + display: -webkit-box;
  432 + -webkit-box-orient: vertical;
  433 + -webkit-line-clamp: 2;
449 434 }
450 435  
451   -
452   -.zs_wz2_3l{
453   - margin-bottom:10rpx;
454   - font-size:30rpx;
  436 +.zs_wz2_3l {
  437 + margin-bottom: 10rpx;
  438 + font-size: 30rpx;
455 439 display: flex;
456 440 }
457 441  
458   -.zs_wz3_3l{
  442 +.zs_wz3_3l {
459 443 overflow: hidden;
460 444 text-overflow: ellipsis;
461   - margin-bottom:10rpx;
462   - font-size:30rpx;
  445 + margin-bottom: 10rpx;
  446 + font-size: 30rpx;
463 447 white-space: nowrap;
464 448 }
465 449  
466   -.zs_wz4_3l{
  450 +.zs_wz4_3l {
467 451 overflow: hidden;
468 452 text-overflow: ellipsis;
469   - margin-bottom:10rpx;
470   - font-size:30rpx;
  453 + margin-bottom: 10rpx;
  454 + font-size: 30rpx;
471 455 white-space: nowrap;
472 456 }
473 457  
474   -.zs_wz5_3l{
  458 +.zs_wz5_3l {
475 459 overflow: hidden;
476 460 text-overflow: ellipsis;
477   - font-size:30rpx;
478   - white-space: nowrap;
  461 + font-size: 30rpx;
  462 + white-space: nowrap;
479 463 }
480 464  
481   -
482   -.zs_t1_3l{
  465 +.zs_t1_3l {
483 466 width: 56rpx;
484 467 height: 56rpx;
485 468 position: absolute;
... ... @@ -487,8 +470,7 @@ top: 234rpx;
487 470 top: 10rpx;
488 471 }
489 472  
490   -
491   -.zs_t2_3l{
  473 +.zs_t2_3l {
492 474 width: 56rpx;
493 475 height: 56rpx;
494 476 position: absolute;
... ... @@ -496,7 +478,7 @@ top: 234rpx;
496 478 top: 10rpx;
497 479 }
498 480  
499   -.zs_t3_3l{
  481 +.zs_t3_3l {
500 482 width: 56rpx;
501 483 height: 56rpx;
502 484 position: absolute;
... ... @@ -504,8 +486,7 @@ top: 234rpx;
504 486 bottom: 10rpx;
505 487 }
506 488  
507   -
508   -.zs_t4_3l{
  489 +.zs_t4_3l {
509 490 width: 56rpx;
510 491 height: 56rpx;
511 492 position: absolute;
... ... @@ -513,27 +494,67 @@ top: 234rpx;
513 494 bottom: 10rpx;
514 495 }
515 496  
516   -.zs_goods_wai{
  497 +.zs_goods_wai {
517 498 background-color: white;
518 499 margin-top: 10rpx;
519 500 }
520 501  
521   -.rel{position: relative}
522   -.flex{display: flex}
523   -.fs24{font-size: 24rpx}
524   -.fs35{font-size: 35rpx}
525   -.xc-wc{ align-items: center; margin-top: -3rpx}
  502 +.rel {
  503 + position: relative;
  504 +}
  505 +
  506 +.flex {
  507 + display: flex;
  508 +}
  509 +
  510 +.fs24 {
  511 + font-size: 24rpx;
  512 +}
  513 +
  514 +.fs35 {
  515 + font-size: 35rpx;
  516 +}
  517 +
  518 +.xc-wc {
  519 + align-items: center;
  520 + margin-top: -3rpx;
  521 +}
526 522  
527   -.price.xc-ash{
  523 +.price.xc-ash {
528 524 font-size: 24rpx;
529 525 color: #999;
530 526 text-decoration: line-through;
531 527 margin-top: 8rpx;
532 528 }
533 529  
  530 +.line_th {
  531 + text-decoration: line-through;
  532 +}
534 533  
535   -.line_th{ text-decoration: line-through}
536   -.card_bg {display: flex; padding: 2rpx 10rpx;height: 28rpx; align-items: center; border-radius: 26rpx; font-size: 19rpx;line-height: 28rpx;max-width: 110rpx;
537   - background: #333; color: #fff; justify-content: center; margin-left: 2rpx;}
538   -.card_bg image{ width: 19rpx; height: 19rpx; margin-right: 1rpx;}
539   -.card_bg .card_name{ max-width: 76rpx; width: auto;overflow: hidden; white-space:nowrap; }
540 534 \ No newline at end of file
  535 +.card_bg {
  536 + display: flex;
  537 + padding: 2rpx 10rpx;
  538 + height: 25rpx;
  539 + align-items: center;
  540 + border-radius: 26rpx;
  541 + font-size: 19rpx;
  542 + line-height: 25rpx;
  543 + max-width: 110rpx;
  544 + background: #333;
  545 + color: #fff;
  546 + justify-content: center;
  547 + margin-left: 8rpx;
  548 +}
  549 +
  550 +.card_bg image {
  551 + width: 19rpx;
  552 + height: 19rpx;
  553 + margin-right: 1rpx;
  554 +}
  555 +
  556 +.card_bg .card_name {
  557 + max-width: 76rpx;
  558 + width: auto;
  559 + overflow: hidden;
  560 + white-space: nowrap;
  561 +}
... ...
components/goods_list/goods_list.wxml
... ... @@ -37,7 +37,7 @@
37 37 <block wx:if="{{item[card_field]>0}}">
38 38 <view class="money flex">
39 39 <!-- 办卡价 -->
40   - <view class="flex xc-wc">
  40 + <view class="flex xc-wc ai_and">
41 41 <view class="fs24">¥</view>
42 42 <view class="fs35">{{filter.toFix(item[card_field],2)}}</view>
43 43 <view class="card_bg">
... ... @@ -88,7 +88,7 @@
88 88 </view>
89 89 <view class="flex" style="line-height: 28rpx;">
90 90 <!-- 等级价 -->
91   - <view class="price flex">
  91 + <view class="price flex ai_and">
92 92 <view class="fs22">¥</view>
93 93 <view class="fs28">{{filter.toFix(g_filter.get_card_price(item,card_list,0),2)}}</view>
94 94 <view class="card_bg">
... ...
components/goods_list/goods_list.wxss
1 1 .collects {
2 2 margin-top: 40rpx;
3 3 }
4   -.ib{
5   - display: inline-block;
6   -}
7   -.fs20{
8   - font-size: 20rpx;
9   -}
10   -.fs22{
11   - font-size: 22rpx;
12   -}
13   -.fs24{
14   - font-size: 24rpx;
15   -}
16   -.fs26{
17   - font-size: 26rpx;
  4 +
  5 +.ib {
  6 + display: inline-block;
18 7 }
19   -.fs28{
20   - font-size: 28rpx;
  8 +
  9 +.fs20 {
  10 + font-size: 20rpx;
21 11 }
22   -.fs35{
23   - font-size:35rpx;
  12 +
  13 +.fs22 {
  14 + font-size: 22rpx;
24 15 }
25 16  
  17 +.fs24 {
  18 + font-size: 24rpx;
  19 +}
26 20  
  21 +.fs26 {
  22 + font-size: 26rpx;
  23 +}
27 24  
28   -.flex-center{
29   -display:flex;
30   -justify-content:center;
31   -align-items:center;
  25 +.fs28 {
  26 + font-size: 28rpx;
32 27 }
33   -.xc-wc{
34   - color: #d60021;
35 28  
  29 +.fs35 {
  30 + font-size: 35rpx;
36 31 }
37 32  
  33 +.flex-center {
  34 + display: flex;
  35 + justify-content: center;
  36 + align-items: center;
  37 +}
38 38  
  39 +.xc-wc {
  40 + color: #d60021;
  41 +}
39 42  
40   -.xc-ash{
41   -color: #b9b9b9;
  43 +.xc-ash {
  44 + color: #b9b9b9;
42 45 }
  46 +
43 47 .choice_box .choice_list .choice_footer .price {
44   - color: #f23030; height: 10px
  48 + color: #f23030;
  49 + height: 10px;
  50 +}
  51 +
  52 +.flex {
  53 + display: flex;
45 54 }
46 55  
47   -.flex{display: flex}
48 56 .ellipsis-2 {
49   - overflow: hidden;
50   - text-overflow: ellipsis;
51   - display: -webkit-box;
52   - -webkit-box-orient: vertical;
53   - -webkit-line-clamp: 2;
54   -}
55   -.goods_name{
56   - height: 62rpx;
  57 + overflow: hidden;
  58 + text-overflow: ellipsis;
  59 + display: -webkit-box;
  60 + -webkit-box-orient: vertical;
  61 + -webkit-line-clamp: 2;
  62 +}
  63 +
  64 +.goods_name {
  65 + height: 62rpx;
57 66 margin-top: 6rpx;
58 67 line-height: 30rpx;
59   -
60   -
61 68 }
  69 +
62 70 .hang {
63 71 width: 100%;
64 72 margin: auto;
65 73 padding-left: 21rpx;
66 74 }
67 75  
68   -
69 76 .hang .collect {
70 77 width: 347rpx;
71 78 height: 520rpx;
... ... @@ -91,15 +98,19 @@ color: #b9b9b9;
91 98 line-height: 28rpx;
92 99 align-items: baseline;
93 100 }
94   -.collect .money view{
  101 +
  102 +.collect .money view {
95 103 line-height: 28rpx;
96 104 }
  105 +
97 106 .collect .money .flex {
98   - font-weight: bold;
  107 + font-weight: bold;
99 108 }
100   -.collect .money .flex .fs24{
  109 +
  110 +.collect .money .flex .fs24 {
101 111 padding-top: 5rpx;
102 112 }
  113 +
103 114 .collect .Discount {
104 115 width: 156rpx;
105 116 height: 28rpx;
... ... @@ -150,12 +161,34 @@ color: #b9b9b9;
150 161 background-color: rgb(138, 138, 138);
151 162 }
152 163  
153   -.line_th{ text-decoration: line-through}
154   -.card_bg {display: flex; padding: 2rpx 10rpx;height: 28rpx; align-items: center; border-radius: 26rpx; font-size: 19rpx;line-height: 28rpx;max-width: 110rpx;
155   -background: #333; color: #fff; justify-content: center; margin-left: 2rpx;}
156   -.card_bg image{ width: 19rpx; height: 19rpx; margin-right: 1rpx;}.card_bg .card_name{
157   - max-width: 76rpx;
158   - width: auto;
159   - overflow: hidden;
160   - white-space:nowrap;
161   -}
162 164 \ No newline at end of file
  165 +.line_th {
  166 + text-decoration: line-through;
  167 +}
  168 +
  169 +.card_bg {
  170 + display: flex;
  171 + padding: 2rpx 10rpx;
  172 + height: 25rpx;
  173 + align-items: center;
  174 + border-radius: 26rpx;
  175 + font-size: 19rpx;
  176 + line-height: 25rpx;
  177 + max-width: 110rpx;
  178 + background: #333;
  179 + color: #fff;
  180 + justify-content: center;
  181 + margin-left: 8rpx;
  182 +}
  183 +
  184 +.card_bg image {
  185 + width: 19rpx;
  186 + height: 19rpx;
  187 + margin-right: 1rpx;
  188 +}
  189 +
  190 +.card_bg .card_name {
  191 + max-width: 76rpx;
  192 + width: auto;
  193 + overflow: hidden;
  194 + white-space: nowrap;
  195 +}
... ...
pages/goods/goodsList/goodsList.wxml
... ... @@ -53,7 +53,7 @@
53 53 <block wx:if="{{card_field}}">
54 54 <!-- 等级价>0 -->
55 55 <block wx:if="{{item[card_field]>0}}">
56   - <view class="flex ai-center">
  56 + <view class="flex ai_and">
57 57 <view class="price">¥{{item[card_field]}}</view>
58 58 <view class="card_bg">
59 59 <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>
... ... @@ -80,7 +80,7 @@
80 80 <view class="word-line xc-ash mk_price">¥{{item.market_price}}</view>
81 81 </view>
82 82 <view class="comment flex jc_sb">
83   - <view class="flex">
  83 + <view class="flex ai_and">
84 84 <view class="">¥{{g_filter.get_card_price(item,card_list,0)}}</view>
85 85 <view class="card_bg">
86 86 <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>
... ...
pages/goods/goodsList/goodsList.wxss
1   - .container {
2   - color: #666;
  1 +.container {
  2 + color: #666;
3 3 }
4 4  
5 5 .nav-item {
6   - float: left;
7   - width: 30%;
8   - height: 90rpx;
9   - line-height: 90rpx;
10   - display: flex;
11   - align-items: center;
12   - justify-content: center;
13   - font-size: 32rpx;
14   - border-bottom: 1px solid #dfefef;
15   - background-color: #fff;
  6 + float: left;
  7 + width: 30%;
  8 + height: 90rpx;
  9 + line-height: 90rpx;
  10 + display: flex;
  11 + align-items: center;
  12 + justify-content: center;
  13 + font-size: 32rpx;
  14 + border-bottom: 1px solid #dfefef;
  15 + background-color: #fff;
16 16 }
17 17  
18 18 .nav-item .ico-dg {
19   - width: 18rpx;
20   - height: 12rpx;
21   - margin-left: 10rpx;
22   - line-height: 0;
  19 + width: 18rpx;
  20 + height: 12rpx;
  21 + margin-left: 10rpx;
  22 + line-height: 0;
23 23 }
24 24  
25 25 .nav-item .ico-filter {
26   - width: 20rpx;
27   - height: 20rpx;
28   - margin-left: 10rpx;
29   - line-height: 0;
  26 + width: 20rpx;
  27 + height: 20rpx;
  28 + margin-left: 10rpx;
  29 + line-height: 0;
30 30 }
31 31  
32 32 .ico-dir {
33   - width: 16rpx;
34   - height: 22rpx;
35   - margin-left: 10rpx;
36   - background-repeat: no-repeat;
37   - background-size: cover;
38   - background-position-x: 0;
  33 + width: 16rpx;
  34 + height: 22rpx;
  35 + margin-left: 10rpx;
  36 + background-repeat: no-repeat;
  37 + background-size: cover;
  38 + background-position-x: 0;
39 39 }
40 40  
41 41 .ico-dir-dn {
42   - background-position-x: -16rpx;
  42 + background-position-x: -16rpx;
43 43 }
44 44  
45 45 .ico-dir-up {
46   - background-position-x: -32rpx;
  46 + background-position-x: -32rpx;
47 47 }
48 48  
49 49 .search {
50   - width: 10%;
  50 + width: 10%;
51 51 }
52 52  
53 53 .search-img {
54   - width: 30rpx;
55   - height: 30rpx;
  54 + width: 30rpx;
  55 + height: 30rpx;
56 56 }
57 57  
58 58 .choice_list {
59   - background-color: #fff;
  59 + background-color: #fff;
60 60 }
61 61  
62 62 .choice_item {
63   - position: relative;
64   - width: 100%;
65   - min-height: 200rpx;
66   - padding: 10rpx 0;
67   - border-bottom: 1px solid #dfefef;
68   - font-size: 30rpx;
  63 + position: relative;
  64 + width: 100%;
  65 + min-height: 200rpx;
  66 + padding: 10rpx 0;
  67 + border-bottom: 1px solid #dfefef;
  68 + font-size: 30rpx;
69 69 }
70 70  
71 71 .img-wrap {
72   - float: left;
73   - width: 180rpx;
74   - height: 180rpx;
75   - padding: 0 10rpx 10rpx;
  72 + float: left;
  73 + width: 180rpx;
  74 + height: 180rpx;
  75 + padding: 0 10rpx 10rpx;
76 76 }
77 77  
78 78 .img-wrap image {
79   - width: 100%;
80   - height: 100%;
  79 + width: 100%;
  80 + height: 100%;
81 81 }
82 82  
83 83 .item-cont .title {
84   - height: 72rpx;
85   - margin: 16rpx 0;
86   - padding-right: 10rpx;
87   - line-height: 36rpx;
88   - color: #333;
89   - overflow: hidden;
  84 + height: 72rpx;
  85 + margin: 16rpx 0;
  86 + padding-right: 10rpx;
  87 + line-height: 36rpx;
  88 + color: #333;
  89 + overflow: hidden;
90 90 }
91 91  
92 92 .price {
93   - display: inline-block;
94   - color: #f23030;
95   - line-height: 24rpx;
96   - /* padding-bottom: 20rpx; */
  93 + display: inline-block;
  94 + color: #f23030;
  95 + line-height: 24rpx;
  96 + /* padding-bottom: 20rpx; */
97 97 }
98 98  
99 99 .comment {
100   - font-size: 25rpx;
101   - margin-top: 4rpx;
102   - padding-right:30rpx
  100 + font-size: 25rpx;
  101 + margin-top: 4rpx;
  102 + padding-right: 30rpx;
103 103 }
104 104  
105 105 .filter-modal {
106   - position: fixed;
107   - left: 150rpx;
108   - top: 0;
109   - right: 0;
110   - bottom: 0;
111   - z-index: 20;
112   - background-color: white;
113   - overflow-x: hidden;
114   - padding-bottom: 30rpx;
  106 + position: fixed;
  107 + left: 150rpx;
  108 + top: 0;
  109 + right: 0;
  110 + bottom: 0;
  111 + z-index: 20;
  112 + background-color: white;
  113 + overflow-x: hidden;
  114 + padding-bottom: 30rpx;
115 115 }
116 116  
117 117 .filter-box {
118   - box-sizing: border-box;
119   - width: 100%;
120   - font-size: 28rpx;
121   - padding: 20rpx;
  118 + box-sizing: border-box;
  119 + width: 100%;
  120 + font-size: 28rpx;
  121 + padding: 20rpx;
122 122 }
123 123  
124 124 .filter-name {
125   - width: 100%;
126   - padding: 20rpx 0;
127   - word-break: keep-all;
128   - white-space: nowrap;
129   - text-overflow: ellipsis;
130   - overflow: hidden;
131   - font-size: 30rpx;
  125 + width: 100%;
  126 + padding: 20rpx 0;
  127 + word-break: keep-all;
  128 + white-space: nowrap;
  129 + text-overflow: ellipsis;
  130 + overflow: hidden;
  131 + font-size: 30rpx;
132 132 }
133 133  
134 134 .filter-items {
135   - width: 100%;
  135 + width: 100%;
136 136 }
137 137  
138 138 .filter-item {
139   - float: left;
140   - width: fit-content;
141   - max-width: 500rpx;
142   - word-break: keep-all;
143   - white-space: nowrap;
144   - text-overflow: ellipsis;
145   - overflow: hidden;
146   - padding: 10rpx;
147   - border-radius: 10rpx;
148   - border: 1rpx #ddd solid;
149   - margin: 0 10rpx 10rpx 0;
150   - background-color: #fdfdfd;
151   - color: #666;
  139 + float: left;
  140 + width: fit-content;
  141 + max-width: 500rpx;
  142 + word-break: keep-all;
  143 + white-space: nowrap;
  144 + text-overflow: ellipsis;
  145 + overflow: hidden;
  146 + padding: 10rpx;
  147 + border-radius: 10rpx;
  148 + border: 1rpx #ddd solid;
  149 + margin: 0 10rpx 10rpx 0;
  150 + background-color: #fdfdfd;
  151 + color: #666;
152 152 }
153 153  
154 154 .viewall-btn {
155   - margin-top: 20rpx;
156   - width: 300rpx;
  155 + margin-top: 20rpx;
  156 + width: 300rpx;
157 157 }
158 158  
159   -.card_bg {display: flex; max-width: 110rpx;height: 28rpx; align-items: center; border-radius: 26rpx; font-size: 19rpx;
160   -background: #333; color: #fff; justify-content: center; margin-left: 3rpx; margin-top:7rpx; line-height: 28rpx;
161   -padding: 2rpx 10rpx;width: auto;
  159 +.card_bg {
  160 + display: flex;
  161 + max-width: 110rpx;
  162 + height: 25rpx;
  163 + align-items: center;
  164 + border-radius: 26rpx;
  165 + font-size: 19rpx;
  166 + background: #333;
  167 + color: #fff;
  168 + justify-content: center;
  169 + margin-left: 8rpx;
  170 + margin-top: 7rpx;
  171 + line-height: 25rpx;
  172 + padding: 2rpx 10rpx;
  173 + width: auto;
  174 +}
  175 +
  176 +.card_bg .card_name {
  177 + max-width: 76rpx;
  178 + width: auto;
  179 + overflow: hidden;
  180 + white-space: nowrap;
  181 +}
162 182  
  183 +.card_bg image {
  184 + width: 19rpx;
  185 + height: 19rpx;
  186 + margin-right: 1rpx;
  187 + vertical-align: middle;
163 188 }
164   -.card_bg .card_name{
165   - max-width: 76rpx;
166   - width: auto;
167   - overflow: hidden;
168   - white-space:nowrap;
  189 +
  190 +.mk_price {
  191 + margin-left: 10rpx;
  192 + font-size: 25rpx;
  193 +}
  194 +
  195 +.item-cont {
  196 + line-height: 38rpx;
169 197 }
170   -.card_bg image{ width: 19rpx; height: 19rpx; margin-right: 1rpx; vertical-align: middle}
171   -.mk_price{margin-left: 10rpx; font-size: 25rpx;}
172   -.item-cont{ line-height: 38rpx}
173 198 \ No newline at end of file
... ...
pages/goods/search/search.wxml
... ... @@ -50,7 +50,7 @@
50 50 <block wx:if="{{card_field}}">
51 51 <!-- 等级价>0 -->
52 52 <block wx:if="{{item[card_field]>0}}">
53   - <view class="flex ai-center">
  53 + <view class="flex ai_and">
54 54 <view class="price">¥{{item[card_field]}}</view>
55 55 <view class="card_bg">
56 56 <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>
... ... @@ -77,7 +77,7 @@
77 77 <view class="word-line xc-ash mk_price">¥{{item.market_price}}</view>
78 78 </view>
79 79 <view class="comment flex jc_sb">
80   - <view class="flex">
  80 + <view class="flex ai_and">
81 81 <view class="">¥{{g_filter.get_card_price(item,card_list,0)}}</view>
82 82 <view class="card_bg">
83 83 <image src="{{url}}/miniapp/images/plus/dj_icon.png"></image>
... ...
pages/goods/search/search.wxss
1 1 .container {
2   - color: #666;
  2 + color: #666;
3 3 }
4 4  
5 5 .nav-item {
6   - float: left;
7   - width: 30%;
8   - height: 90rpx;
9   - line-height: 90rpx;
10   - display: flex;
11   - align-items: center;
12   - justify-content: center;
13   - font-size: 32rpx;
14   - border-bottom: 1px solid #dfefef;
15   - background-color: #fff;
  6 + float: left;
  7 + width: 30%;
  8 + height: 90rpx;
  9 + line-height: 90rpx;
  10 + display: flex;
  11 + align-items: center;
  12 + justify-content: center;
  13 + font-size: 32rpx;
  14 + border-bottom: 1px solid #dfefef;
  15 + background-color: #fff;
16 16 }
17 17  
18 18 .nav-item .ico-dg {
19   - width: 18rpx;
20   - height: 12rpx;
21   - margin-left: 10rpx;
22   - line-height: 0;
  19 + width: 18rpx;
  20 + height: 12rpx;
  21 + margin-left: 10rpx;
  22 + line-height: 0;
23 23 }
24 24  
25 25 .nav-item .ico-filter {
26   - width: 20rpx;
27   - height: 20rpx;
28   - margin-left: 10rpx;
29   - line-height: 0;
  26 + width: 20rpx;
  27 + height: 20rpx;
  28 + margin-left: 10rpx;
  29 + line-height: 0;
30 30 }
31 31  
32 32 .ico-dir {
33   - width: 16rpx;
34   - height: 22rpx;
35   - margin-left: 10rpx;
36   - background-repeat: no-repeat;
37   - background-size: cover;
38   - background-position-x: 0;
  33 + width: 16rpx;
  34 + height: 22rpx;
  35 + margin-left: 10rpx;
  36 + background-repeat: no-repeat;
  37 + background-size: cover;
  38 + background-position-x: 0;
39 39 }
40 40  
41 41 .ico-dir-dn {
42   - background-position-x: -16rpx;
  42 + background-position-x: -16rpx;
43 43 }
44 44  
45 45 .ico-dir-up {
46   - background-position-x: -32rpx;
  46 + background-position-x: -32rpx;
47 47 }
48 48  
49 49 .nav-search {
50   - width: 10%;
  50 + width: 10%;
51 51 }
52 52  
53 53 .nav-item .search-img {
54   - width: 30rpx;
55   - height: 30rpx;
  54 + width: 30rpx;
  55 + height: 30rpx;
56 56 }
57 57  
58 58 .choice_list {
59   - background-color: #fff;
  59 + background-color: #fff;
60 60 }
61 61  
62 62 .choice_item {
63   - position: relative;
64   - width: 100%;
65   - min-height: 200rpx;
66   - padding: 10rpx 0;
67   - border-bottom: 1px solid #dfefef;
68   - font-size: 30rpx;
  63 + position: relative;
  64 + width: 100%;
  65 + min-height: 200rpx;
  66 + padding: 10rpx 0;
  67 + border-bottom: 1px solid #dfefef;
  68 + font-size: 30rpx;
69 69 }
70 70  
71 71 .img-wrap {
72   - float: left;
73   - width: 180rpx;
74   - height: 180rpx;
75   - padding: 0 10rpx 10rpx;
  72 + float: left;
  73 + width: 180rpx;
  74 + height: 180rpx;
  75 + padding: 0 10rpx 10rpx;
76 76 }
77 77  
78 78 .img-wrap image {
79   - width: 100%;
80   - height: 100%;
  79 + width: 100%;
  80 + height: 100%;
81 81 }
82 82  
83 83 .item-cont .title {
84   - height: 72rpx;
85   - margin: 16rpx 0;
86   - padding-right: 10rpx;
87   - line-height: 36rpx;
88   - color: #333;
89   - overflow: hidden;
  84 + height: 72rpx;
  85 + margin: 16rpx 0;
  86 + padding-right: 10rpx;
  87 + line-height: 36rpx;
  88 + color: #333;
  89 + overflow: hidden;
90 90 }
91 91  
92 92 .price {
93   - display: inline-block;
94   - color: #f23030;
95   - line-height: 24rpx;
96   - /* padding-bottom: 20rpx; */
  93 + display: inline-block;
  94 + color: #f23030;
  95 + line-height: 24rpx;
  96 + /* padding-bottom: 20rpx; */
97 97 }
98 98  
99 99 .comment {
100   - font-size: 25rpx;
101   - padding-right:30rpx;
102   - margin-top:4rpx
103   -
  100 + font-size: 25rpx;
  101 + padding-right: 30rpx;
  102 + margin-top: 4rpx;
104 103 }
105 104  
106 105 .filter-modal {
107   - position: fixed;
108   - left: 150rpx;
109   - top: 0;
110   - right: 0;
111   - bottom: 0;
112   - z-index: 20;
113   - background-color: white;
114   - overflow-x: hidden;
115   - padding-bottom: 30rpx;
  106 + position: fixed;
  107 + left: 150rpx;
  108 + top: 0;
  109 + right: 0;
  110 + bottom: 0;
  111 + z-index: 20;
  112 + background-color: white;
  113 + overflow-x: hidden;
  114 + padding-bottom: 30rpx;
116 115 }
117 116  
118 117 .filter-box {
119   - box-sizing: border-box;
120   - width: 100%;
121   - font-size: 28rpx;
122   - padding: 20rpx;
  118 + box-sizing: border-box;
  119 + width: 100%;
  120 + font-size: 28rpx;
  121 + padding: 20rpx;
123 122 }
124 123  
125 124 .filter-name {
126   - width: 100%;
127   - padding: 20rpx 0;
128   - word-break: keep-all;
129   - white-space: nowrap;
130   - text-overflow: ellipsis;
131   - overflow: hidden;
132   - font-size: 30rpx;
  125 + width: 100%;
  126 + padding: 20rpx 0;
  127 + word-break: keep-all;
  128 + white-space: nowrap;
  129 + text-overflow: ellipsis;
  130 + overflow: hidden;
  131 + font-size: 30rpx;
133 132 }
134 133  
135 134 .filter-items {
136   - width: 100%;
  135 + width: 100%;
137 136 }
138 137  
139 138 .filter-item {
140   - float: left;
141   - width: fit-content;
142   - max-width: 500rpx;
143   - word-break: keep-all;
144   - white-space: nowrap;
145   - text-overflow: ellipsis;
146   - overflow: hidden;
147   - padding: 10rpx;
148   - border-radius: 10rpx;
149   - border: 1rpx #ddd solid;
150   - margin: 0 10rpx 10rpx 0;
151   - background-color: #fdfdfd;
152   - color: #666;
  139 + float: left;
  140 + width: fit-content;
  141 + max-width: 500rpx;
  142 + word-break: keep-all;
  143 + white-space: nowrap;
  144 + text-overflow: ellipsis;
  145 + overflow: hidden;
  146 + padding: 10rpx;
  147 + border-radius: 10rpx;
  148 + border: 1rpx #ddd solid;
  149 + margin: 0 10rpx 10rpx 0;
  150 + background-color: #fdfdfd;
  151 + color: #666;
153 152 }
154 153  
155 154 .viewall-btn {
156   - margin-top: 20rpx;
157   - width: 300rpx;
  155 + margin-top: 20rpx;
  156 + width: 300rpx;
158 157 }
159 158  
160 159 .search-modal {
161   - position: fixed;
162   - top: 0;
163   - right: 0;
164   - left: 0;
165   - bottom: 0;
166   - z-index: 20;
167   - background-color: white;
168   - overflow-x: hidden;
169   - padding: 80rpx 30rpx;
170   - font-size: 30rpx;
171   - color: #555555;
  160 + position: fixed;
  161 + top: 0;
  162 + right: 0;
  163 + left: 0;
  164 + bottom: 0;
  165 + z-index: 20;
  166 + background-color: white;
  167 + overflow-x: hidden;
  168 + padding: 80rpx 30rpx;
  169 + font-size: 30rpx;
  170 + color: #555;
172 171 }
173 172  
174 173 .search-bar {
175   - width: 100%;
176   - box-sizing: border-box;
  174 + width: 100%;
  175 + box-sizing: border-box;
177 176 }
178 177  
179 178 .search-input {
180   - width: 80%;
181   - float: left;
182   - border: 1rpx solid #e0e0e0;
183   - box-sizing: border-box;
184   - height: 80rpx;
185   - padding-left: 20rpx;
186   - border-top-left-radius: 10rpx;
187   - border-bottom-left-radius: 10rpx;
  179 + width: 80%;
  180 + float: left;
  181 + border: 1rpx solid #e0e0e0;
  182 + box-sizing: border-box;
  183 + height: 80rpx;
  184 + padding-left: 20rpx;
  185 + border-top-left-radius: 10rpx;
  186 + border-bottom-left-radius: 10rpx;
188 187 }
189 188  
190 189 .search-btn {
191   - width: 20%;
192   - height: 80rpx;
193   - background-color: #f23030;
194   - display: inline-block;
195   - text-align: center;
196   - border-top-right-radius: 10rpx;
197   - border-bottom-right-radius: 10rpx;
  190 + width: 20%;
  191 + height: 80rpx;
  192 + background-color: #f23030;
  193 + display: inline-block;
  194 + text-align: center;
  195 + border-top-right-radius: 10rpx;
  196 + border-bottom-right-radius: 10rpx;
198 197 }
199 198  
200 199 .search-btn .search-img {
201   - height: 45rpx;
202   - width: 45rpx;
203   - padding: 20rpx;
  200 + height: 45rpx;
  201 + width: 45rpx;
  202 + padding: 20rpx;
204 203 }
205 204  
206 205 .search-hot {
207   - margin-top: 40rpx;
  206 + margin-top: 40rpx;
208 207 }
209 208  
210 209 .hot-title {
211   - font-size: 35rpx;
212   - color: black;
213   - margin-bottom: 30rpx;
  210 + font-size: 35rpx;
  211 + color: black;
  212 + margin-bottom: 30rpx;
214 213 }
215 214  
216 215 .hot-row {
217   - display: flex;
218   - /*--justify-content: space-between---*/
219   - padding: 15rpx 10rpx;
  216 + display: flex;
  217 + /*--justify-content: space-between---*/
  218 + padding: 15rpx 10rpx;
220 219 }
221 220  
222 221 .hot-item {
223   - padding: 8rpx 8rpx;
224   - border: 1rpx solid #e0e0e0;
225   - border-radius: 10rpx;
226   - font-size: 28rpx;
227   - margin-left: 15rpx;
228   -}
229   -
230   -.card_bg {display: flex; max-width: 110rpx;height: 28rpx; align-items: center; border-radius: 26rpx; font-size: 19rpx;padding: 2rpx 10rpx;
231   -background: #333; color: #fff; justify-content: center; margin-left: 3rpx; margin-top:7rpx; line-height: 28rpx; width: auto}
232   -.card_bg image{ width: 19rpx; height: 19rpx; margin-right: 1rpx; vertical-align: middle}
233   -.card_bg .card_name{
234   - max-width: 76rpx;
235   - width: auto;
236   - overflow: hidden;
237   - white-space:nowrap;
238   -}
239   -.mk_price{margin-left: 10rpx; font-size: 25rpx;}
240   -.item-cont{ line-height: 38rpx}
  222 + padding: 8rpx 8rpx;
  223 + border: 1rpx solid #e0e0e0;
  224 + border-radius: 10rpx;
  225 + font-size: 28rpx;
  226 + margin-left: 15rpx;
  227 +}
  228 +
  229 +.card_bg {
  230 + display: flex;
  231 + max-width: 110rpx;
  232 + height: 25rpx;
  233 + align-items: center;
  234 + border-radius: 26rpx;
  235 + font-size: 19rpx;
  236 + padding: 2rpx 10rpx;
  237 + background: #333;
  238 + color: #fff;
  239 + justify-content: center;
  240 + margin-left: 8rpx;
  241 + margin-top: 7rpx;
  242 + line-height: 25rpx;
  243 + width: auto;
  244 +}
  245 +
  246 +.card_bg image {
  247 + width: 19rpx;
  248 + height: 19rpx;
  249 + margin-right: 1rpx;
  250 + vertical-align: middle;
  251 +}
  252 +
  253 +.card_bg .card_name {
  254 + max-width: 76rpx;
  255 + width: auto;
  256 + overflow: hidden;
  257 + white-space: nowrap;
  258 +}
  259 +
  260 +.mk_price {
  261 + margin-left: 10rpx;
  262 + font-size: 25rpx;
  263 +}
  264 +
  265 +.item-cont {
  266 + line-height: 38rpx;
  267 +}
... ...