<template>
  <page-meta>
    <!-- 微信小程序非自定义组件不支持 v-bind(2025-1-16)，兼容处理 -->
    <!-- <navigation-bar v-bind="originNavBarStyle" /> -->
    <navigation-bar
      :front-color="originNavBarStyle.frontColor"
      :background-color="originNavBarStyle.backgroundColor"
      :animation="originNavBarStyle.animation"
    />
  </page-meta>
  <nut-config-provider :theme="theme" class="bg-bg-page h-full" :class="[userStore.theme]">
    <slot></slot>
  </nut-config-provider>
</template>

<script setup lang="ts">
  import { useUserStore } from '@/stores/modules/userStore'
  import { onLaunch, onShow } from '@dcloudio/uni-app'

  defineOptions({
    name: 'MConfigProvider',
    options: {
      virtualHost: true,
    },
  })

  const userStore = useUserStore()
  const theme = computed(() => userStore.theme)

  const setBarStyle = () => {
    if (userStore.theme === 'dark') {
      const styles: UniApp.SetNavigationbarColorOptions = {
        frontColor: '#ffffff',
        backgroundColor: '#1a1a1a',
        animation: {
          duration: 0,
          timingFunc: 'easeIn',
        },
      }
      uni.setNavigationBarColor(styles)
      return styles
    } else {
      const styles: UniApp.SetNavigationbarColorOptions = {
        frontColor: '#000000',
        backgroundColor: '#f8f8f8',
        animation: {
          duration: 0,
          timingFunc: 'easeIn',
        },
      }
      uni.setNavigationBarColor(styles)
      return styles
    }
  }

  const originNavBarStyle = computed(setBarStyle)

  onLaunch(() => {
    setBarStyle()
    // uni.hideTabBar()
  })
  onShow(() => {
    setBarStyle()
    // uni.hideTabBar()
  })
</script>
