import { computed, ref } from 'vue'
import { useDidShow } from '@tarojs/taro'
import { pinia, useAppStore, useCartStore } from '@/stores'
import {
  FulfillmentScenes,
  demoHotProducts,
  type MiniProductCard
} from '@/shared'
import { openRoute } from '@/utils/router'

const categoryCards = [
  { key: 'recommend', icon: '⭐', label: '推荐', toneClass: 'home-page__cat-icon--orange' },
  { key: 'meal', icon: '🍚', label: '主食', toneClass: 'home-page__cat-icon--green-soft' },
  { key: 'snack', icon: '🍜', label: '小吃', toneClass: 'home-page__cat-icon--yellow', badge: 'HOT' },
  { key: 'drink', icon: '🧋', label: '饮品', toneClass: 'home-page__cat-icon--green-light' },
  { key: 'set', icon: '📦', label: '套餐', toneClass: 'home-page__cat-icon--mint' },
  { key: 'dessert', icon: '🍰', label: '甜品', toneClass: 'home-page__cat-icon--amber' }
] as const

const trustItems = [
  { key: 'fresh', icon: '⚡', label: '现炒现做' },
  { key: 'fast', icon: '🕐', label: '30分钟送达' },
  { key: 'pickup', icon: '🛍', label: '自提更快' },
  { key: 'quality', icon: '🛡', label: '品质保证' }
] as const

export function useHomePage () {
  const appStore = useAppStore(pinia)
  const cartStore = useCartStore(pinia)
  const currentStore = computed(() => appStore.currentStore)
  const cartCount = computed(() => cartStore.itemCount)
  const isDineIn = computed(() => appStore.scene === FulfillmentScenes.DineIn)
  const recommendedProducts = ref<MiniProductCard[]>(demoHotProducts)

  async function refreshPage () {
    await appStore.initBootstrap()
    await appStore.initStores()
  }

  function goStoreSelect () {
    void openRoute('/pages/store/select/index')
  }

  function goMenu () {
    void openRoute('/pages/menu/index')
  }

  useDidShow(() => {
    void refreshPage()
  })

  return {
    cartCount,
    categoryCards,
    currentStore,
    goMenu,
    goStoreSelect,
    isDineIn,
    recommendedProducts,
    trustItems
  }
}