HNKDBOSS-WEB/hn-shop-uniapp/pages/index/index.vue

<template>
  <view class="container" :style="appThemeStyle">
    <!-- 店铺页面组件 -->
    <Page :items="items" />
    <!-- 用户隐私保护提示（仅微信小程序） -->
    <!-- #ifdef MP-WEIXIN -->
    <PrivacyPopup :hideTabBar="true" />
    <!-- #endif -->
  </view>
</template>

<script>
import {setCartTabBadge} from '@/core/app'
import * as Api from '@/api/page'
import Page from '@/components/page'
import PrivacyPopup from '@/components/privacy-popup'
import {homeData} from './data.js'
import * as AppApi from '@/api/app'
import storage from '@/utils/storage'

const App = getApp()

export default {
  components: {
    Page,
    PrivacyPopup
  },
  data() {
    return {
      // 页面参数
      options: {},
      // 页面属性
      page: {},
      // 页面元素
      items: []
    }
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    // 当前页面参数
    this.options = options
    // 加载首页数据
    this.page = homeData.data.pageData.page
    this.items = homeData.data.pageData.items
    // 设置顶部导航栏
    this.setPageBar()
    // console.log(homeData, 'homeData')
    // 加载页面数据
    this.getPageData(() => {
      uni.stopPullDownRefresh()
    })
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    // 更新购物车角标
    setCartTabBadge()
  },

  methods: {
    /**
     * 加载页面数据
     * @param {Object} callback
     */
    async getPageData(callback) {
      const params = {
        'productagentsqym.value': storage.get('wx_qym'),
        pageindex: 1,
        rows: 9999
      }
      // getShopTaochanList
      const {Data: res} = await AppApi.getShopTaochanList(params)
      const goodsIndex = this.items.findIndex((v) => v.type === 'goods')
      this.items[goodsIndex].data = res.Data
      console.log(this.items[goodsIndex].data, '上拉加载加载页面数据')
      callback()
    },

    /**
     * 设置顶部导航栏
     */
    setPageBar() {
      const {page} = this
      // 设置页面标题
      uni.setNavigationBarTitle({
        title: page.params.title
      })
      // 设置navbar标题、颜色
      uni.setNavigationBarColor({
        frontColor: page.style.titleTextColor === 'white' ? '#ffffff' : '#000000',
        backgroundColor: page.style.titleBackgroundColor
      })
    }
  },

  /**
   * 下拉刷新
   */
  onPullDownRefresh() {
    // 获取首页数据 - 上拉加载加载页面数据
    this.getPageData(() => {
      uni.stopPullDownRefresh()
    })
  },

  /**
   * 分享当前页面
   */
  onShareAppMessage() {
    const app = this
    const {page} = app
    return {
      title: page.params.shareTitle,
      path: '/pages/index/index?' + app.$getShareUrlParams()
    }
  },

  /**
   * 分享到朋友圈
   * 本接口为 Beta 版本，暂只在 Android 平台支持，详见分享到朋友圈 (Beta)
   * https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html
   */
  onShareTimeline() {
    const app = this
    const {page} = app
    return {
      title: page.params.shareTitle,
      path: '/pages/index/index?' + app.$getShareUrlParams()
    }
  }
}
</script>

<style lang="scss" scoped>
.container {
  background: #fff;
}
</style>