修改选人组件

This commit is contained in:
sunFlower
2022-10-11 09:31:38 +08:00
parent 8b26816ce2
commit e6dade0a27
3 changed files with 589 additions and 592 deletions
@@ -32,39 +32,39 @@
v-model="searchModel" @search="onSearch"/> v-model="searchModel" @search="onSearch"/>
<div class="drawer-content"> <div class="drawer-content">
<JLoading :loading="loading">{{$t('dataLoading')}}</JLoading> <JLoading :loading="loading">{{$t('dataLoading')}}</JLoading>
<virtualNodeTree <!-- <virtualNodeTree-->
v-if="treeVisible"
ref="virtualNodeTreeRef"
:keeps="40"
show-checkbox
v-model="checkboxList"
class="treeWrap"
:defaultCheckedKeys="defaultCheckedKeys"
:defaultExpandAll="defaultExpandAll"
:check-strictly="false"
node-key="id"
@check="handleCheckChange"
@check-change="checkChange"
:data.sync="gData">
<span slot-scope="{ data }">
<span :class="{'active':data.color ? true:false}">
{{ data.title }}
</span>
</span>
</virtualNodeTree>
<!-- <a-tree-->
<!-- style="margin-bottom: 60px;height: 600px"-->
<!-- v-if="treeVisible"--> <!-- v-if="treeVisible"-->
<!-- checkable--> <!-- ref="virtualNodeTreeRef"-->
<!-- checkStrictly--> <!-- :keeps="40"-->
<!-- :loading="loading"--> <!-- show-checkbox-->
<!-- :tree-data="gData"--> <!-- v-model="checkboxList"-->
<!-- @check="onCheck"--> <!-- class="treeWrap"-->
<!-- @expand="onExpand"--> <!-- :defaultCheckedKeys="defaultCheckedKeys"-->
<!-- v-model:checkedKeys="defaultCheckedKeys"--> <!-- :defaultExpandAll="defaultExpandAll"-->
<!-- :defaultExpandedKeys="defaultExpandedKeys"--> <!-- :check-strictly="false"-->
<!-- >--> <!-- node-key="id"-->
<!-- </a-tree>--> <!-- @check="handleCheckChange"-->
<!-- @check-change="checkChange"-->
<!-- :data.sync="gData">-->
<!-- <span slot-scope="{ data }">-->
<!-- <span :class="{'active':data.color ? true:false}">-->
<!-- {{ data.title }}-->
<!-- </span>-->
<!-- </span>-->
<!-- </virtualNodeTree>-->
<a-tree
style="margin-bottom: 60px;height: 600px"
v-if="treeVisible"
checkable
checkStrictly
:loading="loading"
:tree-data="gData"
@check="onCheck"
@expand="onExpand"
v-model:checkedKeys="defaultCheckedKeys"
:defaultExpandedKeys="defaultExpandedKeys"
>
</a-tree>
</div> </div>
<div class="drawer-bootom-button"> <div class="drawer-bootom-button">
<a-button @click="handleCancel" style="margin-right: 16px">{{$t('cancel')}}</a-button> <a-button @click="handleCancel" style="margin-right: 16px">{{$t('cancel')}}</a-button>
@@ -114,137 +114,137 @@
}, },
methods: { methods: {
checkChange(val, checked, indeterminate) { // checkChange(val, checked, indeterminate) {
if (!checked && this.searchData) { // if (!checked && this.searchData) {
this.userName = this.userName.filter(res => { // this.userName = this.userName.filter(res => {
return res != val.title // return res != val.title
}) // })
this.userIds = this.userIds.filter(res => { // this.userIds = this.userIds.filter(res => {
return res != val.id // return res != val.id
}) // })
for (let i = 0; i < this.userIds.length; i++) { // for (let i = 0; i < this.userIds.length; i++) {
if (this.userIds[i] == val.parentId) { // if (this.userIds[i] == val.parentId) {
this.userIds.splice(i, 1) // this.userIds.splice(i, 1)
this.userName.splice(i, 1) // this.userName.splice(i, 1)
i-- // i--
} // }
} // }
} else if (checked && this.searchData) { // } else if (checked && this.searchData) {
this.userName.push(val.title) // this.userName.push(val.title)
this.userIds.push(val.id) // this.userIds.push(val.id)
} // }
}, // },
handleCheckChange(val, data, checked) { // handleCheckChange(val, data, checked) {
if (!this.searchData) { // if (!this.searchData) {
this.userName = [] // this.userName = []
this.userIds = [] // this.userIds = []
if (data.checkedNodes && data.checkedNodes.length > 0) { // if (data.checkedNodes && data.checkedNodes.length > 0) {
data.checkedNodes.forEach(res => { // data.checkedNodes.forEach(res => {
this.userName.push(res.title) // this.userName.push(res.title)
this.userIds.push(res.id) // this.userIds.push(res.id)
}) // })
} // }
} // }
}, // },
standardClick() { standardClick() {
this.treeVisible = false this.treeVisible = false
// this.departId = '' this.departId = ''
this.searchModel = '' this.searchModel = ''
this.searchData = '' this.searchData = ''
// this.userIds = [] this.userIds = []
// this.userName = [] this.userName = []
// this.queryDepartUserTreeList(1) this.queryDepartUserTreeList(1)
this.visible = true this.visible = true
let gData = localStorage.getItem('gData') // let gData = localStorage.getItem('gData')
if (gData) { // if (gData) {
let dataList = JSON.parse(gData) // let dataList = JSON.parse(gData)
if (!this.selectDepartment) { // if (!this.selectDepartment) {
dataList.forEach(res => { // dataList.forEach(res => {
if (res.type == 'Depart') { // if (res.type == 'Depart') {
res.disabled = true // res.disabled = true
} // }
}) // })
} // }
this.dataList = this.toTree(dataList) // this.dataList = this.toTree(dataList)
} // }
setTimeout(() => { // setTimeout(() => {
if (gData) { // if (gData) {
this.gData = this.dataList // this.gData = this.dataList
this.gData = [...this.gData] // this.gData = [...this.gData]
// this.treeVisible = true // // this.treeVisible = true
if (this.personneQuery[this.query.db_field_name + 'Name']) { // if (this.personneQuery[this.query.db_field_name + 'Name']) {
this.userName = this.personneQuery[this.query.db_field_name + 'Name'].split(',') // this.userName = this.personneQuery[this.query.db_field_name + 'Name'].split(',')
} else if (this.personneQuery[this.query.db_field_name]) { // } else if (this.personneQuery[this.query.db_field_name]) {
this.userName = this.personneQuery[this.query.db_field_name].split(',') // this.userName = this.personneQuery[this.query.db_field_name].split(',')
} else { // } else {
this.userName = [] // this.userName = []
} // }
if (this.personneQuery[this.query.db_field_name + '_id']) { // if (this.personneQuery[this.query.db_field_name + '_id']) {
this.userIds = this.personneQuery[this.query.db_field_name + '_id'].split(',') // this.userIds = this.personneQuery[this.query.db_field_name + '_id'].split(',')
} else if (this.personneQuery[this.query.db_field_name]) { // } else if (this.personneQuery[this.query.db_field_name]) {
this.userIds = this.personneQuery[this.query.db_field_name].split(',') // this.userIds = this.personneQuery[this.query.db_field_name].split(',')
} else { // } else {
this.userIds = [] // this.userIds = []
} // }
this.defaultCheckedKeys = this.userIds // this.defaultCheckedKeys = this.userIds
this.defaultCheckedKeys = [...this.defaultCheckedKeys] // this.defaultCheckedKeys = [...this.defaultCheckedKeys]
this.defaultExpandAll = false // this.defaultExpandAll = false
this.treeVisible = true // this.treeVisible = true
} else { // } else {
this.queryDepartUserTreeList(1) // this.queryDepartUserTreeList(1)
} // }
}, 200) // }, 200)
},
deleteChildren(value, arr) {
let newarr = []
arr.forEach(element => {
if (element.title.indexOf(value) > -1) { // 判断条件
newarr.push(element)
} else {
if (element.children && element.children.length > 0) {
let redata = this.deleteChildren(value, element.children)
if (redata && redata.length > 0) {
let obj = {
...element,
children: redata
}
newarr.push(obj)
}
}
}
})
return newarr
},
// 将数据拼成树形结构
toTree(config, num) {
// 删除 所有 children,以防止多次调用
config.forEach(function(item) {
delete item.children
})
// 将数据存储为 以 id 为 KEY 的 map 索引数据列
let map = {}
config.forEach((item) => {
item.label = item.name
item.key = item.id
item.title = item.name + (item.itemName ? ' ' + item.itemName : '')
map[item.id] = item
})
let val = []
config.forEach((item) => {
// 以当前遍历项,的pid,去map对象中找到索引的id
let parent = map[item.parentId]
// 如果找到索引,那么说明此项不在顶级当中,那么需要把此项添加到,他对应的父级中
if (parent) {
(parent.children || (parent.children = [])).push(item)
} else {
//如果没有在map中找到对应的索引ID,那么直接把 当前的item添加到 val结果集中,作为顶级
val.push(item)
}
})
return val
}, },
// deleteChildren(value, arr) {
// let newarr = []
// arr.forEach(element => {
// if (element.title.indexOf(value) > -1) { // 判断条件
// newarr.push(element)
// } else {
// if (element.children && element.children.length > 0) {
// let redata = this.deleteChildren(value, element.children)
// if (redata && redata.length > 0) {
// let obj = {
// ...element,
// children: redata
// }
// newarr.push(obj)
// }
// }
// }
// })
// return newarr
// },
//将数据拼成树形结构
// toTree(config, num) {
// // 删除 所有 children,以防止多次调用
// config.forEach(function(item) {
// delete item.children
// })
// // 将数据存储为 以 id 为 KEY 的 map 索引数据列
// let map = {}
// config.forEach((item) => {
// item.label = item.name
// item.key = item.id
//
// item.title = item.name + (item.itemName ? ' ' + item.itemName : '')
// map[item.id] = item
// })
// let val = []
// config.forEach((item) => {
// // 以当前遍历项,的pid,去map对象中找到索引的id
// let parent = map[item.parentId]
//
// // 如果找到索引,那么说明此项不在顶级当中,那么需要把此项添加到,他对应的父级中
// if (parent) {
// (parent.children || (parent.children = [])).push(item)
// } else {
// //如果没有在map中找到对应的索引ID,那么直接把 当前的item添加到 val结果集中,作为顶级
// val.push(item)
// }
// })
// return val
// },
standardDelete() { standardDelete() {
this.$emit('input', null) this.$emit('input', null)
this.$forceUpdate() this.$forceUpdate()
@@ -255,71 +255,67 @@
// this.selectedKey = selectedKeys // this.selectedKey = selectedKeys
// }, // },
// onCheck(checkedKeys, info) { onCheck(checkedKeys, info) {
// this.userIds = checkedKeys.checked this.userIds = checkedKeys.checked
// this.userName = [] this.userName = []
// if (this.userIds.length > 0) { if (this.userIds.length > 0) {
// for (let i = 0; i < this.userIds.length; i++) { for (let i = 0; i < this.userIds.length; i++) {
// for (let j = 0; j < this.defaultCheckedKeysName.length; j++) { for (let j = 0; j < this.defaultCheckedKeysName.length; j++) {
// if (this.userIds[i] == this.defaultCheckedKeysName[j].id) { if (this.userIds[i] == this.defaultCheckedKeysName[j].id) {
// this.userName.push(this.defaultCheckedKeysName[j].name) this.userName.push(this.defaultCheckedKeysName[j].name)
// } }
// } }
// } }
// } }
// if (info.checkedNodes && info.checkedNodes.length > 0) { if (info.checkedNodes && info.checkedNodes.length > 0) {
// info.checkedNodes.forEach(res => { info.checkedNodes.forEach(res => {
// if (res.data.props.dataRef.key) { if (res.data.props.dataRef.key) {
// this.content.push({ this.content.push({
// id: res.data.props.dataRef.key, id: res.data.props.dataRef.key,
// title: res.data.props.dataRef.title title: res.data.props.dataRef.title
// }) })
// } else { } else {
// this.content.push({ this.content.push({
// id: res.data.props.id, id: res.data.props.id,
// title: res.data.props.title title: res.data.props.title
// }) })
// } }
// }) })
// } }
// if (this.content && this.content.length > 0) { if (this.content && this.content.length > 0) {
// for (let i = 0; i < this.content.length; i++) { for (let i = 0; i < this.content.length; i++) {
// for (let j = i + 1; j < this.content.length; j++) { for (let j = i + 1; j < this.content.length; j++) {
// if (this.content[i].id == this.content[j].id) { if (this.content[i].id == this.content[j].id) {
// this.content.splice(j, 1) this.content.splice(j, 1)
// j-- j--
// } }
// } }
// } }
// this.userIds.forEach(res => { this.userIds.forEach(res => {
// this.content.forEach(val => { this.content.forEach(val => {
// if (res == val.id) { if (res == val.id) {
// this.userName.push(val.title) this.userName.push(val.title)
// } }
// }) })
// }) })
// } }
// if (this.userName.length > 0) { if (this.userName.length > 0) {
// for (let i = 0; i < this.userName.length; i++) { for (let i = 0; i < this.userName.length; i++) {
// for (let j = i + 1; j < this.userName.length; j++) { for (let j = i + 1; j < this.userName.length; j++) {
// if (this.userName[i] == this.userName[j]) { if (this.userName[i] == this.userName[j]) {
// this.userName.splice(j, 1) this.userName.splice(j, 1)
// j-- j--
// } }
// } }
// } }
// } }
// }, },
handleCancel() { handleCancel() {
this.visible = false this.visible = false
this.treeVisible = false this.treeVisible = false
}, },
handleSubmit() { handleSubmit() {
// if (this.userIds && this.userIds.length > 0) { // if (this.userIds && this.userIds.length > 0) {
if (this.userIds.length > 100 && this.selectDepartment) {
this.$message.warning(this.$t('OnlyPersonsCanBeSelected'))
return
}
if (this.isSingleChoice) { if (this.isSingleChoice) {
if (this.userIds.length > 1) { if (this.userIds.length > 1) {
this.$message.warning(this.$t('onlyOnePersonCanBeSelected')) this.$message.warning(this.$t('onlyOnePersonCanBeSelected'))
@@ -351,120 +347,119 @@
this.defaultCheckedKeys = [] this.defaultCheckedKeys = []
}, },
onSearch(e) { onSearch(e) {
this.treeVisible = false // this.treeVisible = false
let p = new Promise((resolve, reject) => { // let p = new Promise((resolve, reject) => {
resolve() // resolve()
// })
// p.then(() => {
// this.searchData = e
// let gData = localStorage.getItem('gData')
// let content = []
// if (gData) {
// if (e) {
// JSON.parse(gData).forEach(res => {
// if (res.type == 'User') {
// if (res.name.includes(e)) {
// res.color = true
// content.push(res)
// }
// }
// // else if(res.type == 'Depart'){
// // content.push(res)
// // }
// })
// let gDataAdmin = this.toTree(content)
// this.gData = this.deleteChildren(e, gDataAdmin)
// this.defaultExpandAll = true
// this.treeVisible = true
// this.defaultCheckedKeys = this.userIds
// this.defaultCheckedKeys = [...this.defaultCheckedKeys]
// this.loading = false
// } else {
// let content = JSON.parse(gData)
// if (!this.selectDepartment) {
// content.forEach(res => {
// if (res.type == 'Depart') {
// res.disabled = true
// }
// })
// }
// this.gData = this.toTree(content)
// this.defaultExpandAll = false
// this.defaultCheckedKeys = this.userIds
// this.defaultCheckedKeys = [...this.defaultCheckedKeys]
// this.treeVisible = true
// this.loading = false
// }
// }
// })
this.gData = []
this.departId = ''
this.visibleTree = false
if (e) {
this.getUserAndDepart()
} else {
this.treeVisible = false
this.queryDepartUserTreeList(2)
}
},
getUserAndDepart() {
getAction('sys/user/getUserAndDepart', { name: this.searchModel }).then((res) => {
if (res) {
this.gData = res.filter(ele => ele.flag === 'DEPART')
} else {
this.gData = []
}
this.visibleTree = true
}) })
p.then(() => { },
this.searchData = e onExpand(selectedKeys, val) {
let gData = localStorage.getItem('gData') if (this.searchModel == '' || !this.searchModel) {
let content = [] if (val.expanded) {
if (gData) { if (this.departId == val.node.value) {
if (e) {
JSON.parse(gData).forEach(res => {
if (res.type == 'User') {
if (res.name.includes(e)) {
res.color = true
content.push(res)
}
}
// else if(res.type == 'Depart'){
// content.push(res)
// }
})
let gDataAdmin = this.toTree(content)
this.gData = this.deleteChildren(e, gDataAdmin)
this.defaultExpandAll = true
this.treeVisible = true
this.defaultCheckedKeys = this.userIds
this.defaultCheckedKeys = [...this.defaultCheckedKeys]
this.loading = false
} else { } else {
let content = JSON.parse(gData) this.departId = val.node.value
if (!this.selectDepartment) { this.queryDepartUserTreeList(2)
content.forEach(res => {
if (res.type == 'Depart') {
res.disabled = true
}
})
}
this.gData = this.toTree(content)
this.defaultExpandAll = false
this.defaultCheckedKeys = this.userIds
this.defaultCheckedKeys = [...this.defaultCheckedKeys]
this.treeVisible = true
this.loading = false
} }
} }
}) }
// this.gData = []
// this.departId = ''
// this.visibleTree = false
// if (e) {
// this.getUserAndDepart()
// } else {
// this.treeVisible = false
// this.queryDepartUserTreeList(2)
// }
}, },
// getUserAndDepart() {
// getAction('sys/user/getUserAndDepart', { name: this.searchModel }).then((res) => {
// if (res) {
// this.gData = res.filter(ele => ele.flag === 'DEPART')
// } else {
// this.gData = []
// }
// this.visibleTree = true
// })
// },
// onExpand(selectedKeys, val) {
// if (this.searchModel == '' || !this.searchModel) {
// if (val.expanded) {
// if (this.departId == val.node.value) {
// } else {
// this.departId = val.node.value
// this.queryDepartUserTreeList(2)
// }
// }
// }
// },
queryDepartUserTreeList(num) { queryDepartUserTreeList(num) {
// let gData = JSON.parse(JSON.stringify(this.gData)) let gData = JSON.parse(JSON.stringify(this.gData))
// if (gData && gData.length > 0) { if (gData && gData.length > 0) {
// gData = JSON.stringify(gData) gData = JSON.stringify(gData)
// } else { } else {
// gData = '' gData = ''
// } }
this.confirmLoading = true this.confirmLoading = true
this.loading = true this.loading = true
//queryDepartUserTreeList post //queryDepartUserTreeList
//queryUserTreeList get //queryUserTreeList
//换接口需要改请求 postAction('sys/user/queryDepartUserTreeList', {
getAction('sys/user/queryUserTreeList', { departId: this.departId,
// departId: this.departId, json: gData,
// json: gData, flag: '1'
// flag: '1'
}).then((res) => { }).then((res) => {
this.confirmLoading = false this.confirmLoading = false
if (res.success) { if (res.success) {
this.loading = false this.loading = false
// localStorage.setItem('gData', JSON.stringify(res.result)) // localStorage.setItem('gData', JSON.stringify(res.result))
// this.toTree(dataList) // this.toTree(dataList)
let content = JSON.parse(JSON.stringify(res.result)) // let content = JSON.parse(JSON.stringify(res.result))
if (!this.selectDepartment) { // if (!this.selectDepartment) {
res.result.forEach(res => { // res.result.forEach(res => {
if (res.type == 'Depart') { // if (res.type == 'Depart') {
res.disabled = true // res.disabled = true
} // }
}) // })
} // }
localStorage.removeItem('gData') // localStorage.removeItem('gData')
localStorage.setItem('gData', JSON.stringify(content)) // localStorage.setItem('gData', JSON.stringify(content))
this.gData = this.toTree(res.result) // this.gData = this.toTree(res.result)
// this.gData = res.result this.gData = res.result
this.gData = [...this.gData] this.gData = [...this.gData]
// this.gData[0].isLeaf = false // this.gData[0].isLeaf = false
// this.defaultExpandedKeys = [this.departId] this.defaultExpandedKeys = [this.departId]
if (num == 1) { if (num == 1) {
if (this.userName && this.userName.length == 0) { if (this.userName && this.userName.length == 0) {
if (this.personneQuery[this.query.db_field_name + 'Name']) { if (this.personneQuery[this.query.db_field_name + 'Name']) {
@@ -486,15 +481,15 @@
} }
this.defaultCheckedKeys = this.userIds this.defaultCheckedKeys = this.userIds
this.defaultCheckedKeys = [...this.defaultCheckedKeys] this.defaultCheckedKeys = [...this.defaultCheckedKeys]
// this.defaultCheckedKeysName = [] this.defaultCheckedKeysName = []
// if (this.defaultCheckedKeys.length > 0) { if (this.defaultCheckedKeys.length > 0) {
// for (let i = 0; i < this.defaultCheckedKeys.length; i++) { for (let i = 0; i < this.defaultCheckedKeys.length; i++) {
// this.defaultCheckedKeysName.push({ this.defaultCheckedKeysName.push({
// id: this.defaultCheckedKeys[i], id: this.defaultCheckedKeys[i],
// name: this.userName[i] name: this.userName[i]
// }) })
// } }
// } }
} }
this.defaultExpandAll = false this.defaultExpandAll = false
this.treeVisible = true this.treeVisible = true
+263 -261
View File
@@ -15,38 +15,38 @@
allowClear allowClear
:placeholder="$t('NodeQuickLookup')"/> :placeholder="$t('NodeQuickLookup')"/>
<div class="drawer-content"> <div class="drawer-content">
<virtualNodeTree <!-- <virtualNodeTree-->
v-if="treeVisible" <!-- v-if="treeVisible"-->
ref="virtualNodeTreeRef" <!-- ref="virtualNodeTreeRef"-->
:keeps="40" <!-- :keeps="40"-->
show-checkbox <!-- show-checkbox-->
v-model="checkboxList" <!-- v-model="checkboxList"-->
class="treeWrap" <!-- class="treeWrap"-->
:defaultCheckedKeys="defaultCheckedKeys" <!-- :defaultCheckedKeys="defaultCheckedKeys"-->
:defaultExpandAll="defaultExpandAll" <!-- :defaultExpandAll="defaultExpandAll"-->
:check-strictly="false" <!-- :check-strictly="false"-->
node-key="id" <!-- node-key="id"-->
@check="handleCheckChange" <!-- @check="handleCheckChange"-->
@check-change="checkChange" <!-- @check-change="checkChange"-->
:data.sync="gData"> <!-- :data.sync="gData">-->
<span slot-scope="{ data }"> <!-- <span slot-scope="{ data }">-->
<span :class="{'active':data.color ? true:false}"> <!-- <span :class="{'active':data.color ? true:false}">-->
{{ data.title }} <!-- {{ data.title }}-->
</span> <!-- </span>-->
</span> <!-- </span>-->
</virtualNodeTree> <!-- </virtualNodeTree>-->
<!-- <a-tree--> <a-tree
<!-- v-if="visibleTree"--> v-if="visibleTree"
<!-- style="margin-bottom: 60px;height: 600px"--> style="margin-bottom: 60px;height: 600px"
<!-- checkable--> checkable
<!-- :autoExpandParent="false"--> :autoExpandParent="false"
<!-- :tree-data="gData"--> :tree-data="gData"
<!-- @select="onSelect"--> @select="onSelect"
<!-- @check="checkChange"--> @check="checkChange"
<!-- @expand="onExpand"--> @expand="onExpand"
<!-- :defaultExpandedKeys="defaultExpandedKeys"--> :defaultExpandedKeys="defaultExpandedKeys"
<!-- >--> >
<!-- </a-tree>--> </a-tree>
</div> </div>
</a-spin> </a-spin>
<div class="drawer-bootom-button"> <div class="drawer-bootom-button">
@@ -94,38 +94,38 @@
}, },
methods: { methods: {
checkChange(val, checked, indeterminate) { // checkChange(val, checked, indeterminate) {
if (!checked && this.searchData) { // if (!checked && this.searchData) {
this.userName = this.userName.filter(res => { // this.userName = this.userName.filter(res => {
return res != val.title // return res != val.title
}) // })
this.userIds = this.userIds.filter(res => { // this.userIds = this.userIds.filter(res => {
return res != val.id // return res != val.id
}) // })
for (let i = 0; i < this.userIds.length; i++) { // for (let i = 0; i < this.userIds.length; i++) {
if (this.userIds[i] == val.parentId) { // if (this.userIds[i] == val.parentId) {
this.userIds.splice(i, 1) // this.userIds.splice(i, 1)
this.userName.splice(i, 1) // this.userName.splice(i, 1)
i-- // i--
} // }
} // }
} else if (checked && this.searchData) { // } else if (checked && this.searchData) {
this.userName.push(val.title) // this.userName.push(val.title)
this.userIds.push(val.id) // this.userIds.push(val.id)
} // }
}, // },
handleCheckChange(val, data, checked) { // handleCheckChange(val, data, checked) {
if (!this.searchData) { // if (!this.searchData) {
this.userName = [] // this.userName = []
this.userIds = [] // this.userIds = []
if (data.checkedNodes && data.checkedNodes.length > 0) { // if (data.checkedNodes && data.checkedNodes.length > 0) {
data.checkedNodes.forEach(res => { // data.checkedNodes.forEach(res => {
this.userName.push(res.title) // this.userName.push(res.title)
this.userIds.push(res.id) // this.userIds.push(res.id)
}) // })
} // }
} // }
}, // },
getPush(data) { getPush(data) {
this.tableKey = data this.tableKey = data
this.userName = [] this.userName = []
@@ -136,94 +136,94 @@
this.visible = true this.visible = true
this.visibleTree = false this.visibleTree = false
this.treeVisible = false this.treeVisible = false
// this.$nextTick(() => { this.$nextTick(() => {
// this.departId = '' this.departId = ''
// this.queryDepartUserTreeList() this.queryDepartUserTreeList()
// }) })
let gData = localStorage.getItem('gData') // let gData = localStorage.getItem('gData')
if (gData) { // if (gData) {
let dataList = JSON.parse(gData) // let dataList = JSON.parse(gData)
dataList.forEach(res => { // dataList.forEach(res => {
if (res.type == 'Depart') { // if (res.type == 'Depart') {
res.disabled = true // res.disabled = true
} // }
}) // })
this.dataList = this.toTree(dataList) // this.dataList = this.toTree(dataList)
} // }
setTimeout(() => { // setTimeout(() => {
if (gData) { // if (gData) {
this.gData = this.dataList // this.gData = this.dataList
this.gData = [...this.gData] // this.gData = [...this.gData]
this.treeVisible = true // this.treeVisible = true
} else { // } else {
this.queryDepartUserTreeList(1) // this.queryDepartUserTreeList(1)
} // }
}, 200) // }, 200)
}, },
deleteChildren(value, arr) { // deleteChildren(value, arr) {
let newarr = [] // let newarr = []
arr.forEach(element => { // arr.forEach(element => {
if (element.title.indexOf(value) > -1) { // 判断条件 // if (element.title.indexOf(value) > -1) { // 判断条件
newarr.push(element) // newarr.push(element)
} else { // } else {
if (element.children && element.children.length > 0) { // if (element.children && element.children.length > 0) {
let redata = this.deleteChildren(value, element.children) // let redata = this.deleteChildren(value, element.children)
if (redata && redata.length > 0) { // if (redata && redata.length > 0) {
let obj = { // let obj = {
...element, // ...element,
children: redata // children: redata
} // }
newarr.push(obj) // newarr.push(obj)
} // }
}
}
})
return newarr
},
// 将数据拼成树形结构
toTree(config, num) {
// 删除 所有 children,以防止多次调用
config.forEach(function(item) {
delete item.children
})
// 将数据存储为 以 id 为 KEY 的 map 索引数据列
let map = {}
config.forEach((item) => {
item.label = item.name
item.key = item.id
item.title = item.name + (item.itemName ? ' ' + item.itemName : '')
map[item.id] = item
})
let val = []
config.forEach((item) => {
// 以当前遍历项,的pid,去map对象中找到索引的id
let parent = map[item.parentId]
// 如果找到索引,那么说明此项不在顶级当中,那么需要把此项添加到,他对应的父级中
if (parent) {
(parent.children || (parent.children = [])).push(item)
} else {
//如果没有在map中找到对应的索引ID,那么直接把 当前的item添加到 val结果集中,作为顶级
val.push(item)
}
})
return val
},
// onSelect(selectedKeys) {
// this.selectedKey = selectedKeys
// },
// onExpand(selectedKeys, val) {
// if (this.searchModel == '' || !this.searchModel) {
// if (val.expanded) {
// if (this.departId == val.node.value) {
// } else {
// this.departId = val.node.value
// this.queryDepartUserTreeList()
// } // }
// } // }
// } // })
// return newarr
// }, // },
// // 将数据拼成树形结构
// toTree(config, num) {
// // 删除 所有 children,以防止多次调用
// config.forEach(function(item) {
// delete item.children
// })
// // 将数据存储为 以 id 为 KEY 的 map 索引数据列
// let map = {}
// config.forEach((item) => {
// item.label = item.name
// item.key = item.id
//
// item.title = item.name + (item.itemName ? ' ' + item.itemName : '')
// map[item.id] = item
// })
// let val = []
// config.forEach((item) => {
// // 以当前遍历项,的pid,去map对象中找到索引的id
// let parent = map[item.parentId]
//
// // 如果找到索引,那么说明此项不在顶级当中,那么需要把此项添加到,他对应的父级中
// if (parent) {
// (parent.children || (parent.children = [])).push(item)
// } else {
// //如果没有在map中找到对应的索引ID,那么直接把 当前的item添加到 val结果集中,作为顶级
// val.push(item)
// }
// })
// return val
// },
onSelect(selectedKeys) {
this.selectedKey = selectedKeys
},
onExpand(selectedKeys, val) {
if (this.searchModel == '' || !this.searchModel) {
if (val.expanded) {
if (this.departId == val.node.value) {
} else {
this.departId = val.node.value
this.queryDepartUserTreeList()
}
}
}
},
handleCancel() { handleCancel() {
this.visible = false this.visible = false
this.visibleTree = false this.visibleTree = false
@@ -257,92 +257,92 @@
}) })
}, },
onSearch(e) { onSearch(e) {
this.treeVisible = false // this.treeVisible = false
let p = new Promise((resolve, reject) => { // let p = new Promise((resolve, reject) => {
resolve() // resolve()
}) // })
p.then(() => { // p.then(() => {
this.searchData = e // this.searchData = e
let gData = localStorage.getItem('gData') // let gData = localStorage.getItem('gData')
let content = [] // let content = []
if (gData) { // if (gData) {
if (e) { // if (e) {
JSON.parse(gData).forEach(res => { // JSON.parse(gData).forEach(res => {
if (res.type == 'User') { // if (res.type == 'User') {
if (res.name.includes(e)) { // if (res.name.includes(e)) {
res.color = true // res.color = true
content.push(res) // content.push(res)
} // }
} // }
}) // })
let gDataAdmin = this.toTree(content) // let gDataAdmin = this.toTree(content)
this.gData = this.deleteChildren(e, gDataAdmin) // this.gData = this.deleteChildren(e, gDataAdmin)
this.defaultExpandAll = true // this.defaultExpandAll = true
this.treeVisible = true // this.treeVisible = true
this.defaultCheckedKeys = this.userIds // this.defaultCheckedKeys = this.userIds
this.defaultCheckedKeys = [...this.defaultCheckedKeys] // this.defaultCheckedKeys = [...this.defaultCheckedKeys]
this.loading = false // this.loading = false
} else { // } else {
let content = JSON.parse(gData) // let content = JSON.parse(gData)
content.forEach(res => { // content.forEach(res => {
if (res.type == 'Depart') { // if (res.type == 'Depart') {
res.disabled = true // res.disabled = true
} // }
}) // })
this.gData = this.toTree(content) // this.gData = this.toTree(content)
this.defaultExpandAll = false // this.defaultExpandAll = false
this.defaultCheckedKeys = this.userIds // this.defaultCheckedKeys = this.userIds
this.defaultCheckedKeys = [...this.defaultCheckedKeys] // this.defaultCheckedKeys = [...this.defaultCheckedKeys]
this.treeVisible = true // this.treeVisible = true
this.loading = false // this.loading = false
} // }
// }
// })
this.gData = []
this.departId = ''
this.visibleTree = false
if (e) {
this.getUserAndDepart()
} else {
this.queryDepartUserTreeList()
}
},
getUserAndDepart() {
getAction('sys/user/getUserAndDepart', { name: this.searchModel }).then((res) => {
if (res) {
this.gData = res.filter(ele => ele.flag === 'DEPART')
} else {
this.gData = []
} }
this.visibleTree = true
}) })
// this.gData = []
// this.departId = ''
// this.visibleTree = false
// if (e) {
// this.getUserAndDepart()
// } else {
// this.queryDepartUserTreeList()
// }
}, },
// getUserAndDepart() {
// getAction('sys/user/getUserAndDepart', { name: this.searchModel }).then((res) => {
// if (res) {
// this.gData = res.filter(ele => ele.flag === 'DEPART')
// } else {
// this.gData = []
// }
// this.visibleTree = true
// })
// },
queryDepartUserTreeList() { queryDepartUserTreeList() {
// let gData = JSON.parse(JSON.stringify(this.gData)) let gData = JSON.parse(JSON.stringify(this.gData))
// if (gData && gData.length > 0) { if (gData && gData.length > 0) {
// gData = JSON.stringify(gData) gData = JSON.stringify(gData)
// } else { } else {
// gData = '' gData = ''
// } }
this.confirmLoading = true this.confirmLoading = true
getAction('sys/user/queryUserTreeList', { postAction('sys/user/queryDepartUserTreeList', {
// departId: this.departId, departId: this.departId,
// flag: '1', flag: '1',
// json: gData json: gData
}).then((res) => { }).then((res) => {
this.confirmLoading = false this.confirmLoading = false
if (res.success) { if (res.success) {
let content = JSON.parse(JSON.stringify(res.result)) // let content = JSON.parse(JSON.stringify(res.result))
res.result.forEach(res => { // res.result.forEach(res => {
if (res.type == 'Depart') { // if (res.type == 'Depart') {
res.disabled = true // res.disabled = true
} // }
}) // })
localStorage.removeItem('gData') // localStorage.removeItem('gData')
localStorage.setItem('gData', JSON.stringify(content)) // localStorage.setItem('gData', JSON.stringify(content))
this.gData = this.toTree(res.result) // this.gData = this.toTree(res.result)
this.gData = res.result
this.gData = [...this.gData] this.gData = [...this.gData]
// this.gData = res.result
// this.defaultExpandedKeys = [this.departId] // this.defaultExpandedKeys = [this.departId]
this.defaultExpandAll = false this.defaultExpandAll = false
this.treeVisible = true this.treeVisible = true
@@ -351,43 +351,43 @@
this.gData = [] this.gData = []
} }
}) })
},
checkChange(e, info) {
this.userIds = e
this.userName = []
if (info.checkedNodes && info.checkedNodes.length > 0) {
info.checkedNodes.forEach(res => {
if (res.data.props.dataRef.key) {
this.content.push({
id: res.data.props.dataRef.key,
title: res.data.props.dataRef.title
})
} else {
this.content.push({
id: res.data.props.id,
title: res.data.props.title
})
}
})
}
if (this.content && this.content.length > 0) {
for (let i = 0; i < this.content.length; i++) {
for (let j = i + 1; j < this.content.length; j++) {
if (this.content[i].id == this.content[j].id) {
this.content.splice(j, 1)
j--
}
}
}
this.userIds.forEach(res => {
this.content.forEach(val => {
if (res == val.id) {
this.userName.push(val.title)
}
})
})
}
} }
// checkChange(e, info) {
// this.userIds = e
// this.userName = []
// if (info.checkedNodes && info.checkedNodes.length > 0) {
// info.checkedNodes.forEach(res => {
// if (res.data.props.dataRef.key) {
// this.content.push({
// id: res.data.props.dataRef.key,
// title: res.data.props.dataRef.title
// })
// } else {
// this.content.push({
// id: res.data.props.id,
// title: res.data.props.title
// })
// }
// })
// }
// if (this.content && this.content.length > 0) {
// for (let i = 0; i < this.content.length; i++) {
// for (let j = i + 1; j < this.content.length; j++) {
// if (this.content[i].id == this.content[j].id) {
// this.content.splice(j, 1)
// j--
// }
// }
// }
// this.userIds.forEach(res => {
// this.content.forEach(val => {
// if (res == val.id) {
// this.userName.push(val.title)
// }
// })
// })
// }
// }
} }
} }
</script> </script>
@@ -428,9 +428,11 @@
height: calc(100% - 60px); height: calc(100% - 60px);
overflow: auto; overflow: auto;
} }
.treeWrap { .treeWrap {
height: calc(100vh - 240px); height: calc(100vh - 240px);
} }
.active { .active {
color: #21c9cc; color: #21c9cc;
display: inline-block; display: inline-block;
+8 -8
View File
@@ -142,14 +142,14 @@ const user = {
//Vue.ls.set(USER_AUTH,authData); //Vue.ls.set(USER_AUTH,authData);
sessionStorage.setItem(USER_AUTH, JSON.stringify(authData)) sessionStorage.setItem(USER_AUTH, JSON.stringify(authData))
sessionStorage.setItem(SYS_BUTTON_AUTH, JSON.stringify(allAuthData)) sessionStorage.setItem(SYS_BUTTON_AUTH, JSON.stringify(allAuthData))
let gData = localStorage.getItem('gData') // let gData = localStorage.getItem('gData')
if (!gData) { // if (!gData) {
getAction('sys/user/queryUserTreeList', {}).then((res) => { // getAction('sys/user/queryUserTreeList', {}).then((res) => {
if (res.success) { // if (res.success) {
localStorage.setItem('gData', JSON.stringify(res.result)) // localStorage.setItem('gData', JSON.stringify(res.result))
} // }
}) // })
} // }
if (menuData && menuData.length > 0) { if (menuData && menuData.length > 0) {
//update--begin--autor:qinfeng-----date:20200109------for:JEECG-63 一级菜单的子菜单全部是隐藏路由,则一级菜单不显示------ //update--begin--autor:qinfeng-----date:20200109------for:JEECG-63 一级菜单的子菜单全部是隐藏路由,则一级菜单不显示------
menuData.forEach((item, index) => { menuData.forEach((item, index) => {