132 lines
3.1 KiB
Vue
132 lines
3.1 KiB
Vue
<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="drawer = !drawer"></v-toolbar-side-icon>
|
|
<h1>ONE</h1>
|
|
<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="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
|
|
v-model="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-avatar>
|
|
<img src="https://cdn.vuetifyjs.com/images/john.jpg" alt="John">
|
|
</v-list-tile-avatar>
|
|
|
|
<v-list-tile-content>
|
|
<v-list-tile-title>{{ xusername }}</v-list-tile-title>
|
|
<v-list-tile-sub-title>Founder of Vuetify.js</v-list-tile-sub-title>
|
|
</v-list-tile-content>
|
|
|
|
|
|
</v-list-tile>
|
|
</v-list>
|
|
|
|
<v-divider></v-divider>
|
|
|
|
<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-tile>
|
|
<v-list-tile-action>
|
|
<v-switch v-model="hints" color="purple"></v-switch>
|
|
</v-list-tile-action>
|
|
<v-list-tile-title>Enable hints</v-list-tile-title>
|
|
</v-list-tile> -->
|
|
</v-list>
|
|
|
|
|
|
</v-card>
|
|
</v-menu>
|
|
<!-- End of PROFILE MENU -->
|
|
|
|
</v-toolbar>
|
|
</template>
|
|
<style scoped>
|
|
.v-badge__badge{
|
|
top:0px;
|
|
right:0px;
|
|
}
|
|
</style>
|
|
<script>
|
|
module.exports = {
|
|
components: {
|
|
'one-menu-drawer' : httpVueLoader('./oneMenuDrawer.vue'),
|
|
'one-menu-notification' : httpVueLoader('./oneNotificationDrawer.vue')
|
|
},
|
|
data: function() {
|
|
return {
|
|
drawer: false,
|
|
drawer_notification: false
|
|
}
|
|
},
|
|
computed: {
|
|
xusername() {
|
|
var un = ''
|
|
if(localStorage.getItem("user")){
|
|
var retrievedObject = localStorage.getItem('user')
|
|
var dtuser = JSON.parse(retrievedObject)
|
|
|
|
un = dtuser.M_UserUsername
|
|
}
|
|
return un
|
|
}
|
|
},
|
|
|
|
methods : {
|
|
logout () {
|
|
window.one_logout('/one-ui/test/vuex/one-login')
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|