WL/laws_weilai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

人员选择修改

Browse Source
This commit is contained in:
范强强
2023-04-21 18:00:52 +08:00
parent 266167626b
commit 557912138f
1 changed files with 91 additions and 503 deletions
Download Patch File Download Diff File Expand all files Collapse all files
jero-web/src/components/PersonnelSelection/index.vue
+91 -503
View File
@@ -2,98 +2,39 @@
<div>
<div class="itemModelStand-select" v-if="!isInput">
<a-select
:mode="isSingleChoice?'':'multiple'"
class="itemModelStand-input"
:value="valueSelect"
@change="onChange"
mode="multiple"
:disabled="disabled"
show-search
:label-in-value="isSingleChoice ? false:true"
:value="selectValue"
:placeholder="$t('PleaseSelect')+query.db_field_txt"
:getPopupContainer="triggerNode=> triggerNode.parentNode">
<a-select-option
v-for="(item,index) in dictOptions"
:key="index"
:value="item.value">
<span class="itemOption" :title="item.title">
{{ item.title }}
</span>
style="width: 100%"
:disabled="disabled"
:default-active-first-option="false"
:filter-option="false"
@search="fetchUser"
@change="handleChange"
>
<a-spin v-if="fetching" slot="notFoundContent" size="small"/>
<a-select-option v-for="d in selectData" :key="d.id">
{{ d.username }}
</a-select-option>
</a-select>
<!-- <a-input class="box-input" :value="value" @input="indexclick($event)"-->
<!-- :disabled="true"-->
<!-- :title="value"-->
<!-- :placeholder="$t('PleaseSelect')+query.db_field_txt"/>-->
<a-button type="primary" class="button-box" :disabled="disabled" @click="standardClick">
{{this.$t('PersonnelSelection')}}
</a-button>
<!-- <a-button type="primary" v-if='isDelete' class="button-box" @click="standardDelete">-->
<!-- {{this.$t('delete')}}-->
<!-- </a-button>-->
</div>
<div class="box-title-text" v-if="isInput">
<a-input :class="{'box-input':!isClass}" :value="value"
readonly
:title="value"
@click.native="standardClick"
:placeholder="$t('PleaseSelect')+query.db_field_txt"/>
</div>
<a-drawer
:title="$t('PersonnelSelection')"
:maskClosable="false"
:width="600"
placement="right"
:closable="true"
@close="handleCancel"
:visible="visible"
style="height: 100%;overflow: auto;padding-bottom: 53px;">
<a-input-search style="margin-bottom: 8px" :placeholder="$t('NodeQuickLookup')"
v-model="searchModel" @search="onSearch"/>
<div class="drawer-content">
<JLoading :loading="loading">{{$t('dataLoading')}}</JLoading>
<!-- <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"
checkable
checkStrictly
:loading="loading"
:tree-data="gData"
@check="onCheck"
@expand="onExpand"
v-model:checkedKeys="defaultCheckedKeys"
:defaultExpandedKeys="defaultExpandedKeys"
>
</a-tree>
</div>
<div class="drawer-bootom-button">
<a-button @click="handleCancel" style="margin-right: 16px">{{$t('cancel')}}</a-button>
<a-button @click="handleSubmit" type="primary">{{$t('submit')}}</a-button>
</div>
</a-drawer>
<!-- <div class="box-title-text" v-if="isInput">-->
<!-- <a-input :class="{'box-input':!isClass}" :value="value"-->
<!-- readonly-->
<!-- :title="value"-->
<!-- @click.native="standardClick"-->
<!-- :placeholder="$t('PleaseSelect')+query.db_field_txt"/>-->
<!-- </div>-->
</div>
</template>
<script>
import { getAction, postAction } from '@/api/manage'
import virtualNodeTree from '@/components/virtualNodeTree/tree'
import debounce from 'lodash/debounce'
import XEUtils from 'xe-utils'
import VXETable from 'vxe-table'
@@ -104,11 +45,12 @@
virtualNodeTree
},
data() {
this.lastFetchId = 0
this.fetchUser = debounce(this.fetchUser, 800)
return {
loading: false,
gData: [],
valueSelect: [],
dictOptions: [],
autoExpandParent: false,
checkboxList: [],
expandedKeys: [],
@@ -125,12 +67,14 @@
content: [],
dataList: [],
defaultExpandAll: false,
searchData: ''
selectData: [],
fetching: false,
selectValue: this.isSingleChoice ? '' : []
}
},
mounted() {
this.valueSelect = []
this.dictOptions = []
this.selectValue = []
this.selectData = []
setTimeout(() => {
if (this.value) {
let contentName = []
@@ -149,439 +93,83 @@
} else {
contentId = []
}
contentId.forEach((res, index) => {
this.dictOptions.push({
value: res,
title: contentName[index]
if (this.isSingleChoice) {
if (contentId && contentId.length > 0) {
this.selectValue = contentId[0]
contentId.forEach((res, index) => {
this.selectData.push({
id: res,
username: contentName[index]
})
})
this.selectData = [...this.selectData]
}
} else {
contentId.forEach((res, index) => {
this.selectValue.push({
key: res,
label: contentName[index]
})
this.selectData.push({
id: res,
username: contentName[index]
})
})
this.valueSelect.push(res)
})
}
}
}, 600)
},
methods: {
// checkChange(val, checked, indeterminate) {
// if (!checked && this.searchData) {
// this.userName = this.userName.filter(res => {
// return res != val.title
// })
// this.userIds = this.userIds.filter(res => {
// return res != val.id
// })
// for (let i = 0; i < this.userIds.length; i++) {
// if (this.userIds[i] == val.parentId) {
// this.userIds.splice(i, 1)
// this.userName.splice(i, 1)
// i--
// }
// }
// } else if (checked && this.searchData) {
// this.userName.push(val.title)
// this.userIds.push(val.id)
// }
// },
// handleCheckChange(val, data, checked) {
// if (!this.searchData) {
// this.userName = []
// this.userIds = []
// if (data.checkedNodes && data.checkedNodes.length > 0) {
// data.checkedNodes.forEach(res => {
// this.userName.push(res.title)
// this.userIds.push(res.id)
// })
// }
// }
// },
standardClick() {
this.treeVisible = false
this.departId = ''
this.searchModel = ''
this.searchData = ''
this.userIds = []
this.userName = []
this.queryDepartUserTreeList(1)
this.visible = true
// let gData = localStorage.getItem('gData')
// if (gData) {
// let dataList = JSON.parse(gData)
// if (!this.selectDepartment) {
// dataList.forEach(res => {
// if (res.type == 'Depart') {
// res.disabled = true
// }
// })
// }
// this.dataList = this.toTree(dataList)
// }
// setTimeout(() => {
// if (gData) {
// this.gData = this.dataList
// this.gData = [...this.gData]
// // this.treeVisible = true
// if (this.personneQuery[this.query.db_field_name + 'Name']) {
// this.userName = this.personneQuery[this.query.db_field_name + 'Name'].split(',')
// } else if (this.personneQuery[this.query.db_field_name]) {
// this.userName = this.personneQuery[this.query.db_field_name].split(',')
// } else {
// this.userName = []
// }
// if (this.personneQuery[this.query.db_field_name + '_id']) {
// this.userIds = this.personneQuery[this.query.db_field_name + '_id'].split(',')
// } else if (this.personneQuery[this.query.db_field_name]) {
// this.userIds = this.personneQuery[this.query.db_field_name].split(',')
// } else {
// this.userIds = []
// }
// this.defaultCheckedKeys = this.userIds
// this.defaultCheckedKeys = [...this.defaultCheckedKeys]
// this.defaultExpandAll = false
// this.treeVisible = true
// } else {
// this.queryDepartUserTreeList(1)
// }
// }, 200)
fetchUser(value) {
this.lastFetchId += 1
const fetchId = this.lastFetchId
this.selectData = []
this.fetching = true
this.getUserAndDepart(value, (res) => {
this.selectData = res
this.fetching = false
})
},
// 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() {
this.$emit('input', null)
this.$forceUpdate()
this.$emit('deleteData', this.query.db_field_name)
},
// onSelect(selectedKeys, info) {
// console.log(selectedKeys)
// this.selectedKey = selectedKeys
// },
onCheck(checkedKeys, info) {
this.userIds = checkedKeys.checked
handleChange(selectValue) {
if (this.isSingleChoice) {
if (this.userIds.length > 1) {
this.userIds.shift()
}
}
this.userName = []
if (this.userIds.length > 0) {
for (let i = 0; i < this.userIds.length; i++) {
for (let j = 0; j < this.defaultCheckedKeysName.length; j++) {
if (this.userIds[i] == this.defaultCheckedKeysName[j].id) {
this.userName.push(this.defaultCheckedKeysName[j].name)
}
}
}
}
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
})
}
this.selectValue = selectValue
let content = this.selectData.filter(res => {
return res.id === selectValue
})
}
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)
}
this.$emit('input', content[0].username)
this.$emit('change', this.query.db_field_name, selectValue, this.query.subscript)
} else {
Object.assign(this, {
selectValue,
fetching: false
})
let id = []
let username = []
if (this.selectValue.length > 0) {
this.selectValue.forEach(res => {
id.push(res.key)
username.push(res.label)
})
})
}
if (this.userName.length > 0) {
for (let i = 0; i < this.userName.length; i++) {
for (let j = i + 1; j < this.userName.length; j++) {
if (this.userName[i] == this.userName[j]) {
this.userName.splice(j, 1)
j--
}
}
}
this.$emit('input', username.join(','))
this.$emit('change', this.query.db_field_name, id.join(','), this.query.subscript)
}
},
handleCancel() {
this.visible = false
this.treeVisible = false
},
onChange(value) {
this.valueSelect = value
console.log(this.valueSelect)
console.log(this.dictOptions)
this.userIds = []
this.userName = []
if (this.valueSelect && this.valueSelect.length > 0) {
value.forEach(res => {
this.dictOptions.forEach(val => {
if (res == val.value) {
this.userIds.push(val.value)
this.userName.push(val.title)
}
})
})
getUserAndDepart(value, callback) {
let query = {
current: 1,
pageSize: 10,
username: '*' + value + '*'
}
let userIds = JSON.parse(JSON.stringify(this.userIds))
let userName = JSON.parse(JSON.stringify(this.userName))
console.log(userIds)
this.$emit('input', userName.join(','))
this.$emit('change', this.query.db_field_name, userIds.join(','), this.query.subscript)
},
handleSubmit() {
// if (this.userIds && this.userIds.length > 0) {
if (this.isSingleChoice) {
if (this.userIds.length > 1) {
this.$message.warning(this.$t('onlyOnePersonCanBeSelected'))
return
}
}
let userIds = JSON.parse(JSON.stringify(this.userIds))
let userName = JSON.parse(JSON.stringify(this.userName))
// userName = userName.filter(function(item, index) {
// return userName.indexOf(item) === index // 因为indexOf 只能查找到第一个
// })
// userIds = userIds.filter(function(item, index) {
// return userIds.indexOf(item) === index // 因为indexOf 只能查找到第一个
// })
if (!this.isInput) {
this.dictOptions = []
this.valueSelect = []
if (userIds && userIds.length > 0) {
userIds.forEach((res, index) => {
this.dictOptions.push({
title: userName[index],
value: res
})
this.valueSelect.push(res)
})
}
}
this.$emit('input', userName.join(','))
this.$emit('change', this.query.db_field_name, userIds.join(','), this.query.subscript)
this.visible = false
this.treeVisible = false
// } else {
// this.$message.warning(this.$t('pleaseSelectPersonFirst'))
// }
},
indexclick(event) {
this.$emit('input', event.target.value)
this.departId = ''
this.searchModel = ''
this.userIds = []
this.userName = []
this.defaultCheckedKeys = []
},
onSearch(e) {
// this.treeVisible = false
// let p = new Promise((resolve, reject) => {
// 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
})
},
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) {
let gData = JSON.parse(JSON.stringify(this.gData))
if (gData && gData.length > 0) {
gData = JSON.stringify(gData)
} else {
gData = ''
}
this.confirmLoading = true
this.loading = true
//queryDepartUserTreeList
//queryUserTreeList
postAction('sys/user/queryDepartUserTreeList', {
departId: this.departId,
json: gData,
flag: '1'
}).then((res) => {
this.confirmLoading = false
getAction('/sys/user/page', query).then((res) => {
if (res.success) {
this.loading = false
// localStorage.setItem('gData', JSON.stringify(res.result))
// this.toTree(dataList)
// let content = JSON.parse(JSON.stringify(res.result))
// if (!this.selectDepartment) {
// res.result.forEach(res => {
// if (res.type == 'Depart') {
// res.disabled = true
// }
// })
// }
// localStorage.removeItem('gData')
// localStorage.setItem('gData', JSON.stringify(content))
// this.gData = this.toTree(res.result)
this.gData = res.result
this.gData = [...this.gData]
// this.gData[0].isLeaf = false
this.defaultExpandedKeys = [this.departId]
if (num == 1) {
console.log(this.personneQuery)
if (this.userName && this.userName.length == 0) {
if (this.personneQuery[this.query.db_field_name + 'Name']) {
this.userName = this.personneQuery[this.query.db_field_name + 'Name'].split(',')
} else if (this.personneQuery[this.query.db_field_name]) {
this.userName = this.personneQuery[this.query.db_field_name].split(',')
} else {
this.userName = []
}
}
if (this.userIds && this.userIds.length == 0) {
if (this.personneQuery[this.query.db_field_name + '_id']) {
this.userIds = this.personneQuery[this.query.db_field_name + '_id'].split(',')
} else if (this.personneQuery[this.query.db_field_name]) {
this.userIds = this.personneQuery[this.query.db_field_name].split(',')
} else {
this.userIds = []
}
}
this.defaultCheckedKeys = this.userIds
this.defaultCheckedKeys = [...this.defaultCheckedKeys]
this.defaultCheckedKeysName = []
if (this.defaultCheckedKeys.length > 0) {
for (let i = 0; i < this.defaultCheckedKeys.length; i++) {
this.defaultCheckedKeysName.push({
id: this.defaultCheckedKeys[i],
name: this.userName[i]
})
}
}
}
this.defaultExpandAll = false
this.treeVisible = true
callback && callback(res.result.records || res.result)
} else {
this.gData = []
callback && callback([])
}
})
}
@@ -602,7 +190,7 @@
}
.itemModelStand-input {
width: calc(100% - 100px);
width: 100%;
display: inline-block;
height: 38px;
}
@@ -695,7 +283,7 @@
}
</style>
<style>
.itemModelStand-select .ant-select-dropdown--multiple {
display: none !important;
}
/*.itemModelStand-select .ant-select-dropdown--multiple {*/
/* display: none !important;*/
/*}*/
</style>