home.wxml 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. <view class="home-wrapper">
  2. <view class="app_page-header-search">
  3. <view class="app_page-header-search-warp">
  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">
  15. <image src="../../image/common/message@2x.png"></image>
  16. <view>8</view>
  17. </view>
  18. </view>
  19. <!-- 轮播 -->
  20. <view class="page-section">
  21. <swiper
  22. indicator-dots="{{true}}"
  23. indicator-color="rgba(151, 209, 79, 1)"
  24. indicator-active-color="#FFF"
  25. autoplay="{{false}}">
  26. <block wx:for="{{background}}" wx:key="*this">
  27. <swiper-item>
  28. <view class="swiper-item {{item}}">
  29. <image src=""></image>
  30. </view>
  31. </swiper-item>
  32. </block>
  33. </swiper>
  34. </view>
  35. <!-- 消息通知 -->
  36. <view class="news-section">
  37. <image src="../../image/home/notice.png"></image>
  38. <swiper
  39. vertical="{{true}}"
  40. interval="{{2000}}"
  41. circular="{{true}}"
  42. autoplay="{{true}}">
  43. <block wx:for="{{txtlist}}" wx:key="*this">
  44. <swiper-item>
  45. <view class="swiper-item {{item}}">{{item}}</view>
  46. </swiper-item>
  47. </block>
  48. </swiper>
  49. </view>
  50. <!--顶部导航-->
  51. <view class="header-nav">
  52. <view
  53. class="nav"
  54. wx:for="{{headerNav}}"
  55. wx:key="index"
  56. data-item="{{item}}"
  57. bind:tap="handleNav">
  58. <image src="../../image/home/{{item.icon}}"></image>
  59. <text>{{item.name}}</text>
  60. </view>
  61. </view>
  62. <!-- 核心入口:最新上架、VR看菜园、频道:村长说农货 -->
  63. <view class="marketing-wrap">
  64. <view>
  65. <image
  66. class="new-goods"
  67. src="../../image/home/new_goods.png"
  68. data-page="newGoods"
  69. bind:tap="openMarketing"></image>
  70. <image
  71. class="vr"
  72. data-page="VR"
  73. src="../../image/home/vr.png"
  74. bind:tap="openMarketing"></image>
  75. </view>
  76. <image
  77. class="media"
  78. data-page="media"
  79. src="../../image/home/media.png"
  80. bind:tap="openMarketing"></image>
  81. </view>
  82. <view class="excellent-goods-title">优秀产品</view>
  83. <van-tabs
  84. active="{{ searchForm.category_id }}"
  85. color="transparent"
  86. title-active-color="#FFFFFF"
  87. title-inactive-color="#858597"
  88. tab-class="my-tab-class"
  89. tab-active-class="my-tab-active-class"
  90. bind:click="handleTab">
  91. <van-tab
  92. title="{{item.category_name}}"
  93. wx:for="{{categoryList}}"
  94. wx:key="id"
  95. name="{{item.id}}">
  96. </van-tab>
  97. </van-tabs>
  98. <!--瀑布流-->
  99. <view class="waterfall">
  100. <view class="waterfall-left">
  101. <goods-item-large/>
  102. </view>
  103. <view class="waterfall-right">
  104. <goods-item-large/>
  105. </view>
  106. </view>
  107. </view>
  108. <!--自定义tabbar页面被遮挡-->
  109. <view style="padding-bottom:25%;"></view>