Ohm-Management - Projektarbeit B-ME
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

navRoutes.js 4.4KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. Vue.component('nav-router', {
  2. template: `
  3. <div>
  4. <nav class="navbar is-fixed-bottom is-expanded is-primary is-hidden-desktop" role="navigation" aria-label="main navigation">
  5. <div class="navbar-brand is-expanded is-light">
  6. <router-link to="/home" class="navbar-item is-primary is-expanded has-text-centered is-hidden-desktop">
  7. <i class="material-icons">home</i>
  8. </router-link>
  9. <router-link to="/files" class="navbar-item is-primary is-expanded">
  10. <i class="material-icons">search</i>
  11. </router-link>
  12. <router-link to="/createMessage" class="navbar-item is-primary is-expanded is-hidden-desktop">
  13. <i class="material-icons">add_circle</i>
  14. </router-link>
  15. <router-link to="/bookmark" class="navbar-item is-primary is-expanded is-hidden-desktop">
  16. <i class="material-icons">bookmark</i>
  17. </router-link>
  18. <router-link to="/profil" class="navbar-item is-primary is-expanded is-hidden-desktop">
  19. <i class="material-icons">person</i>
  20. </router-link>
  21. </div>
  22. </nav>
  23. <div class="is-fullheight">
  24. <div class="column is-sidebar-menu is-hidden-touch">
  25. <aside class="menu is-medium">
  26. <ul class="menu-list">
  27. <li><router-link to="/home" class="is-hidden-touch">
  28. <i class="material-icons">home</i> Home
  29. </router-link></li>
  30. <li><router-link to="/files" class="is-hidden-touch">
  31. <i class="material-icons">language</i> Language
  32. </router-link></li>
  33. <li><router-link to="/createMessage" class="is-hidden-touch">
  34. <i class="material-icons">add_circle</i> Create Message
  35. </router-link></li>
  36. <li><router-link to="/bookmark" class="is-hidden-touch">
  37. <i class="material-icons">bookmark</i> Bookmark
  38. </router-link></li>
  39. <li><router-link to="/profil" class="is-hidden-touch">
  40. <i class="material-icons">person</i> Profil
  41. </router-link></li>
  42. </ul>
  43. </aside>
  44. </div>
  45. </div>
  46. </div>`,
  47. });
  48. const routes = [
  49. { path: "/", component: HomeRouter },
  50. { path: "/home", component: HomeRouter },
  51. { path: "/files", component: FileRouter },
  52. { path: "/createMessage", component: CreateMsgRouter },
  53. { path: "/bookmark", component: BookmarkRouter },
  54. { path: "/profil", component: ProfilRouter },
  55. ];
  56. const router = new VueRouter({
  57. routes,
  58. linkActiveClass: 'is-active'
  59. });
  60. /*
  61. <div class="nav-right nav-menu is-hidden-desktop-only">
  62. <router-link to="/home" class="nav-item is-primary is-expanded has-text-centered is-hidden-desktop-only">
  63. <i class="material-icons">home</i> Home
  64. </router-link>
  65. <router-link to="/files" class="nav-item is-primary is-expanded has-text-centered is-hidden-desktop-only">
  66. <i class="material-icons">language</i> Language
  67. </router-link>
  68. <router-link to="/createMessage" class="navbar-item is-primary is-expanded has-text-centered is-hidden-desktop-only">
  69. <i class="material-icons">add_circle</i> Create Message
  70. </router-link>
  71. <router-link to="/bookmark" class="navbar-item is-primary is-expanded has-text-centered is-hidden-desktop-only">
  72. <i class="material-icons">bookmark</i> Bookmark
  73. </router-link>
  74. <router-link to="/profil" class="navbar-item is-primary is-expanded has-text-centered is-hidden-desktop-only">
  75. <i class="material-icons">person</i> Profil
  76. </router-link>
  77. </div>
  78. */