265 lines
10 KiB
Vue
265 lines
10 KiB
Vue
<template>
|
|
<div>
|
|
|
|
<v-layout>
|
|
<v-flex xs12>
|
|
<v-layout row wrap>
|
|
<v-flex class="text-xs-center" xs3>
|
|
<v-card color="#5d7aaa" class="mb-2 mr-2" v-for="(mp,index) in xpriviledges" v-if="rmod(index) === 0">
|
|
<v-card-title
|
|
dark
|
|
class="headline text-xs-center pa-0 pb-1"
|
|
primary-title
|
|
style="color:white;background:#00000042"
|
|
>
|
|
<v-toolbar class="text-xs-center" color="cyan" dark>
|
|
|
|
|
|
<v-toolbar-title class="text-xs-center">{{mp.name}}</v-toolbar-title>
|
|
</v-toolbar>
|
|
</v-card-title>
|
|
<v-card-text>
|
|
<v-navigation-drawer
|
|
class="blue lighten-3"
|
|
dark
|
|
permanent
|
|
style="width:100%"
|
|
>
|
|
<v-list>
|
|
<v-list-tile
|
|
v-for="(p,idx) in mp.childs" :key="p.S_PrivilegeID"
|
|
@click="changePriviledge(index,idx,p.status)"
|
|
>
|
|
<v-list-tile-content>
|
|
<v-list-tile-title>{{ p.S_MenuName }}</v-list-tile-title>
|
|
</v-list-tile-content>
|
|
</v-list-tile>
|
|
</v-list>
|
|
</v-navigation-drawer>
|
|
</v-card-text>
|
|
</v-card>
|
|
</v-flex>
|
|
<v-flex xs3>
|
|
<v-card color="#5d7aaa" class="mb-2 mr-2" v-for="(mp,index) in xpriviledges" v-if="rmod(index) === 1">
|
|
<v-card-title
|
|
dark
|
|
class="headline font-weight-black mono pa-0 pb-1"
|
|
primary-title
|
|
style="color:white;background:#00000042"
|
|
>
|
|
<v-toolbar class="text-xs-center" color="cyan" dark>
|
|
|
|
|
|
<v-toolbar-title class="text-xs-center">{{mp.name}}</v-toolbar-title>
|
|
</v-toolbar>
|
|
</v-card-title>
|
|
<v-card-text>
|
|
<v-navigation-drawer
|
|
class="blue lighten-3"
|
|
dark
|
|
permanent
|
|
style="width:100%"
|
|
>
|
|
<v-list>
|
|
<v-list-tile
|
|
v-for="(p,idx) in mp.childs" :key="p.S_PrivilegeID"
|
|
@click="changePriviledge(index,idx,p.status)"
|
|
>
|
|
<v-list-tile-content>
|
|
<v-list-tile-title>{{ p.S_MenuName }}</v-list-tile-title>
|
|
</v-list-tile-content>
|
|
</v-list-tile>
|
|
</v-list>
|
|
</v-navigation-drawer>
|
|
</v-card-text>
|
|
</v-card>
|
|
</v-flex>
|
|
<v-flex xs3>
|
|
<v-card color="#5d7aaa" class="mb-2 mr-2" v-for="(mp,index) in xpriviledges" v-if="rmod(index) === 2">
|
|
<v-card-title
|
|
dark
|
|
class="headline font-weight-black mono pa-0 pb-1"
|
|
primary-title
|
|
style="color:white;background:#00000042"
|
|
>
|
|
<v-toolbar class="text-xs-center" color="cyan" dark>
|
|
|
|
|
|
<v-toolbar-title class="text-xs-center">{{mp.name}}</v-toolbar-title>
|
|
</v-toolbar>
|
|
</v-card-title>
|
|
<v-card-text>
|
|
<v-navigation-drawer
|
|
class="blue lighten-3"
|
|
dark
|
|
permanent
|
|
style="width:100%"
|
|
>
|
|
<v-list>
|
|
<v-list-tile
|
|
v-for="(p,idx) in mp.childs" :key="p.S_PrivilegeID"
|
|
@click="changePriviledge(index,idx,p.status)"
|
|
>
|
|
<v-list-tile-content>
|
|
<v-list-tile-title>{{ p.S_MenuName }}</v-list-tile-title>
|
|
</v-list-tile-content>
|
|
</v-list-tile>
|
|
</v-list>
|
|
</v-navigation-drawer>
|
|
</v-card-text>
|
|
</v-card>
|
|
</v-flex>
|
|
<v-flex xs3>
|
|
<v-card color="#5d7aaa" class="mb-2" v-for="(mp,index) in xpriviledges" v-if="rmod(index) === 3">
|
|
<v-card-title
|
|
dark
|
|
class="headline font-weight-black mono pa-0 pb-1"
|
|
primary-title
|
|
style="color:white;background:#00000042"
|
|
>
|
|
<v-toolbar class="text-xs-center" color="cyan" dark>
|
|
|
|
|
|
<v-toolbar-title class="text-xs-center">{{mp.name}}</v-toolbar-title>
|
|
</v-toolbar>
|
|
</v-card-title>
|
|
<v-card-text>
|
|
<v-navigation-drawer
|
|
class="blue lighten-3"
|
|
dark
|
|
permanent
|
|
style="width:100%"
|
|
>
|
|
<v-list>
|
|
<v-list-tile
|
|
v-for="(p,idx) in mp.childs" :key="p.S_PrivilegeID"
|
|
@click="changePriviledge(index,idx,p.status)"
|
|
>
|
|
<v-list-tile-content>
|
|
<v-list-tile-title>{{ p.S_MenuName }}</v-list-tile-title>
|
|
</v-list-tile-content>
|
|
</v-list-tile>
|
|
</v-list>
|
|
</v-navigation-drawer>
|
|
</v-card-text>
|
|
</v-card>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-flex>
|
|
</v-layout>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
table, td, th {
|
|
border: 1px solid #ddd;
|
|
text-align: left;
|
|
}
|
|
|
|
table {
|
|
border-collapse: collapse;
|
|
width: 100%;
|
|
}
|
|
|
|
th, td {
|
|
padding-top: 5px;
|
|
padding-bottom: 5px;
|
|
padding-left: 8px;
|
|
padding-right: 5px;
|
|
}
|
|
|
|
.mini-input .v-input{
|
|
margin-top: 0px;
|
|
}
|
|
|
|
.mini-input .v-input, .mini-input .v-input--selection-controls,.mini-input .v-input__slot{
|
|
margin-top: 0px;
|
|
margin-bottom:0px;
|
|
margin-left:3px;
|
|
}
|
|
.mini-input .v-messages{
|
|
min-height:0px;
|
|
}
|
|
input.fhm-input{
|
|
border: 1px solid black;
|
|
border-radius: 2px;
|
|
-webkit-box-shadow:
|
|
inset 0 0 2px rgba(0,0,0,0.1),
|
|
0 0 4px rgba(0,0,0,0.1);
|
|
-moz-box-shadow:
|
|
inset 0 0 2px rgba(0,0,0,0.1),
|
|
0 0 4px rgba(0,0,0,0.1);
|
|
box-shadow:
|
|
inset 0 0 2px rgba(0,0,0,0.1),
|
|
0 0 4px rgba(0,0,0,0.1);
|
|
padding: 2px 4px;
|
|
background: rgba(255,255,255,0.5);
|
|
margin: 0 0 1px 0;
|
|
width:30px;
|
|
text-align:center;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
module.exports = {
|
|
data: () => ({
|
|
|
|
}),
|
|
mounted() {
|
|
var items = JSON.parse(localStorage.getItem('user'))
|
|
items.id = items.M_UserGroupID
|
|
console.log(items)
|
|
this.$store.dispatch("priviledge/lookup", items)
|
|
},
|
|
computed: {
|
|
xpriviledges() {
|
|
return this.$store.state.priviledge.priviledges
|
|
},
|
|
dialogsuccess: {
|
|
get() {
|
|
return this.$store.state.priviledge.dialog_success
|
|
},
|
|
set(val) {
|
|
this.$store.commit("priviledge/update_dialog_success",val)
|
|
}
|
|
},
|
|
msgsuccess(){
|
|
return this.$store.state.priviledge.msg_success
|
|
}
|
|
},
|
|
methods : {
|
|
rmod(idx){
|
|
return idx % 4
|
|
},
|
|
changePriviledge(idxpar,idxchild,val){
|
|
var arrx = this.$store.state.priviledge.priviledges
|
|
console.log(arrx[idxpar])
|
|
window.location.href = '/one-ui/'+arrx[idxpar]['childs'][idxchild].S_MenuUrl
|
|
/*arrx[idxpar]['childs'][idxchild].status = val === 'N'?'Y':'N'
|
|
arrx[idxpar]['childs'][idxchild].active = 'Y'
|
|
|
|
this.$store.commit("priviledge/update_priviledges",arrx)
|
|
this.$store.commit("usergroup/update_no_save",true)*/
|
|
},
|
|
changePriviledgeLevel2(idxpar,idxchild,idxchild2,val){
|
|
var arrx = this.$store.state.priviledge.priviledges
|
|
arrx[idxpar]['childs'][idxchild]['childs'][idxchild2].status = val === 'N'?'Y':'N'
|
|
arrx[idxpar]['childs'][idxchild]['childs'][idxchild2].active = 'Y'
|
|
|
|
this.$store.commit("priviledge/update_priviledges",arrx)
|
|
this.$store.commit("usergroup/update_no_save",true)
|
|
},
|
|
closeDialogSuccess(){
|
|
this.$store.commit("priviledge/update_dialog_success",false)
|
|
this.$store.dispatch("priviledge/lookup",{
|
|
id:this.$store.state.usergroup.selected_usergroup.id
|
|
})
|
|
},
|
|
save(){
|
|
var prm = this.$store.state.priviledge.priviledges
|
|
this.$store.dispatch("priviledge/save",prm)
|
|
}
|
|
}
|
|
}
|
|
</script>
|