Files
FE_CPONE/apps/components/oneNavbarComponent.vue-010320
2026-04-27 10:08:27 +07:00

169 lines
4.1 KiB
Plaintext

<template>
<span>
<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 @click.stop="togleDrawer()"></v-toolbar-side-icon>
<h1>ONE</h1>
<h2 class="bread-crumb">{{bread_crumb}}</h2>
<v-spacer></v-spacer>
<a href="#" style="text-decoration:none;color:#fff;font-size:22px; margin-right:15px">{{ xusername }}</a>
<v-badge color="red">
<!--
<template v-slot:badge>
<span>9</span>
</template>
-->
<v-btn icon @click.stop="drawer_notification = !drawer_notification" flat>
<v-icon
medium
>
notifications
</v-icon>
</v-btn>
</v-badge>
<!-- <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="ml-4" 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>
</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>