<script setup>
// 路由转发页面无需额外组件引入
import api from './utils/api.js';
import { nextTick, onMounted, ref } from 'vue'
import { WechatAuth } from '@/utils/wechat'
import LoginModal from './components/LoginModal.vue'
import loginService from './services/loginService'

// 获取当前URL参数
const urlParams = new URLSearchParams(window.location.search);
// const cfUid = urlParams.get('cfUid');
const friend_account_id = urlParams.get('friend_account_id');
const accountId = urlParams.get('accountId');
const loginModal = ref(null)  // 创建 ref

//微信环境
if(WechatAuth.isWechatBrowser()){
  // 执行微信授权检查
  try {
    api.wechatAPI.checkAndLogin(window.location.href, accountId ? accountId : undefined,friend_account_id ? friend_account_id : undefined)
        .then(result => {
          if (result.redirecting) {
            console.log('跳转微信授权中...');
          } else if (result.success) {
            console.log('微信授权成功，token:', result.token);
          }
        })
        .catch(error => {
          console.error('微信授权失败:', error);
        });
  } catch (error) {
    console.error('授权初始化异常:', error);
  }
}

onMounted(() => {
  // 首屏加载时发送一次PV（不需要）
  // if (window.aplus_queue && Array.isArray(window.aplus_queue)) {
  //   window.aplus_queue.push({
  //     action: 'aplus.sendPV',
  //     arguments: [{ is_auto: false }]
  //   })
  // }
  nextTick(() => {  // 使用 nextTick 而不是 this.$nextTick
    if (loginModal.value) {  // 使用 .value 访问 ref 的值
      loginService.register(loginModal.value)
    }
  })

})
</script>

<template>
  <div id="app"
    style="--van-button-danger-background:#f84803;--van-button-danger-border-color:#f84803;--van-button-radius:8px;">
    <!-- 路由导航链接 -->
    <!-- <nav class="nav">
      <router-link to="/" class="nav-link">首页</router-link>
      <router-link to="/about" class="nav-link">关于</router-link>
    </nav> -->
    <!-- 路由视图容器 -->
    <!-- <transition name="fade" mode="out-in">
      <router-view class="view-container" />
    </transition> -->
    <router-view class="view-container" v-slot="{ Component }">
      <transition name="fade">
        <component :is="Component" />
      </transition>
    </router-view>
    <!-- 全局登录弹窗 -->
    <LoginModal ref="loginModal" />
  </div>
</template>

<style scoped lang="scss">
/* 路由切换动画 */
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}

.fade-enter-to,
.fade-leave-from {
  opacity: 1;
}

// @import "./style/pages/h5.scss";</style>
