index.wxml 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  1. <!--index.wxml-->
  2. <view class="container" style="padding-top: {{pageTopHeight}}px;">
  3. <navbar>
  4. <view class="top-navbar-box" wx:if="{{gapTop==1}}" style="opacity: {{titleOpacity}};">
  5. <view class="shop-title">海马购</view>
  6. <view class="shop-info">
  7. <view>百货超市</view>|
  8. <view bindtap="toLocationPage" class="shop-address-info">
  9. <van-icon name="location-o" />
  10. {{select_address||'选择定位'}}
  11. </view>
  12. </view>
  13. </view>
  14. <view wx:else>
  15. <view class="top-search-input">
  16. <swiper vertical="true" circular="true" autoplay="true" interval="3000" class="top-search-swiper" bindtap="toSearchPage" bindchange="topSwiperChange">
  17. <swiper-item wx:for="{{hotList}}" wx:key="index">{{item.name}}</swiper-item>
  18. </swiper>
  19. <view class="top-search-line">|</view>
  20. <view class="top-search-text" bindtap="topHotSearch">搜索</view>
  21. </view>
  22. </view>
  23. </navbar>
  24. <!-- 搜索框 -->
  25. <view class="search-box" id="my-element">
  26. <view class="search-input">
  27. <swiper vertical="true" circular="true" autoplay="true" interval="3000" class="search-swiper" bindtap="toSearchPage" bindchange="swiperChange">
  28. <swiper-item wx:for="{{hotList}}" wx:key="index">{{item.name}}</swiper-item>
  29. </swiper>
  30. <view class="search-line">|</view>
  31. <view class="search-text" bindtap="inputSearch">搜索</view>
  32. </view>
  33. <view class="top-share">
  34. <van-icon name="share" />
  35. <view class="share-text">分享</view>
  36. <button class="share-btn" open-type="share"></button>
  37. </view>
  38. </view>
  39. <view class="recommended-box">
  40. <scroll-view class="recommended-swiper" scroll-x="true">
  41. <view class="recommended-text" wx:for="{{recommendedList}}" bindtap="recommendedSearch" data-name="{{item.name}}">
  42. {{item.name}}
  43. </view>
  44. </scroll-view>
  45. </view>
  46. <!-- 搜索框end -->
  47. <!-- 板块 -->
  48. <view class="swiper-grid-box" wx:if="{{categoryList.length>0}}">
  49. <swiper class="swiper-grid" indicator-dots="true" indicator-active-color="#04358D" bindchange="menuSwiper">
  50. <swiper-item wx:for="{{categoryList}}" wx:key="index">
  51. <van-grid border="{{false}}" column-num="5">
  52. <van-grid-item class="my-grid-item" use-slot bind:click="selectMenu" wx:for="{{item}}" wx:key="categoryId" data-pic="{{item.pic}}" data-itemid="{{item.categoryId}}" data-index="{{index}}" data-categories="{{item.categories}}" data-categoryName="{{item.categoryName}}">
  53. <image class="swiper-grid-image" src="{{item.icon}}" />
  54. <text class="swiper-grid-text">{{item.categoryName}}</text>
  55. </van-grid-item>
  56. </van-grid>
  57. </swiper-item>
  58. </swiper>
  59. </view>
  60. <!-- 板块end -->
  61. <view class="bonus-box" wx:if="{{hotSalesList.length>0}}">
  62. <view class="content-bonus" bindtap="toRedPackage">
  63. <image style="width:36rpx;height: 36rpx;" src="/images/icon/redPack.png" mode="" />
  64. <view class="bonus-text">天天领红包</view>
  65. </view>
  66. <view class="content-bonus" bindtap='toCouponCenter'>
  67. <image style="width:36rpx;height: 36rpx;" src="/images/icon/ticket.png" mode="" />
  68. <view class="bonus-text">领券中心</view>
  69. </view>
  70. </view>
  71. <view class="seckill-box" wx:if="{{snapUpList.length>0}}">
  72. <!-- 秒杀 -->
  73. <view class="seckill-time">
  74. <view class="seckill-title">秒杀特卖</view>
  75. <view class="times">
  76. {{days<10?'0'+days:days}}天/{{hours<10?'0'+hours:hours}}:{{minutes<10?'0'+minutes:minutes}}:{{seconds<10?'0'+seconds:seconds}} </view>
  77. <image style="width:60rpx;height:60rpx;" src="/images/icon/seckill.png" mode="" />
  78. </view>
  79. <view class="seckill-content" wx:for="{{snapUpList}}" wx:key="index" bindtap="toSnapUpListPage" data-seckillid='{{item.seckillId}}'>
  80. <view class="seckill-product-box">
  81. <image style="width: 100rpx;height:100rpx;" src="{{item.pic}}" mode="widthFix" />
  82. <view class="seckill-Price">
  83. <image class="price-bg" style="width: 100rpx;" src="/images/icon/price_bg.png" mode="widthFix" />
  84. <view class="price-num">¥{{wxs.toPrice(item.seckillPrice)}}</view>
  85. </view>
  86. </view>
  87. </view>
  88. <view class="more-icon" bindtap="toSnapUpPage">
  89. <van-icon name="arrow" />
  90. </view>
  91. </view>
  92. <!-- 秒杀end -->
  93. <!-- 推荐 -->
  94. <view class="recommended-card" wx:if="{{newList.length>0}}">
  95. <view class="new-text">
  96. <view class="seckill-title new-text-two">新品推荐</view>
  97. <view class="times">鲜品速荐</view>
  98. <image style="width:60rpx;height:60rpx;" src="/images/icon/new.png" mode="" />
  99. </view>
  100. <view class="seckill-content" wx:for="{{newList}}" wx:key="index">
  101. <view class="seckill-product-box" bindtap="newToProdPage" data-prod="{{item.prodId}}">
  102. <image style="width: 100rpx;height:100rpx;" src="{{item.pic}}" />
  103. <view class="recommended-Price">¥{{item.price}}</view>
  104. </view>
  105. </view>
  106. <view class="more-icon" bindtap="toClassifyPage" data-sts="1">
  107. <van-icon name="arrow" />
  108. </view>
  109. </view>
  110. <!-- 推荐end -->
  111. <!-- 商城热卖 -->
  112. <view class="content" wx:if="{{hotSalesList.length>0}}">
  113. <view class="left">
  114. <view class="swiper-card-box" wx:if="{{banner_img.length>0}}">
  115. <!-- 轮播卡片 -->
  116. <swiper indicator-dots="true" class="swiper-card" circular="true" indicator-active-color="#04358D" autoplay="true">
  117. <swiper-item wx:for="{{banner_img}}" wx:key="index" bindtap="goToLevelPage" data-name="{{item.name}}">
  118. <image class="swiper-card-img" src="{{item.img}}" mode="" />
  119. </swiper-item>
  120. </swiper>
  121. </view>
  122. <block wx:for="{{hotSalesList}}" wx:key="index">
  123. <view wx:if="{{index%2==1}}">
  124. <view class="item" bindtap='toProdPage' data-prodid="{{item.prodId}}">
  125. <image lazy-load class="item-img" src="{{item.pic}}" mode="widthFix"></image>
  126. <view class="item-title-box">
  127. <view class="item-title">{{item.prodName}}</view>
  128. </view>
  129. <view class="name">
  130. <view class="name-title">{{'已售'+item.salesVolume}}</view>
  131. <view class="heart">
  132. <view class="name-price">
  133. <view style="font-size:26rpx;color: #FF4D3A;">¥</view>{{wxs.toPrice(item.price)}}
  134. </view>
  135. <!-- <view class="stepper-box" wx:if="{{item.notData}}">
  136. <view class="stepper-minus" catchtap="minusButton" data-item="{{item}}">-</view>
  137. <view class="stepper-num">{{totalNum}}</view>
  138. <view class="stepper-add" catchtap="addButton" data-item="{{item}}">+</view>
  139. </view>
  140. <image wx:else catchtap="addShopCar" data-shop="{{item}}" style="width: 50rpx;height: 50rpx;" src="/images/icon/shop-car.png" mode="" /> -->
  141. </view>
  142. </view>
  143. </view>
  144. </view>
  145. </block>
  146. </view>
  147. <view class="right">
  148. <block wx:for="{{hotSalesList}}" wx:key="index">
  149. <view wx:if="{{index%2==0}}">
  150. <view class="item" bindtap='toProdPage' data-prodid="{{item.prodId}}">
  151. <image class="item-img" lazy-load src="{{item.pic}}" mode="widthFix"></image>
  152. <view class="item-title-box">
  153. <view class="item-title">{{item.prodName}}</view>
  154. </view>
  155. <view class="name">
  156. <view class="name-title">{{'已售'+item.salesVolume}}</view>
  157. <view class="heart">
  158. <view class="name-price">
  159. <view style="font-size:26rpx;color: #FF4D3A;">¥</view>{{wxs.toPrice(item.price)}}
  160. </view>
  161. <!-- <view class="stepper-box" wx:if="{{item.notData}}">
  162. <view class="stepper-minus" catchtap="minusButton">-</view>
  163. <view class="stepper-num">1</view>
  164. <view class="stepper-add" catchtap="addButton">+</view>
  165. </view>
  166. <image wx:else catchtap="addShopCar" data-shop="{{item}}" style="width: 50rpx;height: 50rpx;" src="/images/icon/shop-car.png" mode="" /> -->
  167. </view>
  168. </view>
  169. </view>
  170. </view>
  171. </block>
  172. </view>
  173. </view>
  174. <block wx:else>
  175. <view style="height: 500rpx;">
  176. <van-empty image="search" description="附近暂无可配送门店" />
  177. </view>
  178. <view class="reset-localization" bindtap="toLocationPage">定位不准确?<text style="color: rgb(40,120,255);">点击手动定位</text></view>
  179. </block>
  180. <block wx:if="{{hotSalesList.length>0}}">
  181. <view class="tips" wx:if="{{isAll}}">已经到底咯~</view>
  182. <view class="loading-box" wx:else>
  183. <van-loading size="20px" type="spinner" color="#04358D">加载中...</van-loading>
  184. </view>
  185. </block>
  186. <van-popup show="{{ addCarshow }}" closeable round position="bottom" custom-style="height: 43%" bind:close="onClose">
  187. <view class="popup-box">
  188. <view class="popup-detail">
  189. <view class="popup-img-box">
  190. <image style="width: 200rpx;height: 200rpx;" src="{{shopDetail.pic}}" mode="" />
  191. </view>
  192. <view class="popup-shop-detail">
  193. <view class="shop-price"><text style="font-size:26rpx;">¥</text>{{wxs.toPrice(shopDetail.price)}}</view>
  194. <view class="shop-detail">
  195. <view class="shop-isselect">已选</view>
  196. <view class="shop-info">黑色,1件</view>
  197. </view>
  198. </view>
  199. </view>
  200. <view class="popup-line"></view>
  201. <view class="shop-color">
  202. <view class="color-text">颜色</view>
  203. <view class="color-btn-box">
  204. <view class="color-btn">黑色</view>
  205. <view class="color-btn">黑色</view>
  206. <view class="color-btn">黑色</view>
  207. </view>
  208. </view>
  209. <view class="popup-num-box">
  210. <view class="color-text">数量</view>
  211. <view class="stepper-box">
  212. <view class="stepper-minus">-</view>
  213. <view class="stepper-num">1</view>
  214. <view class="stepper-add">+</view>
  215. </view>
  216. </view>
  217. </view>
  218. <view class="bottom-button-box">
  219. <view class="bottom-button">选好了</view>
  220. </view>
  221. </van-popup>
  222. </view>
  223. <wxs module="wxs" src="../../wxs/number.wxs" />