TopMenu.vue 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <template>
  2. <el-scrollbar>
  3. <div v-for="item in topMenuData" :key="item.key" class="hc-top-menu-bar-item" @click="barMenuClick(item)">
  4. <hc-icon v-if="item?.source" :name="item.source" />
  5. <span class="name">{{ item.name }}</span>
  6. </div>
  7. </el-scrollbar>
  8. </template>
  9. <script setup>
  10. import { onMounted, ref } from 'vue'
  11. import { getArrValue, newWindow } from 'js-fast-way'
  12. import { isPathUrl } from '~uti/tools'
  13. import mainApi from '~api/system/menu-top'
  14. //渲染完成
  15. onMounted(() => {
  16. getTopMenuData()
  17. })
  18. //获取顶部菜单
  19. const topMenuData = ref([])
  20. const getTopMenuData = async () => {
  21. let menuData = []
  22. const { data } = await mainApi.getData()
  23. const res = getArrValue(data)
  24. for (let i = 0; i < res.length; i++) {
  25. if (isPathUrl(res[i].code)) {
  26. menuData.push(res[i])
  27. }
  28. }
  29. topMenuData.value = menuData
  30. }
  31. //菜单被点击
  32. const barMenuClick = (item) => {
  33. if (isPathUrl(item.code)) {
  34. newWindow(item.code)
  35. }
  36. }
  37. </script>