|
@@ -1,8 +1,8 @@
|
|
<template>
|
|
<template>
|
|
<div class="chooseSomeone">
|
|
<div class="chooseSomeone">
|
|
<div class="chooseSomeone_selsect">
|
|
<div class="chooseSomeone_selsect">
|
|
- <van-search v-model="selectValue" shape="round" background="#F4F4F4" placeholder="请输入姓名"
|
|
|
|
- @search="onSearch"></van-search>
|
|
|
|
|
|
+ <van-search v-model.trim="selectValue" shape="round" background="#F4F4F4" placeholder="请输入姓名" @search="onSearch"
|
|
|
|
+ @input="onSearch"></van-search>
|
|
</div>
|
|
</div>
|
|
<div class="chooseSomeone_Con contentRoll">
|
|
<div class="chooseSomeone_Con contentRoll">
|
|
<!-- 单选 -->
|
|
<!-- 单选 -->
|
|
@@ -27,15 +27,23 @@
|
|
|
|
|
|
<!-- tree -->
|
|
<!-- tree -->
|
|
<div class="treeBox" v-if="newGroupView == 3">
|
|
<div class="treeBox" v-if="newGroupView == 3">
|
|
- <div class="treeBox_tree_text" v-if="!newGroupViewBack && groupView" @click="newGroupViewBackCli(true, groupView)"><van-icon name="arrow-left"/>返回</div>
|
|
|
|
|
|
+ <div class="treeBox_tree_text" v-if="!newGroupViewBack && groupView"
|
|
|
|
+ @click="newGroupViewBackCli(true, groupView)"><van-icon name="arrow-left" />返回</div>
|
|
<div class="treeBox_tree">
|
|
<div class="treeBox_tree">
|
|
- <el-tree v-model="treeVal" show-checkbox node-key="id" :data="personnelTree" :props="defaultProps"></el-tree>
|
|
|
|
|
|
+ <el-tree ref="tree" v-model="treeVal" show-checkbox node-key="id" :data="personnelTree" :props="defaultProps"
|
|
|
|
+ :filter-node-method="filterNode">
|
|
|
|
+ <span class="custom-tree-node" slot-scope="{ node, data }">
|
|
|
|
+ <span>
|
|
|
|
+ {{ node.label }}
|
|
|
|
+ </span>
|
|
|
|
+ </span>
|
|
|
|
+ </el-tree>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="chooseSomeone_btn" v-if="newGroupViewBack">
|
|
<div class="chooseSomeone_btn" v-if="newGroupViewBack">
|
|
<van-button round size="small" v-if="newGroupViewBack" @click="newGroupViewBackCli(false, 3)">从其他工位选择员工</van-button>
|
|
<van-button round size="small" v-if="newGroupViewBack" @click="newGroupViewBackCli(false, 3)">从其他工位选择员工</van-button>
|
|
- <van-button round type="info" size="small" @click="handClick()">确定</van-button>
|
|
|
|
|
|
+ <van-button round type="info" size="small" :loading="loadingBtn" @click="handClick()">确定</van-button>
|
|
</div>
|
|
</div>
|
|
<div class="chooseSomeone_btn" v-if="!newGroupViewBack">
|
|
<div class="chooseSomeone_btn" v-if="!newGroupViewBack">
|
|
<van-button round type="info" size="small" style="width: 100%;">确定</van-button>
|
|
<van-button round type="info" size="small" style="width: 100%;">确定</van-button>
|
|
@@ -44,6 +52,14 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
|
+/**
|
|
|
|
+ * peopleList 数据格式要求
|
|
|
|
+ * 传过来的数据必须包含 以下四个字段
|
|
|
|
+ * id: 人员id
|
|
|
|
+ * name: 人员姓名
|
|
|
|
+ * phone: 人员电话
|
|
|
|
+ * jobNumber: 人员工号
|
|
|
|
+ */
|
|
export default {
|
|
export default {
|
|
props: {
|
|
props: {
|
|
groupView: {
|
|
groupView: {
|
|
@@ -58,8 +74,9 @@ export default {
|
|
type: Array,
|
|
type: Array,
|
|
default: () => []
|
|
default: () => []
|
|
},
|
|
},
|
|
- teamAllocation:{
|
|
|
|
- type: Function
|
|
|
|
|
|
+ peopleListId: { // 选中的Id
|
|
|
|
+ type: Array,
|
|
|
|
+ default: () => []
|
|
},
|
|
},
|
|
},
|
|
},
|
|
components: {},
|
|
components: {},
|
|
@@ -71,41 +88,8 @@ export default {
|
|
treeVal: [],
|
|
treeVal: [],
|
|
// 人员数组
|
|
// 人员数组
|
|
personnelList: [],
|
|
personnelList: [],
|
|
- personnelTree: [{
|
|
|
|
- label: '一级 1',
|
|
|
|
- children: [{
|
|
|
|
- label: '二级 1-1',
|
|
|
|
- children: [{
|
|
|
|
- label: '三级 1-1-1'
|
|
|
|
- }]
|
|
|
|
- }]
|
|
|
|
- }, {
|
|
|
|
- label: '一级 2',
|
|
|
|
- children: [{
|
|
|
|
- label: '二级 2-1',
|
|
|
|
- children: [{
|
|
|
|
- label: '三级 2-1-1'
|
|
|
|
- }]
|
|
|
|
- }, {
|
|
|
|
- label: '二级 2-2',
|
|
|
|
- children: [{
|
|
|
|
- label: '三级 2-2-1'
|
|
|
|
- }]
|
|
|
|
- }]
|
|
|
|
- }, {
|
|
|
|
- label: '一级 3',
|
|
|
|
- children: [{
|
|
|
|
- label: '二级 3-1',
|
|
|
|
- children: [{
|
|
|
|
- label: '三级 3-1-1'
|
|
|
|
- }]
|
|
|
|
- }, {
|
|
|
|
- label: '二级 3-2',
|
|
|
|
- children: [{
|
|
|
|
- label: '三级 3-2-1'
|
|
|
|
- }]
|
|
|
|
- }]
|
|
|
|
- }],
|
|
|
|
|
|
+ personnelTree: [],
|
|
|
|
+ newPersonnelTree: [],
|
|
defaultProps: {
|
|
defaultProps: {
|
|
children: 'children',
|
|
children: 'children',
|
|
label: 'label'
|
|
label: 'label'
|
|
@@ -113,19 +97,54 @@ export default {
|
|
|
|
|
|
newGroupView: '', // 组件传过来的值
|
|
newGroupView: '', // 组件传过来的值
|
|
newGroupViewBack: '', // 组件传过来的值
|
|
newGroupViewBack: '', // 组件传过来的值
|
|
|
|
+
|
|
|
|
+ loadingBtn: false // 确定按钮loading
|
|
};
|
|
};
|
|
},
|
|
},
|
|
computed: {},
|
|
computed: {},
|
|
- watch: {},
|
|
|
|
|
|
+ watch: {
|
|
|
|
+ selectValue(val) {
|
|
|
|
+ this.$refs.tree.filter(val);
|
|
|
|
+ }
|
|
|
|
+ },
|
|
created() { },
|
|
created() { },
|
|
- mounted() {
|
|
|
|
- this.newGroupView = JSON.parse(JSON.stringify(this.groupView))
|
|
|
|
|
|
+ mounted() {
|
|
|
|
+ this.newGroupView = JSON.parse(JSON.stringify(this.groupView))
|
|
this.newGroupViewBack = JSON.parse(JSON.stringify(this.groupViewBack))
|
|
this.newGroupViewBack = JSON.parse(JSON.stringify(this.groupViewBack))
|
|
this.personnelList = JSON.parse(JSON.stringify(this.peopleList))
|
|
this.personnelList = JSON.parse(JSON.stringify(this.peopleList))
|
|
- },
|
|
|
|
|
|
+ let newPpeopleListId = JSON.parse(JSON.stringify(this.peopleListId))
|
|
|
|
+ if (newPpeopleListId.length > 0) {
|
|
|
|
+ if (this.groupView == 1) {
|
|
|
|
+ this.radioVal = newPpeopleListId[0]
|
|
|
|
+ } else if (this.groupView == 2) {
|
|
|
|
+ this.groupVal = newPpeopleListId
|
|
|
|
+ } else if (this.groupView == 3) {
|
|
|
|
+ // tree 额外处理
|
|
|
|
+ console.log('tree 额外处理')
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ console.log(this.groupVal)
|
|
|
|
+ if (this.peopleList.length <= 0) {
|
|
|
|
+ this.getPeople()
|
|
|
|
+ }
|
|
|
|
+ this.getDepartmentPersonnel()
|
|
|
|
+ },
|
|
methods: {
|
|
methods: {
|
|
onSearch() {
|
|
onSearch() {
|
|
- console.log('搜索', this.selectValue)
|
|
|
|
|
|
+ if (!this.selectValue) {
|
|
|
|
+ this.personnelList = JSON.parse(JSON.stringify(this.peopleList))
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ if (this.groupView != 3) {
|
|
|
|
+ this.personnelList = this.personnelList.filter(item => {
|
|
|
|
+ return item.name.indexOf(this.selectValue) != -1 || item.jobNumber.indexOf(this.selectValue) != -1
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ console.log(this.personnelList)
|
|
|
|
+ },
|
|
|
|
+ filterNode(value, data) {
|
|
|
|
+ if (!value) return true;
|
|
|
|
+ return data.label.indexOf(value) !== -1;
|
|
},
|
|
},
|
|
newGroupViewBackCli(flg, i) {
|
|
newGroupViewBackCli(flg, i) {
|
|
this.newGroupViewBack = flg
|
|
this.newGroupViewBack = flg
|
|
@@ -134,26 +153,66 @@ export default {
|
|
// 获取所有人员
|
|
// 获取所有人员
|
|
getPeople() {
|
|
getPeople() {
|
|
this.$axios.post('/user/getSimpleActiveUserList', {})
|
|
this.$axios.post('/user/getSimpleActiveUserList', {})
|
|
- .then(res => {
|
|
|
|
- if (res.code == "ok") {
|
|
|
|
- if(!this.peopleList) {
|
|
|
|
- this.peopleList = res.data.map(item => {
|
|
|
|
- return {
|
|
|
|
- name: item.name,
|
|
|
|
- id: item.id,
|
|
|
|
- phone: item.phone,
|
|
|
|
- jobNumber: item.jobNumber
|
|
|
|
- }
|
|
|
|
- })
|
|
|
|
|
|
+ .then(res => {
|
|
|
|
+ if (res.code == "ok") {
|
|
|
|
+ if (!this.peopleList) {
|
|
|
|
+ this.peopleList = res.data.map(item => {
|
|
|
|
+ return {
|
|
|
|
+ name: item.name,
|
|
|
|
+ id: item.id,
|
|
|
|
+ phone: item.phone,
|
|
|
|
+ jobNumber: item.jobNumber
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ this.$toast.clear();
|
|
|
|
+ this.$toast.fail(res.msg);
|
|
}
|
|
}
|
|
- } else {
|
|
|
|
- this.$toast.clear();
|
|
|
|
- this.$toast.fail(res.msg);
|
|
|
|
|
|
+ }).catch(err => { this.$toast.clear(); });
|
|
|
|
+ },
|
|
|
|
+ // 获取部门人员
|
|
|
|
+ getDepartmentPersonnel() {
|
|
|
|
+ this.$axios.post('/department/listAllMemb', {})
|
|
|
|
+ .then(res => {
|
|
|
|
+ if (res.code == "ok") {
|
|
|
|
+ let list = res.data;
|
|
|
|
+ this.setUserToDept(res.data)
|
|
|
|
+ this.personnelTree = list
|
|
|
|
+ this.newPersonnelTree = JSON.parse(JSON.stringify(list))
|
|
|
|
+ console.log(this.personnelTree)
|
|
|
|
+ } else {
|
|
|
|
+ this.$toast.clear();
|
|
|
|
+ this.$toast.fail(res.msg);
|
|
|
|
+ }
|
|
|
|
+ }).catch(err => { this.$toast.clear(); });
|
|
|
|
+ },
|
|
|
|
+ // 递归设置人员到部门
|
|
|
|
+ setUserToDept(list) {
|
|
|
|
+ for (var i in list) {
|
|
|
|
+ if (list[i].children != null) {
|
|
|
|
+ this.setUserToDept(list[i].children);
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ if (list[i].userList != null) {
|
|
|
|
+ if (list[i].children == null) {
|
|
|
|
+ list[i].children = [];
|
|
|
|
+ }
|
|
|
|
+ list[i].userList.forEach(element => {
|
|
|
|
+ var obj = { id: element.id, label: element.name, parentId: element.departmentId, isUser: 1 };
|
|
|
|
+ list[i].children.push(obj);
|
|
|
|
+ });
|
|
}
|
|
}
|
|
- }).catch(err => { this.$toast.clear(); });
|
|
|
|
|
|
+ }
|
|
},
|
|
},
|
|
- handClick () {
|
|
|
|
- this.teamAllocation(this.groupVal);
|
|
|
|
|
|
+ // 单选和复选点击确定触发的事件
|
|
|
|
+ handClick() {
|
|
|
|
+ let arr = this.groupView == 1 ? [this.radioVal] : this.groupVal
|
|
|
|
+ let newArr = this.personnelList.filter(item => {
|
|
|
|
+ return arr.includes(item.id)
|
|
|
|
+ })
|
|
|
|
+ this.loadingBtn = true
|
|
|
|
+ this.$emit('ChooseSomeoneChanhe', newArr)
|
|
}
|
|
}
|
|
},
|
|
},
|
|
};
|
|
};
|
|
@@ -189,12 +248,14 @@ export default {
|
|
overflow-y: auto;
|
|
overflow-y: auto;
|
|
padding: 10px;
|
|
padding: 10px;
|
|
}
|
|
}
|
|
- .treeBox_tree_text{
|
|
|
|
|
|
+
|
|
|
|
+ .treeBox_tree_text {
|
|
font-size: 14px;
|
|
font-size: 14px;
|
|
color: #999;
|
|
color: #999;
|
|
display: flex;
|
|
display: flex;
|
|
align-items: center;
|
|
align-items: center;
|
|
padding: 8px;
|
|
padding: 8px;
|
|
|
|
+
|
|
.van-icon {
|
|
.van-icon {
|
|
margin-right: 6px;
|
|
margin-right: 6px;
|
|
}
|
|
}
|
|
@@ -205,6 +266,7 @@ export default {
|
|
height: 30px;
|
|
height: 30px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+
|
|
.chooseSomeone_Con {
|
|
.chooseSomeone_Con {
|
|
flex: 1;
|
|
flex: 1;
|
|
background-color: #fff;
|
|
background-color: #fff;
|
|
@@ -255,5 +317,4 @@ export default {
|
|
width: 48%;
|
|
width: 48%;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-}
|
|
|
|
-</style>
|
|
|
|
|
|
+}</style>
|