<template>
  <div class="nav">
    <div class="nav-list content flex">
      <div class="nav-sty" :to="item.to" tag="div" :class="index==nav?'active':''" v-for="(item,index) in linklist" :key="index"
        @click="change(index,item.to)">{{item.name}}</div>
    </div>
  </div>
</template>

<script>
import inDex from '@/pages/index.vue'
  export default {
    data() {
      return {
        ccc:'',
        nav:"0",
        linklist: [{
            to: "/",
            name: "首页"
          },
          {
            to: "/notice/inquiry",
            name: "询价公告"
          }, {
            to: "/notice/bid",
            name: "招标公告"
          }, {
            to: "/notice/biding",
            name: "中标公告"
          }, {
            to: "/notice/all",
            name: "招投标"
          }, {
            to: "/message/news",
            name: "信息公告"
          },
        ]
      }
    },
    created() {
      
    },
    watch: {
      $route() {
        this.getindex();
      }
    },
     mounted(){
      /* inDex.$on("send",(message)=>{
        this.nav = message
      }) */
      if(window.location.href==="/notice/all"){
        console.log(window.location.href+'+++++++++++++-----------------')
        this.nav = window.sessionStorage.getItem("text")
      }
    }, 
    methods: {
      change(index, path) {
        this.$router.push(path);
        this.nav=index;
      },

      getindex() {
        // let path = this.$route.path;
        // if(path=="/"){
        //    this.nav = "0";
        // }else if(path.indexOf("/message")==0){
        //    this.nav = "5";
        // }else if(path.indexOf("/notice")==0){
        //    this.nav = "4";
        // }
        // switch (path) {
        //   case '/':
        //     this.nav = "0";
        //     break;
        //   case '/notice/inquiry':
        //     this.nav = "1";
        //     break;
        //   case "/notice/bid":
        //     this.nav = "2";
        //     break;
        //   case "/notice/biding":
        //     this.nav = "3";
        //     break;
        //   case "/notice/all":
        //     this.nav = "4";
        //     break;
        //   case "/message/news":
        //     this.nav = "5";
        //     break;
        // }
      }

    },
  }
</script>

<style scoped>
.nav-sty{
  cursor: pointer;
}
  .nav {
    width: 100%;
    border-bottom: .05rem solid #D6D6D6;
  }

  .nav-list>div {
    font-size: .16rem;
    color: rgba(0, 0, 0, 1);
    padding: 0.2rem 0.5rem;
    margin-right: .2rem;
  }

  .nav-list>.active {
    color: rgba(255, 255, 255, 1);
    background: #0486FE;
  }
</style>
