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

import type { INotif } from '@model';
import {
  IChat,
  IMessage, IMsgUsers
} from '@model'

import { date } from 'quasar'

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

import { useRouter } from 'vue-router'
import MixinUsers from '../../../mixins/mixin-users'
import { useNotifStore } from '@store/NotifStore'
import { useGlobalStore } from '@store/globalStore'
import { useUserStore } from '@store/UserStore'

import { CTitleBanner } from '@src/components/CTitleBanner'
import { CTimeAgo } from '@src/components/CTimeAgo'
import { CMyFieldRec } from '@src/components/CMyFieldRec'
import { CMyFieldDb } from '@src/components/CMyFieldDb'
import { shared_consts } from '@src/common/shared_vuejs'
import { useI18n } from 'vue-i18n'
import { useQuasar } from 'quasar'
import { costanti } from '@costanti'
import { waitAndcheckPendingNotif } from '../../../store/Modules/ApiTables'

export default defineComponent({
  name: 'notifPopover',
  components: { CTitleBanner, CMyFieldRec, CMyFieldDb, CTimeAgo },
  emits: ['update:modelValue'],
  props: {
    modelValue: {
      required: true,
      type: [String, Number, Boolean],
    }
  },

  setup(props, { emit }) {
    const $router = useRouter()
    const userStore = useUserStore()
    const notifStore = useNotifStore()
    const globalStore = useGlobalStore()

    const { t } = useI18n()
    const q = useQuasar()

    const loading = ref(false)

    const myuser = ref({})

    const show_all = ref(true)
    const username = computed(() => userStore.my.username)

    const lasts_notifs = computed(() => notifStore.getlasts_notifs().filter((rec) => show_all.value ? true : !rec.read))
    const num_notifs_unread = computed(() => notifStore.getnumNotifUnread())
    // const usernotifs = computed(() => userStore.my.profile.notifs)

    const polling = ref(<any>null)
    const eseguipolling = ref(true)

    const notifsel = ref(<INotif>{
      dest: '',
      datenotif: new Date()
    })

    const open = computed({
      get() {
        return props.modelValue
      },

      set(value) {
        return emit('update:modelValue', value)
      }
    })

    const { getNumNotifUnread, Username, getNumNotif, getUsernameChatByNotif, getImgByNotif, getNotifText, getTypeDirNotif, getTypeIdNotif } = MixinUsers()

    watch(() => open.value, (newval: any, oldval: any) => {
      if (getNumNotifUnread()) {
        if (open.value)
          notifStore.setAllRead(Username(), shared_consts.QualiNotifs.OTHERS)
      }
    })

    // function lasts_notifs (state: IUserState) => IMessage[] {
    //
    // }

    function checkIfArrivedSomeNotif() {
      waitAndcheckPendingNotif()

      return true
    }

    function checkifpolling() {
      // console.log('checkifpolling')
      if (eseguipolling.value) {
        if (!polling.value) {
          // console.log('esegui POLLING 2....')
          polling.value = setInterval(() => {
            checkIfArrivedSomeNotif()
          }, 2000)
        }
      }
    }

    function beforeDestroy() {
      if (polling.value)
        clearInterval(polling.value)
    }

    /*
    watch(() => usernotifs.value, async (to: any, from: any) => {

      if (usernotifs.value) {
        console.log('usernotifs.value', usernotifs.value, to)
        const ret = await userStore.setUserNotifs(usernotifs.value)
      }
    })

     */

    watch(() => userStore.my.username, async (to: any, from: any) => {
      if (userStore.my.username) {
        await refreshdata(userStore.my.username)
      }
    })

    watch(() => notifStore.updateNotification, async (to: any, from: any) => {
      if (notifStore.updateNotification) {
        await refreshdata(userStore.my.username)
      }
    })

    function clickNotif(notif: INotif) {
      if (notif.openUrl) {
        const mylink = tools.updateQueryStringParameter(notif.openUrl, 'idnotif', notif._id)
        console.log('mylink', mylink, notif._id)
        if (mylink) {
          $router.replace(mylink)
        }
      }
    }

    function getlastnotif(myusername: string): any {
      // Get msg for this chat
      if (notifStore.last_notifs)
        return notifStore.last_notifs.find((rec: INotif) => rec.dest === myusername)
      // return users_msg_saved[username]
    }

    function getlastdataread(myusername: string): any {
      // Get msg for this

      const myrec = getlastnotif(myusername)
      const lastdata: any = (myrec && myrec.lastdataread) ? myrec.lastdataread : tools.getLastDateReadReset()

      let mydate = ''
      if (!tools.isIsoDate(lastdata))
        mydate = lastdata.toISOString()
      else
        return lastdata

      // console.log('getlastdataread', mydate)
      return mydate
    }


    async function refreshdata(myusername: string) {
      try {
        if (globalStore.finishLoading && userStore.my.username && tools.isLogged()) {

          if (myusername) {
            notifsel.value.dest = ''
            // console.log('refreshdata')
            loading.value = true

            return notifStore.updateNotifDataFromServer({
              username: myusername,
              lastdataread: getlastdataread(myusername),
            }).then((ris) => {

              notifStore.updateNotification = false
              notifsel.value.dest = myusername
              loading.value = false

              const element = document.getElementById('last')
              tools.scrollToElement(element)

              // changemsgs('', '')

            }).catch((err) => {
              console.error('   refreshdata', err)
              loading.value = false
            })
          }
        }
      } catch (e) {
        console.error('   refreshdata', e)
        loading.value = false
      }
    }

    async function mounted() {
      myuser.value = userStore.my
      await refreshdata(userStore.my.username)
      checkifpolling()
    }

    onMounted(mounted)

    return {
      lasts_notifs,
      num_notifs_unread,
      clickNotif,
      getNumNotifUnread,
      getNumNotif,
      getUsernameChatByNotif,
      getImgByNotif,
      getNotifText,
      getTypeDirNotif,
      getTypeIdNotif,
      tools,
      shared_consts,
      myuser,
      costanti,
      open,
      notifStore,
      show_all,
      t,
      username,
      userStore,
      q,
    }
  },
})
