home.vue 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  1. <template>
  2. <view class="container home clearfix" :style="{paddingTop:CustomBar+'px'}" >
  3. <tui-skeleton v-if="skeletonShow" backgroundColor="#fafafa" borderRadius="10rpx" :isLoading ="true" :loadingType="5" />
  4. <customer ref="customer" :isScroll="isScroll" :navbar-data="nvabarData" :navBarsList="navBarsList" v-if="isNavRequest" />
  5. <!-- 主页内容 -->
  6. <view class="container-home tui-skeleton">
  7. <!-- 轮播 -->
  8. <banner :list="bannerImageList" v-if="isNavRequest" />
  9. <!-- 金刚区菜单 -->
  10. <navbars :list="shortcutList" v-if="isNavRequest" />
  11. <!-- 直播 -->
  12. <!-- <page-special :templateData="templateData" v-if="isLiveRequest" /> -->
  13. <!-- 新品橱窗 -->
  14. <hot-floor :list="hotListPageFloor" :usserIdentity="userIdentity" v-if="isRequest" />
  15. </view>
  16. <!-- 楼层 -->
  17. <view class="container-section tui-skeleton" :style="{ paddingBottom: isIphoneX ? '140rpx' : '98rpx' }">
  18. <!-- <page-floor :list="pageList" :userIdentity="userIdentity" :pageType='1' v-if="isRequest" /> -->
  19. <zone-floor :list="pageList" :userIdentity="userIdentity" :pageType="1" v-if="isRequest" />
  20. <supplier-list :supplierObj="supplierObj" v-if="isRequest" />
  21. <recommend-floor :recommendProducts="recommendProducts" :userIdentity="userIdentity" v-if="isRequest" />
  22. </view>
  23. <!-- 活动弹窗 -->
  24. <activityAlert :show="isActivity" @click="handleClick" @cancel="handleCancelClick" />
  25. <!-- 侧边 -->
  26. <scroll-top :isScrollTop="isScrollTop" :isShowSupplier="true" :isShowKefu='false' :bottom="130" />
  27. </view>
  28. </template>
  29. <script>
  30. import authorize from '@/common/config/authorize.js'
  31. import customer from './homeIndex/customer.vue'
  32. import banner from './homeIndex/banner.vue'
  33. import navbars from './homeIndex/navbars.vue'
  34. import hotFloor from './homeIndex/hotFloor.vue'
  35. import pageFloor from './homeIndex/pageFloor.vue'
  36. import zoneFloor from './homeIndex/zoneFloor.vue'
  37. import recommendFloor from './homeIndex/recommendFloor.vue'
  38. import pageSpecial from './homeIndex/pageSpecial.vue'
  39. import supplierList from './homeIndex/supplierList.vue'
  40. import { mapState,mapMutations} from 'vuex'
  41. export default {
  42. components:{
  43. customer,
  44. banner,
  45. navbars,
  46. hotFloor,
  47. pageFloor,
  48. zoneFloor,
  49. recommendFloor,
  50. pageSpecial,
  51. supplierList
  52. },
  53. data() {
  54. return {
  55. nvabarData: {
  56. // 顶部自定义导航
  57. showCapsule: 1, // 是否显示左上角图标 1表示显示 0表示不显示,
  58. showSearch: 0,
  59. title: '采美采购商城', // 导航栏 中间的标题
  60. haveBack: false,
  61. textLeft: this.$store.state.isIphone,
  62. textColor: '#333333'
  63. },
  64. isIphoneX: this.$store.state.isIphone,
  65. CustomBar:this.CustomBar,// 顶部导航栏高度
  66. userID:0,
  67. clubStatus:'',
  68. current:0,
  69. mode:'round',
  70. modallayer:false,
  71. isLogin:false,
  72. skeletonShow: true,
  73. userIdentity:'',
  74. flootData:[],//楼层
  75. bannerImageList:[],//轮播
  76. navBarsList:[],//导航分类
  77. newsList:[], // 公告
  78. templateData:{},
  79. hotListPageFloor:[], // 新品橱窗
  80. pageList:[],//楼层
  81. supplierObj:{},//供应商列表
  82. recommendProducts:[],//推荐商品
  83. isScrollTop:false,
  84. isRequest:false,
  85. isNavRequest:false,
  86. isLiveRequest:false,
  87. shortcutList: [], // 快捷运营
  88. isScroll: false
  89. }
  90. },
  91. created() {
  92. this.$api.getStorage().then((resolve) =>{
  93. this.userID = resolve.userId ? resolve.userId : 0
  94. this.userIdentity = resolve.userIdentity
  95. this.getHomeInformation()
  96. })
  97. },
  98. filters: {
  99. NumFormat:function(text) {//处理金额
  100. return Number(text).toFixed(2)
  101. },
  102. },
  103. computed: {
  104. ...mapState(['hasLogin','userInfo','isActivity'])
  105. },
  106. methods: {
  107. ...mapMutations(['login','logout']),
  108. GetHomeTopDataInfo(){//直播、活动、文章模块
  109. this.CommonService.GetHomeTopDataInfo({source:2}).then(response =>{
  110. this.templateData = response.data
  111. this.isLiveRequest = true
  112. }).catch(error =>{
  113. this.$util.msg(error.msg,2000)
  114. })
  115. },
  116. GetHomeFloorInfo(){//初始化首页楼层数据
  117. this.CommonService.GetHomeDataInfo({userId:this.userID,source:2}).then(response =>{
  118. let data = response.data
  119. this.pageList = data.zones
  120. this.hotListPageFloor = data.pageFloorList
  121. this.supplierObj = data.supplierImage
  122. this.recommendProducts = data.recommendProducts
  123. this.isRequest = true
  124. }).catch(error =>{
  125. this.$util.msg(error.msg,2000)
  126. })
  127. },
  128. getHomeInformation(){//初始化首页数据
  129. this.CommonService.GetHomeModulesDataInfo({ source: 2 }).then(res =>{
  130. let data = res.data
  131. this.bannerImageList = data.bannerList
  132. this.mallPageModules = data.mallPageModules
  133. this.skeletonShow = false
  134. this.navBarsList = data.topMenuList
  135. this.newsList = data.annlist
  136. this.shortcutList = data.shortcutList || [] // 快捷运营
  137. this.isNavRequest = true
  138. this.GetHomeTopDataInfo()
  139. this.GetHomeFloorInfo()
  140. }).catch(error =>{
  141. this.$util.msg(error.msg,2000)
  142. })
  143. },
  144. handleClick(data){
  145. this.$api.navigateTo('/pages/h5/activity/meobohui')
  146. this.$store.commit('setActivity',data)
  147. },
  148. handleCancelClick(data){
  149. this.$store.commit('setActivity',data)
  150. }
  151. },
  152. onPullDownRefresh() {//下拉刷新
  153. this.getHomeInformation()
  154. uni.stopPullDownRefresh()
  155. },
  156. onShareAppMessage(res){//分享转发
  157. if (res.from === 'button') {
  158. // 来自页面内转发按钮
  159. }
  160. return {
  161. title: '生美医美正品采购服务平台',
  162. path: 'pages/tabBar/home/index',
  163. imageUrl:'https://static.caimei365.com/app/img/bg/min-banner.jpg'
  164. }
  165. }
  166. }
  167. </script>
  168. <style lang="scss">
  169. .home{
  170. background-color: #FFFFFF;
  171. }
  172. .container-section{
  173. width: 100%;
  174. height: auto;
  175. background-color: #F7F7F7;
  176. }
  177. </style>