0017
/
iot-ui-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: bug#18898

This commit is contained in:
leiqiaochu 2023-10-07 13:36:48 +08:00
parent 9d4177e1c9
commit 06f128bd0b
1 changed files with 93 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
src/views/system/Role/RoleLeft/index.vue
View File

@ -6,24 +6,14 @@
</template> </template>
</j-input> </j-input>
<div class="controls" v-if="admin"> <div class="controls" v-if="admin">
<j-button <j-button type="primary" @click="addGroup" style="width: 100%">
type="primary"
@click="addGroup"
style="width: 100%"
>
新增分组 新增分组
</j-button> </j-button>
</div> </div>
<div class="listBox"> <div class="listBox">
<j-tree <j-tree :tree-data="listData" v-if="listData.length" :fieldNames="{ title: 'name', key: 'id', children: 'children' }"
:tree-data="listData" blockNode :selectedKeys="selectedKeys" :default-expanded-keys="['global_role']"
v-if="listData.length" :showLine="{ showLeafIcon: false }">
:fieldNames="{title:'name',key:'id',children:'children'}"
blockNode
:selectedKeys="selectedKeys"
:default-expanded-keys="['global_role']"
:showLine="{ showLeafIcon: false }"
>
<template #title="item"> <template #title="item">
<div class="treeItem" @click="() => selectGroup(item.data.id)" v-if="!item.data?.edit"> <div class="treeItem" @click="() => selectGroup(item.data.id)" v-if="!item.data?.edit">
<template v-if="!item?.children"> <template v-if="!item?.children">
@ -31,28 +21,25 @@
<Ellipsis style="width: calc(100%-100px)">{{ item.name }}</Ellipsis> <Ellipsis style="width: calc(100%-100px)">{{ item.name }}</Ellipsis>
</div> </div>
<div @click="(e) => e.stopPropagation()" v-if="item.id !== 'default_group'"> <div @click="(e) => e.stopPropagation()" v-if="item.id !== 'default_group'">
<PermissionButton <PermissionButton type="text" hasPermission="system/Role:groupDelete" :popConfirm="{
type="text"
hasPermission="system/Role:groupDelete"
:popConfirm="{
title: `确定要删除？`, title: `确定要删除？`,
onConfirm: () => deleteGroup(item.id), onConfirm: () => deleteGroup(item.id),
}" }" :disabled="item.id === 'default_group'">
:disabled="item.id === 'default_group'"
>
删除 删除
</PermissionButton> </PermissionButton>
<PermissionButton <PermissionButton type="text" hasPermission="system/Role:groupUpdate"
type="text" @click="editGroup(item.data)" :disabled="item.id === 'default_group'">
hasPermission="system/Role:groupUpdate"
@click="editGroup(item.data)"
:disabled="item.id === 'default_group'"
>
编辑 编辑
</PermissionButton> </PermissionButton>
</div> </div>
</template> </template>
<template v-else><Ellipsis style="width: calc(100%-100px)">{{ item.name }}</Ellipsis></template> <template v-else>
<Ellipsis style="width: calc(100%-100px)">{{ item.name }}</Ellipsis>
</template>
</div>
<div v-else>
<j-input v-model:value="addName" @blur="() => saveGroup(item.data)" ref="inputRef"
:maxlength="64"></j-input>
</div> </div>
</template> </template>
</j-tree> </j-tree>
@ -95,7 +82,7 @@ const queryGroup = async(select?:Boolean,searchName?:string) =>{
} }
const addGroup = () => { const addGroup = () => {
addName.value = '' addName.value = ''
listData.value.unshift({ listData.value[0].children.unshift({
name: '', name: '',
edit: true, edit: true,
id: randomString() id: randomString()
@ -106,7 +93,7 @@ const addGroup = () =>{
} }
const saveGroup = async (data: any) => { const saveGroup = async (data: any) => {
if (addName.value === '') { if (addName.value === '') {
listData.value.shift() listData.value[0].children.shift()
} else { } else {
const saveData = { const saveData = {
name: addName.value, name: addName.value,
@ -146,7 +133,7 @@ const deleteGroup = async(id:string)=>{
} }
const editGroup = (data: any) => { const editGroup = (data: any) => {
addName.value = data.name addName.value = data.name
listData.value.forEach((item:any)=>{ listData.value[0].children.forEach((item: any) => {
if (item.id === data.id) { if (item.id === data.id) {
item.edit = true item.edit = true
} }
@ -160,14 +147,17 @@ onMounted(()=>{
.controls { .controls {
margin: 10px 0; margin: 10px 0;
} }
.treeItem { .treeItem {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.itemText { .itemText {
line-height: 32px; line-height: 32px;
max-width: 40% max-width: 40%
} }
} }
.listBox { .listBox {
margin: 10px 0; margin: 10px 0;
} }