Commit 51c6c754 by zhangleyuan

Merge branch 'feature/zhangleyuan/20210812/opzi-organize' into 'master'

Feature/zhangleyuan/20210812/opzi organize

See merge request !92
parents 45a7f18a e168839f
......@@ -20,7 +20,7 @@
}
.container-left-body-table{
width: 300px;
height: 330px;
height: 360px;
overflow: scroll;
.ant-table {
border: none;
......
......@@ -142,6 +142,7 @@ function EmployeeManage() {
{
title: "员工",
dataIndex: "weChatAccount",
fixed:'left',
render: (val: string, record: RecordTypes) => {
return (
<div className="employee-info">
......@@ -200,6 +201,7 @@ function EmployeeManage() {
{
title: "操作",
dataIndex: "operation",
fixed:'right',
render: (val: string, record: RecordTypes) => {
return record.role === "学院管理员" ||
record.userId === User.getUserId() ? (
......@@ -470,12 +472,12 @@ function EmployeeManage() {
添加员工
</Button>
<Button className="update-user-btn" onClick={()=>{updateListData()}}>更新列表数据</Button>
<span className="origin-text">数据来源企业微信通讯录</span>
<span className="origin-text">系统实时同步企业微信可见范围的员工信息,如需修改请前往企微管理后台通讯录中操作</span>
<a
href="https://www.yuque.com/docs/share/8c66333f-ed62-469d-909e-b36389a115ea?#"
target="_blank"
>
<span className="view-text">查看数据更新说明</span>
<span className="view-text">查看说明</span>
</a>
</>
}
......@@ -487,6 +489,7 @@ function EmployeeManage() {
image: college,
description: '暂无数据'
}}
scroll={{ x: 1200 }}
size={"middle"}
pagination={false}
dataSource={employeeList}
......
/*
* @Author: wufan
* @Date: 2020-11-30 10:47:38
* @LastEditors: wufan
* @LastEditTime: 2021-06-21 11:13:15
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-08-13 16:52:16
* @Description: 学员管理页面
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......
......@@ -8,6 +8,7 @@ import college from "@/common/lottie/college.json";
import WWOpenDataCom from '@/components/WWOpenDataCom';
import StoreService from "@/domains/store-domain/storeService";
import { DepType } from "@/domains/store-domain/constants";
import Platform from '@/common/js/platform';
import User from "@/common/js/user";
import moment from "moment";
import "./DepartMentTabCon.less";
......@@ -31,11 +32,13 @@ function DepartMentTabCon(props) {
useEffect(()=>{
setSelectUser([]);
},[selectDep]);
const columns = [
{
title: "学员",
dataIndex: "nickName",
width: 220,
fixed:!Platform.isWorkWx(),
render: (val, item) => {
return (
<div>
......@@ -59,7 +62,6 @@ function DepartMentTabCon(props) {
{
title: "真实姓名",
dataIndex: "realName",
width: 180,
render: (val, record) => {
return <span>{val}</span>
},
......@@ -352,17 +354,21 @@ function DepartMentTabCon(props) {
{(props.currentTab === "postGrouptab" || props.currentTab === "customGroupTab") &&
<Button className="del-user-btn" onClick={()=>delUser('multiple')}>删除学员</Button>
}
{ selectDep.depId !== '10000' &&
{ selectDep.depId !== '10000' ?
<>
<Button className="update-user-btn" onClick={()=>{updateListData()}}>更新列表数据</Button>
<span className="origin-text">数据来源企业微信通讯录</span>
<a
href="https://www.yuque.com/docs/share/8c66333f-ed62-469d-909e-b36389a115ea?#"
target="_blank"
>
<span className="view-text">查看数据更新说明</span>
</a>
<div style={{marginTop:'12px'}}>
<span className="origin-text">系统实时同步企业微信可见范围的学员信息,如需修改请前往企微管理后台通讯录中操作</span>
<a
href="https://www.yuque.com/docs/share/8c66333f-ed62-469d-909e-b36389a115ea?#"
target="_blank"
>
<span className="view-text">查看说明</span>
</a>
</div>
</>
:
<span className="origin-text">微信学员通过授权或扫码登录后,数据自动同步到系统。</span>
}
</div>
)}
......@@ -422,19 +428,21 @@ function DepartMentTabCon(props) {
},
}}
/>
<div className="box-footer">
<PageControl
current={query.current - 1}
pageSize={query.size}
total={total}
toPage={(page) => {
const queryStates = _.clone(query);
queryStates.current = page + 1;
setQuery(queryStates);
getUserList(null,null,queryStates.current);
}}
/>
</div>
{total > 0 &&
<div className="box-footer">
<PageControl
current={query.current - 1}
pageSize={query.size}
total={total}
toPage={(page) => {
const queryStates = _.clone(query);
queryStates.current = page + 1;
setQuery(queryStates);
getUserList(null,null,queryStates.current);
}}
/>
</div>
}
</div>
</div>
{chooseMembersModalVisible && (
......
......@@ -503,7 +503,9 @@ function LeftStructureTree(props) {
function selectUserList(record, e) {
const _selectKeys = [];
_selectKeys.push(e.selectedNodes[0].id)
if(e.selectedNodes && e.selectedNodes.length>0){
_selectKeys.push(e.selectedNodes[0].id)
}
setSelectedKeys(_selectKeys);
props.onChangeSelectDep(e.selectedNodes[0]);
props.searchUserList(e.selectedNodes[0], treeType, 1);
......@@ -523,7 +525,7 @@ function LeftStructureTree(props) {
<div className="organization">
<div className="search-con">
{/* <Complete/> */}
{/* <AutoComplete
<AutoComplete
dropdownClassName="certain-category-search-dropdown"
dropdownMatchSelectWidth={250}
allowClear
......@@ -545,7 +547,7 @@ function LeftStructureTree(props) {
style={{ width: 250 }}
enterButton={<span className='icon iconfont'>&#xe832;</span>}
/>
</AutoComplete> */}
</AutoComplete>
</div>
{(props.treeType === 'postGrouptab' || props.treeType === 'customGroupTab') && (
<div className="operate">
......
......@@ -100,6 +100,9 @@
text-align:right;
}
}
.ant-select-item-option-grouped{
padding-left:12px;
}
.empty-con{
text-align:center;
.empty-img{
......
import React, { useEffect, useState } from "react";
import { withRouter } from "react-router-dom";
import { Tree} from "antd";
import { Tree,Tooltip} from "antd";
import StoreService from "@/domains/store-domain/storeService";
import User from '@/common/js/user';
import WWOpenDataCom from '@/components/WWOpenDataCom';
......@@ -40,7 +40,7 @@ function MemberTree(props) {
const _dataArray = dataArray.map((item,index)=>{
item.title = "";
item.key=item.id;
item.children = []
item.children = [];
if(item.departmentUserVOList){
item.children = item.departmentUserVOList;
}
......@@ -60,11 +60,10 @@ function MemberTree(props) {
const _checkedNodes = e.checkedNodes;
const _selectNodes = [];
_checkedNodes.map((item,index)=>{
if(item.userId){
// if(item.userId){
_selectNodes.push(item);
}
// }
})
console.log('_selectNodes',_selectNodes);
props.onSelect(_selectNodes);
}
return (
......@@ -75,7 +74,7 @@ function MemberTree(props) {
checkable
showIcon={false}
treeData={treeData}
checkedKeys={_.pluck(props.selectUserList, 'id')}
checkedKeys={_.pluck(props.selectList, 'id')}
onCheck={(selectedKeys,e)=>treeSelected(selectedKeys,e)}
titleRender={(nodeData) => {
return (
......@@ -83,15 +82,20 @@ function MemberTree(props) {
className="node-title-con"
>
{nodeData.userId ?
<div>
<>
<span className="icon iconfont title-icon">&#xe603;</span>
<span><WWOpenDataCom type="userName" openid={nodeData.userName}/></span>
</div>
<Tooltip title={<WWOpenDataCom type="userName" openid={nodeData.userName}/>}>
<span className="name"><WWOpenDataCom type="userName" openid={nodeData.userName}/></span>
</Tooltip>
</>
:
<div>
<>
<span className="icon iconfont title-icon">&#xe604;</span>
<span><WWOpenDataCom type="departmentName" openid={nodeData.name}/></span>
</div>
<Tooltip title={<WWOpenDataCom type="departmentName" openid={nodeData.name}/>}>
<span className="name"><WWOpenDataCom type="departmentName" openid={nodeData.name}/></span>
</Tooltip>
<span>({nodeData.departmentCount || 0})</span>
</>
}
</div>
);
......
......@@ -2,13 +2,29 @@
.node-title-con{
color:#666;
font-size:14px;
display: flex;
.name{
display: inline-block;
vertical-align: middle;
max-width:190px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.title-icon{
font-size:14px;
color:#999;
margin-right:8px;
}
}
.ant-tree .ant-tree-treenode {
padding: 8px 0 14px 0;
}
.ant-tree.ant-tree-directory .ant-tree-treenode-selected:hover::before, .ant-tree.ant-tree-directory .ant-tree-treenode-selected::before{
background: none;
background:transparent;
}
.ant-tree.ant-tree-directory .ant-tree-treenode-selected .ant-tree-switcher{
color:#000;
}
}
\ No newline at end of file
......@@ -18,17 +18,18 @@ function SearchUser(props) {
}
function onChange(e){
setDropDownVisible(true);
props.onChange(e.target.value)
}
function selectuser(e,item){
if(e.target.checked){
let _record = props.selectUserList
let _record = props.selectList
_record.push(item)
props.onSelect(_record,'user')
}else{
let _record = props.selectUserList
let _record = props.selectList
_record.map((_item,index)=>{
if(item.userId === item.userId){
if(_item.userId === item.userId){
_record.splice(index,1)
}
})
......@@ -36,9 +37,34 @@ function SearchUser(props) {
}
}
function selectDep(e,item){
console.log('item',item);
if(e.target.checked){
console.log('item',item);
props.onSelect(item,'department');
let _record = props.selectList;
let _userList = [];
_record.push(item); // 将当前选中的部门塞进来
if(item.departmentUserVOList){
_userList = item.departmentUserVOList; //获取当前选中的人
}
_record = [..._record,..._userList];
props.onSelect(_record,'department');
}else{
let _record = [];
let _userList = [];
props.selectList.map((_item,index)=>{
if(_item.id !== item.id){ //取消选择后将当前的部门移除也要将父部门也移除
_record.push(_item);
}
})
if(item.departmentUserVOList){
_userList = item.departmentUserVOList; //获取当前选中的人
}
const new_arr = _record.filter((x) => {return !_userList.some((item) => x.id === item.id)});
// _userList.map((_item,index)=>{
// if(_item.id === item.id){
// _record.splice(_item,index);
// }
// })
props.onSelect(new_arr,'department');
}
}
function documentClick(){
......@@ -58,14 +84,13 @@ function SearchUser(props) {
};
return (
<div className="search-user" style={{width:'300px'}} id="search-user">
{/* <Search
<Search
placeholder='搜索成员'
enterButton={<span className="icon iconfont">&#xe832;</span>}
onFocus={(e)=>{onFocus(e)}}
onChange={(e)=>{onChange(e)}}
className="search-input-item"
// onBlur={()=>{onBlur()}}
/> */}
/>
{dropDownVisible &&
<div className="drop-down">
<div className="drop-down__list">
......@@ -78,7 +103,7 @@ function SearchUser(props) {
<div>
{props.data.departmentUserVOList.map((item,index)=>{
return <div>
<Checkbox onChange={(e)=>{selectuser(e,item)}} checked={_.pluck(props.selectUserList, 'userId').indexOf(item.userId)=== -1?false:true}>
<Checkbox onChange={(e)=>{selectuser(e,item)}} checked={_.pluck(props.selectList, 'userId').indexOf(item.userId)=== -1?false:true}>
<div className="drop-down__item__con__item">
<div className="drop-down__item__con__item__left">
<span className="icon iconfont title-icon">&#xe603;</span>
......@@ -109,10 +134,14 @@ function SearchUser(props) {
<div className="drop-down__item__con">
<div>
{props.data.departmentVOList.map((item,index)=>{
return <div><Checkbox onChange={(e)=>{selectDep(e,item)}}>
return <div><Checkbox onChange={(e)=>{selectDep(e,item)}} checked={_.pluck(props.selectList, 'id').indexOf(item.id)=== -1?false:true}>
<div className="drop-down__item__con__item">
<div className="drop-down__item__con__item__left">
<WWOpenDataCom type="departmentName" openid={item.name}/>
<Tooltip title={ <WWOpenDataCom type="departmentName" openid={item.name}/>}>
<span className="departmentName">
<WWOpenDataCom type="departmentName" openid={item.name}/>
</span>
</Tooltip>
</div>
</div>
</Checkbox>
......
......@@ -10,10 +10,11 @@
box-shadow: 0px 2px 15px 6px rgba(0, 0, 0, 0.05);
border-radius:2px;
width:270px;
max-height:280px;
overflow-y: scroll;
// .drop-down__item-user{
// margin-bottom:30px;
// }
.drop-down__item__title{
font-size:14px;
color:#666;
......@@ -33,6 +34,14 @@
color:#999;
margin-right:3px;
}
.departmentName{
display: inline-block;
vertical-align: middle;
max-width:190px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
.drop-down__item__con__item__right{
width:84px;
......
......@@ -26,7 +26,8 @@ class NewChooseMembersModal extends React.Component {
constructor(props) {
super(props);
this.state = {
selectUserList:[],
selectList:[], //所有的选中项
selectUserList:[], // 所有的选中的用户
selectObject: {},
openSetModal: false,
visible:this.props.visible,
......@@ -84,26 +85,41 @@ class NewChooseMembersModal extends React.Component {
}
treeSelect = (record)=>{
// console.log('record',record)
this.setState({
selectUserList:record
selectList:record,
selectUserList:this.handleSelectUserList(record)
})
}
clearOneUser = (record) =>{
console.log("record",record);
const {selectUserList} = this.state;
const _selectUserList = selectUserList.filter((item,index)=>{
return item.userId !== record.userId
// 将所有的选中项里的人员挑出来
handleSelectUserList =(list)=>{
const _list = [];
list.map((item,index)=>{
if(item.userId){
_list.push(item);
}
})
console.log('selectUserList',selectUserList);
return _list
}
clearOneUser = (record) =>{
const {selectUserList,selectList} = this.state;
const _selectList = [];
selectList.map((item,index)=>{
if(item.userId !== record.userId && item.id !==record.departmentId){
_selectList.push(item);
}
}); //字部门移除时将其对应的父部门也移除
console.log('_selectList',_selectList);
this.setState({
selectUserList:_selectUserList
selectList:_selectList,
selectUserList:this.handleSelectUserList(_selectList)
})
}
// 清空所有成员
clearAllUser = () => {
this.setState({
selectList:[],
selectUserList : [],
})
}
......@@ -254,25 +270,23 @@ class NewChooseMembersModal extends React.Component {
}
confirmSearchSelect=(record,type)=>{
const { selectUserList } = this.state;
if(type==='user'){
this.setState({selectUserList:[...record]});
}else{
let _list = [];
if(record.departmentUserVOList){
_list = record.departmentUserVOList;
}
console.log('_list',_list);
this.setState({selectUserList:[...selectUserList,..._list]},()=>{
console.log('selectUserList',this.state.selectUserList);
});
}
const { selectUserList,selectList} = this.state;
this.setState({selectList:record,selectUserList:this.handleSelectUserList(record)});
// if(type==='user'){
// this.setState({selectList:[...record],selectUserList:this.handleSelectUserList(record)});
// }else{
// let _userList = [];
// if(record.departmentUserVOList){
// _userList = record.departmentUserVOList;
// }
// this.setState({selectList:[...selectList,..._userList],selectUserList:[...selectUserList,..._userList]});
// }
}
render() {
const {type,treeDepType,selectDep={},addDepType=''} = this.props;
const { id=''} = selectDep;
const {selectUserList,selectObject,visible,openSetModal,searchUserResultList} = this.state;
const {selectUserList,selectObject,visible,openSetModal,searchUserResultList,selectList} = this.state;
const title = type === 'USER' ? '添加员工' : '添加学员';
return (
<div>
......@@ -302,15 +316,9 @@ class NewChooseMembersModal extends React.Component {
<div className='member-container'>
<div className='container-left'>
<div className='container-left-body'>
{/* <Search
placeholder='搜索成员'
className='search search-input'
enterButton={<span className="icon iconfont">&#xe832;</span>}
/> */}
{/* {this.Complete()} */}
<SearchUser onChange={(value)=>{this.getCompleteOptionData(value)}} data={searchUserResultList} onSelect={(record,type)=>{this.confirmSearchSelect(record,type)}} selectUserList={selectUserList}/>
<SearchUser onChange={(value)=>{this.getCompleteOptionData(value)}} data={searchUserResultList} onSelect={(record,type)=>{this.confirmSearchSelect(record,type)}} selectUserList={selectUserList} selectList={selectList}/>
<div className='container-left-body-table'>
<MemberTree departmentId={id} treeDepType={treeDepType} nowTreeDepType={addDepType} onSelect={(record)=>{this.treeSelect(record)}} selectUserList={selectUserList} type={type}/>
<MemberTree departmentId={id} treeDepType={treeDepType} nowTreeDepType={addDepType} onSelect={(record)=>{this.treeSelect(record)}} selectUserList={selectUserList} type={type} selectList={selectList}/>
</div>
</div>
</div>
......
......@@ -23,7 +23,7 @@
}
.container-left-body-table{
width: 300px;
height: 330px;
max-height: 360px;
overflow: scroll;
.ant-table {
border: none;
......
/*
* @Author: yuananting
* @Date: 2021-02-25 11:23:47
* @LastEditors: yuananting
* @LastEditTime: 2021-06-03 17:12:01
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-08-13 17:05:37
* @Description: 助学工具-题库-题目列表数据
* @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment