import { ref, onMounted, onUnmounted } from 'vue'

export interface BookConfig {
  id: string
  title: string
  price: string
  oldPrice: string
  imageSrc: string
  tag?: string
}

export interface SiteDisplayConfig {
  heroVideoUrl: string
  heroVideoCover: string
  heroVideoTitle: string
  heroVideoSubtitle: string
  questionBankMockup: string
  onlineSchoolMockup: string
  questionBankHeroMockup: string
  questionBankFocusMockup: string
  onlineSchoolAppMockup: string
  customerServiceQrcode: string
  statsYears: number
  statsStudents: string
  statsCoverage: string
  statsSchools: number
  books: BookConfig[]
}

const defaultConfig: SiteDisplayConfig = {
  heroVideoUrl: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/%E6%81%AD%E5%AD%A6%E6%95%99%E8%82%B2%E5%93%81%E7%89%8C%E5%AE%A3%E4%BC%A0.mp4',
  heroVideoCover: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/%E5%B0%81%E9%9D%A2.png',
  heroVideoTitle: '了解恭学教育',
  heroVideoSubtitle: '观看 2025 年度品牌宣传片',

  questionBankMockup: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/tikudemo-tuya.webp',
  onlineSchoolMockup: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/wangkedemo-tuya.webp',

  questionBankHeroMockup: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/tikudemo-tuya.webp',
  questionBankFocusMockup: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/tikudemo-tuya.webp',

  onlineSchoolAppMockup: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/wangkedemo-tuya.webp',

  customerServiceQrcode: 'https://duiwaifengxiang-1304851894.cos.ap-beijing.myqcloud.com/gwgongxue/code.jpg',

  statsYears: 7,
  statsStudents: '21W+',
  statsCoverage: '100%',
  statsSchools: 12,

  books: [
    { id: '1', title: '天津专升本数学自学参考书', price: '128.00', oldPrice: '168.00', imageSrc: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/%E6%95%B0%E5%AD%A61-tuya.webp', tag: '畅销榜第一' },
    { id: '2', title: '天津专升本语文自学参考书', price: '128.00', oldPrice: '168.00', imageSrc: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/%E8%AF%AD%E6%96%871-tuya.webp', tag: '新书首发' },
    { id: '3', title: '天津专升本英语自学参考书', price: '128.00', oldPrice: '168.00', imageSrc: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/%E8%8B%B1%E8%AF%AD1-tuya.webp', tag: '热销' },
    { id: '4', title: '天津专升本计算机自学参考书', price: '128.00', oldPrice: '168.00', imageSrc: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/%E8%AE%A1%E7%AE%97%E6%9C%BA%E5%80%92%E5%BD%B1-tuya.webp', tag: '必刷' },
    { id: '5', title: '三年模拟一年升本刷题系列套装', price: '128.00', oldPrice: '198.00', imageSrc: 'https://fenxiang-1304851894.cos.ap-nanjing.myqcloud.com/%E4%B8%89%E4%B8%80-tuya.webp', tag: '限时优惠' },
  ],
}

function getFromCache(): Partial<SiteDisplayConfig> {
  if (typeof localStorage === 'undefined') return {}
  try {
    const cached = localStorage.getItem('site_display_config')
    if (cached) return JSON.parse(cached)
  } catch {}
  return {}
}

function setCache(config: SiteDisplayConfig) {
  if (typeof localStorage === 'undefined') return
  try {
    localStorage.setItem('site_display_config', JSON.stringify(config))
  } catch {}
}

export function getSiteConfig(): SiteDisplayConfig {
  const cached = getFromCache()
  return { ...defaultConfig, ...cached }
}

export function useSiteConfig() {
  const config = ref<SiteDisplayConfig>(getSiteConfig())

  onMounted(() => {
    const cached = getFromCache()
    config.value = { ...defaultConfig, ...cached }

    const handleStorage = (e: StorageEvent) => {
      if (e.key === 'site_display_config') {
        config.value = getSiteConfig()
      }
    }

    window.addEventListener('storage', handleStorage)
    onUnmounted(() => {
      window.removeEventListener('storage', handleStorage)
    })
  })

  return config
}