<template>
  <view class="container">
    <Home v-if="globalStore.curTabIndex == 0 && !globalStore.isWxFriendCircle" :scroll-top="scrollTop"/>
    <Brand v-if="globalStore.curTabIndex == 1 && !globalStore.isWxFriendCircle" :scroll-top="scrollTop"/>
    <Integral v-if="globalStore.curTabIndex == 2 && !globalStore.isWxFriendCircle" :scrollTop="scrollTop"/>
    <My v-if="globalStore.curTabIndex == 3 && !globalStore.isWxFriendCircle" />
    <TabBar v-if="!globalStore.isWxFriendCircle" :curTabIndex="globalStore.curTabIndex" @tabClick="handleTabClick" />
	<WxFriendCircleSimplePage v-if="globalStore.isWxFriendCircle" />
  
  <button v-if="isBackApp" class="back-app" open-type="launchApp" app-parameter="wechat" @binderror="handleLaunchAppError"
    :style="{
      backgroundImage: `url(${$baseUrl}homepage/backAppBtn.png)`,
    }"
  >
      <!-- <text class="back-text">返回app</text> -->
  </button>
  </view>
</template>

<script setup>
import { ref, getCurrentInstance } from "vue";
import { onLoad, onShareAppMessage, onShareTimeline, onPageScroll } from "@dcloudio/uni-app";
import TabBar from "@/components/TabBar.vue";
import Home from "@/views/Home.vue";
import Brand from "@/views/Brand.vue";
import Integral from "@/views/Integral.vue";
import My from "@/views/My.vue";
import WxFriendCircleSimplePage from "@/components/WxFriendCircleSimplePage.vue";
import { useGlobalStore } from "@/stores/global.js";

const globalStore = useGlobalStore();
const { proxy } = getCurrentInstance();
const $baseUrl = proxy.$baseUrl;
const homeRef = ref(null);
const scrollTop = ref(0);
const isBackApp = ref(false);
const shareOptions = {
  0: {
    title: "8000万中国妈妈信赖的育儿品牌",
    path: "/pages/index/index?pageType=home",
    imageUrl: $baseUrl + "share/share_home.png",
  },
  1: {
    title: "飞鹤提供家庭营养一站式解决方案",
    path: "/pages/index/index?pageType=brand",
    imageUrl: $baseUrl + "share/share_brand.png",
  },
  2: {
    title: "超凡吸收！更多妈妈推荐的奶粉",
    path: "/pages/index/index?pageType=integral",
    imageUrl: $baseUrl + "share/share_integral.png",
  },
};

// 处理返回APP失败的情况
const handleLaunchAppError = (e) => {
  console.error('返回APP失败:', e.detail.errMsg);
  
  // 根据错误类型给出不同的提示
  let errorMessage = '返回APP失败';
  if (e.detail.errMsg.includes('fail')) {
    errorMessage = '无法返回APP，请检查APP是否已安装';
  }
  
  uni.showToast({
    title: errorMessage,
    icon: 'none',
    duration: 2000
  });
};

function handleTabClick({ index }) {
  globalStore.setCurTabIndex(index);
}

onLoad((options) => {
	const optionsSync= wx.getEnterOptionsSync()
	if(optionsSync.scene == '1154'){
		globalStore.setIsWxFriendCircle(true)
		
	}
  if(optionsSync.scene == '1069'){
    isBackApp.value = true;
  }else{
    isBackApp.value = false;
  }

	console.warn('options231',options,globalStore.isWxFriendCircle)
  if (options.pageType) {
    switch (options.pageType) {
      case "home":
        globalStore.setCurTabIndex(0);
        break;
      case "brand":
        globalStore.setCurTabIndex(1);
        break;
      case "integral":
        globalStore.setCurTabIndex(2);
        break;
      case "my":
        globalStore.setCurTabIndex(3);
        break;
    }
  }
});

onShareAppMessage(() => {
  const pageType = globalStore.curTabIndex;
  return shareOptions[pageType] || shareOptions[0];
});

onShareTimeline(() => {
  const pageType = globalStore.curTabIndex;
  return shareOptions[pageType] || shareOptions[0];
});

onPageScroll((e) => {
    scrollTop.value = e.scrollTop;
});
</script>

<style lang="scss" scoped>
.container {
  min-height: 100vh;
  background-color: #f5f5f5;

  .content {
    padding-bottom: 100rpx; // 为底部TabBar留出空间
  }
}

.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  
}
// .back-app{
//     position: fixed;
//     top: 100rpx;
//     border-radius: 34rpx;
//     height: 68rpx;
//     width: 250rpx;
//     left:20rpx;
//     // background-image: url('https://course.feihe.com/momclub-picture/back_app.png');
//     // .back-text{
//     //   position: absolute;
//     //   font-size: 28rpx;
//     //   left: 30rpx;
//     // }
//   }

  .back-app{
    position: fixed;
    top: 100rpx;
    border-radius: 34rpx;
    height: 68rpx;
    width: 150rpx;
    left:20rpx;
    border: none;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 999;
    
    &:active {
      transform: scale(0.98);
    }
    
    &::after {
      border: none !important;
    }
}

.logo {
  height: 200rpx;
  width: 200rpx;
  margin-top: 200rpx;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50rpx;
}

.text-area {
  display: flex;
  justify-content: center;
}

.title {
  font-size: 36rpx;
  color: #8f8f94;
}
</style>