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

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

import { toolsext } from '@src/store/Modules/toolsext'

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

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

    const mysite = ref(<ISites>{})
    const tab = ref('server')

    const globalStore = useGlobalStore()

    async function mounted() {
      mysite.value = await globalStore.caricaTabella('sites', tools.getEnv('VITE_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
      }
    }
    function updateSite() {
      globalStore.loadSite()
    }

    onMounted(mounted)

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