<template>
|
<a-spin :spinning="spinning">
|
<a-transfer
|
class="transfer-container"
|
:data-source="dataSource"
|
show-search
|
:list-style="{flex:1,height: '500px'}"
|
:titles="['未分配用户', '已分配用户']"
|
:operations="['分配用户', '移除用户']"
|
:target-keys="targetKeys"
|
:render="item => `${item.realname}`"
|
@change="handleChange"
|
:rowKey="record => record.id"
|
>
|
<span slot="notFoundContent">暂无数据</span>
|
</a-transfer>
|
</a-spin>
|
</template>
|
|
<script>
|
import dncApi from '@/api/dnc'
|
|
export default {
|
name: 'UserPermissionTransfer',
|
components: {},
|
props: {
|
currentTreeNodeInfo: {
|
type: Object
|
},
|
dataSource: {
|
type: Array
|
},
|
isAssignSonNode: {
|
type: Boolean
|
}
|
},
|
data() {
|
return {
|
targetKeys: [],
|
spinning: false
|
}
|
},
|
methods: {
|
getHasPermissionUserByApi() {
|
const that = this
|
that.spinning = true
|
dncApi.getHasPermissionUserApi(this.currentTreeNodeInfo)
|
.then(res => {
|
if (res.success) this.targetKeys = res.list.map(item => item.id)
|
})
|
.finally(() => {
|
that.spinning = false
|
})
|
},
|
|
handleChange(targetKeys, direction, moveKeys) {
|
const { currentTreeNodeInfo: { type, id }, isAssignSonNode, $notification, dataSource } = this
|
const that = this
|
let method
|
const params = {
|
treeNodeType: type,
|
treeNodeId: id,
|
isAssignSonNode: isAssignSonNode ? 1 : 2,
|
userIdArray: moveKeys
|
}
|
console.log('params--------------------------', params)
|
console.log(targetKeys, direction, moveKeys)
|
if (direction === 'right') {
|
method = dncApi.assignPermissionToUser
|
} else {
|
method = dncApi.removePermissionFromUser
|
}
|
that.spinning = true
|
method(params)
|
.then(res => {
|
if (res.success) {
|
$notification.success({
|
message: '消息',
|
description: res.message
|
})
|
this.targetKeys = targetKeys
|
} else {
|
$notification.error({
|
message: '消息',
|
description: res.message
|
})
|
}
|
})
|
.catch(err => {
|
$notification.error({
|
message: '消息',
|
description: err.message
|
})
|
})
|
.finally(() => {
|
that.spinning = false
|
})
|
}
|
}
|
}
|
</script>
|
|
<style scoped lang="less">
|
.transfer-container {
|
display: flex;
|
align-items: center;
|
}
|
</style>
|
