client-trace-v5/src/trace/TraceHeader.vue

<template>
  <nav class="navbar navbar-default">
    <div class="container-fluid">
      <div class="navbar-header">
        <button
          type="button"
          class="navbar-toggle collapsed"
          data-toggle="collapse"
          data-target="#bs-example-navbar-collapse-1"
          aria-expanded="false"
        >
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar" />
          <span class="icon-bar" />
          <span class="icon-bar" />
        </button>
        <a
          class="navbar-brand"
          href="javascript:void(0)"
          style="padding-top: 6px"
        >
          <span
            class="glyphicon glyphicon-circle-arrow-left m-image"
            style="font-size: 36px; color: black"
            @click="goBack"
          />
        </a>
      </div>

      <div id="bs-example-navbar-collapse-1" class="collapse navbar-collapse">
        <ul class="nav navbar-nav">
          <li :class="{ active: type == 'traceProject' }" @click="openProject">
            <a class="nav-item-a" href="javascript:void(0)">项目</a>
          </li>
          <li :class="{ active: type == 'traceList' }" @click="openSelf">
            <a class="nav-item-a" href="javascript:void(0)">我自己</a>
          </li>
          <li :class="{ active: type == 'traceDynamic' }" @click="openDynamic">
            <a class="nav-item-a" href="javascript:void(0)">动态</a>
          </li>
          <li :class="{ active: type == 'team' }" @click="team">
            <a class="nav-item-a" href="javascript:void(0)">团队</a>
          </li>
          <li @click="goHome">
            <a class="nav-item-a" href="javascript:void(0)">主页</a>
          </li>
          <li v-if="isShow" @click="traceSetting">
            <a class="nav-item-a" href="javascript:void(0)">任务配置</a>
          </li>
        </ul>
      </div>
    </div>
  </nav>
</template>

<script>

import Common from '../common/Common.js';

export default {
  // props: ['type'],
  props: {
    type: {
      type: String,
      default: '',
    },
  },

  data: function () {
    return {
      isShow: 'false',
    };
  },
  mounted: function () {
    this.queryIsAdmin();
  },

  methods: {
    /**
     * 打开项目界面
     */
    openProject() {
      var _self = this;
      this.$router.push('/trace/projectList');
    },

    /**
     * 打开动态界面
     */
    openDynamic() {
      var _self = this;
      // this.$router.push('/trace/traceDynamic');
      this.$router.push({
        path: '/trace/traceDynamic',
        query: {
          currentPage: 1,
          pageSize: 20,
        },
      });
    },

    /**
     * 打开我自己界面
     */
    openSelf() {
      // this.$router.push('/trace/traceList/I_LAUNCH');
      this.$router.push({
        path: '/trace/traceList/I_LAUNCH',
        query: {
          currentPage: 1,
          pageSize: 20,
        },
      });
    },

    /**
     * 打开团队界面
     */
    team() {
      this.$router.push('/trace/teamList');
    },

    goBack() {
      history.back();
    },

    goHome() {
      this.$router.push('/desktop/dashboard');
    },

    traceSetting() {
      this.$router.push('/trace/traceConfig');
    },
    /**
     * 查询配置信息
     * @return {[type]} [description]
     */
    queryIsAdmin: function () {
      var _self = this;
      $.ajax({
        url: Common.getApiURL('TraceResource/queryIsAdmin'),
        type: 'get',
        dataType: 'json',
        beforeSend: function (request) {
          Common.addTokenToRequest(request);
        },
        success: function (data) {
          _self.isShow = data;
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
          Common.processException(XMLHttpRequest, textStatus, errorThrown);
        },
      });
    },
  },
};
</script>
<style scoped>
.nav-item-a {
  padding-top: 15px;
  padding-bottom: 15px;
}
</style>