member-center/src/pages/index/index.vue

<template>
  <view class="home-index2">
    <view class="BanContain">
      <view
        class="status_bar"
        :style="{ height: statusBarHeight + 'px' }"
      ></view>
      <view class="navBar" :style="{ height: titleBarHeight + 'px' }">
        <image class="logo" :src="require('@/assets/logo.png')" mode=""></image>
      </view>
    </view>
    <view :style="{ marginTop: BarHeight + 'px' }"></view>
    <swiper
      v-if="modules.lunbo && modules.lunbo.length"
      class="swiper"
      circular
      indicator-dots
      autoplay
    >
      <swiper-item v-for="item in modules.lunbo" :key="item.module_id">
        <image
          class="swiper-item"
          :src="item.img"
          mode=""
          @click="jumpModuleAll(item.url)"
        ></image>
      </swiper-item>
    </swiper>
    <view
      class="icon-list"
      v-if="modules.quick_links && modules.quick_links.length"
    >
      <view
        v-for="item in modules.quick_links"
        :key="item.module_id"
        class="icon-item"
        @click="jumpModuleAll(item.url)"
      >
        <image class="icon" :src="item.img"></image>
        {{ item.name }}
      </view>
    </view>
    <view class="title">最新推荐</view>
    <view
      v-if="modules.latest_recommend && modules.latest_recommend.length"
      class="base-list"
    >
      <list-item
        v-for="item in modules.latest_recommend"
        :key="item.module_id"
        :item="item"
        class="base-list-item"
        @click="jumpModuleAll(item.url)"
      >
      </list-item>
    </view>
    <!-- <view class="fixed-btns">
      <image
        class="fixed-btn"
        :src="require('@/assets/icon/icon-btn-service.png')"
        @click="jumpModuleAll('/pages/help/help_contact')"
      ></image>
      <image
        class="fixed-btn"
        :src="require('@/assets/icon/icon-btn-message.png')"
        @click="jumpModuleAll('/pages/my/messages')"
      ></image>

      <image
        v-if="showTask"
        class="fixed-btn"
        :src="require('@/assets/icon/icon-btn-sign.png')"
        @click="jumpModuleAll('/pages/task/index')"
      ></image>
    </view>
       -->
  </view>
</template>
<script>
import login from "@/lib/utils/login";
import { homeModules } from "@/lib/api/home";
// import { getSingInfo } from "@/lib/api/task";
import listItem from "@/components/list-item/list-item.vue";

export default {
  name: "PageHome",
  components: {
    listItem,
  },
  data() {
    return {
      statusBarHeight: 0, // 自定义导航
      titleBarHeight: 44, // 自定义导航
      BarHeight: 0, // 自定义导航
      userInfo: {},
      modules: {},
      tabStyle: "",
      // showTask: false,
    };
  },
  async onLoad() {
    this.userInfo = await login.getUserInfo();
    uni.showLoading({
      title: "加载中",
    });
    this.loadModules().then(() => {
      uni.hideLoading();
    });
    this.showDialog();
  },
  // onShow() {
  //   // this.getSingInfo();
  // },
  onShareAppMessage() {
    return {
      title: "云果国潮会员中心",
      imageUrl:
        "https://yggc.oss-cn-beijing.aliyuncs.com/images/81d939394aea637ac0f6a3026d1a38e6.jpg",
      path: "/pages/index/index",
    };
  },
  onShareTimeline() {
    return {
      title: "云果国潮会员中心",
      imageUrl:
        "https://yggc.oss-cn-beijing.aliyuncs.com/images/81d939394aea637ac0f6a3026d1a38e6.jpg",
      path: "/pages/index/index",
    };
  },
  async onPullDownRefresh() {
    await this.loadModules().catch((e) => console.log(e));
    uni.stopPullDownRefresh();
  },
  mounted() {
    const systemInfo = uni.getSystemInfoSync();
    this.statusBarHeight = systemInfo.statusBarHeight;

    // #ifdef MP
    this.statusBarHeight = systemInfo.statusBarHeight;
    // this.titleBarHeight = systemInfo.statusBarHeight;
    // #endif

    // #ifdef MP-WEIXIN
    this.statusBarHeight = systemInfo.statusBarHeight;
    const menuButtonInfo = wx.getMenuButtonBoundingClientRect();
    this.titleBarHeight =
      (menuButtonInfo.top - systemInfo.statusBarHeight) * 2 +
      menuButtonInfo.height;
    // #endif

    // #ifdef MP-ALIPAY
    this.statusBarHeight = systemInfo.statusBarHeight;
    this.titleBarHeight =
      systemInfo.statusBarHeight + systemInfo.titleBarHeight;
    // #endif

    // #ifdef APP-PLUS
    this.statusBarHeight = systemInfo.statusBarHeight;
    // this.titleBarHeight = 44;
    // #endif

    // #ifdef H5
    this.statusBarHeight = 0;
    // this.titleBarHeight = systemInfo.statusBarHeight;
    // #endif
    this.BarHeight = this.statusBarHeight + this.titleBarHeight;
  },
  methods: {
    showDialog() {
      if (this.userInfo && this.userInfo.type === "1") return;
      uni.showModal({
        title: "欢迎来到云果国潮",
        content: "您当前还不是VIP，立即加入享受多种优惠活动！",
        cancelText: "暂不开通",
        confirmText: "立即开通",
        success: function (res) {
          if (res.confirm) {
            uni.navigateTo({
              url: "/pages/vip/vip",
            });
          }
        },
      });
    },
    async loadModules() {
      try {
        const data = await homeModules();
        if (data.errno == 10000) {
          this.modules = data.data;
          // this.endTime = data.diff_time;
          // this.runCd();
        } else {
          uni.showToast({
            icon: "none",
            title: data.errmsg,
            duration: 3000,
          });
        }
      } catch (e) {
        uni.showToast({
          icon: "none",
          title: "出错啦，请稍后重试",
          duration: 3000,
        });
      }
    },

    // async getSingInfo() {
    //   if (!this.userInfo.session) {
    //     this.showTask = true;
    //     return Promise.reject();
    //   }
    //   const data = await getSingInfo(this.userInfo.session);
    //   this.showTask = !data.is_current_signin;
    // },

    jumpModuleAll(url) {
      if (!url) return;

      if (/^https?:\/\//i.test(url)) {
        uni.navigateTo({
          url: `../webview/webview?url=${encodeURIComponent(url)}`,
        });
        return;
      }
      if (
        [
          "/pages/index/index",
          "/pages/shop/index",
          "/pages/activity/index",
          "/pages/my/my",
        ].includes(url)
      ) {
        uni.switchTab({
          url,
        });
      } else {
        uni.navigateTo({
          url,
        });
      }
    },
  },
};
</script>
<style lang="scss">
@import "./index.scss";
</style>