index.vue 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212
  1. <template>
  2. <view class="container home clearfix" :style="{ paddingTop: CustomBar + 'px' }">
  3. <customer ref="customer" :isScroll="isScroll" :navbar-data="nvabarData"></customer>
  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">
  13. <!-- 轮播 -->
  14. <banner :list="bannerImageList" v-if="isNavRequest"></banner>
  15. <!-- 金刚区菜单 -->
  16. <navbars :list="navBarsList" v-if="isNavRequest"></navbars>
  17. <!-- 快捷运营 -->
  18. <quick-opera :list="quickOpreaList" v-if="isNavRequest && quickOpreaList.length > 0"/>
  19. <!-- 轮播公告 -->
  20. <notice :list="newsList" v-if="isNavRequest && newsList.length > 0"></notice>
  21. <!-- 优惠券入口 -->
  22. <coupon v-if="isNavRequest && couponEntry == 1"></coupon>
  23. <!-- 直播 -->
  24. <page-special :templateData="templateData" v-if="isLiveRequest"></page-special>
  25. <!-- 新品橱窗 -->
  26. <hot-floor
  27. :list="hotListPageFloor"
  28. :usserIdentity="userIdentity"
  29. :autoplay="autoplay"
  30. v-if="isRequest && hotListPageFloor.length > 0"
  31. ></hot-floor>
  32. </view>
  33. <!-- 楼层 -->
  34. <view class="container-section tui-skeleton">
  35. <page-floor :list="pageList" :userIdentity="userIdentity" :pageType="1" v-if="isRequest"></page-floor>
  36. <supplier-list :supplierObj="supplierObj" v-if="isRequest"></supplier-list>
  37. </view>
  38. <!-- 资质证书 -->
  39. <Certificate v-if="isRequest"></Certificate>
  40. <!-- 侧边 -->
  41. <scroll-top :isScrollTop="isScrollTop" :isShowSupplier="true" :bottom="130"></scroll-top>
  42. <!-- 活动弹窗 -->
  43. <activityAlert :show="isActivity" @click="handleClick" @cancel="handleCancelClick"></activityAlert>
  44. <!-- 采美豆提示弹窗 -->
  45. <activityBean
  46. v-if="isActivityBean"
  47. :show="isActivityBean"
  48. :beansType="beansType"
  49. :beanNumber="beanNumber"
  50. @cancel="handleBeanlClick"
  51. ></activityBean>
  52. <cm-seller-modal :sellerUserId="sellerUserId"></cm-seller-modal>
  53. </view>
  54. </template>
  55. <script>
  56. import { mapState, mapMutations } from 'vuex'
  57. import customer from '@/components/cm-module/homeIndex/customer.vue'
  58. import banner from '@/components/cm-module/homeIndex/banner.vue'
  59. import navbars from '@/components/cm-module/homeIndex/navbars.vue'
  60. import notice from '@/components/cm-module/homeIndex/notice.vue'
  61. import coupon from '@/components/cm-module/homeIndex/coupon.vue'
  62. import pageFloor from '@/components/cm-module/homeIndex/pageFloor.vue'
  63. import hotFloor from '@/components/cm-module/homeIndex/hotFloor.vue'
  64. import Certificate from '@/components/cm-module/homeIndex/certificate.vue'
  65. import pageSpecial from '@/components/cm-module/homeIndex/pageSpecial.vue'
  66. import supplierList from '@/components/cm-module/homeIndex/supplierList.vue'
  67. import activityAlert from '@/components/cm-module/activity/activity.vue'
  68. import activityBean from '@/components/cm-module/activity/activityBean.vue'
  69. import quickOpera from '@/components/cm-module/homeIndex/quickOperation.vue'
  70. import cmSellerModal from '@/components/cm-share-popup/cm-seller-modal.vue'
  71. import homeMiXins from './index.js'
  72. export default {
  73. mixins: [ homeMiXins ],
  74. components: {
  75. customer,
  76. banner,
  77. navbars,
  78. notice,
  79. coupon,
  80. pageFloor,
  81. hotFloor,
  82. Certificate,
  83. pageSpecial,
  84. supplierList,
  85. activityAlert,
  86. activityBean,
  87. quickOpera,
  88. cmSellerModal
  89. },
  90. data() {
  91. return {
  92. nvabarData: {
  93. // 顶部自定义导航
  94. showCapsule: 1, // 是否显示左上角图标 1表示显示 0表示不显示,
  95. showSearch: 0,
  96. title: '采美采购商城', // 导航栏 中间的标题
  97. haveBack: false,
  98. textLeft: this.$store.state.isIphone,
  99. textColor: '#FFFFFF'
  100. },
  101. CustomBar: this.CustomBar, // 顶部导航栏高度
  102. userID: 0,
  103. clubId: 0,
  104. clubStatus: '',
  105. current: 0,
  106. mode: 'round',
  107. isLogin: false,
  108. skeletonShow: true,
  109. userIdentity: 0,
  110. flootData: [], // 楼层
  111. bannerImageList: [], // 轮播
  112. navBarsList: [], // 导航分类
  113. quickOpreaList: [], // 快捷运营
  114. newsList: [], // 公告
  115. templateData: {},
  116. hotListPageFloor: [], // 新品橱窗
  117. pageList: [], // 楼层
  118. supplierObj: {}, // 供应商列表
  119. isScrollTop: false,
  120. isRequest: false,
  121. isNavRequest: false,
  122. isLiveRequest: false,
  123. isActivityBean: false,
  124. beansType: 1,
  125. beanNumber: 50,
  126. couponEntry: 2,
  127. autoplay: true,
  128. isScroll: false,
  129. sellerUserId: 0, // 协销id
  130. }
  131. },
  132. onLoad(option) {
  133. console.log('options', option)
  134. if(!uni.getStorageSync('sellerUserId')) {
  135. uni.setStorageSync('sellerUserId', option.sellerUserId || 0)
  136. }
  137. },
  138. onShow() {
  139. if (!uni.getStorageSync('spUserId')) {
  140. this.sellerUserId = uni.getStorageSync('sellerUserId')
  141. } else {
  142. if (uni.getStorageSync('spUserId') === uni.getStorageSync('sellerUserId')) {
  143. this.sellerUserId = uni.getStorageSync('sellerUserId')
  144. } else {
  145. uni.setStorageSync('sellerUserId', 0)
  146. this.sellerUserId = 0
  147. }
  148. }
  149. if (this.userInfo.userIdentity === 1) {
  150. this.sellerUserId = 0
  151. uni.setStorageSync('sellerUserId', 0)
  152. }
  153. },
  154. computed: {
  155. ...mapState(['hasLogin', 'userInfo'])
  156. },
  157. onPageScroll(e) {
  158. if (e.scrollTop > 0) {
  159. this.isScroll = true
  160. } else {
  161. this.isScroll = false
  162. }
  163. //实时获取到滚动的值
  164. if (e.scrollTop > 50) {
  165. this.inputActive = 'fixed'
  166. } else {
  167. this.inputActive = 'float'
  168. }
  169. if (e.scrollTop > 400) {
  170. this.isScrollTop = true
  171. } else {
  172. this.isScrollTop = false
  173. }
  174. },
  175. onPullDownRefresh() {
  176. //下拉刷新
  177. this.getHomeInformation()
  178. uni.stopPullDownRefresh()
  179. },
  180. onShareAppMessage(res) {
  181. //分享转发
  182. if (res.from === 'button') {
  183. // 来自页面内转发按钮
  184. }
  185. return {
  186. title: '生美医美正品采购服务平台',
  187. path: 'pages/tabBar/home/index',
  188. imageUrl: 'https://static.caimei365.com/app/img/bg/min-banner.jpg'
  189. }
  190. },
  191. onShow() {
  192. this.autoplay = true
  193. this.GetWxAuthorize()
  194. },
  195. onHide() {
  196. this.autoplay = false
  197. }
  198. }
  199. </script>
  200. <style lang="scss">
  201. page {
  202. background-color: #ffffff;
  203. }
  204. .container-section {
  205. width: 100%;
  206. height: auto;
  207. background-color: #f7f7f7;
  208. }
  209. </style>