<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 Page from "@/components/page";
import PrivacyPopup from "@/components/privacy-popup";
import mockData from "./mock-data";
import { apiGetCommodityList } from "@/api/goods";

const App = getApp();

export default {
  components: {
    Page,
    PrivacyPopup,
  },
  data() {
    return {
      page: {
        title: "购de着商城",
        name: "商城首页",
        shareTitle: "购de着商城",
        style: { titleTextColor: "#000000", titleBackgroundColor: "#ffffff" },
      },
      items: [],
    };
  },
  onLoad() {
    this.getPageData();
  },
  onShow() {
    setCartTabBadge(); // 更新购物车角标
  },
  methods: {
    async getPageData(callback) {
      const app = this;
      app.setPageBar()
      app.items =  await this.handleGetHomeData().finally(() => callback && callback());
    },
    async handleGetHomeData() {
        const res = await apiGetCommodityList({});
        return mockData.map(item => {
            if (item.type === 'goods') {
                item.data = res.data.rows
            }
            return item
        })
    },
    /**
     * 设置顶部导航栏
     */
    setPageBar() {
      const { page } = this;
      // 设置页面标题
      uni.setNavigationBarTitle({
        title: page.title,
      });
      // 设置navbar标题、颜色
      uni.setNavigationBarColor({
        frontColor: page.style.titleTextColor,
        backgroundColor: page.style.titleBackgroundColor,
      });
    },
  },
  /**
   * 下拉刷新
   */
  onPullDownRefresh() {
    // 获取首页数据
    this.getPageData(() => {
      uni.stopPullDownRefresh();
    });
  },
  /**
   * 分享当前页面
   */
  onShareAppMessage() {
    const app = this;
    const { page } = app;
    return {
      title: page.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.shareTitle,
      path: "/pages/index/index?" + app.$getShareUrlParams(),
    };
  },
};
</script>

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