import { defineStore } from 'pinia'
import { reactive, ref, watch } from 'vue'

export default defineStore('background', () => {
  const tag = ref(localStorage.getItem('backgroundTag') || '')
  const resource = reactive({
    type: 'image',
    brief: '',
    url: ''
  })
  const getResource = (tag: string) => {
    // 默认壁纸
    if (!tag) {
      return {
        type: 'image',
        brief:
          'https://aihlp.com.cn/admin/wallpaper/508d3994-3727-4839-bfe9-41b97ccf4fba_66a3272c874d41e5b9ec7562fe5822cd (1).jpg?x-oss-process=image/resize,w_400,h_225',
        url: 'https://aihlp.com.cn/admin/wallpaper/508d3994-3727-4839-bfe9-41b97ccf4fba_66a3272c874d41e5b9ec7562fe5822cd (1).jpg'
      }
    }
  }
  watch(
    tag,
    (val) => {
      localStorage.setItem('backgroundTag', val)
      Object.assign(resource, getResource(val))
    },
    { immediate: true }
  )
  return {
    tag,
    resource
  }
})