8 changed files with 712 additions and 101 deletions
@ -0,0 +1,36 @@ |
|||
import { defineStore } from 'pinia' |
|||
import { ref} from 'vue'; |
|||
import request from "@/utils/request"; |
|||
|
|||
export const useOrgMemberStore = defineStore('orgMember', () => { |
|||
interface OrgMemberItem { |
|||
id: string; |
|||
label: string; |
|||
children?:OrgMemberItem[]; |
|||
} |
|||
|
|||
const listMap = ref<Record<string, string>>({}) |
|||
const dataTree = ref<OrgMemberItem>({ id: '', label: '', children: [] }) |
|||
|
|||
async function init() { |
|||
await request({ |
|||
url: "/javasys/lowCode/transfer/getOrgAndManTree", |
|||
method: "post", |
|||
}).then((response) => { |
|||
// assuming response.data is an array of OrgMemberItem
|
|||
dataTree.value=response.data |
|||
handleChildren(response.data.children) |
|||
}); |
|||
} |
|||
|
|||
function handleChildren(childs:any[]){ |
|||
childs.forEach(item => { |
|||
listMap.value[item.id] = item.label; |
|||
if(item.children){ |
|||
handleChildren(item.children) |
|||
} |
|||
}); |
|||
} |
|||
init() |
|||
return { listMap,dataTree } |
|||
}) |
|||
@ -0,0 +1,348 @@ |
|||
<script lang="ts" setup> |
|||
import { |
|||
resetSpaceMatterPermit, |
|||
getSpaceMemberList, |
|||
addSpaceManager, |
|||
updateSpaceMetterPermit, |
|||
} from '@/api/hr/people/share_ctrol' |
|||
|
|||
import { ElDialog, ElMessageBox,ElStep,TreeInstance} from 'element-plus'; |
|||
import { useOrgMemberStore } from "@/store/modules/orgMember"; |
|||
const props = withDefaults(defineProps<{ |
|||
uid:string, //当前用户的uuid |
|||
uuid:string, //文档的uuid |
|||
suid:string, //空间的创建者 |
|||
spaceid:string, //空间uuid |
|||
closeFunc:(refresh?:boolean)=>void, //父级只需销毁组件 |
|||
}>(),{}) |
|||
|
|||
const orgMembers = useOrgMemberStore() |
|||
const spacePermit=ref<{id:number,data:string,matterUid:string}>({}) //权限 |
|||
const treeRef=ref<TreeInstance>() //tree组件的引用，为了实现初始选中状态 |
|||
const managerMode=ref(false) |
|||
const managers=ref<string[]>([]) |
|||
|
|||
let resultPermits: Record<string, number> = {}; |
|||
|
|||
interface Tree { |
|||
id: string |
|||
label:string |
|||
parentId?:string |
|||
indeterminate?:boolean, |
|||
radio?:number[]; |
|||
children?: Tree[] |
|||
ismanager?:boolean, |
|||
} |
|||
|
|||
const dataSource = ref<Tree[]>([]) |
|||
|
|||
//权限组件保存 |
|||
async function onSavePermChange(){ |
|||
resultPermits={} |
|||
|
|||
// 管理员设置 |
|||
if (managerMode.value){ |
|||
managers.value=[] //先清空 |
|||
dataSource.value.forEach(item=>{ |
|||
if(item.ismanager){ |
|||
managers.value.push("p0"+item.id) |
|||
} |
|||
|
|||
if(item.children) collectManager(item) |
|||
}) |
|||
|
|||
await addSpaceManager(btoa(props.uid),{ |
|||
space:props.spaceid, |
|||
mangers:managers.value.join("|") |
|||
}).then(resp=>{ |
|||
console.log(resp) |
|||
}) |
|||
props.closeFunc() |
|||
return |
|||
} |
|||
|
|||
dataSource.value.forEach(item=>{ |
|||
if(item.radio&&item.radio.length>0){ |
|||
if(item.indeterminate) { |
|||
item.radio[0]+=10 |
|||
} |
|||
resultPermits[item.id]=item.radio[0] |
|||
} |
|||
|
|||
if(item.children) collectNodePermits(item) |
|||
}) |
|||
|
|||
spacePermit.value.data=JSON.stringify(resultPermits) |
|||
|
|||
updateSpaceMetterPermit(btoa(props.uid),{ |
|||
space:props.spaceid, |
|||
matter:props.uuid, |
|||
permits:spacePermit.value |
|||
}).then(resp=>{ |
|||
console.log(resp) |
|||
}) |
|||
props.closeFunc() |
|||
} |
|||
|
|||
function collectManager(node:Tree){ |
|||
node.children?.forEach(ele => { |
|||
if(ele.ismanager){ |
|||
managers.value.push("p0"+ele.id) |
|||
} |
|||
|
|||
if(ele.children) collectManager(ele) |
|||
}); |
|||
} |
|||
|
|||
//去遍历查找特殊设置的节点，并保存 |
|||
function collectNodePermits(node:Tree){ |
|||
node.children?.forEach(ele => { |
|||
if(ele.radio&&ele.radio.length>0){ |
|||
if(ele.indeterminate) { |
|||
ele.radio[0]+=10 |
|||
} |
|||
resultPermits[ele.id]=ele.radio[0] |
|||
} |
|||
|
|||
if(ele.children){ |
|||
collectNodePermits(ele) |
|||
} |
|||
}); |
|||
} |
|||
|
|||
|
|||
//递归修改子级元素 |
|||
function onGroupValueChange(node:Tree, val:number[]){ |
|||
if(node.indeterminate) node.indeterminate=false; |
|||
node.children?.forEach(ele => { |
|||
ele.radio=val |
|||
if(ele.children){ |
|||
onGroupValueChange(ele,val) |
|||
} |
|||
}); |
|||
if(node.parentId){ |
|||
updateParentNode(node) |
|||
} |
|||
} |
|||
|
|||
//递归更新父级 |
|||
function updateParentNode(node:Tree){ |
|||
if(node.parentId){ |
|||
|
|||
const pnode = treeRef.value?.getNode(node.parentId); |
|||
if(pnode){ |
|||
const tdata=pnode.data as Tree |
|||
if (tdata.children?.every(ele=>{ |
|||
if(ele.indeterminate) return !ele.indeterminate;//注意这里有个取反计算 |
|||
|
|||
if(ele.radio?.length==0) return ele.radio.length==tdata.radio?.length; |
|||
return ele.radio?.length==tdata.radio?.length && ele.radio[0]==tdata.radio[0] |
|||
})) { |
|||
tdata.indeterminate=false |
|||
}else{ |
|||
tdata.indeterminate=true |
|||
} |
|||
|
|||
updateParentNode(tdata) |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
|
|||
//重置当前文档权限 |
|||
function delMatterPermit(matter_uuid:string){ |
|||
resetSpaceMatterPermit(btoa(props.uid),{ |
|||
space:props.spaceid, |
|||
matter:matter_uuid, |
|||
}).then(()=>{ |
|||
refreshSpaceData() |
|||
}) |
|||
} |
|||
|
|||
function onShowManagers(){ |
|||
managers.value.forEach(item=>{ |
|||
const node = treeRef.value?.getNode(item.replace("p0","")); |
|||
if(node && node.data){ |
|||
node.data.ismanager=true |
|||
} |
|||
}) |
|||
} |
|||
|
|||
function refreshSpaceData(){ |
|||
getSpaceMemberList( |
|||
btoa(props.uid), |
|||
{space:props.spaceid,matter:props.uuid} |
|||
).then(resp=>{ |
|||
resp.data?.dprts?.forEach(item=>{ |
|||
for(let data of dataSource.value){ |
|||
if (data.id==item) return; |
|||
if (checkNode(item,data)) return; |
|||
} |
|||
|
|||
addNode(item,orgMembers.dataTree) |
|||
}); |
|||
|
|||
resp.data?.members?.forEach(item=>{ |
|||
const mid=item.replace("p0","") |
|||
for(let data of dataSource.value){ |
|||
if(checkNode(mid,data)) return; |
|||
} |
|||
|
|||
dataSource.value.push({id:mid,label:orgMembers.listMap[mid],radio:[2]}) |
|||
}); |
|||
|
|||
managers.value=resp.data?.managers.split("|") |
|||
spacePermit.value.id=resp.data?.permits.ID |
|||
spacePermit.value.matterUid=resp.data?.permits.MatterUuid |
|||
spacePermit.value.data=resp.data.permits.data!="" ? resp.data.permits.data : "{}" |
|||
|
|||
|
|||
nextTick(() => { |
|||
const permitJson = JSON.parse(spacePermit.value.data) //object |
|||
Object.keys(permitJson).forEach(key=>{ |
|||
const node = treeRef.value?.getNode(key); |
|||
if(node && node.data){ |
|||
if(permitJson[key]>10){ |
|||
node.data.radio = [permitJson[key]%10] |
|||
node.data.indeterminate=true |
|||
}else{ |
|||
node.data.radio = [permitJson[key]] |
|||
} |
|||
} |
|||
}) |
|||
}); |
|||
|
|||
}) |
|||
} |
|||
|
|||
function addNode(key:string,node:Tree){ |
|||
node.children?.forEach(ele => { |
|||
if(ele.id==key){ |
|||
const eleClone=structuredClone(toRaw(ele)) //这里ele是Proxy，无法clone，所以要toRaw拿到原始object |
|||
eleClone.radio=[2] |
|||
eleClone.parentId=ele.parentId |
|||
dataSource.value.push(eleClone) //{id:ele.id,label:ele.label,radio:2,stage:level,children:ele.children} |
|||
return |
|||
} |
|||
if(ele.children){ |
|||
addNode(key,ele) |
|||
} |
|||
}); |
|||
} |
|||
|
|||
function checkNode(key:string,node:Tree):boolean{ |
|||
for (const child of node.children||[]) { |
|||
if(child.id==key){ |
|||
return true |
|||
} |
|||
if(child.children){ |
|||
//这里不能直接return，因为return后，就中断了for循环，但是true的情况下可以直接return |
|||
if(checkNode(key,child)) return true; |
|||
} |
|||
} |
|||
|
|||
return false; |
|||
} |
|||
|
|||
|
|||
onMounted(()=>{ |
|||
refreshSpaceData() |
|||
}) |
|||
|
|||
</script> |
|||
|
|||
<template> |
|||
<el-dialog :model-value="true" :style="{'max-height': '750px'}" v-on:close="closeFunc()"> |
|||
<template #header> |
|||
<el-button link @click="managerMode=false;">文档权限管理</el-button> |
|||
<el-button v-if="spacePermit.matterUid==spaceid&&uid==suid" link @click="managerMode=true; onShowManagers()">管理员管理</el-button> |
|||
</template> |
|||
|
|||
<div v-if="uuid==spacePermit.matterUid&&uuid!=spaceid" class="tips">当前文档存在定制权限，与空间权限不一致。<el-button size="small" @click="delMatterPermit(uuid)">恢复</el-button></div> |
|||
<div class="tree-node" style="width:93%;font-weight: bold;position: sticky;"> |
|||
<span style="width: 200px;text-align: center;">名称</span> |
|||
<div v-if="managerMode" class="buttons"> |
|||
<span>管理员</span> |
|||
</div> |
|||
<div v-else class="buttons"> |
|||
<span>禁止</span> |
|||
<span>仅预览</span> |
|||
<span>可下载</span> |
|||
<span>上传下载</span> |
|||
<span>编辑</span> |
|||
</div> |
|||
</div> |
|||
<div class="tablelist"> |
|||
<el-tree |
|||
ref="treeRef" |
|||
:data="dataSource" |
|||
node-key="id" |
|||
default-expand-all |
|||
:expand-on-click-node="false" |
|||
> |
|||
<template #default="{ node, data }"> |
|||
<div class="tree-node"> |
|||
<span>{{ node.label }}</span> |
|||
|
|||
<div v-if="managerMode" class="buttons"> |
|||
<el-checkbox v-if="!data.children" v-model="data.ismanager" /> |
|||
</div> |
|||
<div v-else class="buttons"> |
|||
<el-checkbox-group :min="0" :max="1" v-model="data.radio" @change="(val)=>onGroupValueChange(data,val)"> |
|||
<el-checkbox key="forbid" :indeterminate="data.indeterminate" :value="0" /> |
|||
<el-checkbox key="view" :indeterminate="data.indeterminate" :value="1" /> |
|||
<el-checkbox key="download" :indeterminate="data.indeterminate" :value="2" /> |
|||
<el-checkbox key="updown" :indeterminate="data.indeterminate" :value="3" /> |
|||
<el-checkbox key="edit" :indeterminate="data.indeterminate" :value="4" /> |
|||
</el-checkbox-group> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
</el-tree> |
|||
</div> |
|||
|
|||
<template #footer> |
|||
<div class="dialog-footer"> |
|||
<el-button @click="closeFunc()">取消</el-button> |
|||
<el-button type="primary" @click="onSavePermChange">保存</el-button> |
|||
</div> |
|||
</template> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<style lang="scss" scoped> |
|||
.tablelist{ |
|||
width: 94%; |
|||
height: 565px; |
|||
overflow-y: scroll |
|||
} |
|||
.tips{ |
|||
display: flex; |
|||
align-items: center; |
|||
margin: 5px; |
|||
padding: 5px 32px; |
|||
background-color: #d7d1ca; |
|||
} |
|||
.tree-node{ |
|||
display: flex; |
|||
flex-direction: row; |
|||
width: 100%; |
|||
align-items: center; |
|||
.buttons{ |
|||
margin: 0 50px 0 auto; |
|||
span{ |
|||
width: 26px; |
|||
margin: 0 7px; |
|||
} |
|||
} |
|||
} |
|||
.el-checkbox{ |
|||
width: 26px; |
|||
} |
|||
|
|||
.el-tree{ |
|||
/* 让整个弹出窗口位置更高一些*/ |
|||
--el-tree-node-content-height:33px; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue