Initial import

apps/components/oneNavbarComponent.vue070524

@@ -0,0 +1,182 @@
+<template>
+<div>
+  <one-menu-drawer :drawer="drawer" > </one-menu-drawer>	
+  <one-menu-notification :drawer="drawer_notification" > </one-menu-notification>	
+  <v-toolbar color="blue lighten-2" dark fixed app>
+    <v-toolbar-side-icon class="hidden-sm-and-down" @click.stop="togleDrawer()"></v-toolbar-side-icon>
+    <v-layout row  >
+        <v-flex class="pt-2" xs8>
+           <p class="mb-0"><a href="#" style="padding-bottom:0px;margin-bottom:0px;text-decoration:none;color:#fff;font-size:18px; font-weight:bold;">CPONE</a> </p>
+           <p class="mb-0"><span style="text-decoration:none;color:#fff;font-size:12px;" class="ml-0 mt-0 bread-crumb">{{bread_crumb}}</span></p>
+
+        </v-flex>
+        <v-flex xs4 class="mt-2 text-xs-right align-right">
+
+           
+     
+    
+    <a href="#" class="mt-3" style="min-height:10px;text-decoration:none;color:#fff;font-size:22px; margin-right:15px">{{ xusername }}</a>
+    <v-badge color="red">
+  
+  <v-btn class="pt-0 pb-2" icon @click.stop="drawer_notification = !drawer_notification" flat>
+    <v-icon
+      medium
+    >
+      notifications
+    </v-icon>
+  </v-btn>
+</v-badge>
+        </v-flex>
+    </v-layout>
+    
+
+    
+   
+   
+
+
+     <!-- <v-btn class="ml-4" icon>
+      <v-icon>apps</v-icon>
+    </v-btn> -->
+
+    <!-- PROFILE MENU -->
+    <v-menu
+      :close-on-content-click="true"
+      :nudge-width="200"
+      offset-overflow
+      left
+      bottom
+    >
+      <template v-slot:activator="{ on }">
+        <v-btn
+          class="" icon
+          v-on="on"
+        >
+          <v-icon>apps</v-icon>
+        </v-btn>
+      </template>
+
+      <v-card>
+        <v-list>
+          <v-list-tile avatar>
+
+            <v-list-tile-content>
+              <v-list-tile-title>{{ xusername }}</v-list-tile-title>
+              <v-list-tile-sub-title>{{xstaffname}}</v-list-tile-sub-title>
+            </v-list-tile-content>
+            
+          </v-list-tile>
+        </v-list>
+
+        <v-divider></v-divider>
+
+        <v-list>
+          <v-list-tile @click="change_password" >
+             <v-list-tile-action>
+                 <v-icon>security</v-icon>
+             </v-list-tile-action>
+             <v-list-tile-title>Change Password</v-list-tile-title>
+          </v-list-tile>
+
+        </v-list>
+        <v-list>
+          <v-list-tile @click="logout" >
+             <v-list-tile-action>
+                 <v-icon>no_meeting_room</v-icon>
+             </v-list-tile-action>
+             <v-list-tile-title>Log Out</v-list-tile-title>
+          </v-list-tile>
+
+        </v-list>
+
+        
+      </v-card>
+    </v-menu>
+    <!-- End of PROFILE MENU -->
+
+   <one-cp></one-cp> 
+  </v-toolbar>
+  </div>
+
+</template>
+<style scoped>
+.bread-crumb {
+   margin-left:20px;
+   font-weight:normal!important;
+}
+.v-badge__badge{
+  top:0px;
+  right:0px;
+}
+</style>
+<script>
+module.exports = {
+  components: {
+    'one-menu-drawer' : httpVueLoader('./oneMenuDrawer.vue'),
+    'one-cp' : httpVueLoader('./oneChangePassword.vue'),
+    'one-menu-notification' : httpVueLoader('./oneNotificationDrawer.vue')
+  },
+  
+  data: function() {
+    return {
+    drawer: false,
+    drawer_notification: false	
+    }
+  },
+  watch : {
+     is_page_allowed : function(new_ipa, old_ipa) {
+        if(! new_ipa ) {
+           var dashboard = this.$store.state.system.dashboard
+           if (dashboard == "") {
+              //this.logout()
+              console.log('go-to','logout')
+           } else {
+              //window.location.href = '/' + dashboard
+              console.log('go-to dashboard',dashboard)
+           }
+        }
+     }
+  },
+  computed: {
+     is_page_allowed() {
+        return this.$store.state.system.is_page_allowed
+     },
+     bread_crumb() {
+        return this.$store.state.system.bread_crumb
+     },
+     xusername() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_UserUsername
+          }
+          return un
+      },
+     xstaffname() {
+          var un = ''
+          if(localStorage.getItem("user")){
+            var retrievedObject = localStorage.getItem('user')
+            var dtuser = JSON.parse(retrievedObject)
+            
+            un = dtuser.M_StaffName
+          }
+          return un
+      }
+  },
+
+  methods : {
+    togleDrawer() {
+      this.drawer = ! this.drawer 
+    },
+    change_password() {
+       this.$store.commit("system/update_change_password_dialog",true)
+    },
+    logout () {
+      window.one_logout('/one-ui/test/vuex/one-login')
+    }
+  }
+}
+</script>
+