Merge branch 'feature/zhangleyuan/20210719/personnel-organization' into 'master'

Feature/zhangleyuan/20210719/personnel organization

See merge request !82

src/bu-components/ChooseMembersModal.less

@@ -21,7 +21,7 @@
       .container-left-body-table{
         width: 300px;
         height: 330px;
-
+        overflow: scroll;
         .ant-table {
           border: none;
           min-height: 250px !important;

src/common/js/platform.js

+
+module.exports = {
+    isWeiXin() {
+      const ua = navigator.userAgent.toLowerCase();
+      return ua.indexOf('micromessenger') > 0;
+    },
+    isWorkWx (){
+     return  /wxwork/i.test(navigator.userAgent)
+    },
+    isAlipay() {
+      const ua = navigator.userAgent.toLowerCase();
+      return ua.indexOf('aliapp') > 0 || ua.indexOf('alipay') > 0;
+    },
+  
+    isXiaoMaiApp() {
+      const ua = navigator.userAgent.toLowerCase();
+      return ua.match(/xiaomai_ios/i) === 'xiaomai_ios' || ua.match(/xiaomai_android/i) === 'xiaomai_android';
+    },
+  
+    isXiaoMaiIOSApp() {
+      const ua = navigator.userAgent.toLowerCase();
+      return ua.match(/xiaomai_ios/i) === 'xiaomai_ios';
+    },
+  
+    isXiaoMaiAndroidApp() {
+      const ua = navigator.userAgent.toLowerCase();
+      return ua.match(/xiaomai_android/i) === 'xiaomai_android';
+    },
+  
+    isAndroid() {
+      const ua = navigator.userAgent.toLowerCase();
+      return /android/i.test(ua);
+    },
+    isIOS() {
+      const ua = navigator.userAgent.toLowerCase();
+      return /iphone|ipad|ipod/i.test(ua);
+    },
+    isMeiKe() {
+      const ua = navigator.userAgent.toLowerCase();
+      return /xmappc/i.test(ua);
+    },
+  };
+  
\ No newline at end of file

src/common/js/wechatApi.js

+/*
+ * @Author: wufan
+ * @Date: 2021-05-11 10:21:37
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-07-19 15:24:27
+ * @Description: 企业微信api
+ * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
+ * 
+ */
+
+import Platform from '@/common/js/platform';
+import User from '@/common/js/user';
+import Service from '@/common/js/service';
+
+export default class WechatApi {
+  static async initConfig(params = { isAgentConfig: false, url: '' }) {
+    if (Platform.isWorkWx()) {
+
+      return new Promise(async (resolve, reject) => {
+        Service.Hades('anon/hades/getWxCorpJSAPISignature', {
+          storeId: User.getStoreId(),
+          url: params.url,
+        }).then((result) => {
+          const res = result.result;
+          this.config({
+            beta: true, // 必须这么写，否则wx.invoke调用形式的jsapi会有问题
+            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
+            appId: res.appId, // 必填，企业微信的corpID
+            timestamp: res.timestamp, // 必填，生成签名的时间戳
+            nonceStr: res.nonceStr, // 必填，生成签名的随机串
+            signature: res.signature, // 必填，签名，见 附录-JS-SDK使用权限签名算法
+            jsApiList: ['chooseImage', 'shareToExternalContact', 'selectExternalContact', 'selectEnterpriseContact'],
+          }).then(() => {
+            Service.Hades('anon/hades/getWxWorkJSAPISignature', {
+              storeId: User.getStoreId(),
+              url: params.url,
+            }).then((result2) => {
+              const res2 = result2.result;
+              this.agentConfig({
+                corpid: res2.corpid, // 必填，企业微信的corpid，必须与当前登录的企业一致
+                agentid: res2.agentid, // 必填，企业微信的应用id （e.g. 1000247）
+                timestamp: res2.timestamp, // 必填，生成签名的时间戳
+                nonceStr: res2.nonceStr, // 必填，生成签名的随机串
+                signature: res2.signature, // 必填，签名，见附录-JS-SDK使用权限签名算法
+                jsApiList: ['selectExternalContact', 'getCurExternalContact', 'getContext', 'shareToExternalContact', 'sendChatMessage', 'shareToExternalChat'],
+                success: (res) => {
+                  console.log(res, 'res-agentconfig');
+                  console.info('window.WWOpenData', window.WWOpenData);
+                  resolve(res);
+                },
+                fail: (err) => {
+                  console.log(1213545344545)
+                  console.log(err, 'err-agentconfig');
+                  reject(err);
+                },
+              });
+            });
+
+          })
+
+
+        });
+      })
+
+    } else {
+      if (params.isAgentConfig) {
+        console.log(32132132, 'cesgu')
+        return new Promise(async (resolve, reject) => {
+          Service.Hades('anon/hades/getWxWorkJSAPISignature', {
+            storeId: User.getStoreId(),
+            url: params.url,
+          }).then((result2) => {
+            const res2 = result2.result;
+            this.agentConfig({
+              corpid: res2.corpid, // 必填，企业微信的corpid，必须与当前登录的企业一致
+              agentid: res2.agentid, // 必填，企业微信的应用id （e.g. 1000247）
+              timestamp: res2.timestamp, // 必填，生成签名的时间戳
+              nonceStr: res2.nonceStr, // 必填，生成签名的随机串
+              signature: res2.signature, // 必填，签名，见附录-JS-SDK使用权限签名算法
+              jsApiList: ['selectExternalContact', 'getCurExternalContact', 'getContext', 'shareToExternalContact', 'sendChatMessage', 'shareToExternalChat'],
+              success: (res) => {
+                console.log(res, 'res-agentconfig');
+                console.info('window.WWOpenData', window.WWOpenData);
+                resolve(res);
+              },
+              fail: (err) => {
+                console.log(1213545344545)
+                console.log(err, 'err-agentconfig');
+                reject(err);
+              },
+            });
+          });
+        });
+      }
+    }
+
+  }
+
+  static async config(config) {
+    return new Promise((resolve, reject) => {
+      console.info('wx.config', config);
+      wx.config(config);
+      wx.ready(resolve);
+      wx.error(reject);
+    }).then(
+      () => {
+        console.info('wx.ready');
+      },
+      (error) => {
+        console.error('wx.error', error);
+        throw error;
+      }
+    );
+  }
+
+  static async agentConfig(config) {
+    wx.agentConfig({ ...config });
+  }
+
+  static getCurExternalContact() {
+    return new Promise((resolve, reject) => {
+      wx.ready(() => {
+        wx.invoke('getCurExternalContact', {}, function (res) {
+          if (res.err_msg == 'getCurExternalContact:ok') {
+            resolve(res.userId); //返回当前外部联系人userId
+          } else {
+            reject(res.err_msg); //错误处理
+          }
+        });
+      });
+    });
+  }
+
+  static getContext() {
+    return new Promise((resolve, reject) => {
+      wx.ready(() => {
+        wx.invoke('getContext', {}, function (res) {
+          if (res.err_msg == 'getContext:ok') {
+            resolve(res.entry); //返回进入H5页面的入口类型，目前有normal、contact_profile、single_chat_tools、group_chat_tools、chat_attachment
+          } else {
+            reject(res.err_msg); //错误处理
+          }
+        });
+      });
+    });
+  }
+}

src/common/less/icon-font.less

 @font-face {
-  font-family: 'iconfont'; /* Project id 2223403 */
-  src: url('//at.alicdn.com/t/font_2223403_oe5p510553.woff2?t=1624259078391') format('woff2'),
-    url('//at.alicdn.com/t/font_2223403_oe5p510553.woff?t=1624259078391') format('woff'),
-    url('//at.alicdn.com/t/font_2223403_oe5p510553.ttf?t=1624259078391') format('truetype');
+  font-family: 'iconfont';  /* Project id 2223403 */
+  src: url('//at.alicdn.com/t/font_2223403_7261tsts1dc.woff2?t=1628475376853') format('woff2'),
+       url('//at.alicdn.com/t/font_2223403_7261tsts1dc.woff?t=1628475376853') format('woff'),
+       url('//at.alicdn.com/t/font_2223403_7261tsts1dc.ttf?t=1628475376853') format('truetype');
 }
 .iconfont {
   font-family: 'iconfont' !important;

src/components/WWOpenData.jsx

+import React, { useRef, useLayoutEffect } from 'react'
+export default function WWOpenDataCom({ type, openid }) {
+    const ref = useRef(null)
+    useLayoutEffect(() => {
+        console.log('1111');
+        console.log(WWOpenData);
+        WWOpenData && WWOpenData.bind(ref.current)
+    })
+    return <ww-open-data ref={ref} type={type} openid={openid} />
+}
\ No newline at end of file

src/components/WWOpenDataCom.jsx

+import React, { useContext, useRef, useLayoutEffect } from 'react'
+import { XMContext } from '@/store/context';
+import WWOpenData from './WWOpenData'
+export default function WWOpenDataCom(props) {
+
+    const ctx = useContext(XMContext);
+    const ref = useRef(null)
+
+    return ctx.xmState.wechatLogin ? <WWOpenData  {...props} /> : <div></div>
+
+}
\ No newline at end of file

src/core/global.less

@@ -1605,7 +1605,13 @@ input:focus {
   color: #2966FF !important;
   margin-right: 16px !important;
 }
-
+.default-warning-icon {
+  font-size: 22px !important;
+  line-height: 22px !important;
+  float: left !important;
+  color: #FF4F4F !important;
+  margin-right: 16px !important;
+}
 .m-content {
   position: absolute;
   top: 0;

src/data-source/store/request-apis.ts

 /*
  * @Author: wufan
  * @Date: 2020-11-25 18:25:02
- * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-03-09 10:28:03
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-07-30 17:00:06
  * @Description: Description
  * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
@@ -75,6 +75,36 @@ export function updateStoreMessage(params: object) {
 export function getStoreDetail(params: object) {
   return Service.Hades("public/hades/getStoreDetail", params);
 }
-
-
-
+export function getByDepartmentId(params: object) {
+  return Service.Hades("public/hades/getByDepartmentId", params);
+}
+export function getDepartmentUser(params: object) {
+  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);
+}
+export function queryDepartmentTree(params: object) {
+  return Service.Hades("public/hades/queryDepartmentTree", params);
+}
+export function getStoreCustomerAndDepNamePage(params: object) {
+  return Service.Hades("public/hades/getStoreCustomerAndDepNamePage", params);
+}
+export function delDepartmentUser(params: object) {
+  return Service.Hades("public/hades/delDepartmentUser", params);
+}
+export function syncWorkWeChatDepartment(params: object) {
+  return Service.Hades("public/hades/syncWorkWeChatDepartment", params);
+}
+export function getSyncCount(params: object) {
+  return Service.Hades("public/hades/getSyncCount", params);
+}

src/domains/store-domain/constants.ts

 /*
  * @Author: zhangleyuan
  * @Date: 2021-01-19 11:27:56
- * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-03-08 10:36:04
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-07-29 13:37:10
  * @Description: 描述一下
  * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
@@ -12,6 +12,7 @@ export const storeRoleEnum = {
     "1": "管理员",
     "2": "普通讲师"
 };
+
 export const industryList = ["IT服务","制造业","批发/零售","生活服务","文化/体育/娱乐业","建筑/房地产","教育","运输/物流/仓储","医疗","政府","金融","能源/采矿","农林渔牧","其他行业"];
 
 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

 /*
  * @Author: wufan
  * @Date: 2020-11-25 18:25:02
- * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-03-08 11:48:43
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-08-01 09:38:54
  * @Description: Description
  * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
 import { getEmployeeList, getUserList, getStoreDecorationList, getStoreRole, addEmployee, editEmployee, deleteEmployee, getCourseCatalogList,
    getAllSonCategory, addCourseCategory, delCourseCategory, editCourseCategory, deleteStoreDecorationList, addStoreBanner, editStoreBanner,
-    moveBannerSequence,getStoreUserBasicPage,updateStoreMessage,getStoreDetail} from '@/data-source/store/request-apis';
+  moveBannerSequence,getStoreUserBasicPage,updateStoreMessage,getStoreDetail,getByDepartmentId,getDepartmentUser,getDepartmentUserNotPage,addDepartment,
+  editDepartment,delDepartment,queryDepartmentTree,getStoreCustomerAndDepNamePage,delDepartmentUser,syncWorkWeChatDepartment,getSyncCount
+  } from '@/data-source/store/request-apis';
 
 export default class StoreService {
   // 获取员工列表 
@@ -89,4 +91,37 @@ export default class StoreService {
   static getStoreDetail(params: any) {
     return getStoreDetail(params);
   }
+  static getByDepartmentId(params:any){
+    return getByDepartmentId(params);
+  }
+  static getDepartmentUser(params:any){
+    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);
+  }
+  static queryDepartmentTree(params:any){
+    return queryDepartmentTree(params);
+  }
+  static getStoreCustomerAndDepNamePage(params:any){
+    return getStoreCustomerAndDepNamePage(params);
+  }
+  static delDepartmentUser(params:any){
+    return delDepartmentUser(params);
+  }
+  static syncWorkWeChatDepartment(params:any){
+    return syncWorkWeChatDepartment(params);
+  }
+  static getSyncCount(params:any){
+    return getSyncCount(params);
+  }
 }
\ No newline at end of file

src/index.html

@@ -2,7 +2,7 @@
  * @Author: 吴文洁
  * @Date: 2020-08-24 12:20:57
  * @LastEditors: Please set LastEditors
- * @LastEditTime: 2021-07-08 19:38:52
+ * @LastEditTime: 2021-08-11 20:25:11
  * @Description: 
  * @Copyright: 杭州杰竞科技有限公司 版权所有
 -->
@@ -29,8 +29,8 @@
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
     -->
-		<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-		<link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_oe5p510553.css" />
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_7261tsts1dc.css" />
 
 		<!--
       Notice the use of %PUBLIC_URL% in the tags above.
@@ -47,6 +47,8 @@
     <script type="text/javascript" src="https://image.xiaomaiketang.com/xm/PhotoClip.js"></script>
     <script type="text/javascript" charset="utf-8" src="//g.alicdn.com/sd/ncpc/nc.js?t=2015052012"></script>
     <script type="text/javascript" src="https://xiaomai-js.oss-cn-hangzhou.aliyuncs.com/loghub-xm-0.0.1-beta.js"></script>
+    <script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
+    <script type="text/javascript" src="//open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js"></script>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

src/modules/college-manage/EmployeeManage.less

@@ -5,4 +5,25 @@
     .add-show-btn{
         margin-top:12px;
     }
+    .update-user-btn{
+      margin-left:8px;
+      margin-right:8px;
+    }
+    .origin-text{
+        font-size:14px;
+        color:#999;
+    }
+    .view-text{
+        font-size:14px;
+        color:#5289FA;
+    }
+    .post-name{
+        max-width: 200px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+    }
+    .edit-disable{
+        color:#666 !important;
+    }
 }
\ No newline at end of file

src/modules/college-manage/EmployeeManage.tsx

@@ -9,16 +9,17 @@ import React, { useEffect, useState } from "react";
 import { withRouter } from "react-router-dom";
 import _ from "underscore";
 import { CheckBox, PageControl } from "@/components";
-import { Button, Table, Modal, message, Input } from "antd";
+import { Button, Table, Modal, message, Input,Tooltip} from "antd";
 import { XMTable } from '@/components';
 import college from '@/common/lottie/college.json';
 import StoreService from "@/domains/store-domain/storeService";
 import EmployeeAddOrEditModal from "../store-manage/EmployeeAddOrEditModal";
 import User from "@/common/js/user";
 import LimitTip from "./LimitTip";
+import WWOpenDataCom from '@/components/WWOpenDataCom';
 
 import "./EmployeeManage.less";
-import ChooseMembersModal from "./modal/ChooseMembersModal";
+import NewChooseMembersModal from "./modal/NewChooseMembersModal";
 const { confirm } = Modal;
 const { Search } = Input;
 
@@ -32,6 +33,7 @@ interface RecordTypes {
   phone: string;
   avatar?: string;
   weChatAccount?: string;
+  depNameList:any
 }
 
 interface RoleItemType {
@@ -56,6 +58,7 @@ interface ChoosedItemType {
   avatar?: string;
   storeUserId?: string;
   weChatAccount?: string;
+  depNameList?:any;
 }
 
 function EmployeeManage() {
@@ -138,7 +141,7 @@ function EmployeeManage() {
     const columns = [
       {
         title: "员工",
-        dataIndex: "nickName",
+        dataIndex: "weChatAccount",
         render: (val: string, record: RecordTypes) => {
           return (
             <div className="employee-info">
@@ -152,7 +155,10 @@ function EmployeeManage() {
                 />
               )}
 
-              <span className="title">{val}</span>
+              {/* <span className="title">{val}</span> */}
+              <span className="title">
+              <WWOpenDataCom type="userName" openid={val}/>
+              </span>
             </div>
           );
         },
@@ -166,7 +172,25 @@ function EmployeeManage() {
         },
       },
       {
-        title: "角色",
+        title: "部门",
+        dataIndex: "depNameList",
+        key: "depNameList",
+        render: (val:string,record:RecordTypes) => {
+          if(!record.depNameList){
+            return <span>-</span>
+          }
+          if(record.depNameList.length === 0){
+            return <span>-</span>
+          }
+          return <Tooltip title={<div>{handleDepName(record.depNameList)}</div>} placement='top' arrowPointAtCenter><div className="post-name"> {record.depNameList.map((item:any, index:any) => {
+            return <span><WWOpenDataCom type="departmentName" openid={item}/>{index<(record.depNameList.length -1)?'；':''}</span>
+            })}
+          </div>
+          </Tooltip>
+        },
+      },
+      {
+        title: "身份",
         dataIndex: "role",
         key: "role",
         render: (val: string) => {
@@ -182,9 +206,22 @@ function EmployeeManage() {
             <div className="no-operate">-</div>
           ) : (
             <div className="operation">
-              <span className="edit" onClick={() => handleEditEmployee(record)}>
-                编辑
-              </span>
+              {!record.depNameList && 
+                <span className="edit edit-disable">
+                  编辑
+                </span>
+              }
+              {record.depNameList &&
+                  (record.depNameList.length > 0 ?
+                    <span className="edit" onClick={() => handleEditEmployee(record)}>
+                      编辑
+                    </span>
+                    :
+                    <span className="edit edit-disable">
+                      编辑
+                    </span>
+                  )
+              }
               <span className="divider-line">{" | "}</span>
               <span
                 className="delete"
@@ -214,15 +251,23 @@ function EmployeeManage() {
     return columns;
   }
 
+  function handleDepName(depArray:any):any{
+    const depArrayDom = depArray.map((item:any, index:any) => {
+    return <span><WWOpenDataCom type="departmentName" openid={item}/>；</span>
+    });
+    return depArrayDom;
+  };
+
   function handleEditEmployee(record: RecordTypes) {
-    const { nickName, phone, roleCodes, avatar, id, weChatAccount } = record;
+    const { nickName, phone, roleCodes, avatar, id, weChatAccount,depNameList} = record;
     const _choosesItem = {
       nickName: nickName,
       phone: phone,
       role: roleCodes,
       avatar: avatar,
       storeUserId: id,
-      weChatAccount
+      weChatAccount,
+      depNameList:depNameList
     };
     setChooseItem(_choosesItem);
     const model: React.ReactNode = (
@@ -237,7 +282,8 @@ function EmployeeManage() {
             role: [],
             avatar: "",
             storeUserId: "",
-            weChatAccount:""
+            weChatAccount:"",
+            depNameList:[]
           });
         }}
         isWorkWechat={isWorkWechat}
@@ -273,7 +319,56 @@ function EmployeeManage() {
       getEmployeeList();
     });
   }
+  function updateListData(){
+    let num:any;
+    const params = {
+      enterpriseId:User.getEnterpriseId(),
+      storeId:User.getStoreId(),
+      userType:'USER'
+    }
+    StoreService.getSyncCount(params).then((res) => {
+      num = res.result;
+      if(num<3){
+        return confirm({
+          title: "确定更新列表数据吗？",
+          content: <span>员工数据来源企微通讯录，一天只能更新3次，今日还能更新<span style={{color:'#2966FF'}}>{3-num}</span>次。</span>,
+          icon: (
+            <span className="icon iconfont default-confirm-icon">&#xe839; </span>
+          ),
+          okText: "确定",
+          cancelText: "取消",
+          onOk: () => {
+            confirmUpdateListData()
+          },
+        });
+      }else{
+        Modal.warning({
+          title: '提示',
+          okText: '我知道了',
+          content: <span>员工数据今日更新次数已达上限<span style={{color:'#2966FF'}}>（3次）</span>，无法继续更新。</span>,
+          icon: (
+            <span className='icon iconfont default-confirm-icon' style={{ color: '#FFBB54 !important' }}>
+              &#xe834;
+            </span>
+          ),
+        });
+      }
+    });
+
+   
+  }
 
+  function confirmUpdateListData(){
+    const params = {
+      enterpriseId:User.getEnterpriseId(),
+      storeId:User.getStoreId(),
+      userType:'USER'
+    }
+    StoreService.syncWorkWeChatDepartment(params).then((res) => {
+      getEmployeeList();
+      message.success('已更新');
+    });
+  }
   return (
     <div className="page employee-manage-page">
         <div className="content-header">角色管理</div>
@@ -364,15 +459,25 @@ function EmployeeManage() {
               </div>
             </div>
             {(User.getUserRole() === 'CloudManager' || User.getUserRole() === 'StoreManager') &&
-              <Button
-                onClick={() => {
-                  handleToAddEmployee();
-                }}
-                type="primary"
-                className="add-show-btn"
-              >
-                添加员工
-              </Button>
+              <>
+                <Button
+                  onClick={() => {
+                    handleToAddEmployee();
+                  }}
+                  type="primary"
+                  className="add-show-btn"
+                >
+                  添加员工
+                </Button>
+                <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>
           <LimitTip type="员工" total={realTotal} tip={()=>{return (<div>数据为当前学院的员工数，若员工存在多个学院，企业人数只统计为1人</div>)}}/>
@@ -404,17 +509,17 @@ function EmployeeManage() {
           </div>
         </div>
         {model}
-        {employeeModal &&
-          <ChooseMembersModal
-            isOpen={employeeModal}
+        { employeeModal &&
+          <NewChooseMembersModal
+           treeDepType="DEP_CHAT"
+            visible={employeeModal}
             type="USER"
-            handleChooseModal={(bool: any) => {
+            close={()=>{setEmployeeModal(false)}}
+            onConfirm={() => {
               setEmployeeModal(false)
-              if (bool) {
-                message.success('添加成功')
-                getEmployeeList();
-              }
-            }}
+              message.success('添加成功')
+              getEmployeeList();
+              }}
           />
         }
     </div>

src/modules/college-manage/LimitTip.tsx

 /*
  * @Author: your name
  * @Date: 2021-08-04 15:21:36
- * @LastEditTime: 2021-08-04 15:23:37
+ * @LastEditTime: 2021-08-11 20:25:26
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: /xiaomai-cloud-class-web/src/modules/college-manage/LimitTip.tsx

src/modules/college-manage/NewUsersManagePage.jsx

+/*
+ * @Author: wufan
+ * @Date: 2020-11-30 10:47:38
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-08-11 20:31:26
+ * @Description: 学员管理页面
+ * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
+ */
+
+import React, { useEffect, useState } from "react";
+import { withRouter } from "react-router-dom";
+import _ from "underscore";
+import {Tabs,Input,Tree,Button} from "antd";
+import DepartMentTabCon from './components/DepartMentTabCon';
+import "./NewUsersManagePage.less";
+
+const { TabPane } = Tabs;
+
+
+function UserManagePage() {
+  const [currentTab, setCurrentTab] = useState("departMentTab");
+  const [courseList,setCourseList] = useState([]);
+  const [total, setTotal] = useState(0);
+  const [query, setQuery] = useState({
+    current: 0,
+    size: 10,
+  });
+  
+  return (
+    <div className="page new-user-manage-page">
+        <div className="content-header">学员管理</div>
+        <div className="box">
+          <div className="tab-box">
+            <Tabs
+              onChange={(key) => {
+                setCurrentTab(key);
+              }}
+              activeKey={currentTab}
+            >
+              <TabPane key="departMentTab" tab="部门"></TabPane>
+              <TabPane key="postGrouptab" tab="岗位组"></TabPane>
+              <TabPane key="customGroupTab" tab="自定义分组"></TabPane>
+            </Tabs>
+          </div>
+          <div className="box-body tab-con">
+            <DepartMentTabCon currentTab={currentTab}/>
+          </div>
+        </div>
+    </div>
+  );
+}
+
+export default withRouter(UserManagePage);

src/modules/college-manage/NewUsersManagePage.less

+.new-user-manage-page{
+    .ant-tabs-tab + .ant-tabs-tab{
+        margin:0;
+    }
+}
\ No newline at end of file

src/modules/college-manage/components/DepartMentTabCon.jsx

+import React, { useEffect, useState } from "react";
+import { withRouter } from "react-router-dom";
+import { Button, Input, message,Modal,Tooltip} from "antd";
+import NewChooseMembersModal from "@/modules/college-manage/modal/NewChooseMembersModal";
+import LeftStructureTree from "./LeftStructureTree";
+import { XMTable, PageControl } from "@/components";
+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 User from "@/common/js/user";
+import moment from "moment";
+import "./DepartMentTabCon.less";
+import Bus from "@/core/bus";
+import _ from 'underscore';
+const { Search } = Input;
+const { confirm } = Modal;
+const DefaultQuery = {
+  size: 10,
+  current:1,
+};
+function DepartMentTabCon(props) {
+  const [chooseMembersModalVisible, setChooseMembersModalVisible] = useState(
+    false
+  );
+  const [query, setQuery] = useState(DefaultQuery);
+  const [total, setTotal] = useState(0);
+  const [userListdata, setUserListData] = useState([]);
+  const [selectUser,setSelectUser] = useState([]); // 设置选中的用户
+  const [selectDep,setSelectDep] = useState({});
+  useEffect(()=>{
+    setSelectUser([]);
+  },[selectDep]);
+  const columns = [
+    {
+      title: "学员",
+      dataIndex: "nickName",
+      width: 220,
+      render: (val, item) => {
+        return (
+          <div>
+            {item.sourceEnum === "WORK_WE_CHAT" ?
+              <Tooltip title={<div><WWOpenDataCom type="userName" openid={val}/></div>}><span className="student-name"><WWOpenDataCom type="userName" openid={val}/></span></Tooltip>:
+              <Tooltip title={val}><span className="student-name">{val}</span></Tooltip>
+            }
+            <span
+              className="tag"
+              style={{
+                color:
+                  item.sourceEnum === "WORK_WE_CHAT" ? "#2966FF" : "#1DCC65",
+              }}
+            >
+              {item.sourceEnum === "WORK_WE_CHAT" ? "@企业微信" : "@微信"}
+            </span>
+          </div>
+        );
+      },
+    },
+    {
+      title: "真实姓名",
+      dataIndex: "realName",
+      width: 180,
+      render: (val, record) => {
+        return <span>{val}</span>
+      },
+    },
+    {
+      title: "账号",
+      dataIndex: "nickName",
+      width: "15%",
+      render: (val, item) => {
+        return <span>{val}</span>;
+      },
+    },
+    {
+      title: "岗位",
+      width: "15%",
+      dataIndex: "depNameList",
+      render: (val, record) => {
+        if(!record.depNameList){
+          return <span>-</span>
+        }else{
+          if(record.depNameList.length === 0){
+            return <span>-</span>
+          }
+          return <Tooltip title={handleDepName(record.depNameList)} placement='top' arrowPointAtCenter><div className="post-name"> {record.depNameList.map((item, index) => {
+            return <span>{item}{index!==record.depNameList.length-1 && <span>；</span>}</span>
+            })}
+          </div>
+          </Tooltip>
+        }
+
+      }
+    },
+    {
+      title: "手机号",
+      dataIndex: "phone",
+      width: "15%",
+      render: (val, item) => {
+        if(!val){
+            return <span>-</span>
+        }else{
+          return <span>{item.phone}</span>
+        }
+      },
+    },
+    {
+      title: "注册时间",
+      dataIndex: "created",
+      width: "15%",
+      render: (val, item) => {
+        return <div>{moment(val).format("YYYY-MM-DD HH:mm:ss")}</div>;
+      },
+    },
+    {
+      title: "操作",
+      key: "operate",
+      dataIndex: "operate",
+      width: 60,
+      fixed: 'right',
+      render: (val, item) => {
+        return (
+          <div className="operate">
+            {props.currentTab==='departMentTab'?
+              <span>-</span>
+              :
+              (selectDep.depLevel > 0 ?
+               <div className="operate__item" onClick={()=>delUser('single',item.userId)}>移出</div>
+               :
+               <span>-</span>
+              )
+            }
+          </div>
+        );
+      },
+    },
+  ];
+  function handleDepName(depArray){
+    let depStr = '';
+    depArray.forEach((item, index) => {
+      if (index < depArray.length - 1) {
+        depStr = depStr + item + '；';
+      } else {
+        depStr = depStr + item;
+      }
+    });
+    return depStr;
+  };
+  function closeChooseMembersModal() {
+    setChooseMembersModalVisible(false);
+  }
+  function getUserList(record,treeType,current) {
+    const params = {
+      ...query,
+      depType:DepType[treeType]|| DepType[props.currentTab],
+      enterpriseId: User.getEnterpriseId(),
+      source: 0,
+      storeId: User.getStoreId(),
+      userId: User.getUserId()
+    };
+    if(record){
+      if(record.id){
+        params.departmentId = record.id;
+      }else{
+        params.departmentId = null;
+      }
+      if(record.queryName){
+        params.nickName = record.queryName;
+      }else{
+        params.nickName = null;
+      }  
+    }
+    if (current) {
+      params.current = current;
+    }
+    setQuery(params);
+    console.log('params ++++ ',params);
+    StoreService.getStoreCustomerAndDepNamePage(params).then((res) => {
+      const { records = [], total } = res.result;
+      setUserListData(records);
+      setTotal(total);
+    });
+  }
+
+  function confirmAddCustomer() {
+    const _query = {
+      ...DefaultQuery,
+      id:query.departmentId
+    }
+    Bus.trigger("addCustomer",{treeType:props.currentTab,query:_query});
+  }
+
+  function delUser(type,userId){
+    let idList = [];
+    let title = '';
+    let content = '';
+    let okText = '';
+    if(type === 'single'){
+      idList.push(userId);
+    }
+    if(type==='multiple'){
+      idList = _.pluck(selectUser,'userId');
+    }
+    if(idList.length===0){
+      message.warning('请先选择要移出的学员')
+      return;
+    }
+    switch (props.currentTab){
+      case 'departMentTab':
+        title = '确定要删除学员吗？';
+        content = '删除后，该学员将从员工列表中删除，且看不到该学院用户端。';
+        okText = '删除';
+      break;
+      case 'postGrouptab':
+        title = '确定要移出该学员吗？';
+        content = '移出后，该学员将从岗位列表中移出。';
+        okText = '移出';
+      break;
+      case 'customGroupTab':
+        title = '确定要移出该学员吗？';
+        content = '移出后，该学员将从分组列表中移出。';
+        okText = '移出';
+      break;
+      default:
+        title = '确定要删除学员吗？';
+        content = '删除后，该学员将从员工列表中删除，且看不到该学院用户端。';
+        okText = '删除';
+      break;
+    }
+    return confirm({
+      title,
+      content,
+      icon: (
+        <span className="icon iconfont default-confirm-icon">&#xe839; </span>
+      ),
+      okText,
+      okType: "danger",
+      cancelText: "取消",
+      onOk: () => {
+        handleConfirmDelUser(idList);
+      },
+    });
+  }
+
+  function handleConfirmDelUser(idList){
+    const params = {
+      depType:DepType[props.currentTab],
+      idList,
+      storeId:User.getStoreId()
+    }
+    console.log('selectDep',selectDep)
+    if(selectDep.depId==='10000'){
+      params.userType='WE_CHAT';
+    }else{
+      params.userType='WORK_WE_CHAT';
+    }
+    params.departmentId = selectDep.id;
+    StoreService.delDepartmentUser(params).then((res) => {
+      if(props.currentTab === "departMentTab"){
+        message.success(`删除成功`);
+      }else{
+        message.success(`移出成功`);
+      }
+      getUserList();
+      Bus.trigger("changeTreeData",{treeType:props.currentTab});
+    });
+  }
+  function handleSelectUserList(record, selected){
+    let _list = [];
+    if (selected || !_.find(selectUser, (item) => item.userId === record.userId)) {
+      _list = _.uniq(selectUser.concat([record]), false, (item) => item.userId);
+    } else {
+      _list = _.reject(selectUser, (item) => item.userId === record.userId);
+    }
+    if (_list.length > 50) {
+      message.warning('无法继续选择，最多选择50个');
+      return;
+    }
+    console.log('selectUser',_list);
+    setSelectUser(_list);
+  };
+
+  function updateListData(){
+    let num;
+    const params = {
+      enterpriseId:User.getEnterpriseId(),
+      storeId:User.getStoreId(),
+      userType:'CUSTOMER'
+    }
+    StoreService.getSyncCount(params).then((res) => {
+      num = res.result;
+      if(num<3){
+        return confirm({
+          title: "确定更新列表数据吗？",
+          content: <span>学员数据来源企微通讯录，一天只能更新3次，今日还能更新<span style={{color:'#2966FF'}}>{3-num}</span>次。</span>,
+          icon: (
+            <span className="icon iconfont default-confirm-icon">&#xe839; </span>
+          ),
+          okText: "确定",
+          cancelText: "取消",
+          onOk: () => {
+            confirmUpdateListData()
+          },
+        });
+      }else{
+        Modal.warning({
+          title: '提示',
+          okText: '我知道了',
+          content: <span>学员数据今日更新次数已达上限<span style={{color:'#2966FF'}}>（3次）</span>，无法继续更新。</span>,
+          icon: (
+            <span className='icon iconfont default-confirm-icon' style={{ color: '#FFBB54 !important' }}>
+              &#xe834;
+            </span>
+          ),
+        });
+      }
+    });
+  }
+
+  function confirmUpdateListData(){
+    const params = {
+      enterpriseId:User.getEnterpriseId(),
+      storeId:User.getStoreId(),
+      userType:'CUSTOMER'
+    }
+    StoreService.syncWorkWeChatDepartment(params).then((res) => {
+      message.success('已更新');
+    });
+  }
+
+  return (
+    <div className="department-tab-con">
+        <LeftStructureTree
+          treeType={props.currentTab}
+          searchUserList={(params,treeType) => getUserList(params,treeType,1)}
+          onChangeSelectDep={(record)=>{setSelectDep(record);}}
+        />
+      <div className="table-con">
+        {props.currentTab === "departMentTab" && (
+          <div className="operate-area">
+            { selectDep.depId !== '10000' &&
+              <Button
+                type="primary"
+                className="add-user-btn"
+                onClick={() => {
+                  setChooseMembersModalVisible(true);
+                }}
+              >
+                添加学员
+              </Button>
+            }
+            {(props.currentTab === "postGrouptab" || props.currentTab === "customGroupTab") &&
+              <Button className="del-user-btn" onClick={()=>delUser('multiple')}>删除学员</Button>
+            }
+            { 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>
+        )}
+        {(props.currentTab === "postGrouptab" ||
+          props.currentTab === "customGroupTab") && (
+          <div className="operate-area">
+            {/* 岗位组和自定义分组只有岗位下和分组才展示添加学员*/}
+            {(selectDep.depLevel > 0) &&
+              <Button
+                type="primary"
+                className="add-user-btn"
+                onClick={() => {
+                  setChooseMembersModalVisible(true);
+                }}
+              >
+                添加学员
+              </Button>
+            }
+            {selectDep.depLevel > 0 &&
+              <Button className="del-user-btn" onClick={()=>delUser('multiple')}>移出学员</Button>
+            }
+          </div>
+        )}
+        <div className="user-table">
+          <XMTable
+            renderEmpty={{
+              image: college,
+              description: "暂无数据",
+            }}
+            scroll={{ x: 1200 }}
+            bordered
+            size="middle"
+            pagination={false}
+            columns={columns}
+            dataSource={userListdata}
+            rowKey={(record) => record.userId}
+            rowSelection={{
+              type: 'checkbox',
+              selectedRowKeys: _.pluck(selectUser, 'userId'),
+              onSelect: (record, selected) => {
+                console.log('record',record);
+                handleSelectUserList(record, selected)
+              },
+              onSelectAll: (selected, _selectedRows, changeRows) => {
+                let _list = [];
+                if (selected) {
+                  _list = _.uniq(selectUser.concat(changeRows), false, (item) => item.userId);
+                } else {
+                  _list = _.reject(selectUser, (item) => _.find(changeRows, (data) => data.userId === item.userId));
+                }
+                if (_list.length > 50) {
+                  message.warning('无法继续选择，最多选择50个');
+                  const extraLength = _list.length  - 50;
+                  _list.splice(_list.length - extraLength, extraLength);
+                }
+                setSelectUser(_list);
+              },
+            }}
+          />
+          <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 && (
+        <NewChooseMembersModal
+          visible={chooseMembersModalVisible}
+          type="CUSTOMER"
+          selectDep={selectDep}
+          treeDepType={
+            props.currentTab === "departMentTab" ? "DEP_CHAT" : "DEP_ORG"
+          }
+          addDepType={DepType[props.currentTab]}
+          close={() => {
+            closeChooseMembersModal();
+          }}
+          onConfirm={() => {
+            confirmAddCustomer();
+          }}
+        />
+      )}
+    </div>
+  );
+}
+
+export default withRouter(DepartMentTabCon);

src/modules/college-manage/components/DepartMentTabCon.less

+.department-tab-con{
+    display: flex;
+    .table-con{
+        flex:1;
+        max-width: calc(100% - 290px);
+        .post-name{
+          max-width: 200px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+        .student-name{
+          max-width: 120px;
+          white-space:nowrap;
+          overflow:hidden;
+          text-overflow:ellipsis;
+          vertical-align: middle;
+          display: inline-block; 
+        }
+        .operate-area{
+          margin-bottom:16px;
+          .add-user-btn{
+            margin-right:8px;
+          }
+          .del-user-btn{
+            margin-right:8px;
+          }
+          .update-user-btn{
+            margin-right:8px;
+          }
+          .origin-text{
+            font-size:14px;
+            color:#999;
+          }
+          .view-text{
+            font-size:14px;
+            color:#5289FA;
+          }
+        }
+        .operate{
+          .operate__item{
+            color:#2966FF;
+            cursor: pointer;
+          }
+        }
+      }
+}
\ No newline at end of file

src/modules/college-manage/components/LeftStructureTree.jsx

+import React, { useEffect, useState } from "react";
+import { withRouter } from "react-router-dom";
+import { Tree, Input, Dropdown, Menu,Button,Modal,message,AutoComplete,Tooltip} 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 Bus from '@/core/bus';
+import WWOpenDataCom from '@/components/WWOpenDataCom';
+import "./LeftStructureTree.less";
+
+const { Search } = Input;
+const { DirectoryTree } = Tree;
+const { Option } = AutoComplete;
+function LeftStructureTree(props) {
+  const {treeType} = props;
+  const [treeData,setTreeData]=useState([]);
+  const [addOrEditPostGroupShow, setAddOrEditPostGroupShow] = useState(false);
+  const [postGroupModalLevel, setPostGroupModalLevel] = useState(""); 
+  const [operatePostGroupModalType,setOperatePostGroupModalType] = useState(""); 
+  const [postGroupModalTitle,setPostGroupModalTitle] = useState("");
+  const [postGroupModalLable,setPostGroupModalLable] = useState("");
+  const [postGroupName, setPostGroupName] = useState("");
+  const [currentGroupData,setCurrentGroupData] = useState({});
+  const [completeOptions,setCompleteOption] = useState([]); 
+  const [selectedKeys,setSelectedKeys]= useState([]); // 设置选中的部门key值
+  const [queryName,setQueryName] = useState(''); // 搜索框内的值
+  const [selctQueryName,setSelctQueryName]= useState(''); // 搜索出结果后最终选择的名字
+  const [postGroupTreeData,setPostGroupTreeData] = useState([]); // 为了判定创建和编辑时的数据会不会重明
+  const [open,setOpen]=useState(false);
+  
+  useEffect(()=>{
+    setQueryName('');   //切换tab时搜索置空
+    setCompleteOption([]); 
+    setOpen(false); //切换tab时搜索的下拉框置为空
+    getTreeData().then((res)=>{
+      const _defaultSelectedKeys = [];
+      if(res.length > 0){
+        _defaultSelectedKeys.push(res[0].id);
+        setSelectedKeys(_defaultSelectedKeys);
+        props.onChangeSelectDep(res[0])
+        props.searchUserList(res[0],treeType,1);
+      }else{
+        props.searchUserList({id:null},treeType,1);
+      }
+    });
+  },[props.treeType]);
+ 
+  useEffect(()=>{
+    Bus.bind("addCustomer",(record)=>{addCustomer(record.treeType,record.query)})
+  },[]);
+  useEffect(()=>{
+    Bus.bind("changeTreeData",(record)=>{getTreeData(record.treeType)})
+  },[]);
+  const renderTitle = (title) => (
+    <span className="catalog-title">
+      {title}
+    </span>
+  );
+  const renderItem = (record,type) => ({
+    value: record.userName || record.name,
+    label: (
+      <div
+        className="search-result-item"
+        style={{
+          display: 'flex',
+          justifyContent: 'space-between',
+        }}
+        depId={record.id}
+        type={type}
+
+      >
+        {type === 'user'?
+          <div className="search-result-item__left">
+            <span className="icon iconfont title-icon">&#xe603;</span>
+            <WWOpenDataCom type="userName" openid={record.userName}/>
+          </div>
+          :
+          <div className="search-result-item__left"><WWOpenDataCom type="departmentName" openid={record.name}/></div>
+        }
+        {type === 'user' && (
+          <div className="search-result-item__right">
+            <Tooltip  title={<div>{handleDepName(record.depNamesList)}</div>} placement='top' arrowPointAtCenter>
+                  {record.depNamesList.map((item,index)=>{
+                  return <span><WWOpenDataCom type="departmentName" openid={item}/>{index<(record.depNamesList.length -1)?';':''}</span>
+                  })}
+              </Tooltip>
+          </div>
+        )}
+        {type === 'post' &&
+          <span type='post' openid={record.parentName}>{record.parentName}</span>
+        }
+      </div>
+    ),
+  });
+
+  const notFoundContentNode = ()=>{
+    return  <div className="empty-con">
+    <img src="https://image.xiaomaiketang.com/xm/wRDrb2pJFb.png" className="empty-img"/>
+    <div className="empty-text">暂无数据</div>
+  </div>
+  }
+  function handleDepName(depArray){
+    const depArrayDom = depArray.map((item, index) => {
+    return <span><WWOpenDataCom type="departmentName" openid={item}/>；</span>
+    });
+    return depArrayDom;
+  };
+  function handlePlaceHolder(){
+    let placeholder = '';
+    switch (props.treeType){
+      case 'departMentTab':
+        placeholder = '搜索学员姓名、部门';
+      break;
+      case 'postGrouptab':
+        placeholder = '搜索学员姓名/岗位/岗位组';
+      break;
+      case 'customGroupTab':
+        placeholder = '搜索学员姓名/自定义分组集合/自定义分组';
+      break;
+      default:
+      break;  
+    }
+    return placeholder
+  }
+  function confirmSearchSelect(value,option){
+    const param = {}
+    setOpen(false);
+    setQueryName(value);
+    if(option.label.props.type === 'user'){
+      param.queryName = value;
+    }else{
+      param.id = option.label.props.depId;
+    }
+    props.searchUserList(param,treeType,1);
+  }
+
+  // 获取关键词的搜索结果
+  function getCompleteOptionData(value){
+    // setQueryName(value);
+    setCompleteOption([]);
+    if(!value){
+      return  
+    }
+    const params = {
+      depType:DepType[props.treeType], 
+      queryName:value,
+      enterpriseId:User.getEnterpriseId(),
+      source:0,//0代表来自企培
+      storeId:User.getStoreId(),
+      userId:User.getUserId(),
+      whetherCount:false,
+      distinct:false,
+      queryType:'CUSTOMER'
+    }
+    StoreService.getDepartmentUser(params).then((res) => {
+      const _completeOptions = [];
+      const userObj = {};
+      const departmentGroupObj = {};
+      const postobj = {};
+      const { result = {}} = res;
+      const {departmentUserVOList=[],departmentVOList=[],subLevelDepartmentVOList=[]} = result;
+      if(departmentUserVOList.length>0){
+        userObj.label=renderTitle('学员');
+        userObj.options=departmentUserVOList.map((item,index)=>{
+          return renderItem(item,'user');
+        })
+      }
+      if(departmentVOList.length>0){
+        switch (props.treeType){
+          case 'departMentTab':
+            departmentGroupObj.label=renderTitle('部门');
+          break;
+          case 'postGrouptab':
+            departmentGroupObj.label=renderTitle('岗位组');
+          break;
+          case 'customGroupTab':
+            departmentGroupObj.label=renderTitle('分组集合');
+          break;
+          default:
+          break;  
+        }
+        departmentGroupObj.options=departmentVOList.map((item,index)=>{
+          return renderItem(item,'group');
+        })
+      }
+      if(subLevelDepartmentVOList.length>0){
+        switch (props.treeType){
+          case 'postGrouptab':
+            postobj.label=renderTitle('岗位');
+          break;
+          case 'customGroupTab':
+            postobj.label=renderTitle('分组');
+          break;
+          default:
+          break;  
+        }
+        postobj.options=subLevelDepartmentVOList.map((item,index)=>{
+          return renderItem(item,'post');
+        })
+      }
+      if(Object.keys(userObj).length !==0){
+        _completeOptions.push(userObj);
+      }
+      if(Object.keys(departmentGroupObj).length !==0){
+        _completeOptions.push(departmentGroupObj);
+      }
+      if(Object.keys(postobj).length !==0){
+        _completeOptions.push(postobj);
+      }
+      setCompleteOption(_completeOptions);
+    });
+  }
+
+ 
+  async function addCustomer(treeType,query){
+    await getTreeData(treeType);
+    props.searchUserList(query,treeType,1);
+  }
+  function getTreeData(treeType){
+    return new Promise((resolve,reject)=>{
+      const params = {
+        departmentTypeEnum:DepType[treeType] || DepType[props.treeType],
+        enterpriseId:User.getEnterpriseId(),
+        source:0,//0代表来自企培
+        storeId:User.getStoreId(),
+        userId:User.getUserId(),
+        whetherCount:true
+      }
+      StoreService.queryDepartmentTree(params).then((res) => {
+        const { result = []} = res
+        let { departmentVOList=[] } =result;
+        let _treeData = handleData(result);
+        setTreeData(_treeData);
+        resolve(result);
+      });
+
+    })
+   
+  }
+  function handleData(dataArray){
+    const _dataArray = dataArray.map((item,index)=>{
+      item.title = "";
+      item.key=item.id;
+      if(item.sonDepartmentVOList){
+        item.children = item.sonDepartmentVOList;
+        handleData(item.sonDepartmentVOList)
+      }
+      return item
+    })
+    return _dataArray;
+  }
+  const leftBoxWidth =
+    (document.getElementById("left-box") &&
+      document.getElementById("left-box").style.width) ||
+    "304px";
+
+  const moreOpenGroupOperate = (record) => (
+    <Menu>
+      <Menu.Item key="edit">
+        <span onClick={()=>{props.treeType==='postGrouptab'?editPostGroup(record):editCustomGroup(record)}}>编辑</span>
+      </Menu.Item>
+      {record.depLevel ===0 &&
+        <Menu.Item key="add" >
+          <span onClick={()=>{props.treeType==='postGrouptab'?addPostGroup(1,record):addCustomGroup(1,record)}}>
+            {props.treeType==='postGrouptab' &&
+              <span>新建岗位</span>
+            }
+            {props.treeType==='customGroupTab' &&
+              <span>新建分组</span>
+            }
+          </span>
+        </Menu.Item>
+      }
+      {/* { (record.departmentCount === 0 || !record.departmentCount) && */}
+        <Menu.Item key="del">
+          <span onClick={()=>{props.treeType==='postGrouptab'?delPostGroup(record):delCustomGroup(record)}}>删除</span>
+        </Menu.Item>
+      {/* } */}
+    </Menu>
+  );
+
+
+  function closeAddOrEditPostGroupModal() {
+    setAddOrEditPostGroupShow(false);
+  }
+
+  //添加岗位组/岗位
+  function addPostGroup(level,record) {
+    if(level===0){
+      if (treeData.length > 9) {
+        message.error("岗位组数量已达10个上限");
+        return;
+      }
+    }
+    if(level===1){
+      if(record.sonDepartmentVOList){
+        if(record.sonDepartmentVOList.length > 19){
+          message.error("岗位数量已达20个上限");
+          return;
+        }
+      }
+    }
+ 
+    setCurrentGroupData({});
+    setAddOrEditPostGroupShow(true);
+    setOperatePostGroupModalType("add");
+    setPostGroupModalLevel(level);
+    setCurrentGroupData(record);
+    console.log('treeData',record);
+    if(level===0){
+      setPostGroupModalTitle('添加岗位组');
+      setPostGroupModalLable('岗位组');
+      setPostGroupTreeData(treeData);
+    }else{
+      setPostGroupModalTitle('添加岗位'); // sub代表岗位
+      setPostGroupModalLable('岗位');
+      setPostGroupTreeData(record.sonDepartmentVOList || []);
+    }
+  }
+  //编辑岗位组/岗位
+  function editPostGroup(record){
+    setAddOrEditPostGroupShow(true);
+    setOperatePostGroupModalType("edit");
+   //level为0的时候编辑的是岗位组 大于0的时候
+   setPostGroupModalLevel(record.depLevel);
+   setCurrentGroupData(record);
+   console.log('treeData',record);
+   if(record.depLevel===0){
+    setPostGroupModalTitle('编辑岗位组');
+    setPostGroupModalLable('岗位组');
+    setPostGroupTreeData(treeData);
+   }else{
+    setPostGroupModalTitle('编辑岗位');
+    setPostGroupModalLable('岗位');
+    setPostGroupTreeData(getParentChildernData(record.parentId));
+   }
+  }
+
+  // 获取父节点下的所有的子级数据
+  function getParentChildernData(parentId){
+    let _parentChildernData = []
+    treeData.map((item,index)=>{
+      if( parentId=== item.id){
+        _parentChildernData = item.sonDepartmentVOList
+      }
+    })
+    return  _parentChildernData
+  }
+  function delPostGroup(record){
+    let title = '确认删除该岗位组吗？';
+    let content= '删除后，该岗位组下的岗位及也将全部删除。';
+    if(record.departmentCount && record.departmentCount>0 ){
+      title = '删除失败';
+      if(record.depLevel>0){
+        content = `${record.name}存在学员，不能删除该岗位`;
+      }else{
+        content = `${record.name}存在学员，不能删除该岗位组`;
+      }
+      Modal.warning({
+        title,
+        content,
+        icon: <span className='icon iconfont default-warning-icon'>&#xe80d;</span>,
+        okText: "我知道了"
+      })
+      return
+    }
+    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: () => {
+         delGroup(record);
+       },
+    });
+  }
+  function delGroup(record){
+    let parmas = {
+      departmentId:record.id,
+      enterpriseId:User.getEnterpriseId(),
+      source:0,
+      storeId:User.getStoreId(),
+      userId:User.getUserId()
+    }
+    StoreService.delDepartment(parmas).then((res) => {
+      message.success(`删除成功`)
+      getTreeData();
+    });
+  }
+
+
+
+  //添加自定义分组集合/分组
+  function addCustomGroup(level,record) {
+    if(level===0){
+      if (treeData.length > 9) {
+        message.error("自定义分组集合数量已达10个上限");
+        return;
+      }
+    }
+    if(level===1){
+      if(record.sonDepartmentVOList){
+        if(record.sonDepartmentVOList.length > 19){
+          message.error("自定义分组数量已达20个上限");
+          return;
+        }
+      }
+    }
+    setCurrentGroupData({});
+    setAddOrEditPostGroupShow(true);
+    setOperatePostGroupModalType("add");
+    setPostGroupModalLevel(level);
+    setCurrentGroupData(record)
+    if(level===0){
+      setPostGroupModalTitle('添加分组集合');
+      setPostGroupModalLable('分组集合');
+      setPostGroupTreeData(treeData);
+    }else{
+      setPostGroupModalTitle('添加分组'); // sub代表岗位
+      setPostGroupModalLable('分组');
+      setPostGroupTreeData(record.sonDepartmentVOList || []);
+    }
+  }
+  //编辑自定义分组集合/分组
+  function editCustomGroup(record){
+    setAddOrEditPostGroupShow(true);
+    setOperatePostGroupModalType("edit");
+    setPostGroupModalLevel(record.level);
+    setCurrentGroupData(record)
+   //level为0的时候编辑的是岗位组 大于0的时候
+   if(record.depLevel===0){
+    setPostGroupModalTitle('编辑分组集合');
+    setPostGroupModalLable('分组集合');
+    setPostGroupTreeData(treeData);
+   }else{
+    setPostGroupModalTitle('编辑分组');
+    setPostGroupModalLable('分组');
+    setPostGroupTreeData(getParentChildernData(record.parentId));
+   }
+  }
+  function delCustomGroup(record){
+    let title = '确认删除该分组集合吗？';
+    let content= '删除后，该分组集合下的岗位及也将全部删除。';
+    if(record.departmentCount && record.departmentCount>0 ){
+      title = '删除失败';
+      if(record.level>0){
+        content = `${record.name}存在学员，不能删除该分组`;
+      }else{
+        content = `${record.name}存在学员，不能删除该分组集合`;
+      }
+      Modal.warning({
+        title,
+        content,
+        icon: <span className='icon iconfont default-warning-icon'>&#xe80d;</span>,
+        okText: "我知道了"
+      })
+      return
+    }
+    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: () => {
+        delGroup(record)
+       },
+     });
+   }
+
+
+  function confirmAddOrEditPostGroup() {
+    closeAddOrEditPostGroupModal();
+    getTreeData()
+  }
+
+  function selectUserList(record,e){
+    const _selectKeys = [];
+    _selectKeys.push(e.selectedNodes[0].id)
+    setSelectedKeys(_selectKeys);
+    props.onChangeSelectDep(e.selectedNodes[0]);
+    props.searchUserList(e.selectedNodes[0],treeType,1);
+  }
+
+  return (
+    <div className="left-structure-tree">
+      <div className="organization">
+          <div className="search-con">
+            {/* <Complete/> */}
+            <AutoComplete
+              dropdownClassName="certain-category-search-dropdown"
+              dropdownMatchSelectWidth={250}
+              allowClear
+              onChange={(value)=>{setQueryName(value);setOpen(true);getCompleteOptionData(value)}}
+              // onSearch={(value)=>{getCompleteOptionData(value)}}
+              notFoundContent={notFoundContentNode()}
+              value={queryName}
+              open={open}
+              onFocus={()=>{setOpen(true)}}
+              onBlur={()=>{setOpen(false)}}
+              style={{
+                width: 250,
+              }}
+              options={completeOptions}
+              onSelect={confirmSearchSelect}
+              placeholder={handlePlaceHolder()}
+            >
+               <Search
+                  style={{ width: 250 }}
+                  enterButton={<span className='icon iconfont'>&#xe832;</span>}
+                />
+            </AutoComplete>
+          </div>
+          { (props.treeType==='postGrouptab' || props.treeType=== 'customGroupTab') && (
+            <div className="operate">
+              {props.treeType==='postGrouptab' && 
+                <Button
+                  className="add-btn"
+                  onClick={() => {
+                    addPostGroup(0)
+                  }}
+                >
+                  添加岗位组
+                </Button>
+              }
+              {props.treeType==='customGroupTab' && 
+                <Button
+                  className="add-btn"
+                  onClick={() => {
+                    addCustomGroup(0)
+                  }}
+                >
+                  添加自定义分组
+                </Button>
+              }
+            </div>
+          )} 
+        <div className="tree-con">
+          {!selctQueryName ?
+              <DirectoryTree
+              defaultExpandAll
+              showIcon={false}
+              treeData={treeData}
+              selectedKeys={selectedKeys}
+              onSelect={selectUserList}
+              titleRender={(nodeData) => {
+                return (
+                  <div
+                    className="node-title-div"
+                    onMouseOver={(e) => {
+                      if((props.treeType==='postGrouptab' || props.treeType=== 'customGroupTab')){
+                        if (nodeData.key === "null") return;
+                        let moreDiv = e.currentTarget.getElementsByClassName(
+                          "item-more"
+                        )[0];
+                        let countDiv = e.currentTarget.getElementsByClassName(
+                          "item-count"
+                        )[0];
+                        if (moreDiv) {
+                          moreDiv.style.visibility = "visible";
+                        }
+                        if (countDiv) {
+                          countDiv.style.visibility = "hidden";
+                        }
+                      }
+                    }}
+                    onMouseOut={(e) => {
+                      if((props.treeType==='postGrouptab' || props.treeType=== 'customGroupTab')){
+                        if (nodeData.key === "null") return;
+                        let moreDiv = e.currentTarget.getElementsByClassName(
+                          "item-more"
+                        )[0];
+                        let countDiv = e.currentTarget.getElementsByClassName(
+                          "item-count"
+                        )[0];
+                        if (moreDiv) {
+                          moreDiv.style.visibility = "hidden";
+                        }
+                        if (countDiv) {
+                          countDiv.style.visibility = "visible";
+                        }
+                      }
+                    }}
+                  >
+                    <div className="item-icon">
+                    <span className="icon iconfont title-icon">&#xe604;</span>
+                    </div>
+                    <div
+                      className="item-title"
+                      style={{
+                        width:
+                          leftBoxWidth <= "240px"
+                            ? "35%"
+                            : leftBoxWidth <= "304px"
+                            ? "60%"
+                            : "78%",
+                      }}
+                    >
+                      { props.treeType==='departMentTab'?
+                      <span><WWOpenDataCom type="departmentName" openid={nodeData.name}/></span>
+                      :
+                        <span>{nodeData.name}</span>
+                      }
+                    </div>
+                    <div className="item-count">({nodeData.departmentCount || 0})</div>
+                    { (props.treeType==='postGrouptab' || props.treeType=== 'customGroupTab') && (
+                      <Dropdown overlay={moreOpenGroupOperate(nodeData)}>
+                        <div className="item-more icon iconfont">&#xe927;</div>
+                      </Dropdown>
+                    )}
+                  </div>
+                );
+              }}
+            />
+            :
+            <div>
+              {/* { (props.treeType==='departMentTab') &&  */}
+                <div>
+                  { selctQueryName.type==='userName'?
+                   <WWOpenDataCom type="userName" openid={selctQueryName.openid}/>
+                   :
+                   <WWOpenDataCom type="departmentName" openid={selctQueryName.openid}/>
+                  }
+                </div>
+
+              {/* } */}
+              {/* { (props.treeType==='postGrouptab' || props.treeType=== 'customGroupTab') && 
+                <div>
+                  { option.name?
+                   <span>{option.name}</span>
+                   :
+                   <span>{option.userName}</span>
+                  }
+                  
+                </div>
+              } */}
+            </div>
+          }
+         
+
+        </div>
+      </div>
+      {addOrEditPostGroupShow && (
+        <AddOrEditPostGroupModal
+          onClose={() => {
+            closeAddOrEditPostGroupModal();
+          }}
+          onConfirm={() => {
+            confirmAddOrEditPostGroup();
+          }}
+          title={postGroupModalTitle}
+          postGroupModalLevel={postGroupModalLevel}
+          modalOperateType={operatePostGroupModalType}
+          postGroupName={postGroupName}
+          postGroupTreeData={postGroupTreeData}
+          label={postGroupModalLable}
+          currentTab={props.treeType}
+          currentGroupData={currentGroupData}
+        />
+      )}
+    </div>
+  );
+}
+
+export default withRouter(LeftStructureTree);

src/modules/college-manage/components/LeftStructureTree.less

+.left-structure-tree {
+    margin-right: 17px;
+    width:260px;
+    flex-shrink: 0;
+    height: calc(~'100vh - 260px');
+    overflow: scroll;
+    border-right:1px solid #eee;
+    .organization{
+      .search-con{
+        margin-bottom: 10px;
+      }
+      .operate {
+        margin-bottom:16px;
+        .add-btn {
+          width: 230px;
+          height:32px;
+        }
+      }
+    
+      &::-webkit-scrollbar {
+        display: none;
+      }
+      .node-title-div {
+        display: flex;
+        justify-content: space-between;
+        white-space: nowrap;
+        .item-icon {
+          img {
+            width: 16px;
+            height: 16px;
+          }
+        }
+        .item-title {
+          position: absolute;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+          width: 55%;
+          left: 28px;
+        }
+        .item-more {
+          visibility: hidden;
+          position: absolute;
+          right: 8px;
+          text-align: right;
+        }
+        .item-count {
+          visibility: visible;
+          position: absolute;
+          right: 12px;
+          text-align: right;
+        }
+      }
+      // 修改树样式
+      .ant-tree .ant-tree-treenode {
+        padding: 10px 0 14px 0;
+      }
+      .ant-tree.ant-tree-directory {
+        .ant-tree-node-selected{
+          color:#2966FF !important;
+        }
+        .ant-tree-treenode-selected:hover::before,
+        .ant-tree-treenode-selected::before {
+          background: #f3f6fa;
+        }
+        .ant-tree-treenode-selected .ant-tree-switcher {
+          color: #666666;
+        }
+        .ant-tree-treenode .ant-tree-node-content-wrapper {
+          color: #666666;
+        }
+      }
+      
+    }
+   
+  }
+  .certain-category-search-dropdown{
+    .catalog-title{
+      font-size:14px;
+      color:#666;
+      margin-bottom:14px;
+    }
+    .search-result-item{
+      padding:14px 0;
+      color:#333;
+      .title-icon{
+        color:#999;
+        margin-right:3px;
+      }
+      .search-result-item__left{
+        font-size:14px;
+      }
+      .search-result-item__right{
+        font-size:14px;
+        width:84px;
+        overflow: hidden; 
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        color:#999;
+        text-align:right;
+      }
+    }
+    .empty-con{
+      text-align:center;
+      .empty-img{
+          width:150px;
+          height:150px;
+      }
+      .empty-text{
+          color:#666;
+      }
+  }
+  }
+  
\ No newline at end of file

src/modules/college-manage/components/MemberTree.jsx

+import React, { useEffect, useState } from "react";
+import { withRouter } from "react-router-dom";
+import { Tree} from "antd";
+import StoreService from "@/domains/store-domain/storeService";
+import User from '@/common/js/user';
+import WWOpenDataCom from '@/components/WWOpenDataCom';
+import "./MemberTree.less";
+import _ from 'underscore';
+const { DirectoryTree } = Tree;
+function MemberTree(props) {
+  const [treeData,setTreeData]=useState([]);
+  useEffect(()=>{
+    getTreeData();
+  },[]);
+  function getTreeData(){
+    const params = {
+      depType:props.treeDepType,
+      enterpriseId:User.getEnterpriseId(),
+      source:0,//0代表来自企培
+      storeId:User.getStoreId(),
+      userId:User.getUserId(),
+      whetherCount:false,
+      distinct:true,
+      queryType:props.type
+    }
+    if(props.departmentId){
+      params.departmentId = props.departmentId;
+    }
+    if(props.nowTreeDepType){
+      params.nowDepType = props.nowTreeDepType;
+    }
+    StoreService.getDepartmentUserNotPage(params).then((res) => {
+      let { departmentVOList=[]} = res.result;
+      let _treeData = handleData(departmentVOList);
+      console.log("_treeData",_treeData);
+      setTreeData(_treeData);
+    });
+  }
+  function handleData(dataArray){
+    const _dataArray = dataArray.map((item,index)=>{
+      item.title = "";
+      item.key=item.id;
+      item.children = []
+      if(item.departmentUserVOList){
+        item.children = item.departmentUserVOList;
+      }
+      if(item.sonDepartmentVOList){
+        item.children = [...item.children,...item.sonDepartmentVOList];
+      }
+      if(item.children.length > 0){
+        handleData(item.children)
+      }else{
+        delete item.children
+      }
+      return item
+    })
+    return _dataArray;
+  }
+  function treeSelected (selectedKeys,e){
+    const _checkedNodes = e.checkedNodes;
+    const _selectNodes = [];
+    _checkedNodes.map((item,index)=>{
+      if(item.userId){
+        _selectNodes.push(item);
+      }
+    })
+    console.log('_selectNodes',_selectNodes);
+    props.onSelect(_selectNodes);
+  }
+  return (
+    <div className="member-tree">
+      <div className="tree-con">
+        <DirectoryTree
+          defaultExpandAll
+          checkable
+          showIcon={false}
+          treeData={treeData}
+          checkedKeys={_.pluck(props.selectUserList, 'id')}
+          onCheck={(selectedKeys,e)=>treeSelected(selectedKeys,e)}
+          titleRender={(nodeData) => {
+            return (
+              <div
+                className="node-title-con"
+              >
+                {nodeData.userId ?
+                  <div>
+                    <span className="icon iconfont title-icon">&#xe603;</span>
+                    <span><WWOpenDataCom type="userName" openid={nodeData.userName}/></span>
+                  </div>
+                  :
+                  <div>
+                    <span className="icon iconfont title-icon">&#xe604;</span>
+                    <span><WWOpenDataCom type="departmentName" openid={nodeData.name}/></span>
+                  </div>
+                }
+              </div>
+            );
+          }}
+        />
+      </div>
+    </div>
+  );
+}
+
+export default withRouter(MemberTree);

src/modules/college-manage/components/MemberTree.less

+.member-tree{
+    .node-title-con{
+        color:#666;
+        font-size:14px;
+        .title-icon{
+            font-size:14px;
+            color:#999;
+            margin-right:8px;
+        }
+    }
+    .ant-tree.ant-tree-directory .ant-tree-treenode-selected:hover::before, .ant-tree.ant-tree-directory .ant-tree-treenode-selected::before{
+        background: none;
+    }
+}
\ No newline at end of file

src/modules/college-manage/components/SearchUser.jsx

+import React, { useEffect, useState } from "react";
+import { withRouter } from "react-router-dom";
+import { Input,Checkbox,Tooltip} from "antd";
+import StoreService from "@/domains/store-domain/storeService";
+import User from '@/common/js/user';
+import WWOpenDataCom from '@/components/WWOpenDataCom';
+import $  from 'jquery';
+import _ from 'underscore';
+import './SearchUser.less'
+const { Search } = Input;
+function SearchUser(props) {
+  const [dropDownVisible,setDropDownVisible]=useState(false);
+  useEffect(()=>{
+    documentClick();
+  },[])
+  function onFocus(e){
+    setDropDownVisible(true);
+  }
+
+  function onChange(e){
+    props.onChange(e.target.value)
+  }
+  function selectuser(e,item){
+    if(e.target.checked){
+      let _record = props.selectUserList
+      _record.push(item)
+      props.onSelect(_record,'user')
+    }else{
+      let _record = props.selectUserList
+      _record.map((_item,index)=>{
+        if(item.userId === item.userId){
+          _record.splice(index,1)
+        }
+      })
+      props.onSelect(_record,'user') 
+    }
+  }
+  function selectDep(e,item){
+    if(e.target.checked){
+      console.log('item',item);
+      props.onSelect(item,'department');
+    }
+  }
+  function  documentClick(){
+    document.onclick = function (e) {
+      let _con =$('#search-user');
+      if(!_con.is(e.target) && _con.has(e.target).length === 0){
+        setDropDownVisible(false);
+      }
+    };
+  }
+
+  function handleDepName(depArray){
+    const depArrayDom = depArray.map((item, index) => {
+    return <span><WWOpenDataCom type="departmentName" openid={item}/>；</span>
+    });
+    return depArrayDom;
+  };
+  return (
+    <div className="search-user" style={{width:'300px'}} id="search-user">
+        <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">
+                 {props.data.departmentUserVOList &&
+                  ( props.data.departmentUserVOList.length>0 && <div className="drop-down__item-user">
+                    <div className="drop-down__item__title">
+                        员工 
+                    </div>
+                    <div className="drop-down__item__con">
+                      <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}>
+                                <div className="drop-down__item__con__item">
+                                  <div className="drop-down__item__con__item__left">
+                                    <span className="icon iconfont title-icon">&#xe603;</span>
+                                      <WWOpenDataCom type="userName" openid={item.userName}/>
+                                  </div>
+                                  <div className="drop-down__item__con__item__right">
+                                    <Tooltip  title={<div>{handleDepName(item.depNamesList)}</div>} placement='top' arrowPointAtCenter>
+                                      {item.depNamesList.map((_item,index)=>{
+                                        return <span> <WWOpenDataCom type="departmentName" openid={_item}/>{index<(item.depNamesList.length -1)?';':''}</span>
+                                        })
+                                      }
+                                      </Tooltip>
+                                  </div>
+                                </div>
+                          </Checkbox>
+                          </div>
+                        })
+                        }
+                      </div>
+                    </div>
+                  </div>)
+                }
+                {props.data.departmentVOList  &&
+                  (props.data.departmentVOList.length>0 && <div>
+                    <div className="drop-down__item__title drop-down__item__title-dep">
+                        部门
+                    </div>
+                    <div className="drop-down__item__con">
+                      <div>
+                        {props.data.departmentVOList.map((item,index)=>{    
+                          return  <div><Checkbox onChange={(e)=>{selectDep(e,item)}}>
+                                      <div className="drop-down__item__con__item">
+                                      <div className="drop-down__item__con__item__left">
+                                      <WWOpenDataCom type="departmentName" openid={item.name}/>
+                                      </div>
+                                    </div>
+                                </Checkbox>
+                            </div>
+                        })
+                        }
+                      </div>
+                    </div>
+                  </div>)
+                }
+                {(!props.data.departmentUserVOList && !props.data.departmentVOList)&&
+                  <div className="empty-con">
+                    <img src="https://image.xiaomaiketang.com/xm/wRDrb2pJFb.png" className="empty-img"/>
+                    <div className="empty-text">暂无数据</div>
+                  </div>
+                }
+                { (props.data.departmentUserVOList && props.data.departmentVOList) &&(
+                  (props.data.departmentUserVOList.length === 0 && props.data.departmentVOList.length ===0) &&
+                    <div className="empty-con">
+                    <img src="https://image.xiaomaiketang.com/xm/wRDrb2pJFb.png" className="empty-img"/>
+                    <div className="empty-text">暂无数据</div>
+                  </div>
+                 )
+                }
+              </div>
+        </div>
+        }
+    </div>
+  );
+}
+
+export default withRouter(SearchUser);

src/modules/college-manage/components/SearchUser.less

+.search-user{
+    position: relative;
+    padding:12px 16px;
+    .drop-down{
+        padding:18px;
+        position: absolute;
+        background: #FFF;
+        z-index:100001;
+        background: #FFFFFF;
+        box-shadow: 0px 2px 15px 6px rgba(0, 0, 0, 0.05);
+        border-radius:2px;
+        width:270px;
+        // .drop-down__item-user{
+        //     margin-bottom:30px;
+        // }
+       
+        .drop-down__item__title{
+            font-size:14px;
+            color:#666;
+            margin-bottom:14px;
+        }
+        .ant-checkbox-wrapper{
+            width:100%;
+            .drop-down__item__con__item{
+                margin-bottom:24px;
+                display:flex;
+                width:220px;
+                justify-content:space-between;
+                color:#333;
+                font-size:14px;
+                .drop-down__item__con__item__left{
+                    .title-icon{
+                        color:#999;
+                        margin-right:3px;
+                    }
+                }
+                .drop-down__item__con__item__right{
+                    width:84px;
+                    text-align:right;
+                    overflow: hidden; 
+                    text-overflow: ellipsis;
+                    white-space: nowrap;
+                    color:#999;
+                }
+            }
+        }
+        .empty-con{
+            text-align:center;
+            .empty-img{
+                width:150px;
+                height:150px;
+            }
+            .empty-text{
+                color:#666;
+            }
+        }
+    }
+}
\ No newline at end of file

src/modules/college-manage/components/UserTable.jsx

+import React, { useEffect, useState } from "react";
+import { withRouter } from "react-router-dom";
+import { XMTable,PageControl} from '@/components';
+import college from '@/common/lottie/college.json';
+import "./UserTable.less";
+
+function UserTable() {
+    const [courseList,setCourseList] = useState([]);
+    const [total, setTotal] = useState(0);
+    const [query, setQuery] = useState({
+        current: 0,
+        size: 10,
+    });
+    const columns = [
+        {
+        title: '学员',
+        dataIndex: 'user',
+        width:220,
+        render: (val, record) => {
+            return <span>{val}</span>
+        }
+        },
+        {
+        title: '真实姓名',
+        dataIndex: 'nickname',
+        width:'15%',
+        render: (val,record) => {
+            return  <span>{val}</span>
+            
+        }
+        },
+        {
+        title: '账号',
+        dataIndex: 'account',
+        width:'15%',
+        render: (val,record) => {
+            return <span>{val}</span>
+        }
+        },
+        {
+        title: '岗位',
+        dataIndex: 'post',
+        render: (val, record) => {
+            return <span className="post-name">{val}</span>
+        }
+        },
+        {
+        title: '手机号',
+        dataIndex: 'phone',
+        render: (val, record) => {
+            return <span>{val}</span>;
+        }
+        },
+        {
+        title: '注册时间',
+        dataIndex: 'registerTime',
+        render: (val, record) => {
+            return <span>{val}</span>;
+        }
+        },
+        {
+        title: "操作",
+        key: "operate",
+        dataIndex: "operate",
+        render: (val, record) => {
+            return (
+            <div className="operate">
+                <div
+                className="operate__item"
+                >
+                删除
+                </div>
+            </div>
+            )
+        }
+        },
+    ];
+    return (
+        <div className="user-table">
+            <XMTable
+                renderEmpty={{
+                image: college,
+                description: '暂无数据',
+                }}
+                bordered
+                size='middle'
+                pagination={false}
+                columns={columns}
+                scroll={{ x: 1300 }}
+                dataSource={courseList}
+            />
+            <div className='box-footer'>
+                <PageControl
+                    current={query.current}
+                    pageSize={query.size}
+                    total={total}
+                    toPage={(page) => {
+                    const queryStates = _.clone(query);
+                    queryStates.current = page;
+                    setQuery(queryStates);
+                    }}
+                />
+            </div>
+        </div>
+    );
+}
+
+export default withRouter(UserTable);
\ No newline at end of file

src/modules/college-manage/components/UserTable.less

+.user-table{
+   .post-name{
+        max-width: 100px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+   }
+} 
+ 
\ No newline at end of file

src/modules/college-manage/modal/AddOrEditPostGroupModal.jsx

+/*
+ * @Author: wufan
+ * @Date: 2020-11-27 16:21:49
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-08-06 17:10:50
+ * @Description: Description
+ * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
+ */
+import React, { useState, useEffect } from "react";
+import { Modal,Form,Input,Button,message} from "antd";
+import User from '@/common/js/user';
+import StoreService from "@/domains/store-domain/storeService";
+import { DepType }  from '@/domains/store-domain/constants';
+import './AddOrEditPostGroupModal.less'
+function AddOrEditPostGroupModal(props) {
+  const [nameErrorMsg,setNameErrorMsg] = useState('');
+  const [validateStatus,setValidateStatus] = useState('success');
+  const [postGroupName,setPostGroupName] = useState('');
+  const [isError,setIsError] = useState(false)
+  useEffect(() => {
+    
+  },[]);
+  function changePostGroupName(e){
+    setIsError(false)
+    setValidateStatus('success');
+    setNameErrorMsg('');
+    if((!e.target.value) || /^\s+$/.test(e.target.value)){
+      setValidateStatus('error');
+      setNameErrorMsg(`${props.label}不能为空`);
+      setIsError(true)
+    }
+    props.postGroupTreeData.map((item,index)=>{
+        if(item.name === e.target.value){
+          setValidateStatus('error');
+          setNameErrorMsg(`该${props.label}已存在`);
+          setIsError(true)
+        }
+        return item;
+    })
+    setPostGroupName(e.target.value);
+  }
+
+  function handleConfirm(){
+    if(props.modalOperateType === 'add'){
+      addGroup();
+    }else{
+      editGroup();
+    }
+  }
+  function addGroup(){
+    if(isError){
+      return;
+    }
+    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 editGroup(){
+    if(isError){
+      return;
+    }
+    const {postGroupModalLevel,currentTab,currentGroupData,label} = props
+    let parmas={
+      departmentLevel:postGroupModalLevel,
+      departmentId: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.parentId
+    }
+    StoreService.editDepartment(parmas).then((res) => {
+      message.success(`${label}修改成功`)
+      props.onConfirm();
+    });
+  }
+  return (
+    <Modal
+      visible={true}
+      title={props.title}
+      className="add-edit-post-group-modal"
+      onCancel={props.onClose}
+      width={448}
+      footer={[
+        <Button
+            id='cancel_allot_btn'
+            key="back" onClick={props.onClose}>取消</Button>,
+        <Button
+            id='confirm_allot_btn'
+            key="submit"
+            type="primary"
+            onClick={() => {
+                handleConfirm()
+            }}>
+            保存
+        </Button>
+      ]}
+      maskClosable={false}
+      closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
+    >
+     <Form
+        labelCol={ {span:5 }}
+     >
+        <Form.Item
+            // label={`${props.label}名称`}
+            name={`${props.label}名称`}
+            rules={[{ required: true}]}
+            validateStatus={validateStatus}
+            help={nameErrorMsg}
+        >
+        <Input type="text" placeholder={`请输入${props.label}名称（8个字以内）`} maxLength={8} style={{ width: 348 }}  
+            defaultValue={props.modalOperateType==='edit'?props.currentGroupData.name:''}
+            onChange={(e) => { 
+            changePostGroupName(e);
+        }} />
+      </Form.Item>
+     </Form>
+    </Modal>
+  );
+}
+
+export default AddOrEditPostGroupModal;

src/modules/college-manage/modal/ChooseMembersModal.jsx

@@ -16,7 +16,6 @@ import './ChooseMembersModal.less';
 import _ from 'underscore';
 
 const { Search } = Input;
-
 class ChooseMembersModal extends React.Component {
   constructor(props) {
     super(props);
@@ -162,6 +161,7 @@ class ChooseMembersModal extends React.Component {
         })   
       }
     })
+  
   }
 
   addCustomer = () => {

src/modules/college-manage/modal/ChooseMembersModal.less

@@ -23,7 +23,7 @@
         .container-left-body-table{
           width: 300px;
           height: 330px;
-  
+          overflow: scroll;
           .ant-table {
             border: none;
             min-height: 250px !important;

src/modules/college-manage/modal/NewChooseMembersModal.jsx

+/*
+ * @Author: wanghaofeng
+ * @date: 2020/11/14 17:42
+ * @Description：权限管理-选择成员弹窗
+ */
+
+import React from 'react';
+import { Modal, Input, message, Tooltip,AutoComplete} from 'antd';
+import { XMTable } from '@/components';
+import college from '@/common/lottie/college.json';
+import Service from '@/common/js/service';
+import User from '@/common/js/user'
+import SetEmployeeModal from "./SetEmployeeModal";
+import search from '../../lottie/search/data.json';
+import MemberTree from '../components/MemberTree'
+import { DepType } from "@/domains/store-domain/constants";
+import StoreService from "@/domains/store-domain/storeService";
+import SearchUser from "../components/SearchUser"
+import WWOpenDataCom from '@/components/WWOpenDataCom';
+import './NewChooseMembersModal.less';
+import _ from 'underscore';
+
+const { Search } = Input;
+
+class NewChooseMembersModal extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      selectUserList:[],
+      selectObject: {},
+      openSetModal: false,
+      visible:this.props.visible,
+      completeOptions:[],
+      queryName:'',
+      open:false,
+      searchUserResultList:{}
+    }
+  }
+  componentDidMount() {
+    
+  }
+  handleClose = ()=>{
+    this.props.close()
+  }
+  
+   // 信息列表——右边
+  selectedColumnsRight = () => {
+    const selectColumns = [
+      {
+        title: '学员名',
+        key: 'nameRight',
+        dataIndex: 'userName',
+        width: '70%',
+        render: (value, record) => {
+          const { userName = '', avatar } = record;
+          return (
+            <div className='avatar'>
+              <span className="icon iconfont avatar-icon">&#xe84a;</span>
+              <Tooltip title={<WWOpenDataCom type="userName" openid={userName}/>}>
+                <span className='userName'>
+                  <WWOpenDataCom type="userName" openid={userName}/>
+                  {/* {userName} */}
+                </span>
+              </Tooltip>
+            </div> 
+          )
+        }
+      },{
+        title : '操作',
+        key : 'edit',
+        dataIndex : 'edit',
+        width : '30%',
+        align : 'right',
+        render: (value, record) => {
+          return (
+            <div className='edit' onClick={() => this.clearOneUser(record)}>
+              <span className="icon iconfont edit-icon">&#xe717;</span>
+            </div>
+          )
+        }
+      },
+    ]
+    return selectColumns;
+  }
+
+  treeSelect = (record)=>{
+    // console.log('record',record)
+    this.setState({
+      selectUserList:record
+    })
+  }
+
+  clearOneUser = (record) =>{
+    console.log("record",record);
+    const {selectUserList} = this.state;
+    const _selectUserList = selectUserList.filter((item,index)=>{
+      return item.userId !== record.userId
+    })
+    console.log('selectUserList',selectUserList);
+    this.setState({
+      selectUserList:_selectUserList
+    })
+  }
+   // 清空所有成员
+  clearAllUser = () => {
+    this.setState({
+      selectUserList : [],
+    })
+  }
+
+  addCustomer = () => {
+    const { selectUserList } = this.state;
+    const { addDepType } = this.props;
+    let enterpriseUserList = [];            // 保存新加进去的成员
+    enterpriseUserList = selectUserList.map((item) => {
+      const _item = {}
+      if(addDepType==='DEP_ORG'){
+        _item.depUserType = 'VISIBLE_USER';
+        _item.departmentId = item.departmentId;
+        _item.enterpriseVisibleUserId = item.userId;
+      }else{
+        if(item.depId === '10000'){
+          _item.depUserType = 'WE_CHART_USER'; // depid=10000代表是微信学员
+          _item.userId = item.userId;
+        }else{
+          _item.depUserType = 'STORE_USER';
+        }
+        _item.enterpriseVisibleUserId = item.enterpriseUserId;
+        _item.departmentId = this.props.selectDep.id;
+      }
+      return _item 
+    })
+    const _params = {
+      storeId: User.getStoreId(),
+      depType:addDepType,
+      userAndDepartmentList:enterpriseUserList
+    }   
+    Service.Hades('public/hades/addBatchUserAndDepartmentStoreCustomer', _params).then((res) => {
+      this.handleClose();
+      message.success('添加成功')
+      this.props.onConfirm(); 
+    })
+  }
+
+  // 批量添加成员(点击确定)
+  addUser = (selectUserList) => {
+    let enterpriseUserList = [];            // 保存新加进去的成员
+    selectUserList.map((item) => {
+      enterpriseUserList.push({
+        roleCode: item.roleCode,
+        enterpriseVisibleUserId: item.userId
+      })
+      return enterpriseUserList
+    })
+    const _params = {
+      storeId: User.getStoreId(),
+      enterpriseUserList,
+    }   
+    Service.Hades('public/hades/addBatchEnterpriseStoreUser', _params).then((res) => {
+      if (res.code === '200') {
+        this.props.onConfirm();
+        this.setState({
+          openSetModal: false,
+        })   
+      }
+    })
+  }
+
+  renderTitle = (title) => {
+   return  <span>{title}</span>
+  }
+  renderItem = (record,type) => ({
+    value: record.userName || record.name,
+    label: (
+      <div
+        style={{
+          display: 'flex',
+          justifyContent: 'space-between',
+        }}
+      >
+        {type === 'user'?
+          <div>{record.userName}</div>
+          :
+          <div>{record.name}</div>
+        }
+        {type === 'user' && 
+          record.postDepNamesList.map((item,index)=>{
+          return <span>{item}</span>
+          })
+        }
+        {type === 'post' &&
+          <span>{item.parentName}</span>
+        }
+      </div>
+    ),
+  });
+  notFoundContentNode = ()=>{
+    return <span>暂无数据</span>
+  }
+  Complete = () =>{
+    const {open,completeOptions,queryName} = this.state;
+    return <AutoComplete
+            dropdownClassName="certain-category-search-dropdown"
+            dropdownMatchSelectWidth={250}
+            allowClear
+            onChange={(value)=>{this.getCompleteOptionData(value)}}
+            notFoundContent={()=>{this.notFoundContentNode()}}
+            value={queryName}
+            open={open}
+            onFocus={()=>{this.setState({open:true})}}
+            onBlur={()=>{this.setState({open:false})}}
+            style={{
+              width: 250,
+            }}
+            options={completeOptions}
+            onSelect={()=>this.confirmSearchSelect()}
+            placeholder='搜索员工、部门'
+      >
+    </AutoComplete>
+  } 
+  getCompleteOptionData=(value)=>{
+    if(!value){
+      this.setState({
+        searchUserResultList:{}
+      })
+      return
+    }
+    this.setState({
+      queryName:value
+    })
+    const params = {
+      distinct:true,
+      queryType:this.props.type,
+      depType:this.props.treeDepType, 
+      queryName:value,
+      enterpriseId:User.getEnterpriseId(),
+      source:0,//0代表来自企培
+      storeId:User.getStoreId(),
+      userId:User.getUserId(),
+      whetherCount:false
+    }
+    if(this.props.addDepType){
+      params.nowDepType = this.props.addDepType;
+    }
+    if(this.props.selectDep){
+      params.departmentId = this.props.selectDep.id;
+    }
+    StoreService.getDepartmentUser(params).then((res) => {
+      const { result = {}} = res;
+      this.setState({
+        searchUserResultList:result
+      })
+    });
+  }
+
+  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);
+      });
+    }  
+  }
+
+  render() {
+    const {type,treeDepType,selectDep={},addDepType=''} = this.props;
+    const { id=''} = selectDep;
+    const {selectUserList,selectObject,visible,openSetModal,searchUserResultList} = this.state;
+    const title = type === 'USER' ? '添加员工' : '添加学员';
+    return (    
+      <div>
+        {/* 添加学员页面 */}
+        <Modal
+          className="choose-member-modal"
+          visible={visible}
+          onCancel={() => this.handleClose()}
+          onOk={() => {
+            if (User.getVersion() && User.getVersion().whetherReachUserNum) {
+              message.error("添加失败，企业使用人数超出限制")
+              return
+            }
+            if (_.isEmpty(selectUserList)) {
+              message.warning(type === 'USER' ? '请选择员工' : '请选择学员')
+              return null;
+            }
+            type === 'USER' ? this.setState({openSetModal:true,visible:false}) : this.addCustomer();
+          }}
+          okText={type === 'USER' ? '下一步' : '确定'}
+          title={title}
+          width={680}
+          maskClosable={false}
+          closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
+        >
+          <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}/>
+                <div className='container-left-body-table'>
+                  <MemberTree departmentId={id} treeDepType={treeDepType} nowTreeDepType={addDepType} onSelect={(record)=>{this.treeSelect(record)}} selectUserList={selectUserList} type={type}/>
+                </div>
+              </div>
+            </div>
+            {/* 已选择的成员列表 */}
+            <div className='container-right'>
+              <span className='span-left'>已选择{type === 'USER' ? '员工' : '学员'}</span>
+              <div className='span-right' onClick={() => this.clearAllUser()}>
+                <span className={ (selectUserList.length > 0) ? 'span-right-l' : null }>清空</span>
+              </div>
+              <div className='container-right-body'>
+                <XMTable 
+                  renderEmpty={{
+                    image: college,
+                    description: '暂无数据'
+                  }}
+                  rowKey={(record) => record.id}
+                  dataSource={selectUserList}
+                  columns={this.selectedColumnsRight()}
+                  showHeader={false}
+                  scroll={{ y: 375 }}
+                  pagination={false}
+                  size={'small'}
+                />
+              </div>
+            </div>
+          </div>   
+        </Modal>
+        {openSetModal &&
+          <SetEmployeeModal
+            list={selectUserList}
+            selectObject={selectObject}
+            onChange={(key, value) => {
+              selectObject[key] = value;
+              this.setState({ selectObject });
+            }}
+            onClose={() => {
+              // this.setState({ openSetModal: true},()=>{this.handleClose()})
+              this.setState({ openSetModal: false, visible: true })  
+            }}
+            onCancel={() => {
+              this.handleClose();
+              this.setState({ openSetModal: false });
+            }}
+            onOk={(list) => {
+              this.addUser(list);
+            }}
+          />
+        }
+      </div>
+    )
+  }
+}
+
+export default NewChooseMembersModal;
\ No newline at end of file

src/modules/college-manage/modal/NewChooseMembersModal.less

+
+.choose-member-modal {
+    .member-container{
+      display: flex;
+      height: 417px;
+      .container-left{
+        width: 50%;
+        padding-right: 10px;
+        margin-left: 10px;
+    
+        .container-left-header{
+          margin-bottom: 12px;
+        }
+        .container-left-body{
+          border: 1px solid #E9E9E9;
+          height: 100%;
+          .ant-table-thead > tr > th {
+            font-weight:400!important;
+          }
+          .search{
+            width: 305px;
+            padding: 7px 7px;
+          }
+          .container-left-body-table{
+            width: 300px;
+            height: 330px;
+            overflow: scroll;
+            .ant-table {
+              border: none;
+              min-height: 250px !important;
+              .ant-table-header{
+                margin-bottom: -7px !important;
+    
+                >table > .ant-table-thead > tr > th {
+                  background-color: #fff !important;
+                }
+              }
+    
+              .ant-table-tbody{
+                >tr {
+                  >td {
+                    border-bottom: none;
+                    background-color: #fff !important;
+                    padding: 11px 0!important;
+                  }
+                  &:hover {
+                    >td {
+                      background: #F3F6FA !important;
+                    }
+                  }
+                }
+              }
+            }
+    
+            .ant-empty-normal {
+              margin: 80px 0 !important;
+            }
+            .avatar{
+              display: flex;
+              align-items: center;
+              .avatar-icon {
+                font-size:14px;
+                color:#999;
+                margin-right: 6px;
+              }
+              .userName {
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                font-size:14px;
+                color:#333;
+              }
+            }
+          }
+        }
+      }
+    
+      .container-right{
+        width: 50%;
+        border: 1px solid #E9E9E9;
+        .span-left{
+          line-height: 45px;
+          margin-left: 10px;
+          .span-left-l{
+            color: #2966FF;
+            cursor: pointer;
+          } 
+        }
+        .span-right{
+          line-height: 45px;
+          float: right;
+          margin-right: 10px;
+          color: #999;
+          .span-right-l{
+            color: #2966FF;
+            cursor: pointer;
+          }
+        }   
+        .container-right-body{
+          min-height:376px;
+          border-top: 1px solid #e8e8e8;
+          .edit {
+            .edit-icon {
+              color:#999;
+              font-size:14px;
+            }
+          }
+          .edit-img{
+            width: 16px;
+            height: 16px;
+          }
+    
+          .ant-table .ant-table-body {
+            overflow: auto;
+            max-height: 376px!important;
+          }
+          .ant-table tbody  {
+            tr{
+              background: #fff;
+              &:first-child {
+                display: block;
+                overflow: hidden;
+              }
+              td{
+                  padding:12px 18px !important;
+              }
+            }
+            
+           
+          }
+          
+          .ant-empty-normal {
+            margin: 120px 0 !important;
+          }
+          .ant-empty {
+            margin-top: 76px;
+          }
+          .avatar{
+            display: flex;
+            align-items: center;
+            .avatar-icon {
+                font-size:14px;
+                color:#999;
+                margin-right: 6px;
+              }
+              .userName {
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                font-size:14px;
+                color:#333;
+              }
+          }
+    
+          .ant-table-tbody{
+            >tr >td {
+              border-bottom:none;
+            }
+            >tr .ant-table-selection-column{
+              width: 30px !important;
+            }
+          }
+        }
+      }
+    }
+  }
\ No newline at end of file

src/modules/college-manage/modal/SetEmployeeModal.jsx

 import React from 'react';
 import { Modal, Button, Radio, Tooltip } from 'antd';
+import WWOpenDataCom from '@/components/WWOpenDataCom';
 import './SetEmployeeModal.less'
 
 const RadioGroup = Radio.Group;
@@ -13,26 +14,41 @@ export default class SetEmployeeModal extends React.Component {
   constructor(props) {
     super(props);
     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;
     })
     const selectedData = list[0] || {};
     this.state = {
-      list,
-      selected: selectedData.enterpriseVisibleUserId,
+      list:this.uniqArr([...list]),
+      selected: selectedData.userId,
       roleCode: selectedData.roleCode,
+      submit:false
     }
   }
 
+  uniqArr(arr){
+    let obj={};
+    arr.map((item,index)=>{
+        // 若重复则删除该项
+        if(obj.hasOwnProperty(item.userId)){
+            arr.splice(index,1);
+        // 不重复则存入obj
+        }else{
+            obj[item.userId]=item.userName;
+        }
+    });
+    return arr;
+  }
+
   handleChangeValues(value) {
     const { list, selected } = this.state;
     list.map((item) => {
-      if (item.enterpriseVisibleUserId === selected) {
+      if (item.userId === selected) {
         item.roleCode = value;
       }
     })
     this.props.onChange(selected, value);
-    this.setState({ roleCode: value, list });
+    this.setState({ roleCode: value, list});
   }
 
   render() {
@@ -40,6 +56,7 @@ export default class SetEmployeeModal extends React.Component {
       list,
       roleCode,
       selected,
+      submit
     } = this.state;
     return (
       <Modal
@@ -54,7 +71,7 @@ export default class SetEmployeeModal extends React.Component {
           <div className="modal-footer">
             <Button style={{ float: 'left' }} onClick={() => this.props.onClose()}>上一步</Button>
             <Button onClick={() => this.props.onCancel()}>取消</Button>
-            <Button onClick={() => this.props.onOk(list)} type="primary">确定</Button>
+            <Button onClick={() =>{this.setState({submit:true},()=>this.props.onOk(list))}} type="primary" disabled={submit}>确定</Button>
           </div>
         }
       >
@@ -62,15 +79,18 @@ export default class SetEmployeeModal extends React.Component {
           <div className="employee-box">
             {list.map((item) => (
               <div
-                className={`item ${selected === item.enterpriseVisibleUserId ? ' selected' : ''}`}
-                key={item.enterpriseVisibleUserId}
+                className={`item ${selected === item.userId ? ' selected' : ''}`}
+                key={item.userId}
                 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>
                 <Tooltip title={item.name}>
-                  <span className='name'>{item.name}</span>
+                  <span className='name'>
+                    {/* {item.userName} */}
+                    <WWOpenDataCom type="userName" openid={item.userName}/>
+                  </span>
                 </Tooltip>
                 <span className="tag">{tagMap[item.roleCode]}</span>
             </div>

src/modules/college-manage/modal/SetEmployeeModal.less

@@ -47,7 +47,7 @@
             flex-shrink: 0;    
           }
           &.selected {
-            background: rgba(255, 183, 20, 0.1);
+            background:rgba(41, 102, 255,0.1);
             &::after {
               content: '';
               position: absolute;

src/modules/personalInfo/index.less

@@ -3,7 +3,7 @@
             padding: 24px 60px 60px 40px !important;
         }
         .label{
-            width:84px;
+            width:100px;
             text-align:right;
             font-size: 14px;
             color: #666666;
@@ -37,10 +37,10 @@
                     color:#FFF;
                     font-size:22px;
                 }
-                &:hover{
-                    display: inline-block;
-                    opacity:0.5;
-                }
+                // &:hover{
+                //     display: inline-block;
+                //     opacity:0.5;
+                // }
             }
         }
         .name-item{
@@ -58,7 +58,8 @@
             }
         }
         .save-btn {
-            margin-left: 92px;
+            margin-top:20px;
+            margin-left: 106px;
         }
 
 }
\ No newline at end of file

src/modules/personalInfo/index.tsx

 /*
  * @Author: zhangleyuan
  * @Date: 2020-11-27 15:06:31
- * @LastEditors: wufan
- * @LastEditTime: 2021-05-28 15:31:06
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-08-05 10:26:25
  * @Description: 描述一下
  * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
@@ -17,6 +17,7 @@ import IdentificationModal from "./IdentificationModal";
 import ChangePhoneModal from "./ChangePhoneModal";
 import BaseService from "@/domains/basic-domain/baseService";
 import StoreService from "@/domains/store-domain/storeService";
+import WWOpenDataCom from '@/components/WWOpenDataCom';
 import User from "@/common/js/user";
 import "./index.less";
 import { XMContext } from "@/store/context";
@@ -35,7 +36,7 @@ function PersonalInfoPage() {
   const [roleCodes, setRoleCodes] = useState([]);
   const [phone, setPhone] = useState("");
   const [weChatAccount, setWeChatAccount] = useState("");
-
+  const [departmentList,setDepartmentList] = useState([]);
   const storeUserId = User.getStoreUserId();
   const ctx: any = useContext(XMContext);
   const userId = User.getUserId();
@@ -51,11 +52,12 @@ function PersonalInfoPage() {
       storeUserId: User.getStoreUserId(),
     };
     BaseService.getStoreUser(param).then((res) => {
-      const { nickName, phone, roleCodes, weChatAccount } = res.result;
+      const { nickName, phone, roleCodes, weChatAccount,depNameList=[]} = res.result;
       setNickName(nickName);
       setPhone(phone);
       setRoleCodes(roleCodes);
       setWeChatAccount(weChatAccount);
+      setDepartmentList(depNameList)
       if (res.result.avatar) {
         setAvatar(res.result.avatar);
       }
@@ -122,7 +124,6 @@ function PersonalInfoPage() {
     setPhone(phone);
   }
 
-console.log('User.getStoreType()',User.getStoreType());
   return (
     <div className="page personal-info-page">
         <div className="content-header">个人设置</div>
@@ -130,18 +131,7 @@ console.log('User.getStoreType()',User.getStoreType());
           <Form>
             <div className="avatat-item">
               <span className="label">头像：</span>
-              <input
-                type="file"
-                accept="image/*"
-                value={""}
-                id="CrpperAvatarPic"
-                style={{ display: "none" }}
-                onChange={_handleUpdateAvatar}
-              />
               <img className="avatar" src={avatar}></img>
-              <span className="avatar-cover" onClick={_onUpload}>
-                <span className="icon iconfont pen">&#xe82c;</span>
-              </span>
               {cropperModalVisible && (
                 <CropperModal
                   imgUrl={imgUrl}
@@ -162,9 +152,13 @@ console.log('User.getStoreType()',User.getStoreType());
                 }}
               />
             </div>
+            <div className="phone-item">
+                <span className="label">企业微信姓名：</span>
+                <span><WWOpenDataCom type="userName" openid={weChatAccount}/></span>
+            </div>
             {isWorkWechat ? (
               <div className="phone-item">
-                <span className="label">企业微信号：</span>
+                <span className="label">企业微信帐号：</span>
                 <span>{weChatAccount}</span>
               </div>
             ) : (
@@ -181,6 +175,12 @@ console.log('User.getStoreType()',User.getStoreType());
                 </Button>
               </div>
             )}
+            <div>
+                <span className="label">所在部门：</span>
+                {departmentList.map((item,index)=>{
+                  return  <span><WWOpenDataCom type="departmentName" openid={item}/>{index<departmentList.length-1?'、':''}</span>
+                })}
+            </div>
             <div className="save-btn">
               <Button
                 type="primary"

src/modules/plan-manage/components/PlanFilter.jsx

@@ -61,8 +61,8 @@ function PlanFilter(props) {
       delete _query.startTime;
       delete _query.endTime;
     } else {
-      _query.startTime = dates[0].valueOf();
-      _query.endTime = dates[1].valueOf();
+      _query.startTime = dates[0]?.startOf('day').valueOf()
+      _query.endTime = dates[1]?.endOf('day').valueOf()
     }
     const param ={
       ..._query,

src/modules/plan-manage/components/PlanList.jsx

 /*
  * @Author: zhangleyuan
  * @Date: 2021-02-20 16:46:46
- * @LastEditors: wufan
- * @LastEditTime: 2021-07-16 11:29:13
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-07-21 16:03:02
  * @Description: 描述一下
  * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */

src/modules/root/App.tsx

@@ -2,7 +2,7 @@
  * @Author: 吴文洁
  * @Date: 2019-07-10 10:30:49
  * @LastEditors: Please set LastEditors
- * @LastEditTime: 2021-06-22 17:47:02
+ * @LastEditTime: 2021-07-19 16:21:07
  * @Description:
  */
 import React, { useContext, useEffect, useState } from 'react';
@@ -16,9 +16,10 @@ import User from '@/common/js/user';
 import BaseService from "@/domains/basic-domain/baseService";
 import moment from 'moment';
 import { VersionContext, VersionInfo, XMContext } from '@/store/context';
-import { setStoreGroupPermission, setStorePermission, setStoreGroupList, setStoreList } from '@/store/actions/index';
+import { setStoreGroupPermission, setStorePermission, setStoreGroupList, setStoreList, setWechatLogin } from '@/store/actions/index';
 import Service from "@/common/js/service";
 import Bus from '@/core/tbus';
+import WechatApi from '@/common/js/wechatApi';
 import { func } from 'prop-types';
 
 const { Footer, Sider, Content } = Layout;
@@ -28,14 +29,16 @@ declare var window: any;
 const App: React.FC = (props: any) => {
   const [storeUserId, setStoreUserId] = useState('')
   const ctx: any = useContext(XMContext);
-  const [versionInfo, setVersionInfo] = useState<VersionInfo|null>(null)
+  const [versionInfo, setVersionInfo] = useState<VersionInfo | null>(null)
   const userId = User.getUserId();
   const [menuType, setMenuType] = useState(true);
+  const [initWechat, setInitWechat] = useState(false);
   const enterpriseId = User.getEnterpriseId();
   window.ctx = ctx;
-  
+
 
   useEffect(() => {
+    initWechatConfig();
     getStoreAndUserInfo();
     getVersion();
     if (window.location.hash === "#/") {
@@ -44,7 +47,13 @@ const App: React.FC = (props: any) => {
       })
     }
   }, [])
+  async function initWechatConfig() {
+    WechatApi.initConfig({ isAgentConfig: true, url: window.location.href.split('#')[0] }).then(() => {
+      ctx.dispatch(setWechatLogin(true))
+
+    })
 
+  }
   useEffect(() => {
     getStorePermission();
   }, [window.location.hash])
@@ -66,7 +75,7 @@ const App: React.FC = (props: any) => {
       let version = res.result;
       User.setVersion(version);
       User.setExpirationTime(res.result.validEndTime)
-      let versioninfo:VersionInfo = {
+      let versioninfo: VersionInfo = {
         dayTime: version.dayTime,
         stateEnum: version.stateEnum,
         userNum: version.userNum === -1 ? '不限人数' : version.userNum,
@@ -85,30 +94,30 @@ const App: React.FC = (props: any) => {
   async function getStoreAndUserInfo() {
     await (enterpriseId ? getStoreInfo() : getStoreGroupAndStoreList());
   }
-  
+
   function getStoreInfo() {
-    console.log("currentStoreUserInfo",window.currentStoreUserInfo);
+    console.log("currentStoreUserInfo", window.currentStoreUserInfo);
     const params = {
       storeId: User.getStoreId(),
       userId: User.getUserId(),
     };
     Service.Hades('public/customerHades/getStoreAndUserMsg', params).then((res) => {
-      if(res.success){
+      if (res.success) {
         const { id, storeUserId, storeName, userRole, storeType } = res.result;
         User.setStoreId(id);
         User.setStoreUserId(storeUserId);
         User.setStoreName(storeName);
-        Bus.trigger('storeNameChange',storeName);
+        Bus.trigger('storeNameChange', storeName);
         User.setUserRole(userRole);
         User.setStoreType(storeType);
-        setCurrentStoreUserInfo(id,storeUserId)
+        setCurrentStoreUserInfo(id, storeUserId)
         setStoreUserId(storeUserId);
         getUserPermission();
       }
     })
   }
-  
-  function setCurrentStoreUserInfo(storeId:any,storeUserId:any){
+
+  function setCurrentStoreUserInfo(storeId: any, storeUserId: any) {
     window.currentStoreUserInfo.storeId = storeId;
     window.currentStoreUserInfo.storeUserId = storeUserId;
     window.currentStoreUserInfo.userId = User.getUserId();
@@ -134,7 +143,7 @@ const App: React.FC = (props: any) => {
       Bus.trigger('storeNameChange', storeName);
       User.setUserRole(userRole);
       User.setStoreType(storeType);
-      setCurrentStoreUserInfo(id,storeUserId);
+      setCurrentStoreUserInfo(id, storeUserId);
       ctx.dispatch(setStoreGroupList(storeGroupVOS))
       ctx.dispatch(setStoreList(storeVOS));
       setStoreUserId(storeUserId)

src/modules/root/CollegeManagePage.jsx

@@ -5,6 +5,8 @@ import BaseService from "@/domains/basic-domain/baseService";
 import User from "@/common/js/user";
 import { LIVE_SHARE } from "@/domains/course-domain/constants";
 import { Modal, message } from 'antd';
+import WechatApi from '@/common/js/wechatApi';
+import WWOpenDataCom from '@/components/WWOpenData';
 import { brandLogo,xfrwm } from '@/domains/brand/constants'
 import './CollegeManagePage.less';
 import storage from '@/common/js/storage';
@@ -118,6 +120,7 @@ export default class CollegeManagePage extends React.Component {
       isAdmin: false,
       createStoreList: [],
       joinStoreList: [],
+      initWechat: false,
       surplusDayTime: 365, //剩余天数
       endTime: 0, //有效截至时间
     };
@@ -127,6 +130,14 @@ export default class CollegeManagePage extends React.Component {
     this.getStoreList();
     this.getEnterpriseUser();
     this.getVersion()
+
+  }
+
+  initWechatConfig() {
+    WechatApi.initConfig({ isAgentConfig: true, url: window.location.href.split('#')[0] }).then(() => {
+      this.setState({ initWechat: true })
+    })
+
   }
 
   getEnterpriseUser() {
@@ -167,6 +178,7 @@ export default class CollegeManagePage extends React.Component {
         User.setStoreId(mainStore.id);
         User.setStoreUserId(mainStore.storeUserId);
       }
+      this.initWechatConfig();
       const createStoreList = list.filter((item) => {
         return item.userRole === 'StoreManager'
       })
@@ -223,9 +235,7 @@ export default class CollegeManagePage extends React.Component {
       User.removeUserId();
       User.removeToken();
       User.removeEnterpriseId();
-      User.clearUserInfo();
-      const htmlUrl = `${LIVE_SHARE}store/index?id=${User.getCustomerStoreId() || User.getStoreId()}&userId=${User.getUserId()}&from=work_weixin`;
-      window.location.href = htmlUrl;
+      window.RCHistory.replace('/login');
     });
   }
 
@@ -236,7 +246,8 @@ export default class CollegeManagePage extends React.Component {
       list,
       isAdmin,
       createStoreList,
-      joinStoreList
+      joinStoreList,
+      initWechat
     } = this.state;
     return (
       <div className="college-manage-page">
@@ -246,7 +257,12 @@ export default class CollegeManagePage extends React.Component {
             <img className="box-image" src={brandLogo} />
             <div className="user">
               <img className="image" src={avatar} />
-              <span className="name">{name}</span>
+              <span className="name">
+                {
+                  initWechat && <WWOpenDataCom type="userName" openid={name} />
+                }
+
+              </span>
               <span
                 className="logout"
                 onClick={() => {
@@ -270,7 +286,11 @@ export default class CollegeManagePage extends React.Component {
         <div className="college-box">
           <div className="user">
             <img className="image" src={avatar} />
-            <span className="name">{name}</span>
+            <span className="name">
+              {
+                initWechat && <WWOpenDataCom type="userName" openid={name} />
+              }
+            </span>
           </div>
           <div>
             <div className="title-box">

src/modules/root/ErrorCollege.jsx

@@ -71,9 +71,10 @@ export default class ErrorCollege extends React.Component {
       User.removeUserId();
       User.removeToken();
       User.removeEnterpriseId();
-      User.clearUserInfo();
-      const url = `${LIVE_SHARE}store/index?id=${User.getCustomerStoreId()||User.getStoreId()}&userId=${User.getUserId()}&from=work_weixin`;
-      window.location.href = url;
+      window.RCHistory.replace('/login');
+      // User.clearUserInfo();
+      // const url = `${LIVE_SHARE}store/index?id=${User.getCustomerStoreId()||User.getStoreId()}&userId=${User.getUserId()}&from=work_weixin`;
+      // window.location.href = url;
 
     });
   }

src/modules/root/Header.jsx

@@ -2,7 +2,7 @@
  * @Author: 吴文洁
  * @Date: 2019-09-10 18:26:03
  * @LastEditors: Please set LastEditors
- * @LastEditTime: 2021-07-20 17:39:52
+ * @LastEditTime: 2021-08-11 20:26:53
  * @Description:
  */
 import React, { useRef, useContext, useEffect, useState } from 'react';
@@ -19,6 +19,7 @@ import CourseService from '@/domains/course-domain/CourseService';
 import qrcode from '@/libs/qrcode/qrcode.js';
 import Bus from '@/core/tbus';
 import ClickOutside from '../../components/ClickOutside';
+import WWOpenDataCom from '@/components/WWOpenDataCom';
 import _ from 'underscore';
 
 const baseImg = 'https://image.xiaomaiketang.com/xm/rJeQaZxtc7.png';
@@ -75,8 +76,8 @@ function Header(props) {
       storeUserId: User.getStoreUserId(),
     };
     BaseService.getStoreUser(param).then((res) => {
-      const { nickName, phone } = res.result;
-      setNickName(nickName);
+      const { weChatAccount, phone } = res.result;
+      setNickName(weChatAccount);
       setPhone(phone);
       setAvatar(res.result.avatar);
       User.setAvatar(res.result.avatar);
@@ -134,7 +135,10 @@ function Header(props) {
         <div className='user-detail'>
           <div className='box'>
             <Tooltip title={nickName}>
-              <div className='name'>{nickName}</div>
+              <div className='name'>
+                {/* <span>{nickName}</span> */}
+                <WWOpenDataCom type="userName" openid={nickName}/>
+              </div>
             </Tooltip>
             <span className='phone'>{phone}</span>
           </div>
@@ -201,9 +205,10 @@ function Header(props) {
       User.removeUserId();
       User.removeToken();
       User.removeEnterpriseId();
-      User.clearUserInfo();
-      const url = `${LIVE_SHARE}store/index?id=${User.getCustomerStoreId() || User.getStoreId()}&userId=${User.getUserId()}&from=work_weixin`;
-      window.location.href = url;
+      window.RCHistory.replace('/login');
+      // User.clearUserInfo();
+      // const url = `${LIVE_SHARE}store/index?id=${User.getCustomerStoreId() || User.getStoreId()}&userId=${User.getUserId()}&from=work_weixin`;
+      // window.location.href = url;
     });
   }
 
@@ -377,7 +382,10 @@ function Header(props) {
                   }}
                   src={avatar || baseImg}
                 />
-                <span className='name'>{nickName}</span>
+                <span className='name'>
+                  {/* {nickName} */}
+                  <WWOpenDataCom type="userName" openid={nickName}/>
+                </span>
               </div>
             </Dropdown>
           </div>

src/modules/store-manage/EmployeeAddOrEditModal.tsx

 /*
  * @Author: wufan
  * @Date: 2020-11-27 16:21:49
- * @LastEditors: zhangleyuan
- * @LastEditTime: 2021-03-09 14:21:35
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-08-09 11:55:47
  * @Description: Description
  * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
  */
@@ -23,6 +23,7 @@ import _, { values } from "underscore";
 import "./EmployeeAddOrEditModal.less";
 import { CropperModal } from "@/components/";
 import StoreService from "@/domains/store-domain/storeService";
+import WWOpenDataCom from '@/components/WWOpenDataCom';
 import $ from "jquery";
 import User from "@/common/js/user";
 
@@ -36,7 +37,8 @@ interface AddEmployeeModalProps {
     role: Array<string>;
     avatar?: string;
     storeUserId?: string;
-    weChatAccount?: string
+    weChatAccount?: string;
+    depNameList?: any;
   };
   onClose: () => void;
   isWorkWechat: boolean;
@@ -219,20 +221,20 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
             initialValues={{ nickName: nickName, phone: phone, role: role }}
           >
             <Form.Item
-              label="员工昵称"
+              label="员工姓名"
               name="nickName"
-              rules={[{ required: true }]}
-              validateStatus={nameStatus}
-              help={nameErrorMsg || undefined}
+              // rules={[{ required: true }]}
+              // validateStatus={nameStatus}
+              // help={nameErrorMsg || undefined}
               style={{ marginBottom: 0 }}
-            >
-              <Input
-                style={{ width: 200 }}
-                placeholder="请输入员工昵称"
-                maxLength={15}
-                autoComplete="off"
-                onChange={(e) => handleChangeValues("nickName", e.target.value)}
-              />
+            >  
+                <div style={{
+                    whiteSpace: 'nowrap',
+                    textOverflow: 'ellipsis',
+                    overflow: 'hidden',
+                  }}>
+                    <WWOpenDataCom type="userName" openid={props.choosedItem.weChatAccount}/>
+                  </div>
             </Form.Item>
             {props.isWorkWechat ? (
               <Form.Item
@@ -272,6 +274,21 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
                 />
               </Form.Item>
             )}
+              <Form.Item
+              label="所在部门"
+              name="weChatAccount"
+              style={{ marginBottom: 0 }}
+            >  
+                  <div style={{
+                    whiteSpace: 'nowrap',
+                    textOverflow: 'ellipsis',
+                    overflow: 'hidden',
+                  }}>
+                     {props.choosedItem.depNameList.map((item:any,index:any)=>{
+                        return  <span><WWOpenDataCom type="departmentName" openid={item}/>{index<props.choosedItem.depNameList.length-1?'、':''}</span>
+                      })}
+                  </div>
+            </Form.Item>
             <Form.Item
               label="员工角色"
               name="role"
@@ -312,25 +329,6 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
             <div className="avatart-img">
               <img className="avatar" src={avatar}></img>
             </div>
-            <div className="upload-avatar">
-              <Button id="click_upload_btn" onClick={_onUpload}>
-                上传头像
-              </Button>
-              <input
-                type="file"
-                accept="image/*"
-                id="CrpperAvatarPic"
-                style={{ display: "none" }}
-                onChange={_handleUpdateAvatar}
-              />
-              {cropperModalVisible && (
-                <CropperModal
-                  imgUrl={imgUrl}
-                  save={changeAvatar}
-                  close={closeCropperModal}
-                />
-              )}
-            </div>
           </div>
         </Col>
       </Row>

src/routes/config/mainRoutes.tsx

 /*
  * @Author: 吴文洁
  * @Date: 2020-04-29 10:26:32
- * @LastEditors: wufan
- * @LastEditTime: 2021-05-13 16:39:51
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-08-11 20:27:02
  * @Description: 内容线路由配置
  */
-import Home from '@/modules/home/Home'
-import EmployeesManagePage from '@/modules/store-manage/EmployeesManagePage'
-import EmployeeManage from '@/modules/college-manage/EmployeeManage'
-import personalInfoPage from '@/modules/personalInfo'
-import UserManagePage from '@/modules/store-manage/UserManagePage'
-import UserManage from '@/modules/college-manage/UserManagePage'
-import StoreDecorationPage from '@/modules/store-manage/StoreDecorationPage'
-import CourseCatalogPage from '@/modules/store-manage/CourseCatalogPage'
-import LiveCoursePage from '@/modules/course-manage/LiveCoursePage'
-import AddLivePage from '@/modules/course-manage/AddLive'
-import VideoCoursePage from '@/modules/course-manage/video-course'
-import GraphicsCoursePage from '@/modules/course-manage/graphics-course'
-import OfflineCoursePage from '@/modules/course-manage/offline-course'
-import AddVideoCoursePage from '@/modules/course-manage/video-course/AddVideoCourse'
-import AddGraphicsCoursePage from '@/modules/course-manage/graphics-course/AddGraphicsCourse'
-import AddOfflineCoursePage from '@/modules/course-manage/offline-course/AddOfflineCourse'
+import Home from '@/modules/home/Home';
+import EmployeesManagePage from '@/modules/store-manage/EmployeesManagePage';
+import EmployeeManage from '@/modules/college-manage/EmployeeManage';
+import personalInfoPage from '@/modules/personalInfo';
+import UserManagePage from '@/modules/store-manage/UserManagePage';
+import UserManage from '@/modules/college-manage/NewUsersManagePage';
+import StoreDecorationPage from '@/modules/store-manage/StoreDecorationPage';
+import CourseCatalogPage from '@/modules/store-manage/CourseCatalogPage';
+import LiveCoursePage from '@/modules/course-manage/LiveCoursePage';
+import AddLivePage from '@/modules/course-manage/AddLive';
+import VideoCoursePage from '@/modules/course-manage/video-course';
+import GraphicsCoursePage from '@/modules/course-manage/graphics-course';
+import OfflineCoursePage from '@/modules/course-manage/offline-course';
+import AddVideoCoursePage from '@/modules/course-manage/video-course/AddVideoCourse';
+import AddGraphicsCoursePage from '@/modules/course-manage/graphics-course/AddGraphicsCourse';
+import AddOfflineCoursePage from '@/modules/course-manage/offline-course/AddOfflineCourse';
 // import DataList from '@/modules/course-manage/DataList/DataList';
 // import ClassBook from '@/modules/resource-disk';
 import ResourceDisk from '@/modules/resource-disk'

src/store/actions/basicAction.ts

@@ -10,7 +10,8 @@ import {
     STORE_GROUP_PERMISSION,
     STORE_PERMISSION,
     STORE_GROUP_LIST,
-    STORE_LIST
+    STORE_LIST,
+    WECHAT_LOGIN
 } from './constants'
 
 
@@ -34,12 +35,18 @@ const setStoreList = (payload: any) => ({
     payload
 })
 
+const setWechatLogin = (payload: any) => ({
+    type: WECHAT_LOGIN,
+    payload
+})
+
 
 
 export {
     setStoreGroupPermission,
     setStorePermission,
     setStoreGroupList,
-    setStoreList
+    setStoreList,
+    setWechatLogin
 }
 

src/store/actions/constants.ts

@@ -10,11 +10,13 @@ const STORE_GROUP_PERMISSION = 'STORE_GROUP_PERMISSION';
 const STORE_PERMISSION = 'STORE_PERMISSION';
 const STORE_GROUP_LIST = 'STORE_GROUP_LIST';
 const STORE_LIST = 'STORE_LIST';
+const WECHAT_LOGIN = 'WECHAT_LOGIN';
 
 export {
     STORE_GROUP_PERMISSION,
     STORE_PERMISSION,
     STORE_GROUP_LIST,
     STORE_LIST,
+    WECHAT_LOGIN,
     
 }
\ No newline at end of file

src/store/actions/index.ts

@@ -4,12 +4,14 @@ import {
     setStoreGroupPermission,
     setStorePermission,
     setStoreGroupList,
-    setStoreList
+    setStoreList,
+    setWechatLogin
 } from './basicAction';
 
 export  {
     setStoreGroupPermission,
     setStorePermission,
     setStoreGroupList,
-    setStoreList
+    setStoreList,
+    setWechatLogin
 }
\ No newline at end of file

src/store/reducers/basicReducer.ts

@@ -10,7 +10,8 @@ import {
     STORE_GROUP_PERMISSION,
     STORE_PERMISSION,
     STORE_GROUP_LIST,
-    STORE_LIST
+    STORE_LIST,
+    WECHAT_LOGIN,
 } from '@/store/actions/constants';
 import _ from 'underscore';
 import Permission from '@/common/js/permission';
@@ -45,6 +46,11 @@ const basicReducer = (state: any, action: any) => {
             return Object.assign({}, state, {
                 storeList,
             });
+            case WECHAT_LOGIN:
+            const wechatLogin: any = action.payload;
+            return Object.assign({}, state, {
+                wechatLogin,
+            });
         default:
             return state;
     }