Commit 7241214fc1aa27e23590e0bbabf043be7c26d56e
1 parent
1609c52f
商城首页页面与样式
Showing
2 changed files
with
682 additions
and
75 deletions
pages/index/index/index.wxml
| 1 | 1 | <!--普通界面--> |
| 2 | -<view class="container" wx:if="{{ishow}}"> | |
| 2 | +<view class="container rel" wx:if="{{ishow}}"> | |
| 3 | +<image class="xc-top-img abs" src="../../../images/top-img.png"></image> | |
| 3 | 4 | <!--搜索框--> |
| 4 | - <view class="search-box {{scrollTop>10?'search-fixed':''}}"> | |
| 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> | |
| 5 | 10 | <view class="search-inner"> |
| 6 | 11 | <view class="search-img"> |
| 7 | 12 | <image class="wh100" src="{{url}}/miniapp/images/search.png"></image> |
| 8 | 13 | </view> |
| 9 | 14 | <input bindfocus="jumpSearch" class="search-cont" placeholder="请输入您所搜索的商品" type="text"></input> |
| 10 | 15 | </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> | |
| 11 | 20 | </view> |
| 12 | 21 | <!--滚动广告--> |
| 13 | - <view wx:if="{{banner}}"> | |
| 14 | - <swiper autoplay="true" class="swiper_box" duration="1000" indicatorDots="true" interval="3000" vertical=""> | |
| 22 | + <view class="rel title-img" wx:if="{{banner}}" > | |
| 23 | + <swiper autoplay="true" class="swiper_box" duration="1000" interval="3000" vertical=""bindchange="bannerSwiperChange" > | |
| 15 | 24 | <swiper-item wx:for="{{banner}}" wx:key="banner"> |
| 16 | - <navigator url="{{item.media_link}}"> | |
| 25 | + <view url="{{item.media_link}}" class="slide-image-frame"> | |
| 17 | 26 | <image class="slide-image" src="{{item.ad_code}}" lazy-load="true" binderror="bind_bnerr" data-errorimg="banner[{{index}}].ad_code"></image> |
| 18 | - </navigator> | |
| 27 | + </view> | |
| 19 | 28 | </swiper-item> |
| 20 | 29 | </swiper> |
| 30 | + | |
| 31 | + <view class="flex-center-around translation abs"> | |
| 32 | + <view class="circle spot" wx:for="{{banner}}" wx:key="{{index}}" style="background:{{index==banner_index?'#fff':'#999'}}"> | |
| 33 | + </view> | |
| 34 | + </view> | |
| 21 | 35 | </view> |
| 22 | 36 | <view class="pd-view" wx:else></view> |
| 23 | 37 | |
| ... | ... | @@ -56,19 +70,93 @@ |
| 56 | 70 | </view> |
| 57 | 71 | </view> |
| 58 | 72 | </view> |
| 73 | + | |
| 74 | + | |
| 75 | + <view class="flex-center-around"> | |
| 76 | + <view class="flex"> | |
| 77 | + <view class="circle white xc-hook fs20 yellow-b">Г | |
| 78 | + </view> | |
| 79 | + <text class="yellow-co fs20 margin-left">人工优先</text> | |
| 80 | + </view> | |
| 81 | + | |
| 82 | + | |
| 83 | + <view class="flex"> | |
| 84 | + | |
| 85 | + <view class="circle white xc-hook fs20 yellow-b">Г | |
| 86 | + </view> | |
| 87 | + <text class="yellow-co fs20 margin-left">正品保证</text> | |
| 88 | + </view> | |
| 89 | + | |
| 90 | + <view class="flex"> | |
| 91 | + <view class="circle white xc-hook fs20 yellow-b">Г | |
| 92 | + </view> | |
| 93 | + <text class="yellow-co fs20 margin-left">售后无忧</text> | |
| 94 | + </view> | |
| 95 | + </view> | |
| 96 | + | |
| 97 | + | |
| 98 | + <view class="flex-center-around"> | |
| 99 | + <view> | |
| 100 | + <view class="circle xc-class-frame t-c"> | |
| 101 | + <image class="xc-class-img" src="../../../images/skincare.png"></image> | |
| 102 | + <view class="fs24">护肤</view> | |
| 103 | + </view> | |
| 104 | + </view> | |
| 105 | + | |
| 106 | + <view> | |
| 107 | + <view class="circle xc-class-frame t-c"> | |
| 108 | + <image class="xc-class-img" src="../../../images/cosmetics.png"></image> | |
| 109 | + <view class="fs24">彩妆</view> | |
| 110 | + </view> | |
| 111 | + </view> | |
| 112 | + | |
| 113 | + <view> | |
| 114 | + <view class="circle xc-class-frame t-c"> | |
| 115 | + <image class="xc-class-img" src="../../../images/mask.png"></image> | |
| 116 | + <view class="fs24">面膜</view> | |
| 117 | + </view> | |
| 118 | + </view> | |
| 119 | + | |
| 120 | + | |
| 121 | + <view> | |
| 122 | + <view class="circle xc-class-frame t-c"> | |
| 123 | + <image class="xc-class-img" src="../../../images/nursing.png"></image> | |
| 124 | + <view class="fs24">个人护理</view> | |
| 125 | + </view> | |
| 126 | + </view> | |
| 127 | + | |
| 128 | + | |
| 129 | + <view> | |
| 130 | + <view class="circle xc-class-frame t-c"> | |
| 131 | + <image class="xc-class-img" src="../../../images/man_region.png"></image> | |
| 132 | + <view class="fs24">男士专区</view> | |
| 133 | + </view> | |
| 134 | + </view> | |
| 135 | + </view> | |
| 136 | + | |
| 137 | + <view class="title-img-frame"> | |
| 138 | + <image class="xc-title-img"src="../../../images/title.png"></image> | |
| 139 | + </view> | |
| 140 | + <view class="split-line"> | |
| 141 | + </view> | |
| 142 | + | |
| 59 | 143 | <!--秒杀--> |
| 60 | 144 | <view class="seckill" wx:if="{{saleGoods!=null && pindGoods.length!=0 }}"> |
| 61 | 145 | <navigator url="/pages/activity/seckill_list/seckill_list"> |
| 62 | 146 | <view class="seckill-time"> |
| 63 | - <view class="classname"> | |
| 64 | - <text class="sk-tips">秒杀特区</text> | |
| 147 | + <view class="classname flex"> | |
| 148 | + <image class="clock-img" src="../../../images/clock.png"></image> | |
| 149 | + <image class="seckill-ttitle-img"src="../../../images/seckill-ttitle.png"></image> | |
| 65 | 150 | </view> |
| 151 | + <view class="flex seckill-list"> | |
| 152 | + <text class="fs24 xc-marfin-right">查看全部</text> | |
| 66 | 153 | <image class="arrow-right" src="{{url}}/miniapp/images/icon-arrowdown.png"></image> |
| 154 | + </view> | |
| 67 | 155 | </view> |
| 68 | 156 | </navigator> |
| 69 | 157 | <view class="seckill-list"> |
| 70 | - <swiper class="s_prom" indicator-active-color='red' indicator-dots="true"> | |
| 71 | - <swiper-item wx:for="{{saleGoods}}" wx:key="{{index}}" class="p_swiper" wx:key="saleGoods"> | |
| 158 | + <swiper class="s_prom" indicator-dots="{{false}}" bindchange="flashSwiperChange"> | |
| 159 | + <swiper-item wx:for="{{saleGoods}}" wx:key="{{index}}" class="p_swiper flex-center-around" wx:key="saleGoods"> | |
| 72 | 160 | <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}" |
| 73 | 161 | wx:for="{{item}}" wx:key="item" wx:for-item="aitem" wx:for-index="aind" |
| 74 | 162 | > |
| ... | ... | @@ -89,66 +177,109 @@ |
| 89 | 177 | <image wx:if="{{aitem.status==2}}" class="status_img" src="{{url}}/miniapp/images/miao/mend.png"></image> |
| 90 | 178 | </view> |
| 91 | 179 | <view>{{aitem.title}}</view> |
| 92 | - <view class="co-red">￥{{aitem.price}} | |
| 180 | + <view class="red-co mar-top10"> <text class="fs20">￥</text>{{aitem.price}} | |
| 93 | 181 | <text class="un_line">￥{{aitem.market_price}}</text> |
| 94 | 182 | </view> |
| 95 | 183 | </navigator> |
| 96 | 184 | </swiper-item> |
| 97 | 185 | </swiper> |
| 186 | + <view class="flex-center-around translation"> | |
| 187 | + <view class="circle spot" wx:for="{{saleGoods}}" wx:key="{{index}}" style="background:{{index==flash_index?'#fff':'#999'}}"> | |
| 188 | + </view> | |
| 189 | + </view> | |
| 98 | 190 | </view> |
| 99 | 191 | </view> |
| 100 | 192 | <!----拼单----> |
| 101 | 193 | <view class="seckill" wx:if="{{pindGoods!=null && pindGoods.length!=0 }}"> |
| 102 | 194 | <navigator url="/pages/activity/pind_list/pind_list"> |
| 103 | 195 | <view class="seckill-time"> |
| 104 | - <view class="classname"> | |
| 105 | - <text class="sk-tips">天天拼单</text> | |
| 196 | + <view class="classname flex"> | |
| 197 | + <image class="clock-img" src="../../../images/clock.png"></image> | |
| 198 | + <image class="seckill-ttitle-img"src="../../../images/team.png"></image> | |
| 199 | + <image class="user-img circle" src="../../../images/nursing.png"></image> | |
| 200 | + <view class="flex user-frame t-c xc-ash"> | |
| 201 | + <view class="ellipsis-1 user-name fs24">张大仙</view> | |
| 202 | + <text class="fs20">刚拼团成功</text> | |
| 203 | + </view> | |
| 106 | 204 | </view> |
| 205 | + <view class="flex seckill-list"> | |
| 206 | + <text class="fs24 xc-marfin-right">查看全部</text> | |
| 107 | 207 | <image class="arrow-right" src="{{url}}/miniapp/images/icon-arrowdown.png"></image> |
| 208 | + </view> | |
| 108 | 209 | </view> |
| 109 | 210 | </navigator> |
| 110 | - <view class="seckill-list"> | |
| 111 | - <swiper class="s_prom" indicator-active-color='red' indicator-dots="true"> | |
| 112 | - <swiper-item wx:for="{{pindGoods}}" wx:key="{{index}}" class="p_swiper"> | |
| 113 | - <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}" | |
| 114 | - wx:for="{{item}}" wx:key="item" wx:for-item="aitem" wx:for-index="aind" | |
| 115 | - > | |
| 116 | - <view class="imgview"> | |
| 117 | - <image src="{{url+aitem.original_img}}" lazy-load="true" data-errorimg="pindGoods[{{index}}][{{aind}}].original_img" | |
| 118 | - data-img="{{aitem.original_img}}" binderror="bind_bnerr3"></image> | |
| 119 | - <!-- | |
| 120 | - <view class="djs_view"> | |
| 121 | - <text class='tui-conutdown-box'>{{aitem.djs.day}}</text>天 | |
| 122 | - <text class='tui-conutdown-box'>{{aitem.djs.hou}}</text>时 | |
| 123 | - <text class='tui-conutdown-box'>{{aitem.djs.min}}</text>分 | |
| 124 | - <text class='tui-conutdown-box tui-countdown-bg'>{{aitem.djs.sec}}</text>秒 | |
| 125 | - </view>--> | |
| 211 | + <view class="seckill-lists rel"> | |
| 212 | + <swiper class="s_proms" indicator-active-color='red' bindchange="ptSwiperChange"> | |
| 213 | + <swiper-item wx:for="{{pindGoods}}" wx:key="{{index}}"> | |
| 214 | + <view class="teamheight" style='display:block;' wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind"> | |
| 215 | + <view class="kill-item"> | |
| 216 | + <navigator class="flex navwidth" url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}"> | |
| 217 | + <view class="kill-pic"> | |
| 218 | + <image class="wh100" src="{{url+aitem.original_img}}" data-val="{{aitem.original_img}}" | |
| 219 | + data-errorimg="goodlist[{{index}}].original_img" binderror="bind_bnerr2" lazy-load="true"> | |
| 220 | + </image> | |
| 221 | + </view> | |
| 126 | 222 | |
| 127 | - <image wx:if="{{aitem.status==0}}" class="status_img" src="{{url}}/miniapp/images/miao/yure.png"></image> | |
| 128 | - <image wx:if="{{aitem.status==1}}" class="status_img" src="{{url}}/miniapp/images/miao/going.png"></image> | |
| 129 | - <image wx:if="{{aitem.status==2}}" class="status_img" src="{{url}}/miniapp/images/miao/mend.png"></image> | |
| 223 | + <view class="kill-cont"> | |
| 224 | + <navigator class="goods-name ellipsis-2" url="/pages/goods/goodsInfo/goodsInfo?goods_id={{item.goods_id}}"> | |
| 225 | + {{aitem.title}} | |
| 130 | 226 | |
| 131 | - <view wx:if="{{aitem.kttype==1}}" class="status_view">商家团</view> | |
| 132 | - <view wx:if="{{aitem.kttype==2}}" class="status_view">会员团</view> | |
| 133 | - <view wx:if="{{aitem.kttype==3}}" class="status_view">阶梯团</view> | |
| 227 | + </navigator> | |
| 228 | + <view class="flex left"> | |
| 229 | + <view class="tneirong red-b flex-vertical rel"> | |
| 230 | + <image class="xc-team-img abs" src="../../../images/fril.png"></image> | |
| 231 | + 已拼11{{aitem.buy_num}}份</view> | |
| 232 | + <view class="fs20 flex xc-people-val-frame" | |
| 233 | + style="border-color:{{type==1?'#059de5':'#d60021'}};margin-left:8rpx"> | |
| 234 | + <view class=" flex-center val-img {{type==1?'blue_b':'red-b'}}"> | |
| 235 | + <image class="people-img"src="{{iurl}}/miniapp/images/bai-ren.png"></image> | |
| 236 | + </view> | |
| 237 | + <text class="{{type==1?'blue_c':'red-co'}}" style="margin-left:8rpx; margin-right:8rpx">{{aitem.ct_num}}人团</text> | |
| 238 | + </view> | |
| 239 | + </view> | |
| 240 | + | |
| 241 | + <view class="goods-num"style="margin-top:{{type==0?'70rpx':'40rpx'}}"> | |
| 242 | + <view> | |
| 243 | + | |
| 244 | + <view class="fs40 flex xc-top15 {{type==1?'blue_c':' red-co ai-bas'}}"> | |
| 245 | + <text class="fs28 {{type==0?'martop13':''}}">￥</text> | |
| 246 | + <text style="margin-left:-5rpx">{{aitem.price}}</text> | |
| 247 | + <span class="underline {{type==0?'martop18':''}}">零售价￥{{aitem.market_price}}</span> | |
| 248 | + </view> | |
| 249 | + | |
| 250 | + </view> | |
| 134 | 251 | |
| 135 | - </view> | |
| 136 | - <view>{{aitem.title}}</view> | |
| 137 | - <view class="co-red">￥{{aitem.price}}</view> | |
| 138 | - <view class="co-red2">{{aitem.ct_num}}人团</view> | |
| 139 | 252 | |
| 140 | - <view wx:if="{{aitem.kttype==1 && aitem.goods_num>aitem.buy_num }}" class="cantuan">去参团</view> | |
| 141 | - <view wx:if="{{aitem.kttype==2 && aitem.goods_num>aitem.buy_num }}" class="cantuan">去开团</view> | |
| 142 | - <view wx:if="{{aitem.kttype==3 && aitem.goods_num>aitem.buy_num }}" class="cantuan">去开团</view> | |
| 143 | - <view wx:if="{{aitem.goods_num<=aitem.buy_num }}" class="cantuan">已抢光</view> | |
| 253 | + </view> | |
| 254 | + </view> | |
| 255 | + | |
| 256 | + </navigator> | |
| 257 | + | |
| 258 | + | |
| 259 | + </view> | |
| 260 | + | |
| 261 | +</view> | |
| 262 | + <!-- <view class="kill-item"wx:for="{{item}}" wx:for-item="aitem" wx:for-index="aind"> | |
| 263 | + <navigator url="/pages/goods/goodsInfo/goodsInfo?goods_id={{aitem.goods_id}}"> | |
| 264 | + <view class="kill-pic "> | |
| 265 | + <image class="wh100" src="{{url+aitem.original_img}}" data-val="{{aitem.original_img}}" | |
| 266 | + data-errorimg="goodlist[{{index}}].original_img" binderror="bind_bnerr2" lazy-load="true"> | |
| 267 | + </image> | |
| 268 | + </view> | |
| 269 | + </navigator> | |
| 270 | + </view> --> | |
| 144 | 271 | |
| 145 | - </navigator> | |
| 146 | 272 | </swiper-item> |
| 147 | 273 | </swiper> |
| 274 | + | |
| 275 | + <view class="flex-center-around translations abs"> | |
| 276 | + <view class="circle spot" wx:for="{{pindGoods}}" wx:key="{{index}}" style="background:{{index==pt_index?'#fff':'#999'}}"> | |
| 277 | + </view> | |
| 278 | + </view> | |
| 148 | 279 | </view> |
| 149 | 280 | </view> |
| 150 | 281 | <!--新品上市--> |
| 151 | - <view class="seckill" wx:if="{{newGoods!=null}}"> | |
| 282 | + <!-- <view class="seckill" wx:if="{{newGoods!=null}}"> | |
| 152 | 283 | <navigator url="/pages/goods/goodsList/goodsList?is_new=1"> |
| 153 | 284 | <view class="seckill-time"> |
| 154 | 285 | <view class="classname"> |
| ... | ... | @@ -176,9 +307,9 @@ |
| 176 | 307 | </swiper-item> |
| 177 | 308 | </swiper> |
| 178 | 309 | </view> |
| 179 | - </view> | |
| 310 | + </view> --> | |
| 180 | 311 | <!--热销商品--> |
| 181 | - <view class="seckill" wx:if="{{hotGoods!=null}}"> | |
| 312 | + <!-- <view class="seckill" wx:if="{{hotGoods!=null}}"> | |
| 182 | 313 | <navigator url="/pages/goods/goodsList/goodsList?is_hot=1"> |
| 183 | 314 | <view class="seckill-time"> |
| 184 | 315 | <view class="classname"> |
| ... | ... | @@ -206,9 +337,9 @@ |
| 206 | 337 | </swiper-item> |
| 207 | 338 | </swiper> |
| 208 | 339 | </view> |
| 209 | - </view> | |
| 340 | + </view> --> | |
| 210 | 341 | <!--推荐商品--> |
| 211 | - <view class="section"> | |
| 342 | + <!--111111111111 <view class="section"> | |
| 212 | 343 | <view class="section-title">推荐商品</view> |
| 213 | 344 | <view class="section-subtitle"> |
| 214 | 345 | <image class="wh100" src="{{url}}/miniapp/images/pic-interesting.png"></image> |
| ... | ... | @@ -222,17 +353,101 @@ |
| 222 | 353 | </navigator> |
| 223 | 354 | <navigator class="title shelue" url="/pages/goods/goodsInfo/goodsInfo?goods_id={{item.goods_id}}">{{item.goods_name}}</navigator> |
| 224 | 355 | <view class="choice_footer"> |
| 225 | - <view class="price flex"> | |
| 356 | + <view class="price flex"> --> | |
| 226 | 357 | <!--<view class="meiz" wx:if="{{index==1}}">美妆价</view><view class="dengj" wx:if="{{index==3}}">等级价</view>--> |
| 227 | - ￥{{item.shop_price}} <view class="xiafa">￥{{item.market_price}}</view> | |
| 358 | + <!-- 11111￥{{item.shop_price}} <view class="xiafa">￥{{item.market_price}}</view> | |
| 228 | 359 | </view> |
| 229 | - <view class="ys">已售{{item.sales_sum}}</view> | |
| 360 | + <view class="ys">已售{{item.sales_sum}}</view> --> | |
| 230 | 361 | <!-- <navigator class="similer" url="/pages/goods/goodsList/goodsList?cat_id={{item.cat_id}}">找相似</navigator>--> |
| 231 | - </view> | |
| 362 | + <!-- 111111</view> | |
| 232 | 363 | </view> |
| 233 | 364 | </view> |
| 234 | 365 | </view> |
| 235 | -</view> | |
| 366 | +</view> --> | |
| 367 | + | |
| 368 | + | |
| 369 | + | |
| 370 | + | |
| 371 | + | |
| 372 | + <!-- 好物推荐 --> | |
| 373 | + <view class="title"> | |
| 374 | + <!-- 标题 --> | |
| 375 | + <view> | |
| 376 | + <!-- 中文名标题 --> | |
| 377 | + <view class="China flex-level"> | |
| 378 | + <view class="line flex-vertical"> | |
| 379 | + <view class="one"></view> | |
| 380 | + <view class="two"></view> | |
| 381 | + <view class="three"></view> | |
| 382 | + </view> | |
| 383 | + | |
| 384 | + <view class="Recommend flex-level" bindtap="requestList">热门好物</view> | |
| 385 | + | |
| 386 | + <view class="line flex-vertical"> | |
| 387 | + <view class="three"></view> | |
| 388 | + <view class="two"></view> | |
| 389 | + <view class="one"></view> | |
| 390 | + </view> | |
| 391 | + </view> | |
| 392 | + | |
| 393 | + <!-- 英文标题 --> | |
| 394 | + <view class="english flex-center"> | |
| 395 | + <view class="silk"></view> | |
| 396 | + <view class="esh five-level-word">GOOD HOT THING</view> | |
| 397 | + <view class="silk"></view> | |
| 398 | + </view> | |
| 399 | + | |
| 400 | + </view> | |
| 401 | + | |
| 402 | + <view class="collects"> | |
| 403 | + <view class="hang "> | |
| 404 | + | |
| 405 | + <!-- 商品详情 --> | |
| 406 | + <view class="collect ib" wx:for="{{recommend}}"> | |
| 407 | + <!-- 商品图片 --> | |
| 408 | + | |
| 409 | + <image class="sp" src="{{item.original_img}}"mode="scaleToFill"></image> | |
| 410 | + <view class="bottom"> | |
| 411 | + <!-- 商品名称 --> | |
| 412 | + <view class="goods_name ellipsis-2 fs24">{{item.goods_name}}</view> | |
| 413 | + <!-- 商品价格 --> | |
| 414 | + <view class="money flex"> | |
| 415 | + <!-- 办卡价 --> | |
| 416 | + <view class="flex xc-wc"> | |
| 417 | + <view class="fs24">￥</view> | |
| 418 | + <view class="fs35">{{item.shop_price}}</view> | |
| 419 | + </view> | |
| 420 | + <!-- 原价 --> | |
| 421 | + <view class="price flex xc-ash"> | |
| 422 | + <view class="fs22">￥</view> | |
| 423 | + <view class="fs22">{{item.market_price}}</view> | |
| 424 | + </view> | |
| 425 | + | |
| 426 | + </view> | |
| 427 | + | |
| 428 | + <!-- 办卡优惠多少 --> | |
| 429 | + <view class="Discount flex-center"> | |
| 430 | + <image src="../../../images/Member.png"></image> | |
| 431 | + <view class="province">黑卡省11.9元</view> | |
| 432 | + </view> | |
| 433 | + | |
| 434 | + </view> | |
| 435 | + | |
| 436 | + | |
| 437 | + | |
| 438 | + | |
| 439 | + </view> | |
| 440 | + | |
| 441 | + </view> | |
| 442 | + <view class="nothing flex-center" wx:if="{{ismore!=0}}"> | |
| 443 | + <view class="Foil"></view> | |
| 444 | + <view class="no_content fs24">没有更多内容了</view> | |
| 445 | + <view class="Foil"></view> | |
| 446 | + </view> | |
| 447 | + </view> | |
| 448 | + </view> | |
| 449 | + | |
| 450 | + </view> | |
| 236 | 451 | <!--是否是自定义--> |
| 237 | 452 | <view class="container" wx:if="{{isTemplate}}" style="background-color:{{bgcolor_t}}"> |
| 238 | 453 | <block wx:for="{{template_arr}}" wx:key="{{index}}" > | ... | ... |
pages/index/index/index.wxss
| 1 | 1 | .search-box { |
| 2 | + | |
| 2 | 3 | position: fixed; |
| 3 | 4 | top: 0; |
| 4 | 5 | left: 0; |
| 5 | 6 | width: 100%; |
| 6 | 7 | height: 88rpx; |
| 7 | 8 | z-index: 10; |
| 8 | - background: linear-gradient(rgba(0,0,0,.2),rgba(255,255,255,0)); | |
| 9 | + /* background: linear-gradient(rgba(0,0,0,.2),rgba(255,255,255,0)); */ | |
| 10 | +} | |
| 11 | +.classify-img{ | |
| 12 | + width: 50rpx; | |
| 13 | + height: 45rpx | |
| 9 | 14 | } |
| 10 | - | |
| 11 | 15 | .logo { |
| 12 | 16 | width: 48rpx; |
| 13 | 17 | height: 48rpx; |
| ... | ... | @@ -19,19 +23,23 @@ |
| 19 | 23 | .search-inner { |
| 20 | 24 | display: flex; |
| 21 | 25 | align-items: center; |
| 22 | - margin: 15rpx 30rpx; | |
| 23 | - width: 675rpx; | |
| 26 | + margin: 20rpx 25rpx; | |
| 27 | + width: 566rpx; | |
| 24 | 28 | height: 58rpx; |
| 25 | 29 | border-radius: 29rpx; |
| 26 | 30 | background-color: #fff; |
| 31 | + justify-content: center; | |
| 27 | 32 | } |
| 28 | 33 | |
| 29 | 34 | .search-img { |
| 30 | - margin-right: 12rpx; | |
| 35 | + | |
| 31 | 36 | width: 30rpx; |
| 32 | 37 | height: 30rpx; |
| 33 | - margin-top: -6rpx; | |
| 34 | - margin-left: 20rpx; | |
| 38 | + margin-left: 36rpx; | |
| 39 | +display: flex; | |
| 40 | +align-items: center; | |
| 41 | +position: absolute | |
| 42 | + | |
| 35 | 43 | } |
| 36 | 44 | |
| 37 | 45 | .search-cont { |
| ... | ... | @@ -44,7 +52,7 @@ |
| 44 | 52 | } |
| 45 | 53 | |
| 46 | 54 | .search-fixed { |
| 47 | - background: rgba(242,48,48,0.8); | |
| 55 | + background: #ff7295; | |
| 48 | 56 | } |
| 49 | 57 | |
| 50 | 58 | .swiper_box { |
| ... | ... | @@ -55,8 +63,12 @@ |
| 55 | 63 | width: 100%; |
| 56 | 64 | height: 380rpx; |
| 57 | 65 | } |
| 66 | +.s_proms{ | |
| 67 | + width: 100%; | |
| 68 | + height:590rpx; | |
| 69 | +} | |
| 58 | 70 | |
| 59 | -swiper-item image { | |
| 71 | +.slide-image{ | |
| 60 | 72 | width: 100%; |
| 61 | 73 | height: 380rpx; |
| 62 | 74 | display: inline-block; |
| ... | ... | @@ -103,6 +115,12 @@ swiper-item image { |
| 103 | 115 | width: 100%; |
| 104 | 116 | height: 368rpx; |
| 105 | 117 | } |
| 118 | +.title-img{ | |
| 119 | + margin-top: 150rpx; | |
| 120 | + | |
| 121 | + margin-bottom: 15rpx; | |
| 122 | + | |
| 123 | +} | |
| 106 | 124 | |
| 107 | 125 | .choice_box .choice_list .title { |
| 108 | 126 | height: 36rpx; |
| ... | ... | @@ -221,34 +239,36 @@ swiper-item image { |
| 221 | 239 | } |
| 222 | 240 | |
| 223 | 241 | .seckill-list { |
| 224 | - height: 360rpx; | |
| 242 | + | |
| 225 | 243 | overflow: hidden; |
| 226 | 244 | } |
| 227 | 245 | |
| 228 | -.seckill-list navigator { | |
| 246 | +/* .seckill-list navigator { | |
| 229 | 247 | width: 236rpx; margin-right: 10rpx; position: relative; |
| 230 | -} | |
| 248 | +} */ | |
| 249 | + | |
| 231 | 250 | |
| 232 | -.seckill-list image { | |
| 233 | - width: 236rpx; | |
| 234 | - height: 236rpx; | |
| 235 | -} | |
| 236 | 251 | |
| 237 | 252 | .seckill-list view { |
| 238 | 253 | height: 45rpx; |
| 239 | 254 | padding: 0 10rpx; |
| 240 | - line-height: 45rpx; | |
| 255 | + line-height: 25rpx; | |
| 241 | 256 | overflow: hidden; |
| 242 | 257 | font-size: 30rpx; |
| 243 | 258 | } |
| 244 | 259 | |
| 245 | 260 | .seckill-list view.imgview{ |
| 246 | - width: 236rpx; | |
| 247 | - height: 236rpx; | |
| 261 | + width: 203rpx; | |
| 262 | + height: 226rpx; | |
| 248 | 263 | position: relative; |
| 249 | 264 | overflow: hidden |
| 250 | 265 | } |
| 251 | - | |
| 266 | +.imgview image{ | |
| 267 | + width: 203rpx; | |
| 268 | + height: 203rpx; | |
| 269 | + border-radius: 10rpx; | |
| 270 | + | |
| 271 | +} | |
| 252 | 272 | .seckill-list view.djs_view{ |
| 253 | 273 | background:rgba(9,9,9,0.5);color: #fff; font-size: 20rpx; |
| 254 | 274 | width: 216rpx; height: 36rpx; line-height: 36rpx; |
| ... | ... | @@ -292,5 +312,377 @@ swiper-item image { |
| 292 | 312 | bottom: 30rpx; right: 10rpx; z-index: 5; border-radius: 5rpx;padding: 0; |
| 293 | 313 | } |
| 294 | 314 | |
| 295 | -.arrow-right{width: 30rpx; height: 30rpx;} | |
| 315 | +.arrow-right{width: 24rpx; height: 24rpx;} | |
| 296 | 316 | .pd-view{height: 80rpx;} |
| 317 | +.xc-top-img{ | |
| 318 | +width: 100%; | |
| 319 | +top: -1rpx; | |
| 320 | + | |
| 321 | +height: 315rpx; | |
| 322 | + | |
| 323 | +} | |
| 324 | + | |
| 325 | +.classify-frame{ | |
| 326 | +line-height: 25rpx; | |
| 327 | +} | |
| 328 | +.slide-image-frame{ | |
| 329 | + width: 95%; | |
| 330 | +margin: auto; | |
| 331 | + | |
| 332 | +} | |
| 333 | +.xc-hook{ | |
| 334 | + width: 30rpx; | |
| 335 | + height: 30rpx; | |
| 336 | + transform: rotate(-145deg); | |
| 337 | +line-height: 35rpx; | |
| 338 | +text-align: center; | |
| 339 | + | |
| 340 | +} | |
| 341 | +.margin-left{ | |
| 342 | +margin-left: 10rpx; | |
| 343 | +} | |
| 344 | +.xc-class-img{ | |
| 345 | + width: 83rpx; | |
| 346 | + height: 83rpx; | |
| 347 | +} | |
| 348 | +.xc-class-frame{ | |
| 349 | + line-height: 40rpx; | |
| 350 | + margin-top: 40rpx; | |
| 351 | + | |
| 352 | +} | |
| 353 | +.xc-title-img{ | |
| 354 | + height: 220rpx; | |
| 355 | + width: 100%; | |
| 356 | +} | |
| 357 | + | |
| 358 | +.title-img-frame{ | |
| 359 | + width: 95%; | |
| 360 | +margin: auto; | |
| 361 | +margin-top: 30rpx; | |
| 362 | + | |
| 363 | +} | |
| 364 | +.seckill-list{ | |
| 365 | + line-height: 30rpx; | |
| 366 | +} | |
| 367 | +.seckill-lists{ | |
| 368 | + line-height: 30rpx; | |
| 369 | +} | |
| 370 | + | |
| 371 | +.xc-marfin-right{ | |
| 372 | +margin-right: 15rpx; | |
| 373 | +} | |
| 374 | +.classname .clock-img{ | |
| 375 | + width:36rpx; | |
| 376 | + height: 36rpx; | |
| 377 | + margin-right: 10rpx; | |
| 378 | +} | |
| 379 | +.classname .seckill-ttitle-img{ | |
| 380 | + width:150rpx; | |
| 381 | + height: 40rpx; | |
| 382 | + | |
| 383 | + | |
| 384 | + | |
| 385 | +} | |
| 386 | +.split-line{ | |
| 387 | + width:100%;height:10rpx;background:#eee; | |
| 388 | +} | |
| 389 | +.mar-top10{ | |
| 390 | +margin-top: 10rpx; | |
| 391 | +} | |
| 392 | +.classname .user-img{ | |
| 393 | +width: 30rpx; | |
| 394 | +height:30rpx; | |
| 395 | +margin-left:20rpx; | |
| 396 | +} | |
| 397 | +.user-frame{ | |
| 398 | + width:220rpx; | |
| 399 | + border-left: 5rpx solid #eee; | |
| 400 | + height: 35rpx; | |
| 401 | + line-height: 35rpx; | |
| 402 | + margin-left: 10rpx; | |
| 403 | + | |
| 404 | +} | |
| 405 | +.user-name{ | |
| 406 | + width: 66rpx | |
| 407 | +} | |
| 408 | + | |
| 409 | + | |
| 410 | +/* 团购列表 */ | |
| 411 | + | |
| 412 | +.kill-item { | |
| 413 | + | |
| 414 | + display: flex; | |
| 415 | + justify-content: space-between; | |
| 416 | + background-color: #fff; | |
| 417 | + padding: 10rpx 10rpx; | |
| 418 | + margin-bottom: 10rpx; | |
| 419 | + border-radius: 10rpx; | |
| 420 | + height: 249rpx; | |
| 421 | + align-items: center; | |
| 422 | + | |
| 423 | + | |
| 424 | +} | |
| 425 | +.kill-pic { | |
| 426 | + width: 215rpx; | |
| 427 | + height: 215rpx; | |
| 428 | + position: relative; | |
| 429 | +} | |
| 430 | +.teamheight{ | |
| 431 | +height: 289rpx; | |
| 432 | +border-bottom:6rpx solid #eee; | |
| 433 | + | |
| 434 | +} | |
| 435 | + | |
| 436 | + | |
| 437 | +.kill-cont { | |
| 438 | + width: 440rpx; | |
| 439 | + height: 215rpx; | |
| 440 | + margin-left: 16rpx; | |
| 441 | +} | |
| 442 | +.goods-name { | |
| 443 | + max-height: 60rpx; | |
| 444 | + font-size: 24rpx; | |
| 445 | + color: #555; | |
| 446 | + line-height: 55rpx; | |
| 447 | + | |
| 448 | +} | |
| 449 | + | |
| 450 | +.xc-team-img{ | |
| 451 | +width:38rpx; | |
| 452 | +height: 45rpx; | |
| 453 | +left: -1rpx; | |
| 454 | +top: -16rpx; | |
| 455 | +} | |
| 456 | + | |
| 457 | +.tneirong{ | |
| 458 | + color:#fff; | |
| 459 | + font-size: 20rpx; | |
| 460 | + border-radius:20rpx; | |
| 461 | + padding-left: 32rpx; | |
| 462 | + padding-right: 15rpx; | |
| 463 | + padding-bottom: 2rpx; | |
| 464 | + height: 28rpx; | |
| 465 | + line-height: 28rpx; | |
| 466 | + | |
| 467 | +white-space: nowrap; | |
| 468 | + } | |
| 469 | + .xc-people-val-frame{ | |
| 470 | + border: 3rpx solid #d60021;border-radius: 8rpx;white-space: nowrap; | |
| 471 | +height: 28rpx; | |
| 472 | + | |
| 473 | +} | |
| 474 | +.xc-people-val-frame .val-img{ | |
| 475 | +width:33rpx;height:28rpx;border-radius: 8rpx;margin-left: -2rpx; | |
| 476 | +} | |
| 477 | +.people-img{ | |
| 478 | + width:20rpx;height:20rpx | |
| 479 | +} | |
| 480 | +.goods-num { | |
| 481 | + height: 50rpx; | |
| 482 | + display: flex; | |
| 483 | + justify-content: space-between; | |
| 484 | +margin-top: 10rpx; | |
| 485 | + font-size: 24rpx; | |
| 486 | + color: #999; | |
| 487 | + | |
| 488 | +} | |
| 489 | +.xc-top15{ | |
| 490 | + padding-top: 15rpx; | |
| 491 | + margin-top: 4rpx; | |
| 492 | +} | |
| 493 | +.underline { | |
| 494 | + text-decoration: line-through; color:#999999; font-size: 20rpx; margin-left: 5rpx; | |
| 495 | +} | |
| 496 | +.navigator.navwidth{ | |
| 497 | + width: 100%； | |
| 498 | +} | |
| 499 | +.view.left{ | |
| 500 | + padding: 0 5rpx; | |
| 501 | + | |
| 502 | +} | |
| 503 | + | |
| 504 | + | |
| 505 | + | |
| 506 | +/* 热门好物 */ | |
| 507 | + | |
| 508 | +.title .China { | |
| 509 | + width: 100%; | |
| 510 | + margin-top: 50rpx; | |
| 511 | + margin-bottom: 10rpx; | |
| 512 | + line-height: 0rpx; | |
| 513 | +} | |
| 514 | + | |
| 515 | +.title .China .line view { | |
| 516 | + width: 2rpx; | |
| 517 | +} | |
| 518 | + | |
| 519 | +.title .China .line { | |
| 520 | + height: 40rpx; | |
| 521 | + color: rgb(51,51, 51); | |
| 522 | +} | |
| 523 | + | |
| 524 | +.title .China .line .one { | |
| 525 | + height: 23rpx; | |
| 526 | + background-color: #000; | |
| 527 | + margin-left: 5rpx; | |
| 528 | +} | |
| 529 | + | |
| 530 | +.title .China .line .two { | |
| 531 | + height: 15rpx; | |
| 532 | + background-color: #000; | |
| 533 | + margin-left: 5rpx; | |
| 534 | +} | |
| 535 | + | |
| 536 | +.title .China .line .three { | |
| 537 | + height: 18rpx; | |
| 538 | + background-color: #000; | |
| 539 | + margin-left: 5rpx; | |
| 540 | +} | |
| 541 | + | |
| 542 | +.title .China .Recommend { | |
| 543 | + margin: 0rpx 20rpx; | |
| 544 | + font-size: 28rpx; | |
| 545 | + line-height: 39rpx; | |
| 546 | + font-weight: bold; | |
| 547 | +} | |
| 548 | + | |
| 549 | +.title .english .silk { | |
| 550 | + width: 214rpx; | |
| 551 | + height: 2rpx; | |
| 552 | + background-color: #000; | |
| 553 | +} | |
| 554 | + | |
| 555 | +.title .english .esh { | |
| 556 | + margin: 0rpx 15rpx; | |
| 557 | +} | |
| 558 | + | |
| 559 | +.collects { | |
| 560 | + margin-top: 40rpx; | |
| 561 | +} | |
| 562 | + | |
| 563 | +.hang { | |
| 564 | + width: 100%; | |
| 565 | + margin: auto; | |
| 566 | + padding-left: 21rpx; | |
| 567 | +} | |
| 568 | + | |
| 569 | +.hang .collect { | |
| 570 | + width: 347rpx; | |
| 571 | + height: 571rpx; | |
| 572 | + border-radius: 25rpx; | |
| 573 | + border: 1rpx solid rgb(214, 214, 214); | |
| 574 | + overflow: hidden; | |
| 575 | + margin-right: 14rpx; | |
| 576 | + margin-bottom: 5rpx; | |
| 577 | +} | |
| 578 | + | |
| 579 | +.collect .bottom { | |
| 580 | + padding: 0rpx 20rpx; | |
| 581 | +} | |
| 582 | + | |
| 583 | +.collect .sp { | |
| 584 | + width: 100%; | |
| 585 | + height: 326rpx; | |
| 586 | +} | |
| 587 | + | |
| 588 | +.collect .money { | |
| 589 | + margin-top: 60rpx; | |
| 590 | + margin-bottom: 18rpx; | |
| 591 | + line-height: 28rpx; | |
| 592 | + align-items: baseline; | |
| 593 | +} | |
| 594 | +.collect .money view{ | |
| 595 | + line-height: 28rpx; | |
| 596 | +} | |
| 597 | +.collect .money .flex { | |
| 598 | + font-weight: bold; | |
| 599 | +} | |
| 600 | +.collect .money .flex .fs24{ | |
| 601 | + padding-top: 5rpx; | |
| 602 | +} | |
| 603 | +.collect .Discount { | |
| 604 | + width: 156rpx; | |
| 605 | + height: 28rpx; | |
| 606 | + border-radius: 20rpx; | |
| 607 | + background-color: rgb(56, 56, 56); | |
| 608 | + font-size: 18rpx; | |
| 609 | + color: rgb(255, 255, 255); | |
| 610 | +} | |
| 611 | + | |
| 612 | +.collect .Discount image { | |
| 613 | + height: 18rpx; | |
| 614 | + width: 18rpx; | |
| 615 | + line-height: 28rpx; | |
| 616 | + margin-right: 3rpx; | |
| 617 | +} | |
| 618 | + | |
| 619 | +.collect.ml20 { | |
| 620 | + margin-left: 13rpx; | |
| 621 | +} | |
| 622 | + | |
| 623 | +.fs24.dollar { | |
| 624 | + padding: 0rpx; | |
| 625 | +} | |
| 626 | + | |
| 627 | +.money .price { | |
| 628 | + margin-left: 12rpx; | |
| 629 | + text-decoration: line-through; | |
| 630 | + line-height: 23rpx; | |
| 631 | +} | |
| 632 | + | |
| 633 | +.province { | |
| 634 | + line-height: 26rpx; | |
| 635 | +} | |
| 636 | + | |
| 637 | +.nothing { | |
| 638 | + height: 75rpx; | |
| 639 | + width: 100%; | |
| 640 | +} | |
| 641 | + | |
| 642 | +.nothing .no_content { | |
| 643 | + margin: 0rpx 11rpx; | |
| 644 | + color: rgb(138, 138, 138); | |
| 645 | +} | |
| 646 | + | |
| 647 | +.nothing .Foil { | |
| 648 | + width: 80rpx; | |
| 649 | + height: 2rpx; | |
| 650 | + background-color: rgb(138, 138, 138); | |
| 651 | +} | |
| 652 | +.goods_name{ | |
| 653 | + height: 70rpx; | |
| 654 | + margin-top: 6rpx; | |
| 655 | +} | |
| 656 | +.seckill-list view.translation{ | |
| 657 | + width:108rpx;height:20rpx; border-radius: 20rpx;background:#e0e0e0;margin: auto;line-height: 20rpx; | |
| 658 | +} | |
| 659 | +.seckill-list view.spot{ | |
| 660 | + width:10rpx; | |
| 661 | + height:10rpx; | |
| 662 | + padding: 0rpx; | |
| 663 | + | |
| 664 | +} | |
| 665 | + | |
| 666 | +.spot{ | |
| 667 | + width:10rpx; | |
| 668 | + height:10rpx; | |
| 669 | + padding: 0rpx; | |
| 670 | + | |
| 671 | +} | |
| 672 | +.translation{ | |
| 673 | + width:108rpx;height:20rpx; border-radius: 20rpx;background:#e0e0e0;line-height: 20rpx; | |
| 674 | + bottom: 45rpx; | |
| 675 | +left: 43%; | |
| 676 | + | |
| 677 | +} | |
| 678 | + | |
| 679 | +.translation{ | |
| 680 | + width:108rpx;height:20rpx; border-radius: 20rpx;background:#e0e0e0;line-height: 20rpx; | |
| 681 | + bottom: 45rpx; | |
| 682 | +left: 43%; | |
| 683 | +} | |
| 684 | +.translations{ | |
| 685 | + width:108rpx;height:20rpx; border-radius: 20rpx;background:#e0e0e0;line-height: 20rpx; | |
| 686 | + bottom: 25rpx; | |
| 687 | +left: 43%; | |
| 688 | +} | |
| 297 | 689 | \ No newline at end of file | ... | ... |