import { create } from 'zustand'

import { TModelAppConfig } from '@/types/index'
import { useUserStore } from './userStore'
import Taro from '@tarojs/taro'
export interface AppState {
  value: number
  ratio: number
  headerHeight: number
  screenHeight: number
  windowWidth: number
  windowHeight: number
  topDistance: number
  statusBarHeight: number
  bottomSafeHeight: number
  colorPrimary: string
  colorTextPrimary: string
  systemInfo: Taro.getSystemInfoAsync.Result | null
  isIos: boolean,
  capsuleInfo: Taro.getMenuButtonBoundingClientRect.Rect,
  appConfig: TModelAppConfig | null
  keyboardHeight: number
  desktopPopupTips: boolean
  setSystemInfo: (info: Taro.getSystemInfoAsync.Result)=> void
  setKeyboardHeight: (height: number) => void
  fetchAppConfig: ()=> Promise<TModelAppConfig | null>
}

export const useAppStore = create<AppState>((set) => ({
  value: 0,
  ratio: 1, // 750 / windowWidth  宽高比
  topDistance: 0, // 内容距离顶部的距离
  headerHeight: 0, // 头部高度
  screenHeight: 0, // 屏幕高度
  windowHeight: 0, // 可用高度（减去状态栏等）
  windowWidth: 0, // 可用高度（减去状态栏等）
  statusBarHeight: 0, // 头部状态高度
  capsuleInfo: {
    /** 下边界坐标，单位：px */
    bottom: 0,
    /** 高度，单位：px */
    height: 0,
    /** 左边界坐标，单位：px */
    left: 0,
    /** 右边界坐标，单位：px */
    right: 0,
    /** 上边界坐标，单位：px */
    top: 0,
    /** 宽度，单位：px */
    width: 0,
  },
  colorPrimary: '#CBF706', // 主题色
  colorTextPrimary: '#262626', // 主题色
  systemInfo: null,
  appConfig: null,
  isIos: false,
  keyboardHeight: 0, // 弹出键盘高度
  vip: null,
  vipPopupVisible: false,
  desktopPopupTips: false,
  bottomSafeHeight: 0,
  setKeyboardHeight: (height: number)=> {
    set({keyboardHeight: height})
  },
  setSystemInfo: (info) => {
    // 状态栏高度 - 6 偏差值为垂直居中对齐胶囊按钮
    // statusBarHeight 离顶部导航栏位置
    const statusBarHeight = (isNaN(info.statusBarHeight!) ? 24 : info.statusBarHeight || 47) - 6;
    const system = info.system.toLowerCase() 
    const isIos = system.includes('ios')
    let bottomSafeHeight = 0
    let desktopPopupTips = false;
    const capsuleInfo = Taro.getMenuButtonBoundingClientRect()

    const screenHeight = info.screenHeight
    const windowWidth = info.windowWidth
    const windowHeight = info.windowHeight // 更精确的可用高度（减去状态栏等）
    const ratio = 750 / windowWidth
    
    // 导航栏高度 = 胶囊和状态栏之间的留白 * 2 胶囊高度
    let navbarHeight = (capsuleInfo.top - statusBarHeight) * 2 + capsuleInfo.height
    
    // Android 导航栏高度多加 4
    navbarHeight = isIos ? navbarHeight : navbarHeight + 4
    
    // 整个 header 高度
    const headerHeight = statusBarHeight + navbarHeight

    // console.log({ systemInfo: info, statusBarHeight: statusBarHeight, headerHeight, capsuleInfo, navbarHeight})

    // 如果是 Mac 或 windows 电脑平台则不允许使用 并 显示小程序二维码
    if (!system.includes('android') && !system.includes('ios')) {
      desktopPopupTips = true
    }
    if(info.safeArea?.bottom){
      bottomSafeHeight = screenHeight - info.safeArea?.bottom;
    }
    
    
    set({ systemInfo: info, capsuleInfo, statusBarHeight, headerHeight, isIos, desktopPopupTips, bottomSafeHeight, screenHeight, windowHeight, windowWidth, ratio})
    
      
  },
  fetchAppConfig: async ()=> {

    return null
  },
  
}))

export const useUserPhone = ()=> {
  return useUserStore((state)=> state.user?.phone)
}


