<template>
|
<div>
|
<b-card header-tag="h6" class="mb-2" >
|
<b-form-group>
|
<b-input-group style="width: 300px;">
|
<b-form-input autocomplete="off" placeholder="请输入关键字" @change.native="handleSearchTree" v-model="searchTreeValue" />
|
<b-btn class="ml10" variant="primary" @click="handleSearchTree"><span class="fas fa-search" @click="handleSearchTree"></span> 搜 索</b-btn>
|
</b-input-group>
|
</b-form-group>
|
<div>
|
<treeTable v-if="treeList.length" :expandAll="true" border :data="treeList" :columns="columns">
|
<TableColumn label="事件">
|
<template slot-scope="scope">
|
<fButton
|
size="sm"
|
type="link"
|
@click.native="handleAdd(scope.row)"
|
authority="sys:project:add"
|
>
|
添加下一级
|
</fButton>
|
<fButton
|
v-show="isUser(scope.row)"
|
size="sm"
|
type="link"
|
@click.native="handleSettingPermissions(scope.row)"
|
authority="sys:project:permission"
|
>
|
权限设置
|
</fButton>
|
<fButton
|
size="sm"
|
type="link"
|
@click.native="handleEdit(scope.row)"
|
authority="sys:project:edit"
|
>
|
编辑
|
</fButton>
|
<fButton
|
size="sm"
|
type="link"
|
@click.native="handleDel(scope.row.id)"
|
authority="sys:project:delete"
|
>
|
删除
|
</fButton>
|
</template>
|
</TableColumn>
|
</treeTable>
|
</div>
|
</b-card>
|
<ProjectEdit
|
ref="projectEdit"
|
:treeList="treeList"
|
:id="currentItem"
|
:isEdit="isEdit"
|
@update="init"
|
/>
|
<SetPermissions
|
ref="setPermissions"
|
:rolesList="rolesList"
|
:rolePermission="rolePermission"
|
@submit="handleSubmitPermission"
|
/>
|
</div>
|
</template>
|
|
<script>
|
import { TableColumn } from 'element-ui'
|
import treeTable from '@/components/TreeTable'
|
import ProjectEdit from './ProjectEdit'
|
import SetPermissions from '../../../components/SetPermissions/SetPermissions'
|
import { isOrg } from '../../../components/common/util.js'
|
import { getRolesTree } from '../../../server/role'
|
import {
|
getOrgDel,
|
getOrgTree,
|
getOrgTypeAll,
|
getPermission,
|
savePermission
|
} from '../../../server/project.js'
|
|
let treeListComputed = []
|
|
export default {
|
data() {
|
return {
|
isEdit: false,
|
rolesList: [],
|
rolePermission: [],
|
userInfo: {},
|
currentItem: {},
|
state: false,
|
searchTreeValue: '',
|
treeList: [],
|
typeListAll: [],
|
columns: [{
|
text: '名称',
|
value: 'name',
|
width: '400'
|
}, {
|
text: '类别',
|
value: 'typeVal',
|
width: '120'
|
}, {
|
text: '负责人',
|
value: 'master',
|
width: '120'
|
}, {
|
text: '手机号',
|
value: 'phone',
|
width: '200'
|
}, {
|
text: '联系方式',
|
value: 'phone'
|
}]
|
}
|
},
|
computed: {
|
orgId() {
|
return this.$store.getters.basicUserInfo.orgId
|
}
|
},
|
async mounted() {
|
await this._getOrgTypeAll()
|
await this.init()
|
treeListComputed = [...this.treeList]
|
},
|
methods: {
|
// * 初始化
|
async init() {
|
let res = await getOrgTree({
|
orgById: this.orgId
|
})
|
if (res) {
|
let arr = [...res]
|
let _this = this
|
// eslint-disable-next-line
|
function recursion (param) {
|
if (!param.length) {
|
return
|
}
|
param.forEach(item => {
|
let obj = _this.typeListAll.find(t => t.value === item.type)
|
item.typeVal = obj && obj.text
|
if (item.child && item.child.length) {
|
recursion(item.child)
|
}
|
})
|
}
|
recursion(arr)
|
this.treeList = [...arr]
|
treeListComputed = [...arr]
|
}
|
},
|
// * 获取机构类型数据
|
async _getOrgTypeAll() {
|
let res = await getOrgTypeAll({
|
orgId: this.orgId,
|
type: 'ORG_TYPE'
|
})
|
if (res && res.code - 0 === 0) {
|
let arr = []
|
res.data && res.data.length && res.data.map(item => {
|
arr.push({
|
text: item.lable,
|
value: item.value
|
})
|
})
|
this.typeListAll = [...arr]
|
}
|
},
|
// * 获取权限树
|
async fetchRolesList() {
|
let res = await getRolesTree()
|
if (res) {
|
this.rolesList = res
|
}
|
},
|
// * 删除
|
handleDel(id) {
|
this.$swal({
|
title: '确定删除吗？',
|
type: 'warning',
|
showCancelButton: true,
|
allowOutsideClick: true,
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
closeOnConfirm: true
|
},
|
async () => {
|
let res = await getOrgDel({
|
id
|
})
|
if (res && res.code - 0 === 0) {
|
this.$toast({
|
type: 'success',
|
message: '删除成功!'
|
})
|
this.init()
|
} else {
|
this.$toast({
|
type: 'error',
|
message: `${res && res.message ? res.message : '删除失败'}`
|
})
|
}
|
})
|
},
|
// * 添加
|
handleAdd(param) {
|
this.isEdit = false
|
this.$refs.projectEdit.showModel()
|
this.currentItem = param
|
},
|
// * 编辑
|
handleEdit(param) {
|
this.isEdit = true
|
this.$refs.projectEdit.showModel()
|
this.currentItem = param
|
},
|
// * 是否有权限去设置权限
|
isUser(param) {
|
if (param.partack - 0) {
|
if (isOrg(param.type)) {
|
return true
|
} else {
|
return false
|
}
|
} else {
|
return false
|
}
|
},
|
// * 获取用户权限回显
|
async fetchPermissions({ orgId, userId }) {
|
const res = await getPermission({
|
orgId,
|
userId
|
})
|
if (res) {
|
this.rolePermission = res
|
}
|
},
|
// * 打开选择权限弹窗
|
handleSettingPermissions(param) {
|
if (param.revJson) {
|
const revJson = JSON.parse(param.revJson)
|
const userInfo = revJson.admin
|
if (!userInfo) {
|
this.$toast({
|
type: 'error',
|
message: '此机构暂无用户信息'
|
})
|
return
|
}
|
this.userInfo = userInfo
|
this.fetchRolesList()
|
this.$refs.setPermissions.showModel()
|
this.currentItem = param
|
this.fetchPermissions({ orgId: param.id, userId: userInfo.userId })
|
} else {
|
this.$toast({
|
type: 'error',
|
message: '此机构暂无用户信息'
|
})
|
}
|
},
|
// * 保存所选全选
|
async handleSubmitPermission(menuIds) {
|
const res = await savePermission({
|
orgId: this.currentItem.id,
|
userId: this.userInfo.userId,
|
orgName: this.currentItem.name,
|
menuIds
|
})
|
if (res.code - 0 === 0) {
|
this.$toast({
|
type: 'success',
|
message: '设置成功'
|
})
|
this.$refs.setPermissions.hideModel()
|
} else {
|
this.$toast({
|
type: 'error',
|
message: '设置失败'
|
})
|
}
|
},
|
// * 搜索组织机构树
|
filterNode (value, data) {
|
if (!value) return true
|
return data.name.indexOf(value) !== -1
|
},
|
handleSearchTree () {
|
if (this.searchTreeValue === '') {
|
this.treeList = treeListComputed
|
} else {
|
let arr = []
|
this._filter({
|
arr: this.treeList,
|
key: 'name',
|
val: this.searchTreeValue
|
}, res => {
|
arr.push(res)
|
})
|
this.treeList = [...arr]
|
}
|
},
|
// * 轮子
|
_filter(param = {}, fn = () => {}) {
|
const { arr, key, val } = param
|
if (arr && !arr.length) return
|
if (key === '' || val === '') return
|
const patt = new RegExp(val)
|
arr.map(item => {
|
if (patt.test(item[key])) {
|
if (item.child) {
|
let { child, ...payload } = item
|
fn(payload)
|
} else {
|
fn(item)
|
}
|
}
|
if (item.child && item.child.length) {
|
this._filter({
|
key,
|
val,
|
arr: item.child
|
}, fn)
|
}
|
})
|
}
|
},
|
components: {
|
treeTable,
|
TableColumn,
|
ProjectEdit,
|
SetPermissions
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.project-tree {
|
button {
|
display: none;
|
}
|
&:hover button {
|
display: inline-block;
|
}
|
}
|
</style>
|
