Skip to content

X
xiaomai-cloud-class-web
Commit 14068771 by wufan
Options

fix:合并任务并解决冲突

parents 1d14c756 c80863f2
Showing with 194 additions and 174 deletions
src/modules/college-manage/EmployeeManage.tsx
...@@ -5,23 +5,21 @@ ...@@ -5,23 +5,21 @@
* @Last Modified time: 2021-04-10 14:36:43 * @Last Modified time: 2021-04-10 14:36:43
* 学院管理-员工管理 * 学院管理-员工管理
*/ */
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from "react";
import { withRouter } from 'react-router-dom'; import { withRouter } from "react-router-dom";
import _ from 'underscore'; import _ from "underscore";
import { CheckBox, PageControl } from '@/components'; import { CheckBox, PageControl } from "@/components";
import { Button, Table, Modal, message, Input, Tooltip } from 'antd'; import { Button, Table, Modal, message, Input,Tooltip} from "antd";
import { XMTable } from '@/components'; import { XMTable } from '@/components';
import college from '@/common/lottie/college.json'; import college from '@/common/lottie/college.json';
import StoreService from "@/domains/store-domain/storeService"; import StoreService from "@/domains/store-domain/storeService";
import EmployeeAddOrEditModal from "../store-manage/EmployeeAddOrEditModal"; import EmployeeAddOrEditModal from "../store-manage/EmployeeAddOrEditModal";
import User from "@/common/js/user"; import User from "@/common/js/user";
import WechatApi from '@/common/js/wechatApi'; import LimitTip from "./LimitTip";
import LimitTip from './LimitTip';
import WWOpenDataCom from '@/components/WWOpenDataCom'; import WWOpenDataCom from '@/components/WWOpenDataCom';
import "./EmployeeManage.less";
import './EmployeeManage.less'; import NewChooseMembersModal from "./modal/NewChooseMembersModal";
import NewChooseMembersModal from './modal/NewChooseMembersModal';
const { confirm } = Modal; const { confirm } = Modal;
const { Search } = Input; const { Search } = Input;
...@@ -35,7 +33,7 @@ interface RecordTypes { ...@@ -35,7 +33,7 @@ interface RecordTypes {
phone: string; phone: string;
avatar?: string; avatar?: string;
weChatAccount?: string; weChatAccount?: string;
depNameList: any; depNameList:any
} }
interface RoleItemType { interface RoleItemType {
...@@ -60,7 +58,7 @@ interface ChoosedItemType { ...@@ -60,7 +58,7 @@ interface ChoosedItemType {
avatar?: string; avatar?: string;
storeUserId?: string; storeUserId?: string;
weChatAccount?: string; weChatAccount?: string;
depNameList?: any; depNameList?:any;
} }
function EmployeeManage() { function EmployeeManage() {
...@@ -68,25 +66,25 @@ function EmployeeManage() { ...@@ -68,25 +66,25 @@ function EmployeeManage() {
const [query, setQuery] = useState<QueryType>({ const [query, setQuery] = useState<QueryType>({
current: 0, current: 0,
size: 10, size: 10,
nickName: '', nickName: "",
phone: '', phone: "",
roleCodes: [], roleCodes: [],
}); });
const [total, setTotal] = useState(0); const [total, setTotal] = useState(0);
const [realTotal, setRealTotal] = useState(0); const [realTotal, setRealTotal] = useState(0)
const [model, setModel] = useState<React.ReactNode>(null); const [model, setModel] = useState<React.ReactNode>(null);
const [employeeModal, setEmployeeModal] = useState(false); const [employeeModal, setEmployeeModal] = useState(false);
const [choosedItem, setChooseItem] = useState<ChoosedItemType>({ const [choosedItem, setChooseItem] = useState<ChoosedItemType>({
nickName: '', nickName: "",
phone: '', phone: "",
role: [], role: [],
avatar: '', avatar: "",
}); });
const [roleIds, setRoleIds] = useState<Array<RoleItemType>>([]); const [roleIds, setRoleIds] = useState<Array<RoleItemType>>([]);
const storeId = User.getStoreId(); const storeId = User.getStoreId();
const StoreType = User.getStoreType(); const StoreType = User.getStoreType();
const isWorkWechat = !!(StoreType === 'WE_CHAT_STORE'); const isWorkWechat = !!(StoreType === "WE_CHAT_STORE");
useEffect(() => { useEffect(() => {
if (!User.getEnterpriseId()) { if (!User.getEnterpriseId()) {
...@@ -96,14 +94,14 @@ function EmployeeManage() { ...@@ -96,14 +94,14 @@ function EmployeeManage() {
const _query = { const _query = {
current: 0, current: 0,
size: 10, size: 10,
nickName: '', nickName: "",
phone: '', phone: "",
roleCodes: [], roleCodes: [],
}; }
StoreService.getEmployeeList(_query).then((res: any) => { StoreService.getEmployeeList(_query).then((res: any) => {
setRealTotal(res.result.total); setRealTotal(res.result.total);
}); });
}, []); }, [])
useEffect(() => { useEffect(() => {
getEmployeeList(); getEmployeeList();
...@@ -135,7 +133,7 @@ function EmployeeManage() { ...@@ -135,7 +133,7 @@ function EmployeeManage() {
const _query = { ...query }; const _query = { ...query };
let _data = _.filter(data, (_item) => { let _data = _.filter(data, (_item) => {
return _item.roleCode !== 'StoreManager'; return _item.roleCode !== "StoreManager";
}); });
setRoleIds(_data); setRoleIds(_data);
...@@ -150,21 +148,29 @@ function EmployeeManage() { ...@@ -150,21 +148,29 @@ function EmployeeManage() {
fixed:'left', fixed:'left',
render: (val: string, record: RecordTypes) => { render: (val: string, record: RecordTypes) => {
return ( return (
<div className='employee-info'> <div className="employee-info">
{isWorkWechat && <img src={record.avatar || 'https://image.xiaomaiketang.com/xm/rJeQaZxtc7.png'} alt='' />} {isWorkWechat && (
<img
src={
record.avatar ||
"https://image.xiaomaiketang.com/xm/rJeQaZxtc7.png"
}
alt=""
/>
)}
{/* <span className="title">{val}</span> */} {/* <span className="title">{val}</span> */}
<span className='title'> <span className="title">
<WWOpenDataCom type='userName' openid={val} /> <WWOpenDataCom type="userName" openid={val}/>
</span> </span>
</div> </div>
); );
}, },
}, },
{ {
title: '手机号', title: "手机号",
dataIndex: 'phone', dataIndex: "phone",
key: 'phone', key: "phone",
render: (val: string) => { render: (val: string) => {
return <div>{val || '-'}</div>; return <div>{val || '-'}</div>;
}, },
...@@ -177,8 +183,8 @@ function EmployeeManage() { ...@@ -177,8 +183,8 @@ function EmployeeManage() {
if(!record.depNameList){ if(!record.depNameList){
return <span>-</span> return <span>-</span>
} }
if (record.depNameList.length === 0) { if(record.depNameList.length === 0){
return <span>-</span>; 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 <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> return <span><WWOpenDataCom type="departmentName" openid={item}/>{index<(record.depNameList.length -1)?'；':''}</span>
...@@ -192,7 +198,7 @@ function EmployeeManage() { ...@@ -192,7 +198,7 @@ function EmployeeManage() {
dataIndex: "role", dataIndex: "role",
key: "role", key: "role",
render: (val: string) => { render: (val: string) => {
return <div>{val.split('，').join('、')}</div>; return <div>{val.split("，").join("、")}</div>;
}, },
}, },
{ {
...@@ -200,17 +206,31 @@ function EmployeeManage() { ...@@ -200,17 +206,31 @@ function EmployeeManage() {
dataIndex: "operation", dataIndex: "operation",
fixed:'right', fixed:'right',
render: (val: string, record: RecordTypes) => { render: (val: string, record: RecordTypes) => {
return record.role === '学院管理员' || record.userId === User.getUserId() ? ( return record.role === "学院管理员" ||
<div className='no-operate'>-</div> record.userId === User.getUserId() ? (
<div className="no-operate">-</div>
) : ( ) : (
<div className='operation'> <div className="operation">
<span className='edit' onClick={() => handleEditEmployee(record)}> {!record.depNameList &&
编辑 <span className="edit edit-disable">
</span> 编辑
<span className='divider-line'>{' | '}</span> </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 <span
className="delete" className="delete"
onClick={() => { onClick={() =>{
handleDeleteWorkWechatEmployeeConfirm(record) handleDeleteWorkWechatEmployeeConfirm(record)
}} }}
> >
...@@ -224,9 +244,9 @@ function EmployeeManage() { ...@@ -224,9 +244,9 @@ function EmployeeManage() {
if (isWorkWechat && columns) { if (isWorkWechat && columns) {
const item = { const item = {
title: '企业微信账号', title: "企业微信账号",
dataIndex: 'weChatAccount', dataIndex: "weChatAccount",
key: 'weChatAccount', key: "weChatAccount",
render: (val: string) => { render: (val: string) => {
return <div>{val}</div>; return <div>{val}</div>;
}, },
...@@ -236,19 +256,15 @@ function EmployeeManage() { ...@@ -236,19 +256,15 @@ function EmployeeManage() {
return columns; return columns;
} }
function handleDepName(depArray: any): any { function handleDepName(depArray:any):any{
const depArrayDom = depArray.map((item: any, index: any) => { const depArrayDom = depArray.map((item:any, index:any) => {
return ( return <span><WWOpenDataCom type="departmentName" openid={item}/>；</span>
<span>
<WWOpenDataCom type='departmentName' openid={item} />；
</span>
);
}); });
return depArrayDom; return depArrayDom;
} };
function handleEditEmployee(record: RecordTypes) { function handleEditEmployee(record: RecordTypes) {
const { nickName, phone, roleCodes, avatar, id, weChatAccount, depNameList } = record; const { nickName, phone, roleCodes, avatar, id, weChatAccount,depNameList} = record;
const _choosesItem = { const _choosesItem = {
nickName: nickName, nickName: nickName,
phone: phone, phone: phone,
...@@ -256,7 +272,7 @@ function EmployeeManage() { ...@@ -256,7 +272,7 @@ function EmployeeManage() {
avatar: avatar, avatar: avatar,
storeUserId: id, storeUserId: id,
weChatAccount, weChatAccount,
depNameList: depNameList, depNameList:depNameList
}; };
setChooseItem(_choosesItem); setChooseItem(_choosesItem);
const model: React.ReactNode = ( const model: React.ReactNode = (
...@@ -266,13 +282,13 @@ function EmployeeManage() { ...@@ -266,13 +282,13 @@ function EmployeeManage() {
setModel(null); setModel(null);
getEmployeeList(); getEmployeeList();
setChooseItem({ setChooseItem({
nickName: '', nickName: "",
phone: '', phone: "",
role: [], role: [],
avatar: '', avatar: "",
storeUserId: '', storeUserId: "",
weChatAccount: '', weChatAccount:"",
depNameList: [], depNameList:[]
}); });
}} }}
isWorkWechat={isWorkWechat} isWorkWechat={isWorkWechat}
...@@ -283,12 +299,14 @@ function EmployeeManage() { ...@@ -283,12 +299,14 @@ function EmployeeManage() {
function handleDeleteWorkWechatEmployeeConfirm(record: RecordTypes) { function handleDeleteWorkWechatEmployeeConfirm(record: RecordTypes) {
return confirm({ return confirm({
title: '你确定要删除此员工吗？', title: "你确定要删除此员工吗？",
content: '删除后数据无法恢复', content: "删除后数据无法恢复",
icon: <span className='icon iconfont default-confirm-icon'>&#xe839; </span>, icon: (
okText: '删除', <span className="icon iconfont default-confirm-icon">&#xe839; </span>
okType: 'danger', ),
cancelText: '取消', okText: "删除",
okType: "danger",
cancelText: "取消",
onOk: () => { onOk: () => {
handleDeleteEmployee(record.id); handleDeleteEmployee(record.id);
}, },
...@@ -301,21 +319,21 @@ function EmployeeManage() { ...@@ -301,21 +319,21 @@ function EmployeeManage() {
function handleDeleteEmployee(storeUserId: string) { function handleDeleteEmployee(storeUserId: string) {
StoreService.deleteEmployee({ storeUserId }).then((res: any) => { StoreService.deleteEmployee({ storeUserId }).then((res: any) => {
const msg = isWorkWechat ? "员工已删除" : "讲师已删除"; const msg = isWorkWechat ? "员工已删除":"讲师已删除";
message.success(msg); message.success(msg);
getEmployeeList(); getEmployeeList();
}); });
} }
function updateListData() { function updateListData(){
let num: any; let num:any;
const params = { const params = {
enterpriseId: User.getEnterpriseId(), enterpriseId:User.getEnterpriseId(),
storeId: User.getStoreId(), storeId:User.getStoreId(),
userType: 'USER', userType:'USER'
}; }
StoreService.getSyncCount(params).then((res) => { StoreService.getSyncCount(params).then((res) => {
num = res.result; num = res.result;
if (num < 3) { if(num<3){
return confirm({ return confirm({
title: "确定更新列表数据吗？", title: "确定更新列表数据吗？",
content: <span>员工数据来源企微通讯录，一天只能更新3次，今日还能更新<span style={{color:'#2966FF'}}>{3-num}</span>次。</span>, content: <span>员工数据来源企微通讯录，一天只能更新3次，今日还能更新<span style={{color:'#2966FF'}}>{3-num}</span>次。</span>,
...@@ -325,10 +343,10 @@ function EmployeeManage() { ...@@ -325,10 +343,10 @@ function EmployeeManage() {
okText: "确定", okText: "确定",
cancelText: "取消", cancelText: "取消",
onOk: () => { onOk: () => {
confirmUpdateListData(); confirmUpdateListData()
}, },
}); });
} else { }else{
Modal.warning({ Modal.warning({
title: '提示', title: '提示',
okText: '我知道了', okText: '我知道了',
...@@ -341,105 +359,109 @@ function EmployeeManage() { ...@@ -341,105 +359,109 @@ function EmployeeManage() {
}); });
} }
}); });
} }
function confirmUpdateListData() { function confirmUpdateListData(){
const params = { const params = {
enterpriseId: User.getEnterpriseId(), enterpriseId:User.getEnterpriseId(),
storeId: User.getStoreId(), storeId:User.getStoreId(),
userType: 'USER', userType:'USER'
}; }
StoreService.syncWorkWeChatDepartment(params).then((res) => { StoreService.syncWorkWeChatDepartment(params).then((res) => {
getEmployeeList(); getEmployeeList();
message.success('已更新'); message.success('已更新');
}); });
} }
return ( return (
<div className='page employee-manage-page'> <div className="page employee-manage-page">
<div className='content-header'>角色管理</div> <div className="content-header">角色管理</div>
<div className='box'> <div className="box">
<div className='box-header'> <div className="box-header">
<div <div
style={{ style={{
display: 'flex', display: "flex",
alignItems: 'center', alignItems: "center",
justifyContent: 'flex-start', justifyContent: "flex-start",
padding: '0px 0 4px', padding: "0px 0 4px",
}}> }}
<div> >
<div>
搜索员工： 搜索员工：
<Search <Search
style={{ style={{
width: 300, width: 300,
marginRight: 40, marginRight: 40,
}} }}
placeholder={ placeholder={
isWorkWechat ? "请输入员工昵称" : "搜索员工昵称/手机号" isWorkWechat ? "请输入员工昵称" : "搜索员工昵称/手机号"
}
onSearch={(value) => {
const _query = { ...query };
// 企业微信用户只能搜索员工昵称
if (isWorkWechat) {
_query.nickName = value;
_query.current = 0;
setQuery(_query);
return;
}
if (value) {
const isPhone = (value || "").match(/^\d+$/);
const name = isPhone ? "phone" : "nickName";
const otherName = isPhone ? "nickName" : "phone";
_query[name] = value;
_query[otherName] = "";
_query.current = 0;
} else {
_query.nickName = "";
_query.phone = "";
_query.current = 0;
} }
setQuery(_query); onSearch={(value) => {
}} const _query = { ...query };
enterButton={<span className="icon iconfont">&#xe832;</span>} // 企业微信用户只能搜索员工昵称
/> if (isWorkWechat) {
</div> _query.nickName = value;
_query.current = 0;
setQuery(_query);
return;
}
<div> if (value) {
角色： const isPhone = (value || "").match(/^\d+$/);
{_.map(roleIds, (item: any) => { const name = isPhone ? "phone" : "nickName";
return ( const otherName = isPhone ? "nickName" : "phone";
<CheckBox _query[name] = value;
key={item.roleCode} _query[otherName] = "";
text={item.name} _query.current = 0;
name={item.roleCode} } else {
onChange={(e: any) => { _query.nickName = "";
const { checked, name } = e.target; _query.phone = "";
const _query = { ...query };
_query.roleCodes = [];
_query.current = 0; _query.current = 0;
const _roleIds: Array<RoleItemType> = roleIds.map( }
(_item: RoleItemType) => { setQuery(_query);
if (name === _item.roleCode) { }}
if (checked) { enterButton={<span className="icon iconfont">&#xe832;</span>}
_item.isChecked = true; />
} else { </div>
_item.isChecked = false;
<div>
角色：
{_.map(roleIds, (item: any) => {
return (
<CheckBox
key={item.roleCode}
text={item.name}
name={item.roleCode}
onChange={(e: any) => {
const { checked, name } = e.target;
const _query = { ...query };
_query.roleCodes = [];
_query.current = 0;
const _roleIds: Array<RoleItemType> = roleIds.map(
(_item: RoleItemType) => {
if (name === _item.roleCode) {
if (checked) {
_item.isChecked = true;
} else {
_item.isChecked = false;
}
} }
if (_item.isChecked) {
_query.roleCodes.push(_item.roleCode);
}
return _item;
} }
if (_item.isChecked) { );
_query.roleCodes.push(_item.roleCode);
}
return _item;
}
);
setRoleIds(_roleIds); setRoleIds(_roleIds);
setQuery(_query); setQuery(_query);
}} }}
defaultChecked={item.isChecked} defaultChecked={item.isChecked}
/> />
); );
})} })}
</div>
</div> </div>
{(User.getUserRole() === 'CloudManager' || User.getUserRole() === 'StoreManager') && {(User.getUserRole() === 'CloudManager' || User.getUserRole() === 'StoreManager') &&
<> <>
...@@ -491,23 +513,21 @@ function EmployeeManage() { ...@@ -491,23 +513,21 @@ function EmployeeManage() {
}} }}
/> />
</div> </div>
</div> </div>
{model} {model}
{employeeModal && { employeeModal &&
<NewChooseMembersModal <NewChooseMembersModal
treeDepType="DEP_CHAT" treeDepType="DEP_CHAT"
visible={employeeModal} visible={employeeModal}
type='USER' type="USER"
close={() => { close={()=>{setEmployeeModal(false)}}
setEmployeeModal(false);
}}
onConfirm={() => { onConfirm={() => {
setEmployeeModal(false); setEmployeeModal(false)
message.success('添加成功'); message.success('添加成功')
getEmployeeList(); getEmployeeList();
}} }}
/> />
} }
</div> </div>
); );
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment