scocial-management-platform-frontend/src/views/modules/demo/basicComponent/com-third-menu.vue

<template>
  <el-submenu v-if="menuItem.children && menuItem.children.length >= 1" :index="menuItem.id+'sub'" :popper-append-to-body="false">
    <template slot="title">
      <template v-if="menuItem.lv===1" class="cs">
        <div class="csm-item">
          <i class="csm-icon" :class="menuItem.icon"></i>
          <div class="csm-name" :title="menuItem.name">{{menuItem.name}}</div>
          <i class="el-icon-arrow-right"></i>
        </div>
      </template>
      <template v-if="menuItem.lv>=2">
        <em class="csm-point">&middot;</em>
        <span class="csm-sec-name" :title=" menuItem.name">
          {{ menuItem.name }}
        </span>
      </template>
    </template>
    <com-thirdmenu v-for="item in menuItem.children" :key="item.id+'sub'" :menuItem="item"></com-thirdmenu>
  </el-submenu>
  <el-menu-item v-else :index="menuItem.id+'sub'">
    <template v-if="menuItem.lv===1">
      <div class="csm-item">
        <a class="menuItemA" :href="getHref(menuItem)" :target="getTarget(menuItem)">
          <i class="csm-icon" :class="menuItem.icon"></i>
          <div class="csm-name" :title="menuItem.name">{{menuItem.name}}</div>
        </a>
      </div>
    </template>
    <template v-if="menuItem.lv>=2">
      <a class="menuItemA" :href="getHref(menuItem)" :target="getTarget(menuItem)">
      <em class="csm-point">&middot;</em>
      <span class="csm-sec-name" :title=" menuItem.name">
        {{ menuItem.name }}
      </span>
      </a>
    </template>
  </el-menu-item>
</template>

<script>
import comThirdmenu from './com-third-menu'
export default {
  name: 'com-thirdmenu',
  data () {
    return {

    }
  },
  props: {
    menuItem: {
      type: Object,
      required: true
    }
  },
  components: {
    comThirdmenu
  },
  mounted () {
    // console.log(this.menuItem)
  },
  methods: {
    getHref (item) {
      // console.log(item.url, window.location)
      let host = window.location.host
      let href = window.location.href
      if (!item.url) {
        return 'javascript:void(0);'
      } else if (item.url.indexOf('http') > -1) {
        return item.url
      } else if (href.indexOf(host + '/#') > -1) {
        return '/#' + item.url
      }
    },
    getTarget (item) {
      if (!item.url) {
        return '_self'
      } else {
        return '_blank'
      }
    },
    gotoRouteHandle (item) {
      console.log(item)
      if (item.url) {
        // this.$router.push({ path: item.url })
        // window.open("http://www.jb51.net")
      }
    }
  }
}
</script>