<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.departName}`"
|
@change="handleChange"
|
:rowKey="record => record.departId"
|
>
|
|
<span slot="notFoundContent">暂无数据</span>
|
</a-transfer>
|
</a-spin>
|
</template>
|
|
<script>
|
import dncApi from '@/api/dnc'
|
|
export default {
|
name: 'DepartPermissionTransfer',
|
components: {},
|
props: {
|
currentTreeNodeInfo: {
|
type: Object
|
},
|
dataSource: {
|
type: Array
|
},
|
isAssignSonNode: {
|
type: Boolean
|
}
|
},
|
data() {
|
return {
|
targetKeys: [],
|
spinning: false
|
}
|
},
|
methods: {
|
getHasPermissionDepartByApi() {
|
dncApi.getHasPermissionDepartApi(this.currentTreeNodeInfo)
|
.then(res => {
|
if (res.success) this.targetKeys = res.list.map(item => item.departId)
|
})
|
},
|
|
handleChange(targetKeys, direction, moveKeys) {
|
const { currentTreeNodeInfo: { type, id }, isAssignSonNode, $notification } = this
|
const that = this
|
let method
|
const params = {
|
treeNodeType: type,
|
treeNodeId: id,
|
isAssignSonNode: isAssignSonNode ? 1 : 2,
|
departIdArray: moveKeys
|
}
|
console.log('params--------------------------', params)
|
console.log(targetKeys, direction, moveKeys)
|
if (direction === 'right') {
|
method = dncApi.assignPermissionToDepart
|
} else {
|
method = dncApi.removePermissionFromDepart
|
}
|
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>
|
