Initial import
This commit is contained in:
sas.fajri
95
one-ui/apps/components/oneChangePassword.vue
Normal file
95
one-ui/apps/components/oneChangePassword.vue
Normal file
@@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<v-dialog v-model="showdialog" persistent max-width="400">
|
||||
<v-card>
|
||||
<v-card-title style="color:#fff" class="headline grey darken-1">Ganti Password</v-card-title>
|
||||
<v-card-text>
|
||||
<v-layout pa-2 class="grey lighten-2" row>
|
||||
<v-flex xs12>
|
||||
<v-text-field :append-icon="show_saat_ini ? 'mdi-eye' : 'mdi-eye-off'"
|
||||
:type="show_saat_ini ? 'text' : 'password'"
|
||||
label="Password saat ini :"
|
||||
v-model="current_password"
|
||||
class="input-group--focused"
|
||||
@click:append="show_saat_ini = !show_saat_ini"
|
||||
></v-text-field>
|
||||
|
||||
<v-text-field :append-icon="show_new ? 'mdi-eye' : 'mdi-eye-off'"
|
||||
:type="show_new ? 'text' : 'password'"
|
||||
label="Password baru :"
|
||||
v-model="new_password"
|
||||
class="input-group--focused"
|
||||
@click:append="show_new= !show_new"
|
||||
></v-text-field>
|
||||
<v-text-field :append-icon="show_re_new ? 'mdi-eye' : 'mdi-eye-off'"
|
||||
:type="show_re_new ? 'text' : 'password'"
|
||||
label="Konfirmasi Password baru :"
|
||||
v-model="re_new_password"
|
||||
class="input-group--focused"
|
||||
@click:append="show_re_new= !show_re_new"
|
||||
></v-text-field>
|
||||
<v-alert v-show="message != ''" :type="type">
|
||||
{{message}}
|
||||
</v-alert>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn color="grey darken-1" flat @click="showdialog = false">Tutup</v-btn>
|
||||
<v-btn dark color="grey darken-1" @click="update_password()">Ganti Password</v-btn>
|
||||
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</template>
|
||||
<style scoped>
|
||||
</style>
|
||||
<script>
|
||||
|
||||
module.exports = {
|
||||
data() {
|
||||
return {
|
||||
current_password : ''
|
||||
,new_password : ''
|
||||
,re_new_password : ''
|
||||
,show_saat_ini : false
|
||||
,show_new: false
|
||||
,show_re_new: false
|
||||
,type : 'error'
|
||||
}
|
||||
}
|
||||
,methods : {
|
||||
async update_password() {
|
||||
if (this.current_password == this.new_password) {
|
||||
this.message = "Password lama dan Password baru masih sama."
|
||||
return
|
||||
}
|
||||
if (this.re_new_password != this.new_password) {
|
||||
this.message = "Password dan Konfirmasi Password tidak sama."
|
||||
return
|
||||
}
|
||||
let prm = { token: window.one_token(), old : this.current_password ,new : this.new_password }
|
||||
await this.$store.dispatch("system/change_password",prm)
|
||||
if (this.message == "" ) {
|
||||
this.type = "success"
|
||||
this.message = "Password berhasil diubah, silahkan login lagi."
|
||||
let self = this
|
||||
setTimeout(function() {
|
||||
window.one_logout('/one-ui/test/vuex/one-login')
|
||||
},1000)
|
||||
}
|
||||
}
|
||||
}
|
||||
,computed: {
|
||||
message : {
|
||||
get(){ return this.$store.state.system.change_password_error }
|
||||
,set(v) { this.$store.commit("system/update_change_password_error",v) }
|
||||
}
|
||||
,showdialog : {
|
||||
get(){ return this.$store.state.system.change_password_dialog }
|
||||
,set(v) { this.$store.commit("system/update_change_password_dialog",v) }
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
20
one-ui/apps/components/oneFooter.vue
Normal file
20
one-ui/apps/components/oneFooter.vue
Normal file
@@ -0,0 +1,20 @@
|
||||
<template>
|
||||
<v-footer color="blue lighten-2" app>
|
||||
<one-clock></one-clock>
|
||||
<v-spacer></v-spacer>
|
||||
<span class="one-footer white--text">© 2019</span>
|
||||
</v-footer>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
span.one-footer {
|
||||
margin-right:30px;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
module.exports = {
|
||||
components: {
|
||||
'one-clock' : httpVueLoader('./oneTanggal.vue')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
35
one-ui/apps/components/oneFooterlogin.vue
Normal file
35
one-ui/apps/components/oneFooterlogin.vue
Normal file
@@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<v-footer color="blue lighten-2" app>
|
||||
|
||||
<span class="one-footer white--text" >
|
||||
SURABAYA -
|
||||
JAKARTA -
|
||||
BANDUNG -
|
||||
CIMAHI -
|
||||
CIREBON -
|
||||
MEDAN -
|
||||
PADANG -
|
||||
PALEMBANG -
|
||||
SEMARANG -
|
||||
YOGYAKARTA -
|
||||
MADIUN -
|
||||
BALIKPAPAN -
|
||||
PEKANBARU -
|
||||
MAGELANG -
|
||||
MAKASSAR -
|
||||
TEGAL -
|
||||
SALATIGA -
|
||||
MANADO</span>
|
||||
</v-footer>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
span.one-footer {
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
module.exports = {
|
||||
}
|
||||
</script>
|
||||
212
one-ui/apps/components/oneMenuDrawer-bkp.vue
Normal file
212
one-ui/apps/components/oneMenuDrawer-bkp.vue
Normal file
@@ -0,0 +1,212 @@
|
||||
<template>
|
||||
<v-navigation-drawer v-model="drawer" fixed app>
|
||||
<v-list>
|
||||
<!-- IF NO CHILD -->
|
||||
<template
|
||||
v-for="(lev_0, i) in level_0"
|
||||
>
|
||||
<v-list-tile
|
||||
:key="i"
|
||||
v-show="!level_1['p_'+lev_0.id] && lev_0.is_parent=='N'"
|
||||
@click="goTo(lev_0.url)">
|
||||
<v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<!-- HAVING CHILDREN -->
|
||||
<template
|
||||
v-for="(lev_0, i) in level_0"
|
||||
>
|
||||
<v-list-group
|
||||
v-bind:key="i"
|
||||
prepend-icon="account_circle"
|
||||
:value="lev_0.state"
|
||||
v-show="level_1['p_'+lev_0.id]"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile>
|
||||
<v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<!-- LEVEL 1 STARTS HERE -->
|
||||
<!-- NOT HAVING CHILD -->
|
||||
<template
|
||||
v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
|
||||
>
|
||||
<v-list-tile
|
||||
v-bind:key="j"
|
||||
v-show="!level_2['p_'+lev_1.id] && lev_1.is_parent=='N'"
|
||||
sub-group
|
||||
no-action
|
||||
@click="goTo(lev_1.url)"
|
||||
>
|
||||
<v-list-tile-action>
|
||||
<!-- <v-icon>home</v-icon> -->
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<!-- HAVING CHILD -->
|
||||
<template
|
||||
v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
|
||||
>
|
||||
|
||||
<v-list-group
|
||||
v-bind:key="j"
|
||||
:value="lev_1.state"
|
||||
v-show="level_2['p_'+lev_1.id]"
|
||||
sub-group
|
||||
no-action
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile>
|
||||
<v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<!-- LEVEL 2 STARTS HERE -->
|
||||
<template
|
||||
v-for="(lev_2, k) in level_2['p_'+lev_1.id]"
|
||||
>
|
||||
<v-list-tile
|
||||
:key="k"
|
||||
@click="goTo(lev_2.url)">
|
||||
<!-- <v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action> -->
|
||||
<v-list-tile-title>{{ lev_2.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
</template>
|
||||
<!-- END OF LEVEL 2 -->
|
||||
|
||||
</v-list-group>
|
||||
</template>
|
||||
<!-- END OF LEVEL 1 -->
|
||||
|
||||
</v-list-group>
|
||||
</template>
|
||||
</v-list>
|
||||
|
||||
<!-- <v-list>
|
||||
<v-list-tile>
|
||||
<v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-title>Home</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
<v-list-group
|
||||
prepend-icon="account_circle"
|
||||
value="true"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile>
|
||||
<v-list-tile-title>Users</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
<v-list-group
|
||||
no-action
|
||||
sub-group
|
||||
value="true"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile>
|
||||
<v-list-tile-title>Admin</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<v-list-tile
|
||||
v-for="(admin, i) in admins"
|
||||
:key="i"
|
||||
@click=""
|
||||
>
|
||||
<v-list-tile-title v-text="admin[0]"></v-list-tile-title>
|
||||
<v-list-tile-action>
|
||||
<v-icon v-text="admin[1]"></v-icon>
|
||||
</v-list-tile-action>
|
||||
</v-list-tile>
|
||||
</v-list-group>
|
||||
|
||||
<v-list-group
|
||||
sub-group
|
||||
no-action
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile>
|
||||
<v-list-tile-title>Actions</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
<v-list-tile
|
||||
v-for="(crud, i) in cruds"
|
||||
:key="i"
|
||||
@click=""
|
||||
>
|
||||
<v-list-tile-title v-text="crud[0]"></v-list-tile-title>
|
||||
<v-list-tile-action>
|
||||
<v-icon v-text="crud[1]"></v-icon>
|
||||
</v-list-tile-action>
|
||||
</v-list-tile>
|
||||
</v-list-group>
|
||||
</v-list-group>
|
||||
</v-list> -->
|
||||
<!-- <v-list dense>
|
||||
<v-list-tile>
|
||||
<v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>Home</v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</v-list-tile>
|
||||
<v-list-tile>
|
||||
<v-list-tile-action>
|
||||
<v-icon>contact_mail</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>Contact</v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</v-list-tile>
|
||||
</v-list> -->
|
||||
</v-navigation-drawer>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
props: {
|
||||
drawer: Boolean
|
||||
},
|
||||
|
||||
computed : {
|
||||
level_0 () {
|
||||
return this.$store.state.system.menu_level_0
|
||||
},
|
||||
|
||||
level_1 () {
|
||||
return this.$store.state.system.menu_level_1
|
||||
},
|
||||
|
||||
level_2 () {
|
||||
return this.$store.state.system.menu_level_2
|
||||
}
|
||||
},
|
||||
|
||||
mounted () {
|
||||
this.$store.dispatch('system/get_menu')
|
||||
},
|
||||
|
||||
methods : {
|
||||
goTo (url) {
|
||||
window.location = BASE_URL + '/one-ui/' + url
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
154
one-ui/apps/components/oneMenuDrawer.vue
Normal file
154
one-ui/apps/components/oneMenuDrawer.vue
Normal file
@@ -0,0 +1,154 @@
|
||||
<template>
|
||||
<v-navigation-drawer temporary class="blue lighten-2" v-model="xdrawer" dark fixed app>
|
||||
<v-list>
|
||||
|
||||
<!-- LEVEL 0 -->
|
||||
<template
|
||||
v-for="(lev_0, i) in level_0"
|
||||
>
|
||||
<v-list-tile class="tile"
|
||||
:key="lev_0.id + 10000"
|
||||
v-if="!level_1['p_'+lev_0.id] && lev_0.is_parent=='N'"
|
||||
@click="goTo(lev_0.url)">
|
||||
<v-list-tile-action>
|
||||
<v-icon>{{ lev_0.icon }}</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
<v-list-group
|
||||
:key="lev_0.id"
|
||||
:prepend-icon="lev_0.icon"
|
||||
:value="lev_0.state"
|
||||
v-if="level_1['p_'+lev_0.id]"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile class="tile">
|
||||
<v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<!-- LEVEL 1 -->
|
||||
<template
|
||||
v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
|
||||
>
|
||||
<v-list-tile class="tile"
|
||||
:key="lev_1.id + 10000"
|
||||
v-if="!level_2['p_'+lev_1.id] && lev_1.is_parent=='N'"
|
||||
sub-group
|
||||
no-action
|
||||
@click="goTo(lev_1.url)"
|
||||
>
|
||||
<v-list-tile-action>
|
||||
<!-- <v-icon>home</v-icon> -->
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
<v-list-group
|
||||
:key="lev_1.id"
|
||||
:value="lev_1.state"
|
||||
v-show="level_2['p_'+lev_1.id]"
|
||||
sub-group
|
||||
no-action
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile>
|
||||
<v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<!-- LEVEL 2 -->
|
||||
<template
|
||||
v-for="(lev_2, k) in level_2['p_'+lev_1.id]"
|
||||
>
|
||||
<v-list-tile class="tile"
|
||||
:key="lev_2.id"
|
||||
@click="goTo(lev_2.url)">
|
||||
<!-- <v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action> -->
|
||||
<v-list-tile-title>{{ lev_2.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
</template>
|
||||
</v-list-group>
|
||||
|
||||
</template>
|
||||
|
||||
</v-list-group>
|
||||
|
||||
</template>
|
||||
</v-list>
|
||||
</v-navigation-drawer>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.tile {
|
||||
margin: 5px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.tile:hover {
|
||||
background-color: #1E88E5;
|
||||
}
|
||||
.tile:active {
|
||||
background: #bec5b7;
|
||||
}
|
||||
.v-list__group__header__prepend-icon .v-icon {
|
||||
color: white;
|
||||
}
|
||||
.v-list__tile__title:hover {
|
||||
color: #BBDEFB;
|
||||
}
|
||||
|
||||
.v-navigation-drawer {
|
||||
z-index: 1003;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
<style>
|
||||
.v-overlay--active {
|
||||
z-index: 1002;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
module.exports = {
|
||||
props: {
|
||||
drawer: Boolean
|
||||
},
|
||||
|
||||
computed : {
|
||||
xdrawer: {
|
||||
get() {
|
||||
return this.drawer
|
||||
},
|
||||
set(v) {
|
||||
this.$emit("togleDrawer")
|
||||
}
|
||||
},
|
||||
level_0 () {
|
||||
return this.$store.state.system.menu_level_0
|
||||
},
|
||||
|
||||
level_1 () {
|
||||
return this.$store.state.system.menu_level_1
|
||||
},
|
||||
|
||||
level_2 () {
|
||||
return this.$store.state.system.menu_level_2
|
||||
}
|
||||
},
|
||||
|
||||
mounted () {
|
||||
this.$store.dispatch('system/get_menu')
|
||||
},
|
||||
|
||||
methods : {
|
||||
goTo (url) {
|
||||
window.location = BASE_URL + '/one-ui/' + url
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
134
one-ui/apps/components/oneMenuDrawer2.vue
Normal file
134
one-ui/apps/components/oneMenuDrawer2.vue
Normal file
@@ -0,0 +1,134 @@
|
||||
<template>
|
||||
<v-navigation-drawer temporary class="blue lighten-2" v-model="drawer" dark fixed app>
|
||||
<v-list>
|
||||
|
||||
<!-- LEVEL 0 -->
|
||||
<template
|
||||
v-for="(lev_0, i) in level_0"
|
||||
>
|
||||
<v-list-tile class="tile"
|
||||
:key="i"
|
||||
v-if="!level_1['p_'+lev_0.id] && lev_0.is_parent=='N'"
|
||||
@click="goTo(lev_0.url)">
|
||||
<v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
<v-list-group
|
||||
v-bind:key="i"
|
||||
:prepend-icon="lev_0.icon"
|
||||
:value="lev_0.state"
|
||||
v-if="level_1['p_'+lev_0.id]"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile class="tile">
|
||||
<v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<!-- LEVEL 1 -->
|
||||
<template
|
||||
v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
|
||||
>
|
||||
<v-list-tile class="tile"
|
||||
v-bind:key="j"
|
||||
v-if="!level_2['p_'+lev_1.id] && lev_1.is_parent=='N'"
|
||||
sub-group
|
||||
no-action
|
||||
@click="goTo(lev_1.url)"
|
||||
>
|
||||
<v-list-tile-action>
|
||||
<!-- <v-icon>home</v-icon> -->
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
<v-list-group
|
||||
v-bind:key="j"
|
||||
:value="lev_1.state"
|
||||
v-show="level_2['p_'+lev_1.id]"
|
||||
sub-group
|
||||
no-action
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile>
|
||||
<v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<!-- LEVEL 2 -->
|
||||
<template
|
||||
v-for="(lev_2, k) in level_2['p_'+lev_1.id]"
|
||||
>
|
||||
<v-list-tile class="tile"
|
||||
:key="k"
|
||||
@click="goTo(lev_2.url)">
|
||||
<!-- <v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action> -->
|
||||
<v-list-tile-title>{{ lev_2.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
</template>
|
||||
</v-list-group>
|
||||
|
||||
</template>
|
||||
|
||||
</v-list-group>
|
||||
|
||||
</template>
|
||||
</v-list>
|
||||
</v-navigation-drawer>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.tile {
|
||||
margin: 5px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.tile:hover {
|
||||
background-color: #1E88E5;
|
||||
}
|
||||
.tile:active {
|
||||
background: #bec5b7;
|
||||
}
|
||||
.v-list__group__header__prepend-icon .v-icon {
|
||||
color: white;
|
||||
}
|
||||
.v-list__tile__title:hover {
|
||||
color: #BBDEFB;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
module.exports = {
|
||||
props: {
|
||||
drawer: Boolean
|
||||
},
|
||||
|
||||
computed : {
|
||||
level_0 () {
|
||||
return this.$store.state.system.menu_level_0
|
||||
},
|
||||
|
||||
level_1 () {
|
||||
return this.$store.state.system.menu_level_1
|
||||
},
|
||||
|
||||
level_2 () {
|
||||
return this.$store.state.system.menu_level_2
|
||||
}
|
||||
},
|
||||
|
||||
mounted () {
|
||||
this.$store.dispatch('system/get_menu')
|
||||
},
|
||||
|
||||
methods : {
|
||||
goTo (url) {
|
||||
window.location = BASE_URL + '/one-ui/' + url
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
229
one-ui/apps/components/oneMenuDrawerGlobal.vue
Normal file
229
one-ui/apps/components/oneMenuDrawerGlobal.vue
Normal file
@@ -0,0 +1,229 @@
|
||||
<template>
|
||||
<v-navigation-drawer temporary class="blue lighten-2" v-model="drawer" dark fixed app>
|
||||
<v-list>
|
||||
<!-- IF NO CHILD -->
|
||||
<template
|
||||
v-for="(lev_0, i) in level_0"
|
||||
>
|
||||
<v-list-tile class="tile"
|
||||
:key="i"
|
||||
v-show="!level_1['p_'+lev_0.id]"
|
||||
@click="goTo(lev_0.url)">
|
||||
<v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-title >{{ lev_0.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<!-- HAVING CHILDREN -->
|
||||
<template
|
||||
v-for="(lev_0, i) in level_0"
|
||||
>
|
||||
<v-list-group
|
||||
v-bind:key="i"
|
||||
prepend-icon="account_circle"
|
||||
:value="lev_0.state"
|
||||
v-show="level_1['p_'+lev_0.id]"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile class="tile">
|
||||
<v-list-tile-title>{{ lev_0.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<!-- LEVEL 1 STARTS HERE -->
|
||||
<!-- NOT HAVING CHILD -->
|
||||
<template
|
||||
v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
|
||||
>
|
||||
<v-list-tile class="tile"
|
||||
v-bind:key="j"
|
||||
v-show="!level_2['p_'+lev_1.id]"
|
||||
sub-group
|
||||
no-action
|
||||
@click="goTo(lev_1.url)"
|
||||
>
|
||||
<v-list-tile-action>
|
||||
<!-- <v-icon>home</v-icon> -->
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<!-- HAVING CHILD -->
|
||||
<template
|
||||
v-for="(lev_1, j) in level_1['p_'+lev_0.id]"
|
||||
>
|
||||
|
||||
<v-list-group
|
||||
v-bind:key="j"
|
||||
:value="lev_1.state"
|
||||
v-show="level_2['p_'+lev_1.id]"
|
||||
sub-group
|
||||
no-action
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile class="tile">
|
||||
<v-list-tile-title>{{ lev_1.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<!-- LEVEL 2 STARTS HERE -->
|
||||
<template
|
||||
v-for="(lev_2, k) in level_2['p_'+lev_1.id]"
|
||||
>
|
||||
<v-list-tile class="tile"
|
||||
:key="k"
|
||||
@click="goTo(lev_2.url)">
|
||||
<!-- <v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action> -->
|
||||
<v-list-tile-title>{{ lev_2.name }}</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
</template>
|
||||
<!-- END OF LEVEL 2 -->
|
||||
|
||||
</v-list-group>
|
||||
</template>
|
||||
<!-- END OF LEVEL 1 -->
|
||||
|
||||
</v-list-group>
|
||||
</template>
|
||||
</v-list>
|
||||
|
||||
<!-- <v-list>
|
||||
<v-list-tile class="tile">
|
||||
<v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-title>Home</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
|
||||
<v-list-group
|
||||
prepend-icon="account_circle"
|
||||
value="true"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile class="tile">
|
||||
<v-list-tile-title>Users</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
<v-list-group
|
||||
no-action
|
||||
sub-group
|
||||
value="true"
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile class="tile">
|
||||
<v-list-tile-title>Admin</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
|
||||
<v-list-tile
|
||||
v-for="(admin, i) in admins"
|
||||
:key="i"
|
||||
@click=""
|
||||
>
|
||||
<v-list-tile-title v-text="admin[0]"></v-list-tile-title>
|
||||
<v-list-tile-action>
|
||||
<v-icon v-text="admin[1]"></v-icon>
|
||||
</v-list-tile-action>
|
||||
</v-list-tile>
|
||||
</v-list-group>
|
||||
|
||||
<v-list-group
|
||||
sub-group
|
||||
no-action
|
||||
>
|
||||
<template v-slot:activator>
|
||||
<v-list-tile class="tile">
|
||||
<v-list-tile-title>Actions</v-list-tile-title>
|
||||
</v-list-tile>
|
||||
</template>
|
||||
<v-list-tile
|
||||
v-for="(crud, i) in cruds"
|
||||
:key="i"
|
||||
@click=""
|
||||
>
|
||||
<v-list-tile-title v-text="crud[0]"></v-list-tile-title>
|
||||
<v-list-tile-action>
|
||||
<v-icon v-text="crud[1]"></v-icon>
|
||||
</v-list-tile-action>
|
||||
</v-list-tile class="tile">
|
||||
</v-list-group>
|
||||
</v-list-group>
|
||||
</v-list> -->
|
||||
<!-- <v-list dense>
|
||||
<v-list-tile class="tile">
|
||||
<v-list-tile-action>
|
||||
<v-icon>home</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>Home</v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</v-list-tile>
|
||||
<v-list-tile class="tile">
|
||||
<v-list-tile-action>
|
||||
<v-icon>contact_mail</v-icon>
|
||||
</v-list-tile-action>
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>Contact</v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</v-list-tile>
|
||||
</v-list> -->
|
||||
</v-navigation-drawer>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.tile {
|
||||
margin: 5px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.tile:hover {
|
||||
background-color: #1E88E5;
|
||||
}
|
||||
.tile:active {
|
||||
background: #bec5b7;
|
||||
}
|
||||
.v-list__group__header__prepend-icon .v-icon {
|
||||
color: #3b60f2;
|
||||
}
|
||||
.v-list__tile__title:hover {
|
||||
color: #BBDEFB;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
module.exports = {
|
||||
props: {
|
||||
drawer: Boolean
|
||||
},
|
||||
|
||||
computed : {
|
||||
level_0 () {
|
||||
return this.$store.state.menu.menu_level_0
|
||||
},
|
||||
|
||||
level_1 () {
|
||||
return this.$store.state.menu.menu_level_1
|
||||
},
|
||||
|
||||
level_2 () {
|
||||
return this.$store.state.menu.menu_level_2
|
||||
}
|
||||
},
|
||||
|
||||
mounted () {
|
||||
this.$store.dispatch('menu/get_menu')
|
||||
},
|
||||
|
||||
methods : {
|
||||
goTo (url) {
|
||||
window.location = BASE_URL + '/one-ui/' + url
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
131
one-ui/apps/components/oneNavbarComponent-bkp.vue
Normal file
131
one-ui/apps/components/oneNavbarComponent-bkp.vue
Normal file
@@ -0,0 +1,131 @@
|
||||
<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>
|
||||
|
||||
168
one-ui/apps/components/oneNavbarComponent.vue
Normal file
168
one-ui/apps/components/oneNavbarComponent.vue
Normal file
@@ -0,0 +1,168 @@
|
||||
<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/one-login')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
54
one-ui/apps/components/oneNavbarComponentGlobal.vue
Normal file
54
one-ui/apps/components/oneNavbarComponentGlobal.vue
Normal file
@@ -0,0 +1,54 @@
|
||||
<template>
|
||||
<span>
|
||||
<one-menu-drawer :drawer="drawer" > </one-menu-drawer>
|
||||
<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-icon
|
||||
medium
|
||||
|
||||
>
|
||||
notifications
|
||||
</v-icon>
|
||||
</v-badge>
|
||||
<v-btn class="ml-4" icon>
|
||||
<v-icon>apps</v-icon>
|
||||
</v-btn>
|
||||
</v-toolbar>
|
||||
</template>
|
||||
<style scoped>
|
||||
.v-badge__badge{
|
||||
top:-9px;
|
||||
right:-9px;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
module.exports = {
|
||||
components: {
|
||||
'one-menu-drawer' : httpVueLoader('./oneMenuDrawerGlobal.vue')
|
||||
},
|
||||
data: function() {
|
||||
return {
|
||||
drawer: 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
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
168
one-ui/apps/components/oneNavbarComponentNoMenu.vue
Normal file
168
one-ui/apps/components/oneNavbarComponentNoMenu.vue
Normal file
@@ -0,0 +1,168 @@
|
||||
<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() {
|
||||
window.location.href = "/one-ui/system/one-md-menu/"
|
||||
},
|
||||
change_password() {
|
||||
this.$store.commit("system/update_change_password_dialog",true)
|
||||
},
|
||||
logout () {
|
||||
window.one_logout('/one-ui/one-login')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
138
one-ui/apps/components/oneNotificationDrawer.vue
Normal file
138
one-ui/apps/components/oneNotificationDrawer.vue
Normal file
@@ -0,0 +1,138 @@
|
||||
<template>
|
||||
<v-navigation-drawer v-model="xdrawer" fixed app right temporary :width="drawerHeight">
|
||||
|
||||
<v-list two-line>
|
||||
<template v-for="(item, index) in items">
|
||||
<v-subheader
|
||||
v-bind:key="item.id"
|
||||
v-if="item.header"
|
||||
>
|
||||
{{ item.header }}
|
||||
</v-subheader>
|
||||
|
||||
|
||||
|
||||
<template v-for="(itm, idx) in item.items">
|
||||
<v-list-tile
|
||||
:key="itm.id"
|
||||
avatar
|
||||
>
|
||||
<v-list-tile-avatar>
|
||||
<img :src="itm.avatar">
|
||||
</v-list-tile-avatar>
|
||||
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title v-html="itm.title"></v-list-tile-title>
|
||||
|
||||
<v-list-tile-sub-title v-html="itm.subtitle"></v-list-tile-sub-title>
|
||||
</v-list-tile-content>
|
||||
|
||||
<v-list-tile-action v-if="itm.date">
|
||||
|
||||
{{ itm.date }}
|
||||
|
||||
</v-list-tile-action>
|
||||
|
||||
|
||||
</v-list-tile>
|
||||
<v-divider
|
||||
:key="itm.id+50000"
|
||||
:inset="true"
|
||||
></v-divider>
|
||||
</template>
|
||||
|
||||
</template>
|
||||
</v-list>
|
||||
|
||||
</v-navigation-drawer>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
data () {
|
||||
return {
|
||||
items:
|
||||
[
|
||||
{
|
||||
// header: 'Today' ,
|
||||
items : [
|
||||
{
|
||||
avatar: 'https://cdn.vuetifyjs.com/images/lists/1.jpg',
|
||||
title: 'Brunch this weekend?',
|
||||
subtitle: "<span class='text--primary'>Ali Connors</span> — I'll be in your neighborhood doing errands this weekend. Do you want to hang out?",
|
||||
date: '15 mins'
|
||||
,id : 0
|
||||
},
|
||||
|
||||
{
|
||||
avatar: 'https://cdn.vuetifyjs.com/images/lists/2.jpg',
|
||||
title: 'Summer BBQ <span class="grey--text text--lighten-1">4</span>',
|
||||
subtitle: "<span class='text--primary'>to Alex, Scott, Jennifer</span> — Wish I could come, but I'm out of town this weekend.",
|
||||
date: '30 mins'
|
||||
,id : 1
|
||||
},
|
||||
|
||||
{
|
||||
avatar: 'https://cdn.vuetifyjs.com/images/lists/3.jpg',
|
||||
title: 'Oui oui',
|
||||
subtitle: "<span class='text--primary'>Sandra Adams</span> — Do you have Paris recommendations? Have you ever been?",
|
||||
date: '45 mins'
|
||||
,id : 2
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
// header: 'Yesterday' ,
|
||||
items : [
|
||||
{
|
||||
avatar: 'https://cdn.vuetifyjs.com/images/lists/1.jpg',
|
||||
title: 'Brunch this weekend?',
|
||||
subtitle: "<span class='text--primary'>Ali Connors</span> — I'll be in your neighborhood doing errands this weekend. Do you want to hang out?",
|
||||
date: '1 day'
|
||||
,id : 3
|
||||
},
|
||||
|
||||
{
|
||||
avatar: 'https://cdn.vuetifyjs.com/images/lists/2.jpg',
|
||||
title: 'Summer BBQ <span class="grey--text text--lighten-1">4</span>',
|
||||
subtitle: "<span class='text--primary'>to Alex, Scott, Jennifer</span> — Wish I could come, but I'm out of town this weekend.",
|
||||
date: '2 day'
|
||||
,id : 4
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
props: {
|
||||
drawer: Boolean
|
||||
},
|
||||
|
||||
computed : {
|
||||
drawerHeight() {
|
||||
if (this.$vuetify.breakpoint.smAndDown) {
|
||||
return "300px"
|
||||
}
|
||||
return "500px"
|
||||
},
|
||||
xdrawer: {
|
||||
get() {
|
||||
return this.drawer
|
||||
},
|
||||
set(v) {
|
||||
this.$emit("togleDrawer")
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mounted () {
|
||||
|
||||
},
|
||||
|
||||
methods : {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
62
one-ui/apps/components/oneTanggal.vue
Normal file
62
one-ui/apps/components/oneTanggal.vue
Normal file
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<div class="tanggal">
|
||||
{{f_tanggal}}
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
div.tanggal {
|
||||
text-decoration: none;
|
||||
color: rgb(255, 255, 255);
|
||||
font-size: 14px;
|
||||
display:inline-block;
|
||||
margin-left:10px;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
let hari = ['Minggu','Senin','Selasa', 'Rabu', 'Kamis',"Jum'at","Sabtu"]
|
||||
let bulan = ["Jan","Feb","Mar","Apr","Mei","Jun","Jul","Agu","Sep","Okt","Nov","Des"]
|
||||
|
||||
module.exports = {
|
||||
data() {
|
||||
return {
|
||||
tanggal: new Date()
|
||||
,timepool : 0
|
||||
}
|
||||
}
|
||||
,computed: {
|
||||
f_tanggal() {
|
||||
try {
|
||||
let tgl = this.tanggal.getDate()
|
||||
let bln = bulan[this.tanggal.getMonth()]
|
||||
let day = hari[this.tanggal.getDay()]
|
||||
let result = day + ', ' + tgl + ' ' + bln + ' ' + this.tanggal.getFullYear()
|
||||
let hour = this.tanggal.getHours()
|
||||
let minute = this.tanggal.getMinutes()
|
||||
let second = this.tanggal.getSeconds()
|
||||
let jam = ' '
|
||||
if ( hour < 10 ) jam = jam + '0'
|
||||
jam = jam + hour.toString() + ':'
|
||||
if ( minute < 10 ) jam = jam + '0'
|
||||
jam = jam + minute.toString() + ':'
|
||||
if ( second< 10 ) jam = jam + + '0'
|
||||
jam = jam + second.toString()
|
||||
|
||||
result = result + ' ' + jam
|
||||
return result
|
||||
} catch(e) {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
}
|
||||
, mounted() {
|
||||
let self = this
|
||||
this.timepool = setInterval(function() {
|
||||
self.tanggal = new Date()
|
||||
},1000)
|
||||
}
|
||||
,beforeDestroy() {
|
||||
if (this.timepool > 0 ) clearInterval(this.timepool)
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user