144 lines
3.8 KiB
Vue
144 lines
3.8 KiB
Vue
<template>
|
|
<div>
|
|
<warning-bar
|
|
title="此功能仅用于创建角色和角色的many2many关系表，具体使用还须自己结合表实现业务，详情参考示例代码（客户示例）。此功能不建议使用，建议使用插件市场【组织管理功能（点击前往）】来管理资源权限。"
|
|
href="https://plugin.gin-vue-admin.com/#/layout/newPluginInfo?id=36"
|
|
/>
|
|
<div class="sticky top-0.5 z-10 bg-white my-4">
|
|
<el-button
|
|
class="float-left"
|
|
type="primary"
|
|
@click="all"
|
|
>全选</el-button>
|
|
<el-button
|
|
class="float-left"
|
|
type="primary"
|
|
@click="self"
|
|
>本角色</el-button>
|
|
<el-button
|
|
class="float-left"
|
|
type="primary"
|
|
@click="selfAndChildren"
|
|
>本角色及子角色</el-button>
|
|
<el-button
|
|
class="float-right"
|
|
type="primary"
|
|
@click="authDataEnter"
|
|
>确 定</el-button>
|
|
</div>
|
|
<div class="clear-both pt-4">
|
|
<el-checkbox-group
|
|
v-model="dataAuthorityId"
|
|
@change="selectAuthority"
|
|
>
|
|
<el-checkbox
|
|
v-for="(item,key) in authoritys"
|
|
:key="key"
|
|
:label="item"
|
|
>{{ item.authorityName }}</el-checkbox>
|
|
</el-checkbox-group>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { setDataAuthority } from '@/api/authority'
|
|
import WarningBar from '@/components/warningBar/warningBar.vue'
|
|
import { ref } from 'vue'
|
|
import { ElMessage } from 'element-plus'
|
|
|
|
defineOptions({
|
|
name: 'Datas'
|
|
})
|
|
|
|
const props = defineProps({
|
|
row: {
|
|
default: function() {
|
|
return {}
|
|
},
|
|
type: Object
|
|
},
|
|
authority: {
|
|
default: function() {
|
|
return []
|
|
},
|
|
type: Array
|
|
}
|
|
})
|
|
|
|
const authoritys = ref([])
|
|
const needConfirm = ref(false)
|
|
// 平铺角色
|
|
const roundAuthority = (authoritysData) => {
|
|
authoritysData && authoritysData.forEach(item => {
|
|
const obj = {}
|
|
obj.authorityId = item.authorityId
|
|
obj.authorityName = item.authorityName
|
|
authoritys.value.push(obj)
|
|
if (item.children && item.children.length) {
|
|
roundAuthority(item.children)
|
|
}
|
|
})
|
|
}
|
|
|
|
const dataAuthorityId = ref([])
|
|
const init = () => {
|
|
roundAuthority(props.authority)
|
|
props.row.dataAuthorityId && props.row.dataAuthorityId.forEach(item => {
|
|
const obj = authoritys.value && authoritys.value.filter(au => au.authorityId === item.authorityId) && authoritys.value.filter(au => au.authorityId === item.authorityId)[0]
|
|
dataAuthorityId.value.push(obj)
|
|
})
|
|
}
|
|
|
|
init()
|
|
|
|
// 暴露给外层使用的切换拦截统一方法
|
|
const enterAndNext = () => {
|
|
authDataEnter()
|
|
}
|
|
|
|
const emit = defineEmits(['changeRow'])
|
|
const all = () => {
|
|
dataAuthorityId.value = [...authoritys.value]
|
|
emit('changeRow', 'dataAuthorityId', dataAuthorityId.value)
|
|
needConfirm.value = true
|
|
}
|
|
const self = () => {
|
|
dataAuthorityId.value = authoritys.value.filter(item => item.authorityId === props.row.authorityId)
|
|
emit('changeRow', 'dataAuthorityId', dataAuthorityId.value)
|
|
needConfirm.value = true
|
|
}
|
|
const selfAndChildren = () => {
|
|
const arrBox = []
|
|
getChildrenId(props.row, arrBox)
|
|
dataAuthorityId.value = authoritys.value.filter(item => arrBox.indexOf(item.authorityId) > -1)
|
|
emit('changeRow', 'dataAuthorityId', dataAuthorityId.value)
|
|
needConfirm.value = true
|
|
}
|
|
const getChildrenId = (row, arrBox) => {
|
|
arrBox.push(row.authorityId)
|
|
row.children && row.children.forEach(item => {
|
|
getChildrenId(item, arrBox)
|
|
})
|
|
}
|
|
// 提交
|
|
const authDataEnter = async() => {
|
|
const res = await setDataAuthority(props.row)
|
|
if (res.code === 0) {
|
|
ElMessage({ type: 'success', message: '资源设置成功' })
|
|
}
|
|
}
|
|
|
|
// 选择
|
|
const selectAuthority = () => {
|
|
emit('changeRow', 'dataAuthorityId', dataAuthorityId.value)
|
|
needConfirm.value = true
|
|
}
|
|
|
|
defineExpose({
|
|
enterAndNext,
|
|
needConfirm
|
|
})
|
|
|
|
</script>
|