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

import { CImgText } from '../../../components/CImgText/index'
import { CCard } from '@/components/CCard'
import { CMyPage } from '@/components/CMyPage'
import { CTitleBanner } from '@/components/CTitleBanner'
import { CMyFieldRec } from '@/components/CMyFieldRec'
import { CMyFieldDb } from '@/components/CMyFieldDb'

import { useGlobalStore } from '@store/globalStore'
import { costanti } from '@costanti'
import { tools } from '@src/store/Modules/tools'

export default defineComponent({
  name: 'Confsite',
  components: { CImgText, CCard, CMyPage, CTitleBanner, CMyFieldRec, CMyFieldDb },
  setup() {

    const mysite = ref(null)
    const tab = ref('server')

    const globalStore = useGlobalStore()

    async function mounted() {
      mysite.value = await globalStore.caricaTabella('sites', process.env.APP_ID!)
    }

    function save(newval: any) {
      console.log('ConfSite save')
      tools.updateFonts(newval)
    }

    function saveCol(mycol: any) {
      if (globalStore.site?.confpages) {
        globalStore.site.confpages.col_toolbar = mycol
      }
    }

    function saveBgCol(mycol: any) {
      if (globalStore.site?.confpages) {
        globalStore.site.confpages.col_bgfooter = mycol
      }
    }
    function saveShowDark(mycol: any) {
      if (globalStore.site?.confpages) {
        globalStore.site.confpages.show_darkopt = mycol
      }
    }
    onMounted(mounted)

    return {
      mysite,
      costanti,
      tab,
      tools,
      save,
      saveCol,
      saveBgCol,
      globalStore,
      saveShowDark,
    }
  }
})
