124 lines
2.7 KiB
Vue
124 lines
2.7 KiB
Vue
<template>
|
|
<div>
|
|
<div class="clearflex">
|
|
<el-button class="fl-right" size="small" type="primary" @click="authApiEnter">确 定</el-button>
|
|
</div>
|
|
<el-tree
|
|
ref="apiTree"
|
|
:data="apiTreeData"
|
|
:default-checked-keys="apiTreeIds"
|
|
:props="apiDefaultProps"
|
|
default-expand-all
|
|
highlight-current
|
|
node-key="onlyId"
|
|
show-checkbox
|
|
@check="nodeChange"
|
|
/>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
name: 'Apis',
|
|
}
|
|
</script>
|
|
|
|
<script setup>
|
|
import { getAllApis } from '@/api/api'
|
|
import { UpdateCasbin, getPolicyPathByAuthorityId } from '@/api/casbin'
|
|
import { ref } from 'vue'
|
|
import { ElMessage } from 'element-plus'
|
|
const props = defineProps({
|
|
row: {
|
|
default: function() {
|
|
return {}
|
|
},
|
|
type: Object
|
|
}
|
|
})
|
|
|
|
const apiDefaultProps = ref({
|
|
children: 'children',
|
|
label: 'description'
|
|
})
|
|
|
|
const apiTreeData = ref([])
|
|
const apiTreeIds = ref([])
|
|
const activeUserId = ref('')
|
|
const init = async() => {
|
|
const res2 = await getAllApis()
|
|
const apis = res2.data.apis
|
|
|
|
apiTreeData.value = buildApiTree(apis)
|
|
const res = await getPolicyPathByAuthorityId({
|
|
authorityId: props.row.authorityId
|
|
})
|
|
activeUserId.value = props.row.authorityId
|
|
apiTreeIds.value = []
|
|
res.data.paths && res.data.paths.forEach(item => {
|
|
apiTreeIds.value.push('p:' + item.path + 'm:' + item.method)
|
|
})
|
|
}
|
|
|
|
init()
|
|
|
|
const needConfirm = ref(false)
|
|
const nodeChange = () => {
|
|
needConfirm.value = true
|
|
}
|
|
// 暴露给外层使用的切换拦截统一方法
|
|
const enterAndNext = () => {
|
|
authApiEnter()
|
|
}
|
|
|
|
// 创建api树方法
|
|
const buildApiTree = (apis) => {
|
|
const apiObj = {}
|
|
apis &&
|
|
apis.forEach(item => {
|
|
item.onlyId = 'p:' + item.path + 'm:' + item.method
|
|
if (Object.prototype.hasOwnProperty.call(apiObj, item.apiGroup)) {
|
|
apiObj[item.apiGroup].push(item)
|
|
} else {
|
|
Object.assign(apiObj, { [item.apiGroup]: [item] })
|
|
}
|
|
})
|
|
const apiTree = []
|
|
for (const key in apiObj) {
|
|
const treeNode = {
|
|
ID: key,
|
|
description: key + '组',
|
|
children: apiObj[key]
|
|
}
|
|
apiTree.push(treeNode)
|
|
}
|
|
return apiTree
|
|
}
|
|
|
|
// 关联关系确定
|
|
const apiTree = ref(null)
|
|
const authApiEnter = async() => {
|
|
const checkArr = apiTree.value.getCheckedNodes(true)
|
|
var casbinInfos = []
|
|
checkArr && checkArr.forEach(item => {
|
|
var casbinInfo = {
|
|
path: item.path,
|
|
method: item.method
|
|
}
|
|
casbinInfos.push(casbinInfo)
|
|
})
|
|
const res = await UpdateCasbin({
|
|
authorityId: activeUserId.value,
|
|
casbinInfos
|
|
})
|
|
if (res.code === 0) {
|
|
ElMessage({ type: 'success', message: 'api设置成功' })
|
|
}
|
|
}
|
|
|
|
defineExpose({
|
|
needConfirm,
|
|
enterAndNext
|
|
})
|
|
|
|
</script>
|