Merge pull request #204 from gradido/179-menu

refactor: Remove Right Menu

frontend/src/components/SidebarPlugin/SideBar.vue

@@ -14,43 +14,13 @@
       </b-row>
       <slot name="mobile-right">
         <ul class="nav align-items-center d-md-none">
-          <base-dropdown class="nav-item" menu-on-right tag="li" title-tag="a">
+          <a slot="title-container" class="nav-link" role="button">
-            <a slot="title-container" class="nav-link" role="button">
+            <div class="media align-items-center">
-              <div class="media align-items-center">
+              <span class="avatar avatar-sm">
-                <span class="avatar avatar-sm">
+                <vue-qrcode :value="$store.state.email" type="image/png"></vue-qrcode>
-                  <vue-qrcode :value="$store.state.email" type="image/png"></vue-qrcode>
+              </span>
-                </span>
-              </div>
-            </a>
-            xx
-            <router-link to="/overview" class="dropdown-item text-lg text-muted">
-              <i class="ni ni-single-02"></i>
-              <span>{{ $t('site.overview.account_overview') }}</span>
-            </router-link>
-            <router-link to="/profile" class="dropdown-item text-lg text-muted">
-              <i class="ni ni-single-02"></i>
-              <span>{{ $t('site.navbar.my-profil') }}</span>
-            </router-link>
-            <router-link to="/profileedit" class="dropdown-item text-lg text-muted">
-              <i class="ni ni-settings-gear-65"></i>
-              <span>{{ $t('site.navbar.settings') }}</span>
-            </router-link>
-            <router-link to="/transactions" class="dropdown-item text-lg text-muted">
-              <i class="ni ni-calendar-grid-58"></i>
-              <span>Transactions</span>
-            </router-link>
-            <!--
-                 <router-link to="/activity" class="dropdown-item  text-lg text-muted">
-                 <i class="ni ni-calendar-grid-58"></i>
-                 <span>{{ $t('site.navbar.activity') }}</span>
-                 </router-link>
-            -->
-            <div class="dropdown-divider"></div>
-            <div @click="logout" class="dropdown-item text-lg text-muted">
-              <i class="ni ni-support-16"></i>
-              {{ $t('logout') }}
             </div>
-          </base-dropdown>
+          </a>
         </ul>
       </slot>
       <slot></slot>
@@ -136,10 +106,5 @@ export default {
       this.$router.push('/login')
     },
   },
-  beforeDestroy() {
-    if (this.$sidebar.showSidebar) {
-      this.$sidebar.showSidebar = false
-    }
-  },
 }
 </script>

frontend/src/views/Layout/DashboardNavbar.vue

@@ -4,83 +4,33 @@
     class="navbar-top navbar-expand"
     :class="{ 'navbar-dark': type === 'default' }"
   >
-    <a
-      href="#"
-      aria-current="page"
-      class="h4 mb-0 text-uppercase d-none d-lg-inline-block active router-link-active"
-    >
-      {{ $route.name }}
-    </a>
     <!-- Navbar links -->
     <b-navbar-nav class="align-items-center ml-md-auto">
       <!-- This item dont have <b-nav-item> because item have data-action/data-target on tag <a>, wich we cant add -->
-      <li class="nav-item d-sm-none">
+      <li class="nav-item d-sm-none"></li>
-        <a class="nav-link" href="#" data-action="search-show" data-target="#navbar-search-main">
-          <i class="ni ni-zoom-split-in"></i>
-        </a>
-      </li>
     </b-navbar-nav>
     <b-navbar-nav class="align-items-center ml-auto ml-md-0">
-      <base-dropdown
+      <a class="pr-1" slot="title-container">
-        menu-on-right
+        <b-media no-body class="align-items-center">
-        class="nav-item"
+          <span class="pb-2 text-lg font-weight-bold">
-        tag="li"
+            {{ $store.state.email }}
-        title-tag="a"
+          </span>
-        title-classes="nav-link pr-0"
+          <b-media-body class="ml-2 d-none d-lg-block">
-      >
+            <span class="avatar">
-        <a href="#" class="pr-1" @click.prevent slot="title-container">
+              <vue-qrcode :value="$store.state.email" type="image/png"></vue-qrcode>
-          <b-media no-body class="align-items-center">
-            <span class="pb-2 text-lg font-weight-bold">
-              {{ $store.state.email }}
             </span>
-            <b-media-body class="ml-2 d-none d-lg-block">
+          </b-media-body>
-              <span class="avatar">
+        </b-media>
-                <vue-qrcode :value="$store.state.email" type="image/png"></vue-qrcode>
+      </a>
-              </span>
-            </b-media-body>
-          </b-media>
-        </a>
-
-        <template>
-          <b-dropdown-header class="noti-title">
-            <h6 class="text-overflow m-0">{{ $t('welcome') }}</h6>
-          </b-dropdown-header>
-          <b-dropdown-item to="/overview">
-            <i class="ni ni-single-02"></i>
-            <span>{{ $t('site.overview.account_overview') }}</span>
-          </b-dropdown-item>
-          <b-dropdown-item to="/profile">
-            <i class="ni ni-single-02"></i>
-            <span>{{ $t('site.navbar.my-profil') }}</span>
-          </b-dropdown-item>
-          <b-dropdown-item to="/profileedit">
-            <i class="ni ni-settings-gear-65"></i>
-            <span>{{ $t('site.navbar.settings') }}</span>
-          </b-dropdown-item>
-          <!--
-          <b-dropdown-item href="#!">
-            <i class="ni ni-calendar-grid-58"></i>
-            <span>{{ $t('site.navbar.activity') }}</span>
-          </b-dropdown-item>
-          -->
-          <div class="dropdown-divider"></div>
-          <b-dropdown-item @click="logout">
-            <i class="ni ni-user-run"></i>
-            <span>{{ $t('logout') }}</span>
-          </b-dropdown-item>
-        </template>
-      </base-dropdown>
     </b-navbar-nav>
   </base-nav>
 </template>
 <script>
-import { CollapseTransition } from 'vue2-transitions'
 import { BaseNav } from '@/components'
 import VueQrcode from 'vue-qrcode'
 
 export default {
   components: {
-    //CollapseTransition,
     BaseNav,
     VueQrcode,
   },