import { defineComponent, ref, computed, PropType, toRef, onMounted } from 'vue'
import { useUserStore } from '@store/UserStore'
import { useRouter } from 'vue-router'
import { useGlobalStore } from '@store/globalStore'
import { useI18n } from 'vue-i18n'

import { CMyImgUser } from '@src/components/CMyImgUser'
import { CSingleMovement } from '@src/components/CSingleMovement'
import { CCurrencyValue } from '@src/components/CCurrencyValue'
import { tools } from '@tools'
import type { IMovQuery, IMovVisu} from '@src/model';
import { IMovement } from '@src/model'

import { shared_consts } from '@src/common/shared_vuejs'

export default defineComponent({
  name: 'CMovements',
  components: { CMyImgUser, CCurrencyValue, CSingleMovement },
  props: {
    numcol: {
      type: Number,
      required: false,
      default: 3
    },
    username: {
      type: String,
      required: false,
      default: ''
    },
    showbuttolastmov: {
      type: Boolean,
      required: false,
      default: false
    },
  },
  emits: ['loaded'],
  setup(props, { emit }) {

    const userStore = useUserStore()
    const $router = useRouter()
    const globalStore = useGlobalStore()
    const { t } = useI18n();

    const loadingvalues = ref(false)
    const numtransaz = ref(0)
    const prectransaz = ref(0)

    const tab = ref('tutti')
    const nummovTodownload = ref(5)

    const mylist = computed(() => {
      if (globalStore.datastat || userStore.my.profile) {
        let arrtransaz: any = []
        let transaz = -1
        if (props.username) {
          arrtransaz = userStore.my.profile.last_my_transactions
          transaz = arrtransaz.length
        } else {
          if (globalStore.datastat) {
            arrtransaz = globalStore.datastat.last_transactions
            transaz = arrtransaz!.length
          }
        }

        if (transaz >= 0) {
          // eslint-disable-next-line vue/no-side-effects-in-computed-properties
          numtransaz.value = transaz
        }

        if (prectransaz.value !== numtransaz.value) {
          emit('loaded', { numtransaz: numtransaz.value })
          // eslint-disable-next-line vue/no-side-effects-in-computed-properties
          prectransaz.value = numtransaz.value
        }

        return arrtransaz
      } else
        return []
    })

    const getInviati = computed(() => {
      if (props.username && mylist.value) {
        const list = mylist.value.filter((rec: IMovVisu) => {
          return (props.username && (rec.userfrom && (rec.userfrom.username === props.username)))
        })
        return list
      }
      return []
    })

    const getRicevuti = computed(() => {
      if (props.username && mylist.value) {
        const list = mylist.value.filter((rec: IMovVisu) => {
          return (props.username && (rec.userto && (rec.userto.username === props.username)))
        })
        return list
      }
      return []
    })

    async function mounted() {
      numtransaz.value = 0
      prectransaz.value = 0

      emit('loaded', { numtransaz: 0 })

    }

    function getFromToStr(mov: any) {

      let mystr = ''
      if (mov) {

        mystr += mov.str
      }
      return mystr
    }

    function navigabyMov(mov: IMovQuery, from: boolean) {
      let link = ''
      if (from) {
        if (mov.tipocontofrom === shared_consts.AccountType.USER) {
          link = `/my/` + mov.userfrom.username
        } else if (mov.tipocontofrom === shared_consts.AccountType.CONTO_DI_GRUPPO) {
          link = tools.getPathByGroup(mov.groupfrom)
        } else if (mov.tipocontofrom === shared_consts.AccountType.COMMUNITY_ACCOUNT) {
          link = '' // mov.contocomfrom.name
        }
      } else {
        if (mov.tipocontoto === shared_consts.AccountType.USER) {
          link = `/my/` + mov.userto.username
        } else if (mov.tipocontoto === shared_consts.AccountType.CONTO_DI_GRUPPO) {
          link = tools.getPathByGroup(mov.groupto)
        } else if (mov.tipocontoto === shared_consts.AccountType.COMMUNITY_ACCOUNT) {
          link = ''
        }
      }
      $router.push(link)
    }

    onMounted(() => {
      mounted()
    })

    async function addlastmov() {
      nummovTodownload.value += 5

      loadingvalues.value = true
      await globalStore.loadLastMovements(nummovTodownload.value)
      loadingvalues.value = false
    }

    return {
      userStore,
      getInviati,
      getRicevuti,
      tools,
      mylist,
      getFromToStr,
      t,
      navigabyMov,
      numtransaz,
      tab,
      loadingvalues,
      addlastmov,
    }
  }
})
