Skip to content

X
xiaomai-cloud-class-web
Commit fe98d086 by zhangleyuan
Options

feat:处理岗位组的添加删除

parent 537099a7
Showing with 551 additions and 281 deletions
src/data-source/store/request-apis.ts
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: wufan * @Author: wufan
* @Date: 2020-11-25 18:25:02 * @Date: 2020-11-25 18:25:02
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @LastEditTime: 2021-07-26 16:05:10 * @LastEditTime: 2021-07-27 15:08:02
* @Description: Description * @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -81,7 +81,17 @@ export function getByDepartmentId(params: object) { ...@@ -81,7 +81,17 @@ export function getByDepartmentId(params: object) {
export function getDepartmentUser(params: object) { export function getDepartmentUser(params: object) {
return Service.Hades("/public/hades/getDepartmentAndDepartmentUserByName", params); return Service.Hades("/public/hades/getDepartmentAndDepartmentUserByName", params);
} }
export function getDepartmentUserNotPage(params: object) {
return Service.Hades("public/hades/getDepartmentAndDepartmentUserNotPageByName", params);
}
export function addDepartment(params: object) {
return Service.Hades("public/hades/addDepartment", params);
}
export function editDepartment(params: object) {
return Service.Hades("public/hades/editDepartment", params);
}
export function delDepartment(params: object) {
return Service.Hades("public/hades/delDepartment", params);
}
src/domains/store-domain/constants.ts
/* /*
* @Author: zhangleyuan * @Author: zhangleyuan
* @Date: 2021-01-19 11:27:56 * @Date: 2021-01-19 11:27:56
* @LastEditors: zhangleyuan * @LastEditors: Please set LastEditors
* @LastEditTime: 2021-03-08 10:36:04 * @LastEditTime: 2021-07-27 15:29:08
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -12,6 +12,7 @@ export const storeRoleEnum = { ...@@ -12,6 +12,7 @@ export const storeRoleEnum = {
"1": "管理员", "1": "管理员",
"2": "普通讲师" "2": "普通讲师"
}; };
export const industryList = ["IT服务","制造业","批发/零售","生活服务","文化/体育/娱乐业","建筑/房地产","教育","运输/物流/仓储","医疗","政府","金融","能源/采矿","农林渔牧","其他行业"]; export const industryList = ["IT服务","制造业","批发/零售","生活服务","文化/体育/娱乐业","建筑/房地产","教育","运输/物流/仓储","医疗","政府","金融","能源/采矿","农林渔牧","其他行业"];
export const childIndustryList = { export const childIndustryList = {
...@@ -29,4 +30,9 @@ export const childIndustryList = { ...@@ -29,4 +30,9 @@ export const childIndustryList = {
"能源/采矿":["电力/热力/燃气/水供应业","石油/天然气","煤炭","有色金属","钢铁","其他"], "能源/采矿":["电力/热力/燃气/水供应业","石油/天然气","煤炭","有色金属","钢铁","其他"],
"农林渔牧":["农林渔牧"], "农林渔牧":["农林渔牧"],
"其他行业":["科学研究和技术服务业","社会组织","水利和环境管理","国际组织","其他"] "其他行业":["科学研究和技术服务业","社会组织","水利和环境管理","国际组织","其他"]
}
export const DepType = {
'departMentTab':'DEP_ORG',
'postGrouptab':'DEP_POST',
'customGroupTab':'DEP_CUSTOM'
} }
\ No newline at end of file
src/domains/store-domain/storeService.ts
...@@ -2,13 +2,15 @@ ...@@ -2,13 +2,15 @@
* @Author: wufan * @Author: wufan
* @Date: 2020-11-25 18:25:02 * @Date: 2020-11-25 18:25:02
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @LastEditTime: 2021-07-26 16:06:29 * @LastEditTime: 2021-07-27 15:09:12
* @Description: Description * @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
import { getEmployeeList, getUserList, getStoreDecorationList, getStoreRole, addEmployee, editEmployee, deleteEmployee, getCourseCatalogList, import { getEmployeeList, getUserList, getStoreDecorationList, getStoreRole, addEmployee, editEmployee, deleteEmployee, getCourseCatalogList,
getAllSonCategory, addCourseCategory, delCourseCategory, editCourseCategory, deleteStoreDecorationList, addStoreBanner, editStoreBanner, getAllSonCategory, addCourseCategory, delCourseCategory, editCourseCategory, deleteStoreDecorationList, addStoreBanner, editStoreBanner,
moveBannerSequence,getStoreUserBasicPage,updateStoreMessage,getStoreDetail,getByDepartmentId,getDepartmentUser} from '@/data-source/store/request-apis'; moveBannerSequence,getStoreUserBasicPage,updateStoreMessage,getStoreDetail,getByDepartmentId,getDepartmentUser,getDepartmentUserNotPage,addDepartment,
editDepartment,delDepartment
} from '@/data-source/store/request-apis';
export default class StoreService { export default class StoreService {
// 获取员工列表 // 获取员工列表
...@@ -95,4 +97,16 @@ export default class StoreService { ...@@ -95,4 +97,16 @@ export default class StoreService {
static getDepartmentUser(params:any){ static getDepartmentUser(params:any){
return getDepartmentUser(params); return getDepartmentUser(params);
} }
static getDepartmentUserNotPage(params:any){
return getDepartmentUserNotPage(params);
}
static addDepartment(params:any){
return addDepartment(params);
}
static editDepartment(params:any){
return editDepartment(params);
}
static delDepartment(params:any){
return delDepartment(params);
}
} }
\ No newline at end of file
src/modules/college-manage/EmployeeManage.tsx
...@@ -408,16 +408,16 @@ function EmployeeManage() { ...@@ -408,16 +408,16 @@ function EmployeeManage() {
</div> </div>
</div> </div>
{model} {model}
{employeeModal && { employeeModal &&
<NewChooseMembersModal <NewChooseMembersModal
visible={employeeModal} visible={employeeModal}
type="USER" type="USER"
close={()=>{setEmployeeModal(false)}} close={()=>{setEmployeeModal(false)}}
onConfirm={() => { onConfirm={() => {
setEmployeeModal(false) setEmployeeModal(false)
message.success('添加成功') message.success('添加成功')
getEmployeeList(); getEmployeeList();
}} }}
/> />
} }
</div> </div>
......
src/modules/college-manage/components/CustomGroupTabCon.jsx
...@@ -9,81 +9,81 @@ import UserTable from "./UserTable"; ...@@ -9,81 +9,81 @@ import UserTable from "./UserTable";
import "./PostGroupTabCon.less"; import "./PostGroupTabCon.less";
const { Search } = Input; const { Search } = Input;
function CustomGroupTabCon() { function CustomGroupTabCon() {
const [addOrEditPostGroupShow, setAddOrEditPostGroupShow] = useState(false); // const [addOrEditPostGroupShow, setAddOrEditPostGroupShow] = useState(false);
const [postGroupModalType, setPostGroupModalType] = useState(""); // 初始化弹框类型为岗位组 // const [postGroupModalType, setPostGroupModalType] = useState(""); // 初始化弹框类型为岗位组
const [operatePostGroupModalType,setOperatePostGroupModalType] = useState(""); // 初始化弹框操作为添加操作 // const [operatePostGroupModalType,setOperatePostGroupModalType] = useState(""); // 初始化弹框操作为添加操作
const [postGroupModalTitle,setPostGroupModalTitle] = useState(""); // const [postGroupModalTitle,setPostGroupModalTitle] = useState("");
const [postGroupModalLable,setPostGroupModalLable] = useState(""); // const [postGroupModalLable,setPostGroupModalLable] = useState("");
const [postGroupName, setPostGroupName] = useState(""); // const [postGroupName, setPostGroupName] = useState("");
const [postGroupTreeData, setPostGroupTreeData] = useState([]); const [postGroupTreeData, setPostGroupTreeData] = useState([]);
function closeAddOrEditPostGroupModal() { // function closeAddOrEditPostGroupModal() {
setAddOrEditPostGroupShow(false); // setAddOrEditPostGroupShow(false);
} // }
//添加岗位组/岗位 // //添加岗位组/岗位
function addPostGroup(type) { // function addPostGroup(type) {
if (postGroupTreeData.length === 10) { // if (postGroupTreeData.length === 10) {
message.error("岗位组数量已达10个上限"); // message.error("岗位组数量已达10个上限");
return; // return;
} // }
setAddOrEditPostGroupShow(true); // setAddOrEditPostGroupShow(true);
setOperatePostGroupModalType("add"); // setOperatePostGroupModalType("add");
if(type==='postGroup'){ // if(type==='parentGroup'){
setPostGroupModalType('parentGroup'); //parentGroup 代表岗位组 // setPostGroupModalType('parentGroup'); //parentGroup 代表岗位组
setPostGroupModalTitle('添加分组集合'); // setPostGroupModalTitle('添加分组集合');
setPostGroupModalLable('分组集合'); // setPostGroupModalLable('分组集合');
}else{ // }else{
setPostGroupModalType('sub'); // setPostGroupModalType('sub');
setPostGroupModalTitle('添加分组'); // sub代表岗位 // setPostGroupModalTitle('添加分组'); // sub代表岗位
setPostGroupModalLable('分组'); // setPostGroupModalLable('分组');
} // }
} // }
//编辑岗位组/岗位 //编辑岗位组/岗位
function editPostGroup(record){ // function editPostGroup(record){
setAddOrEditPostGroupShow(true); // setAddOrEditPostGroupShow(true);
setOperatePostGroupModalType("edit"); // setOperatePostGroupModalType("edit");
//level为0的时候编辑的是岗位组 大于0的时候 // //level为0的时候编辑的是岗位组 大于0的时候
if(record.level===0){ // if(record.level===0){
setPostGroupModalType('parentGroup'); // setPostGroupModalType('parentGroup');
setPostGroupModalTitle('编辑分组集合'); // setPostGroupModalTitle('编辑分组集合');
setPostGroupModalLable('分组集合'); // setPostGroupModalLable('分组集合');
}else{ // }else{
setPostGroupModalType('sub'); // setPostGroupModalType('sub');
setPostGroupModalTitle('编辑分组'); // setPostGroupModalTitle('编辑分组');
setPostGroupModalLable('分组'); // setPostGroupModalLable('分组');
} // }
} // }
function getPostGroupTreeData(){ // function getPostGroupTreeData(){
} // }
function confirmAddOrEditPostGroup() { // function confirmAddOrEditPostGroup() {
getPostGroupTreeData() // getPostGroupTreeData()
} // }
function delPostGroup(record){ // function delPostGroup(record){
let title = '确认删除该分组集合吗？'; // let title = '确认删除该分组集合吗？';
let content= '删除后，该分组集合下的岗位及也将全部删除。'; // let content= '删除后，该分组集合下的岗位及也将全部删除。';
if(record.level>0){ // if(record.level>0){
title = '确认删除该分组吗？'; // title = '确认删除该分组吗？';
content = '删除后，不可恢复'; // content = '删除后，不可恢复';
} // }
Modal.confirm({ // Modal.confirm({
title, // title,
content, // content,
icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>, // icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>,
okText: '确定', // okText: '确定',
okType: 'danger', // okType: 'danger',
cancelText: '取消', // cancelText: '取消',
onOk: () => { // onOk: () => {
}, // },
}); // });
} // }
return ( return (
<div className="post-group-tab-con"> <div className="post-group-tab-con">
<div className="organization"> {/* <div className="organization">
<div className="search-con"> <div className="search-con">
<Search <Search
placeholder="搜索部门/学员姓名" placeholder="搜索部门/学员姓名"
...@@ -108,7 +108,13 @@ function CustomGroupTabCon() { ...@@ -108,7 +108,13 @@ function CustomGroupTabCon() {
editPostGroup={(record)=>editPostGroup(record)} editPostGroup={(record)=>editPostGroup(record)}
addPostGroup={(record)=>addPostGroup('post')} addPostGroup={(record)=>addPostGroup('post')}
/> />
</div> </div> */}
<LeftStructureTree
treeData={postGroupTreeData}
treeType={"customGroupTab"}
editPostGroup={(record)=>editPostGroup(record)}
addPostGroup={(record)=>addPostGroup(record)}
/>
<div className="table-con"> <div className="table-con">
<div className="operate-area"> <div className="operate-area">
<Button type="primary" className="add-user-btn"> <Button type="primary" className="add-user-btn">
...@@ -118,7 +124,7 @@ function CustomGroupTabCon() { ...@@ -118,7 +124,7 @@ function CustomGroupTabCon() {
</div> </div>
<UserTable /> <UserTable />
</div> </div>
{addOrEditPostGroupShow && ( {/* {addOrEditPostGroupShow && (
<AddOrEditPostGroupModal <AddOrEditPostGroupModal
onClose={() => { onClose={() => {
closeAddOrEditPostGroupModal(); closeAddOrEditPostGroupModal();
...@@ -133,7 +139,7 @@ function CustomGroupTabCon() { ...@@ -133,7 +139,7 @@ function CustomGroupTabCon() {
postGroupTreeData={postGroupTreeData} postGroupTreeData={postGroupTreeData}
label={postGroupModalLable} label={postGroupModalLable}
/> />
)} )} */}
</div> </div>
); );
} }
......
src/modules/college-manage/components/DepartMentTabCon.jsx
...@@ -16,17 +16,7 @@ function DepartMentTabCon() { ...@@ -16,17 +16,7 @@ function DepartMentTabCon() {
return ( return (
<div className="department-tab-con"> <div className="department-tab-con">
<div className="organization"> <LeftStructureTree treeType={'departMentTab'}/>
<div className="search-con">
<Search
placeholder="搜索部门/学员姓名"
className="search search-input"
style={{ width: 245 }}
enterButton={<span className="icon iconfont">&#xe832;</span>}
/>
</div>
<LeftStructureTree treeType={'departMentTab'}/>
</div>
<div className="table-con"> <div className="table-con">
<div className="operate-area"> <div className="operate-area">
<Button type="primary" className="add-user-btn" onClick={()=>{setChooseMembersModalVisible(true)}}>添加学员</Button> <Button type="primary" className="add-user-btn" onClick={()=>{setChooseMembersModalVisible(true)}}>添加学员</Button>
...@@ -37,7 +27,11 @@ function DepartMentTabCon() { ...@@ -37,7 +27,11 @@ function DepartMentTabCon() {
</div> </div>
<UserTable/> <UserTable/>
</div> </div>
<NewChooseMembersModal visible={chooseMembersModalVisible} type="CUSTOMER" close={()=>{closeChooseMembersModal()}} onConfirm={()=>{}}/> {
chooseMembersModalVisible &&
<NewChooseMembersModal visible={chooseMembersModalVisible} type="CUSTOMER" close={()=>{closeChooseMembersModal()}} onConfirm={()=>{}}/>
}
</div> </div>
); );
} }
......
src/modules/college-manage/components/LeftStructureTree.jsx
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { withRouter } from "react-router-dom"; import { withRouter } from "react-router-dom";
import { Tree, Input, Dropdown, Menu } from "antd"; import { Tree, Input, Dropdown, Menu,Button} from "antd";
import AddOrEditPostGroupModal from "../modal/AddOrEditPostGroupModal";
import User from '@/common/js/user'
import StoreService from "@/domains/store-domain/storeService";
import { DepType } from '@/domains/store-domain/constants';
import "./LeftStructureTree.less"; import "./LeftStructureTree.less";
const { Search } = Input; const { Search } = Input;
const { DirectoryTree } = Tree; const { DirectoryTree } = Tree;
function LeftStructureTree(props) { function LeftStructureTree(props) {
const {treeType} = props const {treeType} = props;
const treeData = [ const [treeData,setTreeData]=useState([]);
{ const [addOrEditPostGroupShow, setAddOrEditPostGroupShow] = useState(false);
title: "parent 1", const [postGroupModalLevel, setPostGroupModalLevel] = useState("");
key: "0-0", const [operatePostGroupModalType,setOperatePostGroupModalType] = useState("");
children: [ const [postGroupModalTitle,setPostGroupModalTitle] = useState("");
{ const [postGroupModalLable,setPostGroupModalLable] = useState("");
title: "parent 1-0", const [postGroupName, setPostGroupName] = useState("");
key: "0-0-0", const [currentGroupData,setCurrentGroupData] = useState({});
children: [ useEffect(()=>{
{ getTreeData();
title: "leaf", },[]);
key: "0-0-0-0",
disableCheckbox: true, function getTreeData(){
}, const params = {
{ depType:DepType[treeType],
title: "leaf", enterpriseId:User.getEnterpriseId(),
key: "0-0-0-1", source:0,//0代表来自企培
}, storeId:User.getStoreId(),
], userId:User.getUserId(),
}, whetherCount:true
{ }
title: "parent 1-1", StoreService.getDepartmentUser(params).then((res) => {
key: "0-0-1", let { departmentVOList=[]} = res.result;
children: [ let _treeData = handleData(departmentVOList);
{ console.log("_treeData",_treeData);
title:'aaa', setTreeData(_treeData);
key: "0-0-1-0", });
}, }
], function handleData(dataArray){
}, const _dataArray = dataArray.map((item,index)=>{
], item.key=item.id;
}, if(item.sonDepartmentVOList){
]; item.children = item.sonDepartmentVOList;
handleData(item.sonDepartmentVOList)
}
return item
})
return _dataArray;
}
const leftBoxWidth = const leftBoxWidth =
(document.getElementById("left-box") && (document.getElementById("left-box") &&
document.getElementById("left-box").style.width) || document.getElementById("left-box").style.width) ||
...@@ -49,29 +58,183 @@ function LeftStructureTree(props) { ...@@ -49,29 +58,183 @@ function LeftStructureTree(props) {
const moreOpenGroupOperate = (record) => ( const moreOpenGroupOperate = (record) => (
<Menu> <Menu>
<Menu.Item key="edit"> <Menu.Item key="edit">
<span onClick={()=>{props.editPostGroup(record)}}>编辑</span> <span onClick={()=>{treeType==='postGrouptab'?editPostGroup(record):editCustomGroup(record)}}>编辑</span>
</Menu.Item>
<Menu.Item key="add" >
<span onClick={()=>{props.addPostGroup()}}>
{props.treeType==='postGrouptab' &&
<span>新建岗位</span>
}
{props.treeType==='customGroupTab' &&
<span>新建分组</span>
}
</span>
</Menu.Item> </Menu.Item>
{record.depLevel ===0 &&
<Menu.Item key="add" >
<span onClick={()=>{treeType==='postGrouptab'?addPostGroup(1,record):addCustomGroup(1,record)}}>
{props.treeType==='postGrouptab' &&
<span>新建岗位</span>
}
{props.treeType==='customGroupTab' &&
<span>新建分组</span>
}
</span>
</Menu.Item>
}
<Menu.Item key="del"> <Menu.Item key="del">
<span onClick={()=>{props.delPostGroup(record)}}>删除</span> <span onClick={()=>{treeType==='postGrouptab'?delPostGroup(record):delCustomGroup(record)}}>删除</span>
</Menu.Item> </Menu.Item>
</Menu> </Menu>
); );
function closeAddOrEditPostGroupModal() {
setAddOrEditPostGroupShow(false);
}
//添加岗位组/岗位
function addPostGroup(level,record) {
if (treeData.length === 10) {
message.error("岗位组数量已达10个上限");
return;
}
setCurrentGroupData({});
setAddOrEditPostGroupShow(true);
setOperatePostGroupModalType("add");
setPostGroupModalLevel(level);
setCurrentGroupData(record)
if(level===0){
setPostGroupModalTitle('添加岗位组');
setPostGroupModalLable('岗位组');
}else{
setPostGroupModalTitle('添加岗位'); // sub代表岗位
setPostGroupModalLable('岗位');
}
}
//编辑岗位组/岗位
function editPostGroup(record){
setAddOrEditPostGroupShow(true);
setOperatePostGroupModalType("edit");
//level为0的时候编辑的是岗位组 大于0的时候
setPostGroupModalLevel(record.depLevel);
setCurrentGroupData(record)
if(record.depLevel===0){
setPostGroupModalTitle('编辑岗位组');
setPostGroupModalLable('岗位组');
}else{
setPostGroupModalTitle('编辑岗位');
setPostGroupModalLable('岗位');
}
}
function delPostGroup(record){
let title = '确认删除该岗位组吗？';
let content= '删除后，该岗位组下的岗位及也将全部删除。';
if(record.level>0){
title = '确认删除该岗位吗？';
content = '删除后，不可恢复';
}
Modal.confirm({
title,
content,
icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>,
okText: '确定',
okType: 'danger',
cancelText: '取消',
onOk: () => {
},
});
}
//添加自定义分组集合/分组
function addCustomGroup(level,record) {
if (treeData.length === 10) {
message.error("岗位组数量已达10个上限");
return;
}
setCurrentGroupData({});
setAddOrEditPostGroupShow(true);
setOperatePostGroupModalType("add");
setPostGroupModalLevel(level);
setCurrentGroupData(record)
if(level===0){
setPostGroupModalTitle('添加分组集合');
setPostGroupModalLable('分组集合');
}else{
setPostGroupModalTitle('添加分组'); // sub代表岗位
setPostGroupModalLable('分组');
}
}
//编辑自定义分组集合/分组
function editCustomGroup(record){
setAddOrEditPostGroupShow(true);
setOperatePostGroupModalType("edit");
setPostGroupModalLevel(record.level);
setCurrentGroupData(record)
//level为0的时候编辑的是岗位组 大于0的时候
if(record.level===0){
setPostGroupModalTitle('编辑分组集合');
setPostGroupModalLable('分组集合');
}else{
setPostGroupModalTitle('编辑分组');
setPostGroupModalLable('分组');
}
}
function delCustomGroup(record){
let title = '确认删除该分组集合吗？';
let content= '删除后，该分组集合下的岗位及也将全部删除。';
if(record.level>0){
title = '确认删除该分组吗？';
content = '删除后，不可恢复';
}
Modal.confirm({
title,
content,
icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>,
okText: '确定',
okType: 'danger',
cancelText: '取消',
onOk: () => {
},
});
}
function confirmAddOrEditPostGroup() {
closeAddOrEditPostGroupModal();
getTreeData()
}
return ( return (
<div className="left-structure-tree"> <div className="left-structure-tree">
<div className="tree-con"> <div className="organization">
<div className="search-con">
<Search
placeholder="搜索部门/学员姓名"
className="search search-input"
style={{ width: 245 }}
enterButton={<span className="icon iconfont">&#xe832;</span>}
/>
</div>
{ (treeType==='postGrouptab' || treeType=== 'customGroupTab') && (
<div className="operate">
{treeType==='postGrouptab' &&
<Button
className="add-btn"
onClick={() => {
addPostGroup(0)
}}
>
添加岗位组
</Button>
}
{treeType==='customGroupTab' &&
<Button
className="add-btn"
onClick={() => {
addCustomGroup(0)
}}
>
添加自定义分组
</Button>
}
</div>
)}
<div className="tree-con">
<DirectoryTree <DirectoryTree
defaultExpandAll defaultExpandAll
showIcon={false} showIcon={false}
...@@ -112,7 +275,7 @@ function LeftStructureTree(props) { ...@@ -112,7 +275,7 @@ function LeftStructureTree(props) {
}} }}
> >
<div className="item-icon"> <div className="item-icon">
<img src="https://image.xiaomaiketang.com/xm/iY4zdsEJb2.png" /> <span className="icon iconfont title-icon">&#xe604;</span>
</div> </div>
<div <div
className="item-title" className="item-title"
...@@ -125,21 +288,38 @@ function LeftStructureTree(props) { ...@@ -125,21 +288,38 @@ function LeftStructureTree(props) {
: "78%", : "78%",
}} }}
> >
{nodeData.title} <span>{nodeData.name}</span>
</div> </div>
<div className="item-count">（0）</div> <div className="item-count">({nodeData.departmentCount || 0})</div>
{ (treeType==='postGrouptab' || treeType=== 'customGroupTab') && (
{ (treeType==='postGrouptab' || treeType=== 'customGroupTab') && ( <Dropdown overlay={moreOpenGroupOperate(nodeData)}>
<Dropdown overlay={moreOpenGroupOperate(nodeData)}> <div className="item-more icon iconfont">&#xe927;</div>
<div className="item-more icon iconfont">&#xe927;</div> </Dropdown>
</Dropdown> )}
)}
</div> </div>
); );
}} }}
/> />
</div>
</div> </div>
{addOrEditPostGroupShow && (
<AddOrEditPostGroupModal
onClose={() => {
closeAddOrEditPostGroupModal();
}}
onConfirm={() => {
confirmAddOrEditPostGroup();
}}
title={postGroupModalTitle}
postGroupModalLevel={postGroupModalLevel}
modalOperateType={operatePostGroupModalType}
postGroupName={postGroupName}
postGroupTreeData={treeData}
label={postGroupModalLable}
currentTab={treeType}
currentGroupData={currentGroupData}
/>
)}
</div> </div>
); );
} }
......
src/modules/college-manage/components/LeftStructureTree.less
...@@ -2,6 +2,18 @@ ...@@ -2,6 +2,18 @@
margin-right: 24px; margin-right: 24px;
overflow: scroll; overflow: scroll;
height: calc(~'100vh - 260px'); height: calc(~'100vh - 260px');
.search-con{
margin-bottom: 10px;
}
.operate {
margin-bottom:16px;
.add-btn {
width: 230px;
height:32px;
}
}
&::-webkit-scrollbar { &::-webkit-scrollbar {
display: none; display: none;
} }
......
src/modules/college-manage/components/MemberTree.jsx
...@@ -9,7 +9,7 @@ const { DirectoryTree } = Tree; ...@@ -9,7 +9,7 @@ const { DirectoryTree } = Tree;
function MemberTree(props) { function MemberTree(props) {
const {treeType} = props; const {treeType} = props;
const {treeData,setTreeData}=useState([]); const [treeData,setTreeData]=useState([]);
useEffect(()=>{ useEffect(()=>{
getTreeData(); getTreeData();
},[]); },[]);
...@@ -20,29 +20,44 @@ function MemberTree(props) { ...@@ -20,29 +20,44 @@ function MemberTree(props) {
source:0,//0代表来自企培 source:0,//0代表来自企培
storeId:User.getStoreId(), storeId:User.getStoreId(),
userId:User.getUserId(), userId:User.getUserId(),
whetherCount:false
} }
StoreService.getDepartmentUser(params).then(() => { StoreService.getDepartmentUserNotPage(params).then((res) => {
const { departmentVOList=[]} = res.result; let { departmentVOList=[]} = res.result;
const _treeData = handleData(departmentVOList); let _treeData = handleData(departmentVOList);
console.log("_treeData",_treeData);
setTreeData(_treeData);
}); });
} }
function handleData(dataArray){ function handleData(dataArray){
dataArray.map((item,index)=>{ const _dataArray = dataArray.map((item,index)=>{
item.key=item.id; item.key=item.id;
item.children = []
if(item.departmentUserVOList){
item.children = item.departmentUserVOList;
}
if(item.sonDepartmentVOList){ if(item.sonDepartmentVOList){
item.children = item.sonDepartmentVOList; item.children = [...item.children,...item.sonDepartmentVOList];
handleData(item.sonDepartmentVOList) }
if(item.children.length > 0){
handleData(item.children)
}else{
delete item.children
} }
return item return item
}) })
return _dataArray;
} }
function treeSelected (selectedKeys,e){ function treeSelected (selectedKeys,e){
const _checkedNodes = e.checkedNodes; const _checkedNodes = e.checkedNodes;
const _selectNodes = _checkedNodes.map((item,index)=>{ const _selectNodes = [];
if(item.userType==='VISIBLE_USER'){ _checkedNodes.map((item,index)=>{
return item; if(item.userId){
_selectNodes.push(item);
} }
}) })
console.log('_selectNodes',_selectNodes);
props.onSelect(_selectNodes); props.onSelect(_selectNodes);
} }
return ( return (
...@@ -59,8 +74,17 @@ function MemberTree(props) { ...@@ -59,8 +74,17 @@ function MemberTree(props) {
<div <div
className="node-title-con" className="node-title-con"
> >
<span className="icon iconfont title-icon">&#xe603;</span> {nodeData.userId ?
<span>{nodeData.title}</span> <div>
<span className="icon iconfont title-icon">&#xe603;</span>
<span>{nodeData.userName}</span>
</div>
:
<div>
<span className="icon iconfont title-icon">&#xe604;</span>
<span>{nodeData.name}</span>
</div>
}
</div> </div>
); );
}} }}
......
src/modules/college-manage/components/PostGroupTabCon.jsx
...@@ -2,90 +2,85 @@ import React, { useEffect, useState } from "react"; ...@@ -2,90 +2,85 @@ import React, { useEffect, useState } from "react";
import { withRouter } from "react-router-dom"; import { withRouter } from "react-router-dom";
import { Button, Input, message,Modal} from "antd"; import { Button, Input, message,Modal} from "antd";
import LeftStructureTree from "./LeftStructureTree"; import LeftStructureTree from "./LeftStructureTree";
import AddOrEditPostGroupModal from "../modal/AddOrEditPostGroupModal";
import UserTable from "./UserTable"; import UserTable from "./UserTable";
import "./PostGroupTabCon.less"; import "./PostGroupTabCon.less";
const { Search } = Input; const { Search } = Input;
function PostGroupTabCon() { function PostGroupTabCon() {
const [addOrEditPostGroupShow, setAddOrEditPostGroupShow] = useState(false); // const [addOrEditPostGroupShow, setAddOrEditPostGroupShow] = useState(false);
const [postGroupModalType, setPostGroupModalType] = useState(""); // 初始化弹框类型为岗位组 // const [postGroupModalType, setPostGroupModalType] = useState("");
const [operatePostGroupModalType,setOperatePostGroupModalType] = useState(""); // 初始化弹框操作为添加操作 // const [operatePostGroupModalType,setOperatePostGroupModalType] = useState("");
const [postGroupModalTitle,setPostGroupModalTitle] = useState(""); // const [postGroupModalTitle,setPostGroupModalTitle] = useState("");
const [postGroupModalLable,setPostGroupModalLable] = useState(""); // const [postGroupModalLable,setPostGroupModalLable] = useState("");
const [postGroupName, setPostGroupName] = useState("");
const [postGroupTreeData, setPostGroupTreeData] = useState([]); const [postGroupTreeData, setPostGroupTreeData] = useState([]);
function closeAddOrEditPostGroupModal() { // function closeAddOrEditPostGroupModal() {
setAddOrEditPostGroupShow(false); // setAddOrEditPostGroupShow(false);
} // }
//添加岗位组/岗位 // //添加岗位组/岗位
function addPostGroup(type) { // function addPostGroup(type) {
if (postGroupTreeData.length === 10) { // if (postGroupTreeData.length === 10) {
message.error("岗位组数量已达10个上限"); // message.error("岗位组数量已达10个上限");
return; // return;
} // }
setAddOrEditPostGroupShow(true); // setAddOrEditPostGroupShow(true);
setOperatePostGroupModalType("add"); // setOperatePostGroupModalType("add");
if(type==='postGroup'){ // if(type==='parentGroup'){
setPostGroupModalType('parentGroup'); //parentGroup 代表岗位组 // setPostGroupModalType('parentGroup'); //parentGroup 代表岗位组
setPostGroupModalTitle('添加岗位组'); // setPostGroupModalTitle('添加岗位组');
setPostGroupModalLable('岗位组'); // setPostGroupModalLable('岗位组');
}else{ // }else{
setPostGroupModalType('sub'); // setPostGroupModalType('sub');
setPostGroupModalTitle('添加岗位'); // sub代表岗位 // setPostGroupModalTitle('添加岗位'); // sub代表岗位
setPostGroupModalLable('岗位'); // setPostGroupModalLable('岗位');
} // }
} // }
//编辑岗位组/岗位 // //编辑岗位组/岗位
function editPostGroup(record){ // function editPostGroup(record){
setAddOrEditPostGroupShow(true); // setAddOrEditPostGroupShow(true);
setOperatePostGroupModalType("edit"); // setOperatePostGroupModalType("edit");
//level为0的时候编辑的是岗位组 大于0的时候 // //level为0的时候编辑的是岗位组 大于0的时候
if(record.level===0){ // if(record.level===0){
setPostGroupModalType('parentGroup'); // setPostGroupModalType('parentGroup');
setPostGroupModalTitle('编辑岗位组'); // setPostGroupModalTitle('编辑岗位组');
setPostGroupModalLable('岗位组'); // setPostGroupModalLable('岗位组');
}else{ // }else{
setPostGroupModalType('sub'); // setPostGroupModalType('sub');
setPostGroupModalTitle('编辑岗位'); // setPostGroupModalTitle('编辑岗位');
setPostGroupModalLable('岗位'); // setPostGroupModalLable('岗位');
} // }
} // }
function delPostGroup(record){ // function delPostGroup(record){
let title = '确认删除该岗位组吗？'; // let title = '确认删除该岗位组吗？';
let content= '删除后，该岗位组下的岗位及也将全部删除。'; // let content= '删除后，该岗位组下的岗位及也将全部删除。';
if(record.level>0){ // if(record.level>0){
title = '确认删除该岗位吗？'; // title = '确认删除该岗位吗？';
content = '删除后，不可恢复'; // content = '删除后，不可恢复';
} // }
Modal.confirm({ // Modal.confirm({
title, // title,
content, // content,
icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>, // icon: <span className='icon iconfont default-confirm-icon'>&#xe6f4;</span>,
okText: '确定', // okText: '确定',
okType: 'danger', // okType: 'danger',
cancelText: '取消', // cancelText: '取消',
onOk: () => { // onOk: () => {
}, // },
}); // });
} // }
function getPostGroupTreeData(){ // function confirmAddOrEditPostGroup() {
// getPostGroupTreeData()
} // }
function confirmAddOrEditPostGroup() {
getPostGroupTreeData()
}
return ( return (
<div className="post-group-tab-con"> <div className="post-group-tab-con">
<div className="organization"> {/* <div className="organization">
<div className="search-con"> <div className="search-con">
<Search <Search
placeholder="搜索部门/学员姓名" placeholder="搜索部门/学员姓名"
...@@ -104,14 +99,15 @@ function PostGroupTabCon() { ...@@ -104,14 +99,15 @@ function PostGroupTabCon() {
添加岗位组 添加岗位组
</Button> </Button>
</div> </div>
<LeftStructureTree
treeData={postGroupTreeData} </div> */}
treeType={"postGrouptab"} <LeftStructureTree
editPostGroup={(record)=>editPostGroup(record)} treeData={postGroupTreeData}
addPostGroup={(record)=>addPostGroup('post')} treeType={"postGrouptab"}
delPostGroup={(record)=>delPostGroup('record')} editPostGroup={(record)=>editPostGroup(record)}
/> addPostGroup={(record)=>addPostGroup(record)}
</div> delPostGroup={(record)=>delPostGroup('record')}
/>
<div className="table-con"> <div className="table-con">
<div className="operate-area"> <div className="operate-area">
<Button type="primary" className="add-user-btn"> <Button type="primary" className="add-user-btn">
...@@ -121,7 +117,7 @@ function PostGroupTabCon() { ...@@ -121,7 +117,7 @@ function PostGroupTabCon() {
</div> </div>
<UserTable /> <UserTable />
</div> </div>
{addOrEditPostGroupShow && ( {/* {addOrEditPostGroupShow && (
<AddOrEditPostGroupModal <AddOrEditPostGroupModal
onClose={() => { onClose={() => {
closeAddOrEditPostGroupModal(); closeAddOrEditPostGroupModal();
...@@ -136,7 +132,7 @@ function PostGroupTabCon() { ...@@ -136,7 +132,7 @@ function PostGroupTabCon() {
postGroupTreeData={postGroupTreeData} postGroupTreeData={postGroupTreeData}
label={postGroupModalLable} label={postGroupModalLable}
/> />
)} )} */}
</div> </div>
); );
} }
......
src/modules/college-manage/components/PostGroupTabCon.less
.post-group-tab-con { .post-group-tab-con {
display: flex; display: flex;
.organization {
.search-con{
margin-bottom: 10px;
}
.operate {
margin-bottom:16px;
.add-btn {
width: 230px;
height:32px;
}
}
}
.table-con { .table-con {
margin-left: 16px; margin-left: 16px;
flex: 1; flex: 1;
......
src/modules/college-manage/modal/AddOrEditPostGroupModal.jsx
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: wufan * @Author: wufan
* @Date: 2020-11-27 16:21:49 * @Date: 2020-11-27 16:21:49
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @LastEditTime: 2021-07-23 14:56:55 * @LastEditTime: 2021-07-27 18:25:35
* @Description: Description * @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -10,24 +10,21 @@ import React, { useState, useEffect } from "react"; ...@@ -10,24 +10,21 @@ import React, { useState, useEffect } from "react";
import { Modal,Form,Input,Button,message} from "antd"; import { Modal,Form,Input,Button,message} from "antd";
import User from '@/common/js/user'; import User from '@/common/js/user';
import StoreService from "@/domains/store-domain/storeService"; import StoreService from "@/domains/store-domain/storeService";
import { DepType } from '@/domains/store-domain/constants';
import './AddOrEditPostGroupModal.less' import './AddOrEditPostGroupModal.less'
function AddOrEditPostGroupModal(props) { function AddOrEditPostGroupModal(props) {
const [nameErrorMsg,setNameErrorMsg] = useState(''); const [nameErrorMsg,setNameErrorMsg] = useState('');
const [validateStatus,setValidateStatus] = useState('success'); const [validateStatus,setValidateStatus] = useState('success');
const [postGroupName,setPostGroupName] = useState(''); const [postGroupName,setPostGroupName] = useState('');
useEffect(() => { useEffect(() => {
}); },[]);
function changePostGroupName(e){ function changePostGroupName(e){
setValidateStatus('success'); setValidateStatus('success');
setNameErrorMsg('该岗位组已存在');
props.postGroupTreeData.map((item,index)=>{ props.postGroupTreeData.map((item,index)=>{
if(item.name === e.target.value){ if(item.name === e.target.value){
setValidateStatus('error'); setValidateStatus('error');
setNameErrorMsg('') setNameErrorMsg('该岗位组已存在');
} }
return item; return item;
}) })
...@@ -35,13 +32,54 @@ function AddOrEditPostGroupModal(props) { ...@@ -35,13 +32,54 @@ function AddOrEditPostGroupModal(props) {
} }
function handleConfirm(){ function handleConfirm(){
props.onConfirm(); if(props.modalOperateType === 'add'){
addGroup();
}else{
editGroup();
}
} }
function addCatalog(){ function addGroup(){
const { postGroupModalLevel,currentTab,currentGroupData,label} = props
let parmas={
depLevel:postGroupModalLevel,
depType:DepType[currentTab],
departmentName:postGroupName,
enterpriseId:User.getEnterpriseId(),
source:0,
storeId:User.getStoreId(),
userId:User.getUserId()
}
if(postGroupModalLevel===0){
parmas.parentId = 0;
}else{
parmas.parentId = currentGroupData.id
}
StoreService.addDepartment(parmas).then((res) => {
message.success(`${label}创建成功`)
props.onConfirm();
});
} }
function editCatalog(){ function editGroup(){
const {postGroupModalLevel,currentTab,currentGroupData,label} = props
let parmas={
departmentLevel:postGroupModalLevel,
departmentId:props.currentGroupData.id,
depType:DepType[currentTab],
departmentName:postGroupName,
enterpriseId:User.getEnterpriseId(),
source:0,
storeId:User.getStoreId(),
userId:User.getUserId()
}
if(postGroupModalLevel===0){
parmas.parentId = 0;
}else{
parmas.parentId = currentGroupData.id
}
StoreService.editDepartment(parmas).then((res) => {
message.success(`${label}修改成功`)
props.onConfirm();
});
} }
return ( return (
<Modal <Modal
...@@ -78,10 +116,9 @@ function AddOrEditPostGroupModal(props) { ...@@ -78,10 +116,9 @@ function AddOrEditPostGroupModal(props) {
help={nameErrorMsg} help={nameErrorMsg}
> >
<Input type="text" placeholder={`请输入${props.label}名称（8个字以内）`} maxLength={8} style={{ width: 348 }} <Input type="text" placeholder={`请输入${props.label}名称（8个字以内）`} maxLength={8} style={{ width: 348 }}
defaultValue={props.postGroupName} defaultValue={props.modalOperateType==='edit'?props.currentGroupData.name:''}
onChange={(e) => { onChange={(e) => {
changePostGroupName(e); changePostGroupName(e);
}} /> }} />
</Form.Item> </Form.Item>
</Form> </Form>
......
src/modules/college-manage/modal/NewChooseMembersModal.jsx
...@@ -24,8 +24,8 @@ class NewChooseMembersModal extends React.Component { ...@@ -24,8 +24,8 @@ class NewChooseMembersModal extends React.Component {
this.state = { this.state = {
selectUserList:[], selectUserList:[],
selectObject: {}, selectObject: {},
visible:this.props.visible,
openSetModal: false, openSetModal: false,
visible:this.props.visible
} }
} }
...@@ -75,6 +75,7 @@ class NewChooseMembersModal extends React.Component { ...@@ -75,6 +75,7 @@ class NewChooseMembersModal extends React.Component {
} }
treeSelect = (record)=>{ treeSelect = (record)=>{
// console.log('record',record)
this.setState({ this.setState({
selectUserList:record selectUserList:record
}) })
...@@ -97,6 +98,7 @@ class NewChooseMembersModal extends React.Component { ...@@ -97,6 +98,7 @@ class NewChooseMembersModal extends React.Component {
selectUserList : [], selectUserList : [],
}) })
} }
addCustomer = () => { addCustomer = () => {
const { selectUserList } = this.state; const { selectUserList } = this.state;
let enterpriseVisibleUserIdList = []; // 保存新加进去的成员 let enterpriseVisibleUserIdList = []; // 保存新加进去的成员
...@@ -118,7 +120,7 @@ class NewChooseMembersModal extends React.Component { ...@@ -118,7 +120,7 @@ class NewChooseMembersModal extends React.Component {
selectUserList.map((item) => { selectUserList.map((item) => {
enterpriseUserList.push({ enterpriseUserList.push({
roleCode: item.roleCode, roleCode: item.roleCode,
enterpriseVisibleUserId: item.enterpriseVisibleUserId enterpriseVisibleUserId: item.userId
}) })
return enterpriseUserList return enterpriseUserList
}) })
...@@ -137,8 +139,8 @@ class NewChooseMembersModal extends React.Component { ...@@ -137,8 +139,8 @@ class NewChooseMembersModal extends React.Component {
} }
render() { render() {
const {type,openSetModal,visible} = this.props; const {type} = this.props;
const {selectUserList,selectObject} = this.state; const {selectUserList,selectObject,visible,openSetModal} = this.state;
const title = type === 'USER' ? '添加员工' : '添加学员'; const title = type === 'USER' ? '添加员工' : '添加学员';
return ( return (
<div> <div>
...@@ -156,7 +158,7 @@ class NewChooseMembersModal extends React.Component { ...@@ -156,7 +158,7 @@ class NewChooseMembersModal extends React.Component {
message.warning(type === 'USER' ? '请选择员工' : '请选择学员') message.warning(type === 'USER' ? '请选择员工' : '请选择学员')
return null; return null;
} }
type === 'USER' ? this.setState({ openSetModal: true},()=>{this.handleClose()}) : this.addCustomer(); type === 'USER' ? this.setState({openSetModal:true,visible:false}) : this.addCustomer();
}} }}
okText={type === 'USER' ? '下一步' : '确定'} okText={type === 'USER' ? '下一步' : '确定'}
title={title} title={title}
...@@ -189,7 +191,7 @@ class NewChooseMembersModal extends React.Component { ...@@ -189,7 +191,7 @@ class NewChooseMembersModal extends React.Component {
image: college, image: college,
description: '暂无数据' description: '暂无数据'
}} }}
rowKey={(record) => record.enterpriseVisibleUserId} rowKey={(record) => record.id}
dataSource={selectUserList} dataSource={selectUserList}
columns={this.selectedColumnsRight()} columns={this.selectedColumnsRight()}
showHeader={false} showHeader={false}
......
src/modules/college-manage/modal/SetEmployeeModal.jsx
...@@ -13,13 +13,13 @@ export default class SetEmployeeModal extends React.Component { ...@@ -13,13 +13,13 @@ export default class SetEmployeeModal extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
const list = props.list.map(item => { const list = props.list.map(item => {
item.roleCode = (props.selectObject || {})[item.enterpriseVisibleUserId] || (item.enterpriseRole === 'ADMIN' ? 'Cloud_Manager' : 'Cloud_Lecturer'); item.roleCode = (props.selectObject || {})[item.userId] || (item.enterpriseRole === 'ADMIN' ? 'Cloud_Manager' : 'Cloud_Lecturer');
return item; return item;
}) })
const selectedData = list[0] || {}; const selectedData = list[0] || {};
this.state = { this.state = {
list, list,
selected: selectedData.enterpriseVisibleUserId, selected: selectedData.userId,
roleCode: selectedData.roleCode, roleCode: selectedData.roleCode,
} }
} }
...@@ -27,7 +27,7 @@ export default class SetEmployeeModal extends React.Component { ...@@ -27,7 +27,7 @@ export default class SetEmployeeModal extends React.Component {
handleChangeValues(value) { handleChangeValues(value) {
const { list, selected } = this.state; const { list, selected } = this.state;
list.map((item) => { list.map((item) => {
if (item.enterpriseVisibleUserId === selected) { if (item.userId === selected) {
item.roleCode = value; item.roleCode = value;
} }
}) })
...@@ -62,15 +62,15 @@ export default class SetEmployeeModal extends React.Component { ...@@ -62,15 +62,15 @@ export default class SetEmployeeModal extends React.Component {
<div className="employee-box"> <div className="employee-box">
{list.map((item) => ( {list.map((item) => (
<div <div
className={`item ${selected === item.enterpriseVisibleUserId ? ' selected' : ''}`} className={`item ${selected === item.userId ? ' selected' : ''}`}
key={item.enterpriseVisibleUserId} key={item.userId}
onClick={() => { onClick={() => {
this.setState({ selected: item.enterpriseVisibleUserId, roleCode: item.roleCode }) this.setState({ selected: item.userId, roleCode: item.roleCode })
}} }}
> >
<span className="icon iconfont avatar-icon">&#xe84a;</span> <span className="icon iconfont avatar-icon">&#xe84a;</span>
<Tooltip title={item.name}> <Tooltip title={item.name}>
<span className='name'>{item.name}</span> <span className='name'>{item.userName}</span>
</Tooltip> </Tooltip>
<span className="tag">{tagMap[item.roleCode]}</span> <span className="tag">{tagMap[item.roleCode]}</span>
</div> </div>
......
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