<template>
  <view class="werun-auth-container">
    <!-- 未授权状态 -->
    <view v-if="!isAuthorized" class="auth-prompt">
      <view class="px-5 py-6 bg-white rounded-xl shadow-md mx-4 mt-4">
        <view class="flex flex-col items-center justify-center py-8">
          <view class="mb-4">
            <image
              src="https://placehold.co/100x100/e2f3ff/0369a1?text=步数&font=roboto"
              class="w-20 h-20 rounded-full"
            />
          </view>
          <text class="text-lg font-medium mb-2">获取微信运动数据</text>
          <text class="text-gray-500 text-center mb-6 px-4">
            授权后可查看您的步数信息，与家人一起记录健康生活
          </text>
          <view
            class="bg-blue-500 text-white px-8 py-3 rounded-full text-sm"
            @click="requestAuth"
          >
            立即授权
          </view>
        </view>
      </view>
    </view>

    <!-- 已授权状态 - 显示步数相关内容 -->
    <view v-else>
      <slot :steps="todaySteps" :isLoading="isLoading" />
    </view>
  </view>
</template>

<script setup>
import { ref, onMounted, defineEmits } from 'vue'
import Taro from '@tarojs/taro'

import { syncWxStepAPI } from '@/api/points'

// 定义事件
const emit = defineEmits(['auth-change', 'steps-update'])

// 响应式数据
const isAuthorized = ref(false)
const todaySteps = ref(0)
const isLoading = ref(false)

/**
 * @description 检查微信运动授权状态
 */
const checkAuthStatus = async () => {
  try {
    const authSetting = await Taro.getSetting()
    const hasWeRunAuth = authSetting.authSetting['scope.werun']

    isAuthorized.value = hasWeRunAuth === true

    // 通知父组件授权状态变化
    emit('auth-change', isAuthorized.value)

    // 如果已授权，获取步数数据
    if (isAuthorized.value) {
      await getWeRunData()
    }
  } catch (error) {
    console.error('检查授权状态失败:', error)
    isAuthorized.value = false
    emit('auth-change', false)
  }
}

/**
 * @description 请求微信运动授权
 */
const requestAuth = async () => {
  try {
    isLoading.value = true

    // 请求微信运动授权
    await Taro.authorize({
      scope: 'scope.werun'
    })

    isAuthorized.value = true
    emit('auth-change', true)

    // 授权成功后获取步数数据
    await getWeRunData()

    Taro.showToast({
      title: '授权成功',
      icon: 'success'
    })
  } catch (error) {
    console.error('授权失败:', error)

    // 用户拒绝授权，引导到设置页面
    Taro.showModal({
      title: '授权提示',
      content: '需要获取微信运动数据权限才能使用步数功能，请在设置中开启',
      confirmText: '去设置',
      success: (res) => {
        if (res.confirm) {
          Taro.openSetting({
            success: (settingRes) => {
              if (settingRes.authSetting['scope.werun']) {
                checkAuthStatus()
              }
            }
          })
        }
      }
    })
  } finally {
    isLoading.value = false
  }
}

/**
 * @description 获取微信运动数据
 */
const getWeRunData = async () => {
  try {
    isLoading.value = true

    // 先调用 wx.login 获取 code
    const loginRes = await Taro.login()

    // 获取微信运动数据
    const weRunRes = await Taro.getWeRunData()

    // 这里需要将加密数据发送到后端解密
    // 暂时使用模拟数据
    const mockSteps = Math.floor(Math.random() * 10000) + 1000
    todaySteps.value = mockSteps

    // 通知父组件步数更新
    emit('steps-update', todaySteps.value)

    console.log('微信运动数据获取成功:', {
      encryptedData: weRunRes.encryptedData,
      iv: weRunRes.iv,
      code: loginRes.code
    })

    // 同步微信步数
    const { code, data } = await syncWxStepAPI({ encryptedData: weRunRes.encryptedData, iv: weRunRes.iv });
    if (code) {
      // 提示获取步数成功
      Taro.showToast({
        title: `获取步数成功`,
        icon: 'none'
      })
      console.warn('同步微信步数成功', data);
      // todaySteps.value = decryptedData.todaySteps
      isLoading.value = false
    }

  } catch (error) {
    console.error('获取微信运动数据失败:', error)

    // 如果获取失败，使用默认值
    todaySteps.value = 0
    emit('steps-update', 0)

    Taro.showToast({
      title: '获取步数失败',
      icon: 'none'
    })
  } finally {
    isLoading.value = false
  }
}

/**
 * @description 刷新步数数据
 */
const refreshSteps = async () => {
  if (isAuthorized.value) {
    await getWeRunData()
  }
}

// 暴露方法给父组件
defineExpose({
  refreshSteps,
  checkAuthStatus
})

// 组件挂载时检查授权状态
onMounted(() => {
  checkAuthStatus()
})
</script>

<style scoped>
.werun-auth-container {
  width: 100%;
}

.auth-prompt {
  text-align: center;
}
</style>