home.vue 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. <template>
  2. <view class="container home clearfix">
  3. <cu-custom :navbar-data='nvabarData'></cu-custom>
  4. <!-- 主页内容 -->
  5. <tui-skeleton
  6. v-if="!skeletonShow"
  7. backgroundColor="#fafafa"
  8. borderRadius="10rpx"
  9. :isLoading="true"
  10. :loadingType="5"
  11. ></tui-skeleton>
  12. <view class="container-home tui-skeleton" :style="{paddingTop: CustomBar + 'px',paddingBottom: isIphoneX ? '140rpx' : '98rpx'}">
  13. <!-- 轮播 -->
  14. <banner :list="bannerList" v-if="skeletonShow"></banner>
  15. <!-- 金刚区菜单 -->
  16. <navbars :list="mainmenu" v-if="skeletonShow"></navbars>
  17. <!-- 活动模块 -->
  18. <hotmode :mallTheme="mallTheme" v-if="skeletonShow"></hotmode>
  19. <!-- 楼层模块 -->
  20. <floors :list="floorList" v-if="skeletonShow"></floors>
  21. </view>
  22. <!-- 侧边 -->
  23. <scroll-top :isScrollTop="isScrollTop" :bottom="50"></scroll-top>
  24. </view>
  25. </template>
  26. <script>
  27. import { mapState, mapMutations } from 'vuex'
  28. import banner from './banner.vue'
  29. import navbars from './navbars.vue'
  30. import hotmode from './hotmode.vue'
  31. import floors from './floors.vue'
  32. import homeMiXins from '../index.js'
  33. export default {
  34. mixins: [ homeMiXins ],
  35. components: {
  36. banner,
  37. navbars,
  38. hotmode,
  39. floors
  40. },
  41. created() {
  42. this.mallOrganizeHome()
  43. },
  44. onPageScroll(e) {
  45. //实时获取到滚动的值
  46. if (e.scrollTop > 400) {
  47. this.isScrollTop = true
  48. } else {
  49. this.isScrollTop = false
  50. }
  51. },
  52. onPullDownRefresh() {
  53. //下拉刷新
  54. this.mallOrganizeHome()
  55. uni.stopPullDownRefresh()
  56. },
  57. onShareAppMessage(res) {
  58. //分享转发
  59. if (res.from === 'button') {
  60. // 来自页面内转发按钮
  61. }
  62. return {
  63. title: '联合丽格集采商城',
  64. path: 'pages/tabBar/home/index',
  65. imageUrl: `${this.staticUrl}icon_share_home@2x.png`
  66. }
  67. },
  68. onShow() {
  69. },
  70. onHide() {
  71. }
  72. }
  73. </script>
  74. <style lang="scss">
  75. page {
  76. background-color: #ffffff;
  77. }
  78. .container-section {
  79. width: 100%;
  80. height: auto;
  81. background-color: #f7f7f7;
  82. }
  83. </style>