<template>
  <component :is="type" v-bind="linkProps()" @click="handleClick">
    <slot />
  </component>
</template>

<script setup>
import { isExternal } from '@/utils/validate'
import useTagsViewStore from '@/store/modules/tagsView'
import { useRouter } from 'vue-router'
import useUserStore from '@/store/modules/user'
import { getCurrentInstance } from 'vue'
const userStore = useUserStore()
const tagsViewStore = useTagsViewStore()
const router = useRouter()
const { proxy } = getCurrentInstance()
const props = defineProps({
  to: {
    type: [String, Object],
    required: true
  },
  route: {
    type: Object,
    required: true
  }
})

const isExt = computed(() => {
  return isExternal(props.to)
})

const type = computed(() => {
  if (isExt.value) {
    return 'a'
  }
  // return 'router-link'
  return 'div'
})

function linkProps() {
  if (isExt.value) {
    return {
      href: props.to,
      target: '_blank',
      rel: 'noopener'
    }
  }
  return {
    to: props.to
  }
}

function handleClick() {
  // 过期禁止点击
  if (userStore.authenticationStatus == 5) {
    return proxy.$modal.msgError('您的会员已过期！')
  }
  tagsViewStore.delCachedView(props.route)
    .then(() => {
      router.push(props.to)
    })
}

</script>