修改授权展示

This commit is contained in:
龙运模 2024-10-09 20:06:33 +08:00
parent fd51cf8e72
commit 6803810f00
2 changed files with 62 additions and 50 deletions

View File

@ -6,31 +6,33 @@
</div> </div>
<div class="right-panel"><div class="companyName">{{name}}</div></div> <div class="right-panel"><div class="companyName">{{name}}</div></div>
</el-header> </el-header>
<el-main class="nopadding"> <el-main class="nopadding" v-loading="loading" element-loading-text="加载中...">
<div class="treeTable"> <el-scrollbar>
<div :class="list.length===0?'thenTitle thenTitleBottom':'thenTitle'"> <div class="treeTable">
<div class="tr"> <div :class="list.length===0?'thenTitle thenTitleBottom':'thenTitle'">
<div class="th module">功能模块</div> <div class="tr">
<div class="th check"><el-checkbox :indeterminate="isCheckFun" @change="allCheckChange" v-model="checkedFun" :size="size" /></div> <div class="th module">功能模块</div>
<div class="th thFlex"> <div class="th check"><el-checkbox :indeterminate="isCheckFun" @change="allCheckChange" v-model="checkedFun" :size="size" /></div>
<div class="menu name">菜单</div> <div class="th thFlex">
<div class="th authority">数据操作权限</div> <div class="menu name">菜单</div>
<div class="th authority">数据操作权限</div>
</div>
</div> </div>
</div> </div>
</div> <div class="tableBody">
<div class="tableBody"> <div class="tr" v-for="(item,index) in list" :key="index">
<div class="tr" v-for="(item,index) in list" :key="index"> <div class="td module">{{item.meta.title}}</div>
<div class="td module">{{item.meta.title}}</div> <div class="td check"><el-checkbox v-model="item.checked" :indeterminate="item.isCheck" @change="menuCheckChange(item)" :size="size" /></div>
<div class="td check"><el-checkbox v-model="item.checked" :indeterminate="item.isCheck" @change="menuCheckChange(item)" :size="size" /></div> <div class="td tdChild">
<div class="td tdChild"> <div class="nextTd" v-for="(em,ind) in item.children" :key="ind">
<div class="nextTd" v-for="(em,ind) in item.children" :key="ind"> <div class="tdName menu">
<div class="tdName menu"> <el-checkbox @change="moduleCheckChange(item,em)" :indeterminate="em.isCheck" v-model="em.checked" :size="size">{{em.meta.title}}</el-checkbox>
<el-checkbox @change="moduleCheckChange(item,em)" :indeterminate="em.isCheck" v-model="em.checked" :size="size">{{em.meta.title}}</el-checkbox> </div>
</div> <div class="tdName authority">
<div class="tdName authority"> <div class="childTr">
<div class="childTr"> <div class="preBox" v-for="(li,lidex) in em.meta.data_permission" :key="lidex">
<div class="preBox" v-for="(li,lidex) in em.meta.data_permission" :key="lidex"> <el-checkbox @change="checkChange(item,em)" v-model="li.checked" :size="size">{{li.title}}</el-checkbox>
<el-checkbox @change="checkChange(item,em)" v-model="li.checked" :size="size">{{li.title}}</el-checkbox> </div>
</div> </div>
</div> </div>
</div> </div>
@ -38,7 +40,7 @@
</div> </div>
</div> </div>
</div> </div>
</div> </el-scrollbar>
</el-main> </el-main>
</el-container> </el-container>
</template> </template>
@ -51,7 +53,8 @@ export default {
size:'small', size:'small',
id: this.$route.query.id, id: this.$route.query.id,
name:this.$route.query.name, name:this.$route.query.name,
list:[] list:[],
loading:false
} }
}, },
computed:{ computed:{
@ -81,7 +84,9 @@ export default {
let params = { let params = {
company_id:this.id company_id:this.id
} }
this.loading = true;
const res = await this.$API.system.company.permission.post(params); const res = await this.$API.system.company.permission.post(params);
this.loading = false;
res.data.forEach(item=>{ res.data.forEach(item=>{
if(item.children){ if(item.children){
item.children.forEach(em=>{ item.children.forEach(em=>{
@ -333,6 +338,8 @@ export default {
.tdName{ .tdName{
padding: 0 10px; padding: 0 10px;
min-height: 33px; min-height: 33px;
display: flex;
align-items: center;
} }
.childTr{ .childTr{
display: flex; display: flex;

View File

@ -13,31 +13,33 @@
<el-alert title="个人用户权限不可编辑,需要编辑请到到角色编辑对应的权限" type="warning" :closable="false" /> <el-alert title="个人用户权限不可编辑,需要编辑请到到角色编辑对应的权限" type="warning" :closable="false" />
</div> </div>
</el-header> </el-header>
<el-main class="nopadding"> <el-main class="nopadding" v-loading="loading" element-loading-text="加载中...">
<div class="treeTable"> <el-scrollbar>
<div :class="list.length===0?'thenTitle thenTitleBottom':'thenTitle'"> <div class="treeTable">
<div class="tr"> <div :class="list.length===0?'thenTitle thenTitleBottom':'thenTitle'">
<div class="th module">功能模块</div> <div class="tr">
<div class="th check"><el-checkbox :indeterminate="isCheckFun" @change="allCheckChange" :disabled="showPermission" v-model="checkedFun" :size="size" /></div> <div class="th module">功能模块</div>
<div class="th thFlex"> <div class="th check"><el-checkbox :indeterminate="isCheckFun" @change="allCheckChange" :disabled="showPermission" v-model="checkedFun" :size="size" /></div>
<div class="menu name">菜单</div> <div class="th thFlex">
<div class="th authority">数据操作权限</div> <div class="menu name">菜单</div>
<div class="th authority">数据操作权限</div>
</div>
</div> </div>
</div> </div>
</div> <div class="tableBody">
<div class="tableBody"> <div class="tr" v-for="(item,index) in list" :key="index">
<div class="tr" v-for="(item,index) in list" :key="index"> <div class="td module">{{item.meta.title}}</div>
<div class="td module">{{item.meta.title}}</div> <div class="td check"><el-checkbox v-model="item.checked" :indeterminate="item.isCheck" @change="menuCheckChange(item)" :disabled="showPermission" :size="size" /></div>
<div class="td check"><el-checkbox v-model="item.checked" :indeterminate="item.isCheck" @change="menuCheckChange(item)" :disabled="showPermission" :size="size" /></div> <div class="td tdChild">
<div class="td tdChild"> <div class="nextTd" v-for="(em,ind) in item.children" :key="ind">
<div class="nextTd" v-for="(em,ind) in item.children" :key="ind"> <div class="tdName menu">
<div class="tdName menu"> <el-checkbox @change="moduleCheckChange(item,em)" :indeterminate="em.isCheck" v-model="em.checked" :disabled="showPermission" :size="size">{{em.meta.title}}</el-checkbox>
<el-checkbox @change="moduleCheckChange(item,em)" :indeterminate="em.isCheck" v-model="em.checked" :disabled="showPermission" :size="size">{{em.meta.title}}</el-checkbox> </div>
</div> <div class="tdName authority">
<div class="tdName authority"> <div class="childTr">
<div class="childTr"> <div class="preBox" v-for="(li,lidex) in em.meta.data_permission" :key="lidex">
<div class="preBox" v-for="(li,lidex) in em.meta.data_permission" :key="lidex"> <el-checkbox @change="checkChange(item,em,li)" v-model="li.checked" :disabled="showPermission" :size="size">{{li.title}}</el-checkbox>
<el-checkbox @change="checkChange(item,em,li)" v-model="li.checked" :disabled="showPermission" :size="size">{{li.title}}</el-checkbox> </div>
</div> </div>
</div> </div>
</div> </div>
@ -45,7 +47,7 @@
</div> </div>
</div> </div>
</div> </div>
</div> </el-scrollbar>
</el-main> </el-main>
</el-container> </el-container>
</template> </template>
@ -60,7 +62,8 @@ export default {
name:this.$route.query.name, name:this.$route.query.name,
user_roles:[], user_roles:[],
list:[], list:[],
showPermission:false showPermission:false,
loading:false,
} }
}, },
computed:{ computed:{
@ -90,7 +93,9 @@ export default {
let params = { let params = {
user_id:this.id user_id:this.id
} }
this.loading = true;
const res = await this.$API.system.user.userPermission.post(params); const res = await this.$API.system.user.userPermission.post(params);
this.loading = false;
this.user_roles = res.data && res.data.role?res.data.role:[]; this.user_roles = res.data && res.data.role?res.data.role:[];
if(res.data && res.data.menu && res.data.menu.length>0){ if(res.data && res.data.menu && res.data.menu.length>0){
res.data.menu.forEach(item=>{ res.data.menu.forEach(item=>{