import { computed } from 'vue'
import { state } from './useOverlayState'

export const zodiacMap: Record<string, { icon: string; date: string }> = {
  '白羊座': { icon: '♈', date: '3.21-4.19' },
  '金牛座': { icon: '♉', date: '4.20-5.20' },
  '双子座': { icon: '♊', date: '5.21-6.21' },
  '巨蟹座': { icon: '♋', date: '6.22-7.22' },
  '狮子座': { icon: '♌', date: '7.23-8.22' },
  '处女座': { icon: '♍', date: '8.23-9.22' },
  '天秤座': { icon: '♎', date: '9.23-10.23' },
  '天蝎座': { icon: '♏', date: '10.24-11.22' },
  '射手座': { icon: '♐', date: '11.23-12.21' },
  '摩羯座': { icon: '♑', date: '12.22-1.19' },
  '水瓶座': { icon: '♒', date: '1.20-2.18' },
  '双鱼座': { icon: '♓', date: '2.19-3.20' },
}

export const barColors: Record<string, string> = {
  all: '#e0e0e0', love: '#ff6b9d', work: '#4fc3f7', money: '#ffd54f', health: '#81c784',
}

export function useHoroscope() {
  const zodiacInfo = computed(() => zodiacMap[state.userZodiac] || { icon: '✨', date: '' })
  const data = computed(() => state.horoscope)

  return { zodiacInfo, data }
}
