<script setup lang="ts">
import { asyncFilteredRoutes } from '~/router/index'
import { constantRoutes } from '~/router/routes'
import { isExternal } from '~/utils/validate'
const props = defineProps<{ to: string }>()
const router = useRouter()
const linkTo = () => {
  router.push({ name: props.to })
}

const allRoutes = computed(() => {
  const routes = [...constantRoutes, ...asyncFilteredRoutes.value]
  return routes
})
const dsjNameData = ref([])
const path = ref('')
allRoutes.value.map((item) => {
  if (item.name == 'DSJ') {
    dsjNameData.value = item.children?.map((value) => {
      if (props.to == value.name)
        path.value = value.path

      return value.name
    })
  }
})
</script>

<template>
  <a v-if="isExternal(props.to)" :href="props.to" target="_blank">
    <slot />
  </a>
  <a v-else-if="dsjNameData.indexOf(props.to) != -1" :href="`#/dsj/${path}`" target="_blank">
    <slot />
  </a>
  <div v-else @click="linkTo">
    <slot />
  </div>
</template>
