home.wxml 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. <view class="home-wrapper">
  2. <view class="app_page-header-search">
  3. <view class="app_page-header-search-warp app_width-690">
  4. <label for="header-search">
  5. <image src="../../image/common/search@2x.png"></image>
  6. </label>
  7. <input
  8. placeholder-class="app_header-search-placeholder"
  9. value="{{searchForm.key_words}}"
  10. placeholder="搜索"
  11. data-formkey="key_words"
  12. bind:input="handleKeyWords"></input>
  13. </view>
  14. <view class="leaving-a-message" bind:tap="jumpLeavingAMessage" wx:if="{{false}}">
  15. <image src="../../image/common/message@2x.png"></image>
  16. <view>8</view>
  17. </view>
  18. </view>
  19. <!-- 轮播 -->
  20. <view
  21. class="page-section"
  22. wx:if="{{!!lunbos.length}}">
  23. <swiper
  24. indicator-dots="{{lunbos.length > 1}}"
  25. indicator-color="rgba(151, 209, 79, 1)"
  26. indicator-active-color="#FFF"
  27. autoplay="{{false}}">
  28. <block wx:for="{{lunbos}}" wx:key="*this">
  29. <swiper-item
  30. data-item="{{item}}"
  31. bind:tap="handleSwiperClick">
  32. <view class="swiper-item">
  33. <image src="{{item.lunbo_img_url}}"></image>
  34. </view>
  35. </swiper-item>
  36. </block>
  37. </swiper>
  38. </view>
  39. <!-- 消息通知 -->
  40. <view
  41. class="news-section"
  42. wx:if="{{!!txtlist.length}}">
  43. <image src="../../image/home/notice.png"></image>
  44. <swiper
  45. vertical="{{true}}"
  46. interval="{{2000}}"
  47. circular="{{true}}"
  48. autoplay="{{true}}">
  49. <block wx:for="{{txtlist}}" wx:key="*this">
  50. <swiper-item>
  51. <view class="swiper-item {{item}}">{{item}}</view>
  52. </swiper-item>
  53. </block>
  54. </swiper>
  55. </view>
  56. <!--顶部导航-->
  57. <view class="header-nav">
  58. <view
  59. class="nav"
  60. wx:for="{{headerNav}}"
  61. wx:key="index"
  62. data-item="{{item}}"
  63. bind:tap="handleNav">
  64. <image src="../../image/home/{{item.icon}}"></image>
  65. <text>{{item.name}}</text>
  66. </view>
  67. </view>
  68. <!-- 核心入口:最新上架、VR看菜园、频道:村长说农货 -->
  69. <view class="marketing-wrap">
  70. <view>
  71. <image
  72. class="new-goods"
  73. src="../../image/home/new_goods.png"
  74. data-page="newGoods"
  75. bind:tap="openMarketing"></image>
  76. <image
  77. class="vr"
  78. data-page="VR"
  79. src="../../image/home/vr.png"
  80. bind:tap="openMarketing"></image>
  81. </view>
  82. <image
  83. class="media"
  84. data-page="media"
  85. src="../../image/home/media.png"
  86. bind:tap="openMarketing"></image>
  87. </view>
  88. <view class="excellent-goods-title">优秀产品</view>
  89. <van-tabs
  90. active="{{ searchForm.category_id }}"
  91. color="transparent"
  92. title-active-color="#FFFFFF"
  93. title-inactive-color="#858597"
  94. tab-class="my-tab-class"
  95. tab-active-class="my-tab-active-class"
  96. bind:click="handleTab">
  97. <van-tab
  98. title="{{item.category_name}}"
  99. wx:for="{{categoryList}}"
  100. wx:key="id"
  101. name="{{item.id}}">
  102. </van-tab>
  103. </van-tabs>
  104. <!--瀑布流-->
  105. <view class="waterfall">
  106. <view class="waterfall-left">
  107. <block wx:for="{{leftList}}" wx:key="id">
  108. <goods-item-large item="{{item}}"/>
  109. </block>
  110. </view>
  111. <view class="waterfall-right">
  112. <block wx:for="{{rightList}}" wx:key="id">
  113. <goods-item-large item="{{item}}"/>
  114. </block>
  115. </view>
  116. </view>
  117. <view class="pullup-wrapper" wx:if="{{!isRefresh}}">
  118. <van-loading
  119. wx:if="{{!finished}}"
  120. size="24px"
  121. type="spinner">加载中...
  122. </van-loading>
  123. </view>
  124. </view>
  125. <!--自定义tabbar页面被遮挡-->
  126. <view style="padding-bottom:25%;"></view>