<script setup>
import {ref, onMounted} from 'vue'
import NavNode from './navNode.vue'
import {useNavStore} from '@/store/nav'
import {useRouter} from 'vue-router'
const navStore = useNavStore()
const router = useRouter()
const footerNav = ref([])

const emit = defineEmits(['downloadClick'])

onMounted(() => {
  footerNav.value = window.nav.footer
})

const navClick = (node) => {
  if (node.downloadType) {
    emit('downloadClick', node.downloadType)
    return
  }
  if (!node.url) return
  navStore.changeNavIndex(node.url)
  router.push(node.url)
}
</script>

<template>
  <ul class="footer-nav flex j-s">
    <NavNode v-for="node in footerNav" :key="node.id" :node="node" @nav-click="navClick" />
  </ul>
</template>

<style scoped>
.footer-nav {
  list-style: none;
  margin: 0;
  padding: 0;
}
</style>
