307 lines
		
	
	
		
			9.1 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
			
		
		
	
	
			307 lines
		
	
	
		
			9.1 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
| 
 | ||
| //import API from '../../../utils/API.js'
 | ||
| import ArrayUtils from 'ArrayUtils.js'
 | ||
| //import EventBus from '../../../components/NotificationCenter/WxNotificationCenter.js'
 | ||
| 
 | ||
| 
 | ||
| 
 | ||
| Page({
 | ||
|   data: {
 | ||
|     currentList: [], //当前展示的列表
 | ||
|     selectList: [],  //已选择的元素列表
 | ||
|     originalList: [], //最原始的数据列表
 | ||
|     indexList: [],  //存储目录层级的数组,用于准确的返回上一层
 | ||
|     selectList: [],  //已选中的人员列表
 | ||
|   },
 | ||
| 
 | ||
|   onLoad: function (options) {
 | ||
|     wx.setNavigationBarTitle({
 | ||
|       title: '选择人员'
 | ||
|     })
 | ||
|     this.init();
 | ||
|   },
 | ||
| 
 | ||
|   init() {
 | ||
|     //上次选中的列表,用于判断是不是取消选中了
 | ||
|     this.lastTimeSelect = []
 | ||
|     wx.request({
 | ||
|       url: getApp().globalData.serverUrl + 'api/partuser?a=getall&parentid=company',
 | ||
|       header: {
 | ||
|         'content-type': 'application/json', // 默认值
 | ||
|         'Cookie': wx.getStorageSync("sessionid"),
 | ||
|       },
 | ||
|       data: {},
 | ||
|       success: res => {
 | ||
|         if (res.statusCode === 200) {
 | ||
|           let list = res.data.data
 | ||
|           console.log(list)
 | ||
|           this.setData({
 | ||
|             currentList: list,
 | ||
|             originalList:list
 | ||
|           })
 | ||
|         }
 | ||
|       }
 | ||
|     })
 | ||
|   },
 | ||
| 
 | ||
|   clickItem(res) {
 | ||
|     console.log(res)
 | ||
|     let index = res.currentTarget.id;
 | ||
|     let item = this.data.currentList[index]
 | ||
| 
 | ||
|     console.log("item", item)
 | ||
| 
 | ||
|     if (!item.isPeople) {
 | ||
|         //children的长度为0时,请求服务器
 | ||
|         if (item.children.length === 0) {
 | ||
|           this._getUserByGroup(item)
 | ||
|         } else {
 | ||
|           //children的长度不为0时,更新 currentList
 | ||
|           this.setData({
 | ||
|             currentList: item.children
 | ||
|           })
 | ||
|         
 | ||
|       }
 | ||
|       //将当前的索引存入索引目录中。索引多一个表示目录多一级
 | ||
|       let indexes = this.data.indexList
 | ||
|       indexes.push(index)
 | ||
|       //是目录不是具体的用户
 | ||
|       this.setData({
 | ||
|         indexList: indexes
 | ||
|       })
 | ||
|       //清空上次选中的元素列表,并设置上一层的选中状态给lastTimeSelect
 | ||
|       this.setLastTimeSelectList();
 | ||
|     }
 | ||
|   },
 | ||
| 
 | ||
| 
 | ||
|   //返回按钮
 | ||
|   goBack() {
 | ||
|     let indexList = this.data.indexList
 | ||
|     if (indexList.length > 0) {
 | ||
|       //返回时删掉最后一个索引
 | ||
|       indexList.pop()
 | ||
|       if (indexList.length == 0) {
 | ||
|         //indexList长度为0说明回到了最顶层
 | ||
|         this.setData({
 | ||
|           currentList: this.data.originalList,
 | ||
|           indexList: indexList
 | ||
|         })
 | ||
|       } else {
 | ||
|         //循环将当前索引的对应数组赋值给currentList
 | ||
|         let list = this.data.originalList
 | ||
|         for (let i = 0; i < indexList.length; i++) {
 | ||
|           let index = indexList[i]
 | ||
|           list = list[index].children
 | ||
|         }
 | ||
|         this.setData({
 | ||
|           currentList: list,
 | ||
|           indexList: indexList
 | ||
|         })
 | ||
|       }
 | ||
|       //清空上次选中的元素列表,并设置上一层的选中状态给lastTimeSelect
 | ||
|       this.setLastTimeSelectList();
 | ||
|     }
 | ||
|   },
 | ||
| 
 | ||
|   //清空上次选中的元素列表,并设置上一层的选中状态给lastTimeSelect
 | ||
|   setLastTimeSelectList() {
 | ||
|     this.lastTimeSelect = []
 | ||
|     this.data.currentList.forEach(item => {
 | ||
|       if (item.checked) {
 | ||
|         this.lastTimeSelect.push(item)
 | ||
|       }
 | ||
|     })
 | ||
|   },
 | ||
| 
 | ||
|   //根据部门获取下列列表
 | ||
|   _getUserByGroup(item) {
 | ||
|     wx.request({
 | ||
|       url: getApp().globalData.serverUrl + 'api/partuser?a=getall&parentid='+item.id,
 | ||
|       header: {
 | ||
|         'content-type': 'application/json', // 默认值
 | ||
|         'Cookie': wx.getStorageSync("sessionid"),
 | ||
|       },
 | ||
|       data: {},
 | ||
|       success: res => {
 | ||
|         if (res.statusCode === 200) {
 | ||
|           let list = res.data.data
 | ||
|           console.log(res.list)
 | ||
|           this.setData({
 | ||
|             currentList: list
 | ||
|           })
 | ||
|           this.addList2DataTree()
 | ||
|           this.setLastTimeSelectList();
 | ||
|         }
 | ||
|       }
 | ||
|     })
 | ||
|     // getApp().get(API.selectUserByGroup(), params, result => {
 | ||
|     //   console.log('result', result)
 | ||
|     //   let list = this.transformData(result.data.data, item.id)
 | ||
|     //   this.setData({
 | ||
|     //     currentList: list
 | ||
|     //   })
 | ||
|     //   this.addList2DataTree()
 | ||
|     //   //清空上次选中的元素列表,并设置上一层的选中状态给lastTimeSelect。写在这里防止异步请求时执行顺序问题
 | ||
|     //   this.setLastTimeSelectList();
 | ||
|     // })
 | ||
|   },
 | ||
| 
 | ||
| 
 | ||
| 
 | ||
|   //将请求的数据转化为需要的格式
 | ||
|   // transformData(list, parentId) {
 | ||
|   //   //先将数据转化为固定的格式
 | ||
|   //   let newList = []
 | ||
|   //   for (let i = 0; i < list.length; i++) {
 | ||
|   //     let item = list[i]
 | ||
|   //     newList.push({
 | ||
|   //       id: item.id,
 | ||
|   //       name: item.realName,
 | ||
|   //       parentId: parentId,
 | ||
|   //       checked: false,
 | ||
|   //       isPeople: true,
 | ||
|   //       userType: item.userType,
 | ||
|   //       gender: item.gender,
 | ||
|   //       children: []
 | ||
|   //     })
 | ||
|   //   }
 | ||
|   //   return newList;
 | ||
|   // },
 | ||
| 
 | ||
|   //将当前列表挂载在原数据树上, 目前支持5层目录,如需更多接着往下写就好
 | ||
|   addList2DataTree() {
 | ||
|     let currentList = this.data.currentList;
 | ||
|     let originalList = this.data.originalList;
 | ||
|     let indexes = this.data.indexList
 | ||
|     switch (indexes.length) {
 | ||
|       case 1:
 | ||
|         originalList[indexes[0]].children = currentList
 | ||
|         break;
 | ||
|       case 2:
 | ||
|         originalList[indexes[0]].children[indexes[1]].children = currentList
 | ||
|         break;
 | ||
|       case 3:
 | ||
|         originalList[indexes[0]].children[indexes[1]].children[indexes[2]].children = currentList
 | ||
|         break;
 | ||
|       case 4:
 | ||
|         originalList[indexes[0]].children[indexes[1]].children[indexes[2]].children[indexes[3]].children = currentList
 | ||
|         break;
 | ||
|       case 5:
 | ||
|         originalList[indexes[0]].children[indexes[1]].children[indexes[2]].children[indexes[3]].children[indexes[4]].children =currentList
 | ||
|         break;
 | ||
|       case 6:
 | ||
|         originalList[indexes[0]].children[indexes[1]].children[indexes[2]].children[indexes[3]].children[indexes[4]].children[indexes[5]].children = currentList
 | ||
|         break;
 | ||
|     }
 | ||
| 
 | ||
|     this.setData({
 | ||
|       originalList: originalList
 | ||
|     })
 | ||
|     console.log("originalList", originalList)
 | ||
|   },
 | ||
| 
 | ||
|   //选框变化回调
 | ||
|   checkChange(res) {
 | ||
|     console.log(res)
 | ||
|     let values = res.detail.value
 | ||
|     let selectItems = []
 | ||
|     //将值取出拼接成 id,name 格式
 | ||
|     values.forEach(value => {
 | ||
|       let arrs = value.split(",")
 | ||
|       selectItems.push({ id: arrs[0], name: arrs[1] })
 | ||
|     })
 | ||
|     console.log("selectItems", selectItems)
 | ||
|     console.log("lastTimeSelect", this.lastTimeSelect)
 | ||
| 
 | ||
|     //将本次选择的与上次选择的比对,本次比上次多说明新增了,本次比上次少说明删除了,找出被删除的那条数据,在footer中也删除
 | ||
|     if (selectItems.length > this.lastTimeSelect.length) {
 | ||
|       //将 selectList 与 selectItems 拼接并去重
 | ||
|       let newList = this.data.selectList.concat(selectItems)
 | ||
|       newList = ArrayUtils.checkRepeat(newList)
 | ||
|       this.setData({
 | ||
|         selectList: newList
 | ||
|       })
 | ||
|     } else {
 | ||
|       //找出取消勾选的item,从selectList中删除
 | ||
|       //比对出取消勾选的是哪个元素
 | ||
|       let diffItem = {}
 | ||
|       this.lastTimeSelect.forEach(item => {
 | ||
|         let flag = false;
 | ||
|         selectItems.forEach(item2 => {
 | ||
|           if (item.id === item2.id) {
 | ||
|             flag = true
 | ||
|           }
 | ||
|         })
 | ||
|         if (!flag) {
 | ||
|           diffItem = item
 | ||
|           console.log("diff=", item)
 | ||
|         }
 | ||
|       })
 | ||
|       //找出被删除的元素在 selectList 中的位置
 | ||
|       let list = this.data.selectList
 | ||
|       let delIndex = 0;
 | ||
|       for (let i = 0; i < list.length; i++) {
 | ||
|         if (list[i].id === diffItem.id) {
 | ||
|           delIndex = i;
 | ||
|           break;
 | ||
|         }
 | ||
|       }
 | ||
|       //从list中删除这个元素
 | ||
|       list.splice(delIndex, 1)
 | ||
|       this.setData({
 | ||
|         selectList: list
 | ||
|       })
 | ||
|     }
 | ||
|     console.log("selectList", this.data.selectList)
 | ||
|     //更新 currentList 选中状态并重新挂载在数据树上,以保存选择状态
 | ||
|     this.updateCurrentList(this.data.currentList, this.data.selectList)
 | ||
|   },
 | ||
| 
 | ||
|   //footer点击删除回调
 | ||
|   footerDelete(res) {
 | ||
|     console.log(res)
 | ||
|     this.setData({
 | ||
|       selectList: res.detail.selectList
 | ||
|     })
 | ||
| 
 | ||
|     console.log('selectList', this.data.selectList)
 | ||
|     this.updateCurrentList(this.data.currentList, res.detail.selectList)
 | ||
|   },
 | ||
| 
 | ||
|   //点击 footer 的确定按钮提交数据
 | ||
|   submitData(res) {
 | ||
|     let selectList = this.data.selectList
 | ||
|     //通过 WxNotificationCenter 发送选择的结果通知
 | ||
|     //EventBus.postNotificationName("SelectPeopleDone", selectList)
 | ||
|     //将选择结果存入 app.js 的 globalData
 | ||
|     getApp().globalData.selectPeopleList = selectList
 | ||
|     //返回
 | ||
|     wx.navigateBack({
 | ||
|       delta: 1
 | ||
|     })
 | ||
|     console.log("selectdone", selectList)
 | ||
|   },
 | ||
| 
 | ||
|   //更新 currentList 并将更新后的列表挂载在数据树上
 | ||
|   updateCurrentList(currentList, selectList) {
 | ||
|     //let newList = []
 | ||
|     let selectids = []
 | ||
|     for (var i = 0; i < selectList.length; i++) {
 | ||
|       selectids.push(selectList[i]['id'])
 | ||
|     }
 | ||
|     for (var i = 0; i < currentList.length; i++) {
 | ||
|       if (selectids.indexOf(currentList[i]['id'].toString())>=0){
 | ||
|         currentList[i]['checked']=true
 | ||
|       }else{
 | ||
|         currentList[i]['checked'] = false
 | ||
|       }
 | ||
|     }
 | ||
|     console.log(currentList)
 | ||
|     this.setData({
 | ||
|       currentList: currentList
 | ||
|     })
 | ||
|     this.addList2DataTree()
 | ||
|     this.setLastTimeSelectList()
 | ||
|   }
 | ||
| }) |