Vue router in select

const router = new VueRouter({ 
  mode: 'history', 
  routes: [ 
   { path:'/account', component: Profile}, 
   { path:'/account/add_company', component: AddCompany}, 
   { path:'/account/company', component: AllCompanies}, 
  ] 
}) 
 
var AddCompany = { 
  data: function() { 
    return { 
      company_info: { 
      } 
    } 
  }, 
  template:` 
  <div>Привет, тут Регистрация компании </div> 
  ` 
} 
 
var Profile = { 
  data: function() { 
    return { 
      profile: { 
      } 
    } 
  }, 
  template:` 
  <div>Привет, тут профиль человеческий </div> 
  ` 
} 
 
var AllCompanies = { 
  data: function() { 
    return { 
      profile: { 
      } 
    } 
  }, 
  template:` 
  <div>Привет, тут все компании </div> 
  ` 
} 
 
new Vue({ 
  router, 
  el: '#app', 
  data: { 
    current: 'UserInfo', 
    selected: null, 
    personal_name: 'Васька', 
    personal_sername: 'Пупыркин', 
    companies: [ 
      {"name": "Лукойл", "company_law_form": "ИП"}, 
      {"name": "Глаза и язык", "company_law_form": "Банк"}, 
      {"name": "Голова и хвост", "company_law_form": "Ком"}, 
      {"name": "Рога и копыта", "company_law_form": "ИП"}, 
      {"name": "Открытие", "company_law_form": "Банк"} 
    ] 
  }, 
  template:` 
    <select  
      v-model="selected" 
      ref="mySelect" 
      v-model="current" 
      v-on:click="whichIndex" 
      v-on:change="onChange" 
    >               
      <option value="UserInfo"> 
        {{this.personal_name}} 
        {{this.personal_sername}} 
      </option> 
      <option value="CompanyAdd"> 
        Добавить новую организацию 
      </option> 
      <option v-for="(company, index) in companies" :key="index" value="CompanyInfo"> 
        <div class="company_law_form">{{ company.company_law_form }} </div> 
        <div class="company_name">{{ company.name }}</div> 
      </option> 
    </select> 
    <router-view></router-view>` 
  , 
  methods: { 
    onChange: function(){ 
      if (this.current == 'UserInfo') { 
        console.log('this.current: ', this.current) 
        this.$router.push(`/account`) 
      } 
      if (this.current == 'CompanyAdd') { 
        console.log('this.current: ', this.current) 
        this.$router.push(`/account/add_company`) 
      } 
      if (this.current == 'CompanyInfo') { 
        console.log('this.current: ', this.current) 
        this.$router.push(`/account/company`) 
      } 
    }, 
    beforeMount: function(){ 
        this.onChange() 
    }, 
    whichIndex: function () { 
      var sel = this.$refs.mySelect.selectedIndex 
      var options = this.$refs.mySelect.options 
      var company_index = options[sel].index 
      if (company_index > 1) { 
        var correct_index = company_index - 2 
        this.choosencompany = this.companies[correct_index] 
        // var info_about_company = this.companies[correct_index] 
        // window.vue.EventBus.$emit('company_index' , info_about_company) 
      } 
    } 
  }, 
  // watch: { 
  //   selected: function(selected, old) { 
  //     this.$router.push(`/ramis/project/lab/vue%20js/examples/vue-router/vue-router.html/${this.selected}`) 
  //   } 
  // } 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> 
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script> 
<div id="app"></div>