index.vue 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. <template>
  2. <view class="content">
  3. <u-swiper height="250" :list="imageTopList"></u-swiper>
  4. <view class="t1">
  5. <u-image height="36" src="/static/t1.png"></u-image>
  6. </view>
  7. <!-- 商品 -->
  8. <view class="goods">
  9. <view v-if="goodsList.length">
  10. <u-section title="人气零食" v-if="goodsList.length" line-color="#01c9b2" sub-title="更多" @click="toGoods(1)"></u-section>
  11. <view class="goods-list">
  12. <uni-coods v-for="item in goodsList" :key="item.id" :data="item"></uni-coods>
  13. </view>
  14. </view>
  15. <view v-if="goodsList.length">
  16. <u-section title="居家生活" v-if="goodsList.length" line-color="#01c9b2" sub-title="更多" @click="toGoods(2)"></u-section>
  17. <view class="goods-list">
  18. <uni-coods v-for="item in goodsList" :key="item.id" :data="item"></uni-coods>
  19. </view>
  20. </view>
  21. </view>
  22. <!-- 购物车 -->
  23. <uni-cart-fix></uni-cart-fix>
  24. </view>
  25. </template>
  26. <script>
  27. import {
  28. checkLogin
  29. } from '@/api/login.js'
  30. import {
  31. getMapStoreList
  32. } from '@/api/store.js'
  33. import {
  34. getLookUpDatas
  35. } from '@/api/data.js'
  36. import {
  37. getUnFinishedOrder
  38. } from '@/api/order.js'
  39. export default {
  40. components: {
  41. },
  42. data() {
  43. return {
  44. imageTopList:[
  45. {image:'/static/banner.png'},
  46. {image:'/static/banner1.png'}
  47. ],
  48. goodsList:[
  49. {
  50. id: 21312312321,
  51. name: '啊撒旦解放拉萨酱豆腐爱丽丝反对萨拉地方就',
  52. src: '/static/goods.png',
  53. price: 300,
  54. status: 0
  55. },
  56. {
  57. id: 6465465465,
  58. name: '啊撒旦解放拉萨酱豆腐爱丽丝反对萨拉地方就',
  59. src: '/static/goods.png',
  60. price: 50,
  61. status: 1
  62. },
  63. ]
  64. }
  65. },
  66. onReady() {
  67. },
  68. onShow() {
  69. },
  70. onLoad() {
  71. },
  72. methods: {
  73. // 更多商品
  74. toGoods(clsId){
  75. uni.navigateTo({
  76. url:"/pages/goods/goods?id="+clsId
  77. })
  78. }
  79. }
  80. }
  81. </script>
  82. <style lang="scss" scoped>
  83. .content {
  84. background: url(../../static/topBg.png) no-repeat top center;
  85. background-size: 100%;
  86. .goods{
  87. >view{
  88. padding: 20upx 20upx 10upx;
  89. background: #FFFFFF;
  90. border-radius: 15upx;
  91. box-shadow: 0upx 6upx 10upx #eee;
  92. margin-bottom: 20upx;
  93. }
  94. }
  95. .goods-list{
  96. display: flex;
  97. flex-wrap: wrap;
  98. justify-content: space-between;
  99. padding-top: 20upx;
  100. }
  101. .t1{
  102. padding: 20upx 0;
  103. }
  104. }
  105. </style>