wxd / MShopWeApp

Commit 3be6532c1b5e58290a12d8c4b4522ff239488d0b

Authored by F5VT98DI7XY4X12\Administrator
1 parent 0f0a596a

首页，和总样式

Inline Side-by-side
Showing 5 changed files with 28 additions and 205 deletions
app.wxss
  View file @3be6532
... ... @@ -312,12 +312,9 @@ color: #b9b9b9;
312 312 position: fixed;
313 313  
314 314 }
315   -.yellow-b{
  315 +.yellow{
316 316 background-color: #ffb03f;
317 317 }
318   -.yellow-co{
319   - color: #ffb03f;
320   -}
321 318 .green{
322 319 background-color: #16ba63;
323 320 }
... ... @@ -349,4 +346,4 @@ background: #ffe3e2;
349 346 }
350 347 .fs40 {
351 348 font-size: 40rpx;
352 349 -}
  350 +}
353 351 \ No newline at end of file
... ...
pages/index/index/index.js
  View file @3be6532
... ... @@ -43,23 +43,11 @@ Page({
43 43 template_arr:null,
44 44 bgcolor_t:'',
45 45 },
46   -
47 46 onLoad: function () {
48   -
49   - wx.setNavigationBarColor({
50   - frontColor: '#ff7295',
51   - backgroundColor: '#000',
52   -
53   - });
54   -
55   -
56 47 var th = this;
57 48 n.init(th, "", "recommend");
58   -
59   -
60 49 },
61 50 async onShow() {
62   -
63 51 await this.init_load();
64 52 //显示的时候要开启计时器
65 53 this.data.is_timer=1;
... ... @@ -460,7 +448,6 @@ Page({
460 448 }
461 449 setTimeout(th.countDown2, 1000);
462 450 },
463   -
464 451  
465 452  
466 453 });
467 454 \ No newline at end of file
... ...
pages/index/index/index.json
  View file @3be6532
1 1 {
2   - "navigationBarBackgroundColor": "#ff7295",
3   - "navigationBarTextStyle": "white",
  2 + "navigationBarBackgroundColor": "#eeeeee",
4 3 "usingComponents": {
5 4 "nav": "/components/diy_nav/diy_nav",
6 5 "advertising":"/components/diy_advertising/diy_advertising",
... ...
pages/index/index/index.wxml
  View file @3be6532
1 1 <!--普通界面-->
2   -<view class="container rel" wx:if="{{ishow}}">
3   -<image class="xc-top-img abs" src="../../../images/top-img.png"></image>
  2 +<view class="container" wx:if="{{ishow}}">
4 3 <!--搜索框-->
5   - <view class="search-box {{scrollTop>10?'search-fixed':''}} flex-center white ">
6   - <view class="classify-frame t-c">
7   - <image class="classify-img" src="../../../images/classify.png"></image>
8   - <view class="fs20">分<text class="white fs22">类</text></view>
9   - </view>
  4 + <view class="search-box {{scrollTop>10?'search-fixed':''}}">
10 5 <view class="search-inner">
11 6 <view class="search-img">
12 7 <image class="wh100" src="{{url}}/miniapp/images/search.png"></image>
13 8 </view>
14 9 <input bindfocus="jumpSearch" class="search-cont" placeholder="请输入您所搜索的商品" type="text"></input>
15 10 </view>
16   - <view class="classify-frame t-c">
17   - <image class="classify-img" src="../../../images/scanning.png"></image>
18   - <view class="fs20">扫一扫</view>
19   - </view>
20 11 </view>
21 12 <!--滚动广告-->
22   - <view wx:if="{{banner}}" style="margin-top: 150rpx;">
  13 + <view wx:if="{{banner}}">
23 14 <swiper autoplay="true" class="swiper_box" duration="1000" indicatorDots="true" interval="3000" vertical="">
24 15 <swiper-item wx:for="{{banner}}" wx:key="banner">
25   - <view url="{{item.media_link}}" class="slide-image-frame">
  16 + <navigator url="{{item.media_link}}">
26 17 <image class="slide-image" src="{{item.ad_code}}" lazy-load="true" binderror="bind_bnerr" data-errorimg="banner[{{index}}].ad_code"></image>
27   - </view>
  18 + </navigator>
28 19 </swiper-item>
29 20 </swiper>
30 21 </view>
... ... @@ -65,93 +56,19 @@
65 56 </view>
66 57 </view>
67 58 </view>
68   -
69   -
70   - <view class="flex-center-around">
71   - <view class="flex">
72   - <view class="circle white xc-hook fs20 yellow-b">Г
73   - </view>
74   - <text class="yellow-co fs24 margin-left">人工优先</text>
75   - </view>
76   -
77   -
78   - <view class="flex">
79   -
80   - <view class="circle white xc-hook fs20 yellow-b">Г
81   - </view>
82   - <text class="yellow-co fs24 margin-left">正品保证</text>
83   - </view>
84   -
85   - <view class="flex">
86   - <view class="circle white xc-hook fs20 yellow-b">Г
87   - </view>
88   - <text class="yellow-co fs24 margin-left">售后无忧</text>
89   - </view>
90   - </view>
91   -
92   -
93   - <view class="flex-center-around">
94   - <view>
95   - <view class="circle xc-class-frame t-c">
96   - <image class="xc-class-img" src="../../../images/skincare.png"></image>
97   - <view class="fs28">护肤</view>
98   - </view>
99   - </view>
100   -
101   - <view>
102   - <view class="circle xc-class-frame t-c">
103   - <image class="xc-class-img" src="../../../images/cosmetics.png"></image>
104   - <view class="fs28">彩妆</view>
105   - </view>
106   - </view>
107   -
108   - <view>
109   - <view class="circle xc-class-frame t-c">
110   - <image class="xc-class-img" src="../../../images/mask.png"></image>
111   - <view class="fs28">面膜</view>
112   - </view>
113   - </view>
114   -
115   -
116   - <view>
117   - <view class="circle xc-class-frame t-c">
118   - <image class="xc-class-img" src="../../../images/nursing.png"></image>
119   - <view class="fs28">个人护理</view>
120   - </view>
121   - </view>
122   -
123   -
124   - <view>
125   - <view class="circle xc-class-frame t-c">
126   - <image class="xc-class-img" src="../../../images/man_region.png"></image>
127   - <view class="fs28">男士专区</view>
128   - </view>
129   - </view>
130   - </view>
131   -
132   - <view class="title-img-frame">
133   - <image class="xc-title-img"src="../../../images/title.png"></image>
134   - </view>
135   - <view class="split-line">
136   - </view>
137   -
138 59 <!--秒杀-->
139 60 <view class="seckill" wx:if="{{saleGoods!=null && pindGoods.length!=0 }}">
140 61 <navigator url="/pages/activity/seckill_list/seckill_list">
141 62 <view class="seckill-time">
142   - <view class="classname flex">
143   - <image class="clock-img" src="../../../images/clock-rad.png"></image>
144   - <image class="seckill-ttitle-img"src="../../../images/seckill-ttitle.png"></image>
  63 + <view class="classname">
  64 + <text class="sk-tips">秒杀特区</text>
145 65 </view>
146   - <view class="flex seckill-list">
147   - <text class="fs28 xc-marfin-right">查看全部</text>
148 66 <image class="arrow-right" src="{{url}}/miniapp/images/icon-arrowdown.png"></image>
149   - </view>
150 67 </view>
151 68 </navigator>
152 69 <view class="seckill-list">
153 70 <swiper class="s_prom" indicator-active-color='red' indicator-dots="true">
154   - <swiper-item wx:for="{{saleGoods}}" wx:key="{{index}}" class="p_swiper flex-center-around" wx:key="saleGoods">
  71 + <swiper-item wx:for="{{saleGoods}}" wx:key="{{index}}" class="p_swiper" wx:key="saleGoods">
155 72 <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}"
156 73 wx:for="{{item}}" wx:key="item" wx:for-item="aitem" wx:for-index="aind"
157 74 >
... ...
pages/index/index/index.wxss
  View file @3be6532
1 1 .search-box {
2   -
3 2 position: fixed;
4 3 top: 0;
5 4 left: 0;
6 5 width: 100%;
7 6 height: 88rpx;
8 7 z-index: 10;
9   - /* background: linear-gradient(rgba(0,0,0,.2),rgba(255,255,255,0)); */
10   -}
11   -.classify-img{
12   - width: 50rpx;
13   - height: 45rpx
  8 + background: linear-gradient(rgba(0,0,0,.2),rgba(255,255,255,0));
14 9 }
  10 +
15 11 .logo {
16 12 width: 48rpx;
17 13 height: 48rpx;
... ... @@ -23,23 +19,19 @@
23 19 .search-inner {
24 20 display: flex;
25 21 align-items: center;
26   - margin: 20rpx 25rpx;
27   - width: 566rpx;
  22 + margin: 15rpx 30rpx;
  23 + width: 675rpx;
28 24 height: 58rpx;
29 25 border-radius: 29rpx;
30 26 background-color: #fff;
31   - justify-content: center;
32 27 }
33 28  
34 29 .search-img {
35   -
  30 + margin-right: 12rpx;
36 31 width: 30rpx;
37 32 height: 30rpx;
38   - margin-left: 36rpx;
39   -display: flex;
40   -align-items: center;
41   -position: absolute
42   -
  33 + margin-top: -6rpx;
  34 + margin-left: 20rpx;
43 35 }
44 36  
45 37 .search-cont {
... ... @@ -52,7 +44,7 @@ position: absolute
52 44 }
53 45  
54 46 .search-fixed {
55   - background: #ff7295;
  47 + background: rgba(242,48,48,0.8);
56 48 }
57 49  
58 50 .swiper_box {
... ... @@ -66,11 +58,9 @@ position: absolute
66 58  
67 59 swiper-item image {
68 60 width: 100%;
69   - height: 203rpx;
  61 + height: 380rpx;
70 62 display: inline-block;
71 63 overflow: hidden;
72   - border-radius: 10rpx;
73   -
74 64 }
75 65  
76 66 .venues_box {
... ... @@ -231,15 +221,18 @@ swiper-item image {
231 221 }
232 222  
233 223 .seckill-list {
234   -
  224 + height: 360rpx;
235 225 overflow: hidden;
236 226 }
237 227  
238 228 .seckill-list navigator {
239   - width: 212rpx; position: relative;
  229 + width: 236rpx; margin-right: 10rpx; position: relative;
240 230 }
241 231  
242   -
  232 +.seckill-list image {
  233 + width: 236rpx;
  234 + height: 236rpx;
  235 +}
243 236  
244 237 .seckill-list view {
245 238 height: 45rpx;
... ... @@ -250,8 +243,8 @@ swiper-item image {
250 243 }
251 244  
252 245 .seckill-list view.imgview{
253   - width: 203rpx;
254   - height: 226rpx;
  246 + width: 236rpx;
  247 + height: 236rpx;
255 248 position: relative;
256 249 overflow: hidden
257 250 }
... ... @@ -301,73 +294,3 @@ swiper-item image {
301 294  
302 295 .arrow-right{width: 30rpx; height: 30rpx;}
303 296 .pd-view{height: 80rpx;}
304   -.xc-top-img{
305   -width: 100%;
306   -top: -1rpx;
307   -
308   -height: 315rpx;
309   -
310   -}
311   -
312   -.classify-frame{
313   -line-height: 25rpx;
314   -}
315   -.slide-image-frame{
316   - width: 95%;
317   -margin: auto;
318   -
319   -}
320   -.xc-hook{
321   - width: 30rpx;
322   - height: 30rpx;
323   - transform: rotate(-145deg);
324   -line-height: 35rpx;
325   -text-align: center;
326   -
327   -}
328   -.margin-left{
329   -margin-left: 10rpx;
330   -}
331   -.xc-class-img{
332   - width: 83rpx;
333   - height: 83rpx;
334   -}
335   -.xc-class-frame{
336   - line-height: 40rpx;
337   - margin-top: 40rpx;
338   -
339   -}
340   -.xc-title-img{
341   - height: 220rpx;
342   - width: 100%;
343   -}
344   -
345   -.title-img-frame{
346   - width: 95%;
347   -margin: auto;
348   -margin-top: 30rpx;
349   -
350   -}
351   -.seckill-list{
352   - line-height: 30rpx;
353   -
354   -}
355   -
356   -.xc-marfin-right{
357   -margin-right: 15rpx;
358   -}
359   -.clock-img{
360   - width:36rpx;
361   - height: 36rpx;
362   - margin-right: 10rpx;
363   -}
364   -.seckill-ttitle-img{
365   - width:150rpx;
366   - height: 40rpx;
367   - margin-left: -10rpx;
368   -
369   -
370   -}
371   -.split-line{
372   - width:100%;height:10rpx;background:#eee;
373   -}
374 297 \ No newline at end of file
... ...