Commit a3da4a1b authored by 皮倩雯's avatar 皮倩雯

fix: '机构,站点树支持搜索'

parent 79275726
import React, { useState, useEffect, useCallback, useRef } from 'react';
import { Form, Modal, Space, Divider, Radio, Checkbox } from 'antd';
import {
} from '@/services/tablemanager/tablemanager'
import styles from './index.less'
import {} from '@/services/tablemanager/tablemanager';
import Sortable from 'sortablejs';
import styles from './index.less'
const CheckboxGroup = Checkbox.Group;
const AddModal = props => {
const { callBackSubmit = () => { }, isType, formObj, visible, filed, characterValue, newCheckedList } = props;
const {
callBackSubmit = () => {},
isType,
formObj,
visible,
filed,
characterValue,
newCheckedList,
} = props;
const [loading, setLoading] = useState(false);
const [value, setValue] = useState('');
const [checkValue, setCheckValue] = useState([]);
const [form] = Form.useForm();
const [title, setTitle] = useState([])
const [title, setTitle] = useState([]);
const { Item } = Form;
const [checkedList, setCheckedList] = useState([]);//选中的复选框内容
const [checkedList, setCheckedList] = useState([]); // 选中的复选框内容
const [indeterminate, setIndeterminate] = useState([]);
const [checkAll, setCheckAll] = useState([]);
const [selectData, setSelectData] = useState([])
let objArr = []
const onChangeList = (list, index,title) => {
const checkedListArr = [...checkedList]
checkedListArr[index] = list
const [selectData, setSelectData] = useState([]);
let objArr = [];
const onChangeList = (list, index, title) => {
const checkedListArr = [...checkedList];
checkedListArr[index] = list;
setCheckedList(checkedListArr);
const indeterminateArr = [...indeterminate]
const checkAllArr = [...checkAll]
indeterminateArr[index] = !!list.length && list.length < filed[title].length
checkAllArr[index] = list.length === filed[title].length
setIndeterminate(indeterminateArr)
const indeterminateArr = [...indeterminate];
const checkAllArr = [...checkAll];
indeterminateArr[index] = !!list.length && list.length < filed[title].length;
checkAllArr[index] = list.length === filed[title].length;
setIndeterminate(indeterminateArr);
setCheckAll(checkAllArr);
};
const onCheckAllChange = e => {
const indeterminateArr = [...indeterminate]
const checkAllArr = [...checkAll]
const checkedListArr = [...checkedList]
checkAllArr[e.target.index] = e.target.checked
indeterminateArr[e.target.index] = false
e.target.checked ? checkedListArr[e.target.index] = e.target.checkvalue : checkedListArr[e.target.index] = []
const indeterminateArr = [...indeterminate];
const checkAllArr = [...checkAll];
const checkedListArr = [...checkedList];
checkAllArr[e.target.index] = e.target.checked;
indeterminateArr[e.target.index] = false;
e.target.checked
? (checkedListArr[e.target.index] = e.target.checkvalue)
: (checkedListArr[e.target.index] = []);
setCheckedList(checkedListArr);
setIndeterminate(indeterminateArr);
setCheckAll(checkAllArr);
};
//监听用户选择的字段名
// 监听用户选择的字段名
useEffect(() => {
selectAll()
selectAll();
}, [checkedList]);
const selectAll = () => {
objArr = []
objArr = [];
checkedList.map(item => {
objArr = objArr.concat(item)
})
setSelectData(objArr)
}
objArr = objArr.concat(item);
});
setSelectData(objArr);
};
const onSubmit = () => {
isType === 'rule' ? callBackSubmit(`${value === '无' || value === '' ? '' : value + ','}${checkValue.join(',')}`) : callBackSubmit({ checkedList, str: selectData.join(",") });
isType === 'rule'
? callBackSubmit(
`${value === '无' || value === '' ? '' : value + ','}${checkValue.join(',')}`,
)
: callBackSubmit({ checkedList, str: selectData.join(',') });
};
useEffect(() => {
if (isType != '' && isType === 'rule') {
setValue(formObj.numerical)
setCheckValue(formObj.rule)
}
else if (isType === 'characteristics') {
let arr = Object.keys(filed)
setTitle(arr)
let checkArr = []
let indeterminateArr = []
let checkAllArr = []
setValue(formObj.numerical);
setCheckValue(formObj.rule);
} else if (isType === 'characteristics') {
let arr = Object.keys(filed);
setTitle(arr);
let checkArr = [];
let indeterminateArr = [];
let checkAllArr = [];
arr.map((item, index) => {
checkArr[index] = []
checkArr[index] = [];
newCheckedList.map(checkItem => {
if (filed[item].includes(checkItem)) {
checkArr[index].push(checkItem)
checkArr[index].push(checkItem);
}
})
indeterminateArr.push(!!checkArr[index].length && checkArr[index].length < filed[item].length)
checkAllArr.push(checkArr[index].length === filed[item].length)
})
setCheckedList(checkArr)
setIndeterminate(indeterminateArr)
setCheckAll(checkAllArr)
let newArr = characterValue.length? characterValue.split(","):[]
setSelectData(newArr)
draftSort()
});
indeterminateArr.push(
!!checkArr[index].length && checkArr[index].length < filed[item].length,
);
checkAllArr.push(checkArr[index].length === filed[item].length);
});
setCheckedList(checkArr);
setIndeterminate(indeterminateArr);
setCheckAll(checkAllArr);
let newArr = characterValue.length ? characterValue.split(',') : [];
setSelectData(newArr);
draftSort();
}
}, [visible]);
//单选框变化时触发的事件
const handleChange = (e) => {
setValue(e.target.value)
// 单选框变化时触发的事件
const handleChange = e => {
setValue(e.target.value);
if (e.target.value === '无') {
setCheckValue([])
setCheckValue([]);
}
}
//复选框变化时触发的事件
const onChange = (e) => {
setCheckValue(e)
};
// 复选框变化时触发的事件
const onChange = e => {
setCheckValue(e);
if (e.length && value == '无') {
setValue('')
setValue('');
}
}
//拖拽初始化及逻辑
};
// 拖拽初始化及逻辑
const draftSort = () => {
let el = document.getElementById('doctor-drag-items');
if (el) {
let sortable = Sortable.create(el, {
animation: 100, //动画参数
onEnd: function (evt) { //拖拽完毕之后发生,只需关注该事件
animation: 100, // 动画参数
onEnd (evt) { //拖拽完毕之后发生,只需关注该事件
let arr = [];
let len = evt.from.children.length;
for (let i = 0; i < len; i++) {
arr.push(evt.from.children[i].getAttribute('drag-id'))
}
setSelectData(arr)
}
},
});
}
}
};
return (
<Modal
......@@ -130,31 +140,35 @@ const AddModal = props => {
style={{ top: '10px' }}
width="700px"
destroyOnClose
centered ={true}
centered={true}
maskClosable={false}
cancelText="取消"
okText="确认"
{...props}
onOk={() => onSubmit()}
confirmLoading={loading}
forceRender={true}
forceRender
getContainer={false}
>
{visible && isType === 'rule' && (
<>
<Radio.Group onChange={handleChange} value={value}>
<Space direction="vertical">
<Radio value='无'>无(清空选中)</Radio>
<Radio value='number'>数值(number)</Radio>
<Radio value='digits'>整数(digits)</Radio>
<Radio value='email'>邮箱(email)</Radio>
<Radio value='identity'>身份证号(identity)</Radio>
<Radio value='mobile'>手机号(mobile)</Radio>
<Radio value='bankAccount'>银行卡号(bankAccount)</Radio>
<Radio value='timeControl'>时间控制(timeControl)</Radio>
<Radio value="无">无(清空选中)</Radio>
<Radio value="number">数值(number)</Radio>
<Radio value="digits">整数(digits)</Radio>
<Radio value="email">邮箱(email)</Radio>
<Radio value="identity">身份证号(identity)</Radio>
<Radio value="mobile">手机号(mobile)</Radio>
<Radio value="bankAccount">银行卡号(bankAccount)</Radio>
<Radio value="timeControl">时间控制(timeControl)</Radio>
</Space>
</Radio.Group>
<Checkbox.Group style={{ width: '100%', marginTop: '1rem' }} onChange={onChange} value={checkValue}>
<Checkbox.Group
style={{ width: '100%', marginTop: '1rem' }}
onChange={onChange}
value={checkValue}
>
<Space direction="vertical">
<Checkbox value="required">必填(required)</Checkbox>
<Checkbox value="emphasis">强调(emphasis)</Checkbox>
......@@ -166,17 +180,25 @@ const AddModal = props => {
{visible && isType === 'characteristics' && (
<div className={styles.listCard}>
<div className={styles.cardItem} style={{ borderRight: '1px solid #99bbe8' }}>
<Divider orientation="left" style={{ margin: '0 0 10px 0', backgroundColor: '#dfe8f6' }}>待选字段列表</Divider>
<Divider
orientation="left"
style={{ margin: '0 0 10px 0', backgroundColor: '#dfe8f6' }}
>
待选字段列表
</Divider>
<div className={styles.cardContent}>
{title.map((item, index) => {
return <div className={styles.cardItemData} key={index}>
{title.map((item, index) => <div className={styles.cardItemData} key={index}>
<Divider orientation="left" style={{ margin: '0 0 10px 0', color: '#15428b', borderTopColor: '#99bbe8' }}>{item} <Checkbox indeterminate={indeterminate[index]} onChange={onCheckAllChange} index={index} checkvalue={filed[item]} checked={checkAll[index]}> </Checkbox></Divider>
<CheckboxGroup options={filed[item]} value={checkedList[index]} onChange={(e) => onChangeList(e, index,item)} /></div>
})}
<CheckboxGroup options={filed[item]} value={checkedList[index]} onChange={(e) => onChangeList(e, index,item)} /></div>)}
</div>
</div>
<div className={styles.cardItem}>
<Divider orientation="left" style={{ margin: '0 0 10px 0', backgroundColor: '#dfe8f6' }}>已选字段列表</Divider>
<Divider
orientation="left"
style={{ margin: '0 0 10px 0', backgroundColor: '#dfe8f6' }}
>
已选字段列表
</Divider>
<div className={styles.cardContent}>
<div className={styles.doctorTable}>
<table>
......@@ -185,25 +207,26 @@ const AddModal = props => {
<td>字段名</td>
</tr>
</thead>
<tbody id='doctor-drag-items'>
{selectData && selectData.length > 0 ?
selectData.map((item, index) => {
return <tr drag-id={item} key={index} style={{ cursor: 'move' }}>
<tbody id="doctor-drag-items">
{selectData && selectData.length > 0 ? (
selectData.map((item, index) => <tr drag-id={item} key={index} style={{ cursor: 'move' }}>
<td><span title={item}>{item}</span></td>
</tr>
</tr>)
})
: <tr><td colSpan='10' style={{ textAlign: 'center' }}>暂无数据</td></tr>
}
) : (
<tr>
<td colSpan="10" style={{ textAlign: 'center' }}>
暂无数据
</td>
</tr>
)}
</tbody>
</table>
</div>
</div>
</div>
</div>
)
}
)}
</Modal>
);
};
......
......@@ -19,6 +19,7 @@ import {
Menu,
Modal,
message,
Tag,
} from 'antd';
import {
EditOutlined,
......@@ -425,11 +426,11 @@ const TableManager = props => {
if (record) {
return (
<Tooltip title={record}>
<span style={{ color: '#50aefc', cursor: 'pointer' }}></span>
<Tag color="success"></Tag>
</Tooltip>
);
}
return <span></span>;
return <Tag color="processing"></Tag>;
},
},
{
......
......@@ -395,6 +395,7 @@ const AddModal = props => {
const pickFiled = fileds => {
if (form.getFieldsValue().tableName) {
let pp = formateArrDataA(nu, 'groupName');
console.log(pp);
if (form.getFieldValue(fileds)) {
let ab = form.getFieldValue(fileds).split(',');
let arr = Object.keys(pp);
......
......@@ -23,6 +23,7 @@ import {
Modal,
Input,
message,
Tag,
} from 'antd';
import {
......@@ -165,17 +166,20 @@ const incident = () => {
// width: 80,
// },
{
title: '编辑',
dataIndex: 'editable',
key: 'editable',
width: 50,
render: item => (
<span style={{ color: 'grey' }} key={item}>
{item}
</span>
),
},
// {
// title: '编辑',
// dataIndex: 'editable',
// key: 'editable',
// width: 50,
// align: 'center',
// render: record => {
// if (record == '是') {
// return <Tag color="success">{record}</Tag>;
// } else {
// return <Tag color="processing">{record}</Tag>;
// }
// },
// },
{
title: '编辑字段',
dataIndex: 'editableFields',
......
import React, { useEffect, useState } from 'react';
import { useHistory } from 'react-router-dom';
import { reloadFlows, removeFlowExtend } from '@/services/flow/flow';
import { Card, Space, Table, Popconfirm, Spin, Tooltip, notification, message, Button } from 'antd';
import { Tag, Card, Space, Table, Popconfirm, Spin, Tooltip, notification, message, Button } from 'antd';
import {
DoubleLeftOutlined,
DoubleRightOutlined,
......@@ -158,6 +158,13 @@ const Flow = () => {
dataIndex: 'useFixedCodingRule',
width: 80,
align: 'center',
render: record => {
if (record == '是') {
return <Tag color="success">{record}</Tag>;
} else {
return <Tag color="processing">{record}</Tag>;
}
},
},
{
title: '异常节点',
......@@ -169,7 +176,17 @@ const Flow = () => {
title: '接口配置',
dataIndex: 'interfaceConfig',
align: 'center',
render: text => <span style={{ color: text === '(无)' ? 'grey' : '000000D9' }}>{text}</span>,
// render: text => <span style={{ color: text === '(无)' ? 'grey' : '000000D9' }}>{text}</span>,
render: record => {
if (record!='(无)') {
return (
<Tooltip title={record}>
<Tag color="success"></Tag>
</Tooltip>
);
}
return <Tag color="processing"></Tag>;
},
},
{
title: '操作',
......
......@@ -5,7 +5,7 @@
/* eslint-disable eqeqeq */
import React, { useEffect, useState } from 'react';
import {
// Tree,
Tree,
message,
Input,
notification,
......@@ -32,11 +32,11 @@ import {
} from '@ant-design/icons';
import PageContainer from '@/components/BasePageContainer';
import Tree from '@/components/ExpendableTree';
import TreeComponents from '@/components/ExpendableTree';
import voca from 'voca';
import zhCN from 'antd/es/locale/zh_CN';
import qs from 'qs';
import lodash, { clone } from 'lodash';
import lodash, { clone, set } from 'lodash';
import styles from './SiteManage.less';
import {
......@@ -76,7 +76,7 @@ const SiteManageV2 = () => {
});
const [total, setTotal] = useState(0); // 分页总数
const [page, setPage] = useState({ pageNum: 1, pageSize: 10 });
const [selectList, setSelectList] = useState([]); // 已勾选列表数据
const [selectList, setSelectList] = useState(new Map()); // 已勾选列表数据
const [updatePageUser, setUpdatePageUser] = useState(1); //
const [updateCheck, setUpdateCheck] = useState(1);
const [name, setName] = useState('');
......@@ -84,16 +84,29 @@ const SiteManageV2 = () => {
const [data, setData] = useState('');
const [ch, setCh] = useState('');
const [keepTree, setKeepTree] = useState([]); // 保存所有一级id用于控制只展开一项一级菜单
const [indeterminate, setIndeterminate] = useState(new Map());
const [searchTreeValue, setSearchTreeValue] = useState('');
let a = [];
// 渲染机构树
const mapTree = org => {
const haveChildren = Array.isArray(org.children) && org.children.length > 0;
const indexsearch = org.text.indexOf(searchTreeValue);
const beforeStr = org.text.substring(0, indexsearch);
const afterStr = org.text.slice(indexsearch + searchTreeValue.length);
return {
title: (
<div className={styles.title}>
<div className={styles.titleText}>{org.text}</div>
{org.text.includes(searchTreeValue) && searchTreeValue != '' ? (
<div className={styles.titleText}>
{beforeStr}
<span className={styles.titleSearch}>{searchTreeValue}</span>
{afterStr}
</div>
) : (
<div className={styles.titleText}>{org.text}</div>
)}
<div className={styles.tip}>
<Tooltip title="添加下级站点" className={styles.fs}>
<PlusSquareOutlined
......@@ -146,16 +159,18 @@ const SiteManageV2 = () => {
handleShowModal('editVisible', true);
};
// 重新渲染树
const updateTrees = () => {
const updateTrees = value => {
setTreeLoading(true);
getSiteTree({ selectNode: -1 }).then(res => {
if (res.data.length > 0) {
getSiteTree({ selectNode: -1, keyword: value }).then(res => {
if (res.code === 0) {
setTreeLoading(false);
setTreeData(res.data);
let aa = [];
res.data.forEach(i => {
aa.push(i.id);
});
if (res.data.length > 0) {
res.data.forEach(i => {
aa.push(i.id);
});
}
setKeepTree(aa);
setTreeDataCopy(res.data);
// 第一次加载,默认选择第一个组织
......@@ -198,6 +213,7 @@ const SiteManageV2 = () => {
}, [currentStation, updateCheck]);
const getList = () => {
indeterminate.clear();
let params = {
PageIndex: +page.pageNum,
PageSize: +page.pageSize,
......@@ -210,25 +226,34 @@ const SiteManageV2 = () => {
setShowSearchStyle(true);
let list = res.data.data;
// 还原选择的数据
if (selectList.length > 0) {
selectList.forEach(item => {
let indete = indeterminate;
if (selectList.size > 0) {
[...selectList].map(item => {
list.forEach((value, index) => {
if (item.groupId == value.groupId) {
list[index].users.forEach((user, userIndex) => {
if (user.userId === item.userId) {
list[index].users[userIndex].isChecked = true;
}
});
let checkedLen = list[index].users.filter(v => v.isChecked).length;
if (checkedLen === list[index].users.length) {
list[index].isChecked = true;
// if (item[1].groupId == value.groupId) {
list[index].users.forEach((user, userIndex) => {
if (user.userId === item[1].userId) {
list[index].users[userIndex].isChecked = true;
list[index].users[userIndex].groupName = value.groupName;
}
});
let checkedLen = list[index].users.filter(v => v.isChecked).length;
if (checkedLen === list[index].users.length) {
list[index].isChecked = true;
indete.set(value.groupId, false);
} else if (checkedLen < list[index].users.length && checkedLen != 0) {
list[index].isChecked = false;
indete.set(value.groupId, true);
} else {
list[index].isChecked = false;
indete.set(value.groupId, false);
}
// }
});
});
}
setIndeterminate(lodash.cloneDeep(indete));
handleShowModal('loading', false);
console.log(lodash.cloneDeep(list));
setdataList(lodash.cloneDeep(list));
setTotal(res.data.count);
} else {
......@@ -240,6 +265,7 @@ const SiteManageV2 = () => {
};
// 搜索状态时获取当前站点可编辑用户(已勾选和未勾选)分页展示
const getSearchList = value => {
indeterminate.clear();
let params = {
PageIndex: 1,
PageSize: 10,
......@@ -252,23 +278,33 @@ const SiteManageV2 = () => {
setShowSearchStyle(true);
let list = res.data.data;
// 还原选择的数据
let indete = indeterminate;
if (selectList.length > 0) {
selectList.forEach(item => {
list.forEach((value, index) => {
if (item.groupId == value.groupId) {
list[index].users.forEach((user, userIndex) => {
if (user.userId === item.userId) {
list[index].users[userIndex].isChecked = true;
}
});
let checkedLen = list[index].users.filter(v => v.isChecked).length;
if (checkedLen === list[index].users.length) {
list[index].isChecked = true;
// if (item.groupId == value.groupId) {
list[index].users.forEach((user, userIndex) => {
if (user.userId === item.userId) {
list[index].users[userIndex].isChecked = true;
list[index].users[userIndex].groupName = value.groupName;
}
});
let checkedLen = list[index].users.filter(v => v.isChecked).length;
if (checkedLen === list[index].users.length) {
list[index].isChecked = true;
indete.set(value.groupId, false);
} else if (checkedLen < list[index].users.length && checkedLen != 0) {
list[index].isChecked = false;
indete.set(value.groupId, true);
} else {
list[index].isChecked = false;
indete.set(value.groupId, false);
}
// }
});
});
}
setIndeterminate(lodash.cloneDeep(indete));
handleShowModal('loading', false);
setdataList(lodash.cloneDeep(list));
setTotal(res.data.count);
......@@ -282,33 +318,47 @@ const SiteManageV2 = () => {
// 重置
const restButton = () => {
setName('');
indeterminate.clear();
let params = {
PageIndex: 1,
PageSize: 10,
};
params = { ...params };
setCheckLoading(true);
getGroupUserTree(params).then(res => {
setCheckLoading(false);
if (res.code === 0 && res.data) {
setShowSearchStyle(true);
let list = res.data.data;
// 还原选择的数据
let indete = indeterminate;
if (selectList.length > 0) {
selectList.forEach(item => {
list.forEach((value, index) => {
if (item.groupId == value.groupId) {
list[index].users.forEach((user, userIndex) => {
if (user.userId === item.userId) {
list[index].users[userIndex].isChecked = true;
}
});
let checkedLen = list[index].users.filter(v => v.isChecked).length;
if (checkedLen === list[index].users.length) {
list[index].isChecked = true;
// if (item.groupId == value.groupId) {
list[index].users.forEach((user, userIndex) => {
if (user.userId === item.userId) {
list[index].users[userIndex].isChecked = true;
list[index].users[userIndex].groupName = value.groupName;
}
});
let checkedLen = list[index].users.filter(v => v.isChecked).length;
if (checkedLen === list[index].users.length) {
list[index].isChecked = true;
indete.set(value.groupId, false);
} else if (checkedLen < list[index].users.length && checkedLen != 0) {
list[index].isChecked = false;
indete.set(value.groupId, true);
} else {
list[index].isChecked = false;
indete.set(value.groupId, false);
}
// }
});
});
}
setIndeterminate(lodash.cloneDeep(indete));
handleShowModal('loading', false);
setdataList(lodash.cloneDeep(list));
setTotal(res.data.count);
......@@ -323,26 +373,26 @@ const SiteManageV2 = () => {
const handleChange = e => {
setName(e.target.value);
handleSearch(e.target.value);
};
// 获取当前站点所有已经勾选的用户新接口
const getAllCheckListNew = () => {
selectList.clear();
getStationUsers({
stationId: currentStation,
}).then(res => {
let list = [];
if (res.data.length > 0) {
res.data.map((item, index) => {
list.push({
groupId: +item.OUID,
console.log(selectList);
selectList.set(`${item.userID}|${item.OUID.toString()}`, {
groupId: item.OUID,
groupName: item.OUName,
userName: item.userName,
userId: item.userID,
userId: item.userID.toString(),
});
});
}
setSelectList(lodash.cloneDeep(list));
console.log(selectList);
setUpdatePageUser(updatePageUser + 1);
});
};
......@@ -425,87 +475,100 @@ const SiteManageV2 = () => {
}
});
};
// 每组全选全不选
const handleChangeAll = (e, index) => {
const handleChangeAll = (e, index, groupName) => {
dataList[index].isChecked = e.target.checked;
setdataList(lodash.cloneDeep(dataList));
let select = selectList;
dataList[index].users.forEach(item => {
item.isChecked = e.target.checked;
let delIndex = selectList.findIndex(
v => v.groupId == dataList[index].groupId && v.userId == item.userId,
);
let datalist = item;
datalist.groupName = groupName;
if (e.target.checked) {
if (delIndex === -1) {
selectList.push({
groupId: dataList[index].groupId,
groupName: dataList[index].groupName,
userName: item.userName,
userId: item.userId,
});
}
}
if (!e.target.checked) {
selectList.splice(delIndex, 1);
select.set(`${item.userId}|${item.groupId}`, datalist);
} else {
select.delete(`${item.userId}|${item.groupId}`);
}
const indeterminateArr = indeterminate;
indeterminateArr.set(item.groupId, false);
setIndeterminate(lodash.cloneDeep(indeterminateArr));
});
setSelectList(lodash.cloneDeep(selectList));
setdataList(lodash.cloneDeep(dataList));
setSelectList(lodash.cloneDeep(select));
};
// 单个选择checkbox
const handleChangeSignel = (e, index, vIndex) => {
dataList[index].users[vIndex].isChecked = e.target.checked;
let checked = isAllChecked(index);
let hasIndex = selectList.findIndex(
item =>
item.userId == dataList[index].users[vIndex].userId &&
item.groupId == dataList[index].groupId,
);
dataList[index].isChecked = checked;
if (e.target.checked && hasIndex === -1) {
selectList.push({
groupId: dataList[index].groupId,
groupName: dataList[index].groupName,
userName: dataList[index].users[vIndex].userName,
userId: dataList[index].users[vIndex].userId,
});
const handleChangeSignel = (e, index, vIndex, item, groupName) => {
let select = selectList;
let datalist = item;
datalist.groupName = groupName;
if (e.target.checked) {
select.set(`${item.userId}|${item.groupId}`, datalist);
setSelectList(lodash.cloneDeep(select));
} else {
select.delete(`${item.userId}|${item.groupId}`);
setSelectList(lodash.cloneDeep(select));
}
// 全选状态样式
let data = [];
[...select].map(i => {
if (i[1].groupId == item.groupId) {
data.push(i[1]); // 分组中已选的数据
}
});
console.log(data);
console.log(dataList[index].users.length);
const indeterminateArr = indeterminate;
if (dataList[index].users.length == data.length) {
indeterminateArr.set(item.groupId, false);
dataList[index].isChecked = true;
} else if (data.length < dataList[index].users.length && data.length != 0) {
indeterminateArr.set(item.groupId, true);
dataList[index].isChecked = false;
} else {
selectList.splice(hasIndex, 1);
indeterminateArr.set(item.groupId, false);
dataList[index].isChecked = false;
}
setSelectList(lodash.cloneDeep(selectList));
setIndeterminate(lodash.cloneDeep(indeterminateArr));
setdataList(lodash.cloneDeep(dataList));
};
const isAllChecked = index =>
dataList[index].users.filter(item => item.isChecked).length === dataList[index].users.length;
// 删除已选列表
const handleDel = index => {
let { groupId, userId } = selectList[index];
let outerIndex = dataList.findIndex(item => item.groupId == groupId);
if (outerIndex > -1) {
let innerIndex = dataList[outerIndex].users.findIndex(item => item.userId == userId);
dataList[outerIndex].users[innerIndex].isChecked = false;
dataList[outerIndex].isChecked = isAllChecked(outerIndex);
const handleDel = (e, item) => {
let select = selectList;
select.delete(item[0]);
setSelectList(lodash.cloneDeep(select));
// 全选样式
let data = [];
[...select].map(i => {
if (i[1].groupId == item[1].groupId) {
data.push(i[1]);
}
});
const indeterminateArr = indeterminate;
[...indeterminateArr].map((i, j) => {
if (i[0] == item[1].groupId) {
dataList[j].isChecked = false;
}
});
if (data.length > 0) {
indeterminateArr.set(item[1].groupId, true);
} else {
indeterminateArr.set(item[1].groupId, false);
}
selectList.splice(index, 1);
setSelectList(lodash.cloneDeep(selectList));
setdataList(lodash.cloneDeep(dataList));
setIndeterminate(lodash.cloneDeep(indeterminateArr));
};
// 提交
const handleCommitBtn = () => {
handleShowModal('btnLoading', true);
let result = [];
let obj = {};
selectList.forEach(item => {
if (obj[item.groupId]) {
obj[item.groupId].push(item.userId);
} else {
obj[item.groupId] = [item.userId];
}
let aa = selectList;
[...aa].map(i => {
console.log(i[1].userId);
result.push(i[1].userId);
});
// dataList.forEach(item => {
// if (obj[item.GroupId] && item.Users.length === obj[item.GroupId].length) {
// obj[item.GroupId].push(item.GroupId);
// }
// });
result = Object.values(obj);
// 数据处理成后台需要的格式
if (result.length === 0)
return notification.warning({
......@@ -520,7 +583,6 @@ const SiteManageV2 = () => {
handleShowModal('btnLoading', false);
if (res.code === 0) {
setSelectList([]);
setUpdateCheck(updateCheck + 1);
notification.success({
message: '提示',
......@@ -629,27 +691,6 @@ const SiteManageV2 = () => {
});
};
const indeterminate = i => {
let aa = [];
i.users.map(i => {
if (i.isChecked) {
aa.push(i.userName);
}
});
if (i.isChecked) {
console.log(12);
return false;
}
if (!i.isChecked && aa.length < i.users.length && aa.length != 0) {
console.log(34);
return true;
}
if (!i.isChecked && aa.length == 0) {
console.log(56);
return false;
}
};
const Panels = React.memo(props => {
let { index, groupId, groupName, users, isChecked, isShow, color, item } = props;
return (
......@@ -668,8 +709,8 @@ const SiteManageV2 = () => {
key="0"
className={styles.siteListTitle}
checked={isChecked}
indeterminate={indeterminate(item)}
onClick={e => props.handleChangeAll(e, index)}
indeterminate={indeterminate.get(groupId)}
onClick={e => props.handleChangeAll(e, index, groupName)}
>
全选
</Checkbox>
......@@ -679,9 +720,12 @@ const SiteManageV2 = () => {
users.map((v, vIndex) => (
<CheckBoxRow
{...v}
item={v}
groupName={groupName}
index={index}
vIndex={vIndex}
key={v.userId}
selectList={selectList}
handleChangeSignel={props.handleChangeSignel}
/>
))}
......@@ -690,6 +734,11 @@ const SiteManageV2 = () => {
);
});
const onSearch = value => {
setSearchTreeValue(value);
updateTrees(value);
};
return (
<PageContainer className={styles.siteManageContainer}>
<div className={styles.contentContainer}>
......@@ -711,23 +760,57 @@ const SiteManageV2 = () => {
}}
/>
</Tooltip>
{treeData.length > 0 && (
<div style={{ height: '100%', overflowY: 'scroll' }}>
<Tree
showIcon="true"
showLine={{ showLeafIcon: false }}
blockNode
autoExpandParent
selectedKeys={[currentStation]}
onSelect={onSelect}
treeData={treeData.map(t => mapTree(t))}
expandedKeys={treeData[0].id}
draggable
onDrop={handleDrop}
keepTree={keepTree}
/>
</div>
<hr style={{ width: '95%', color: '#eeecec', marginLeft: '15px' }} />
<Search
style={{
marginBottom: 8,
width: '98%',
marginLeft: '7px',
}}
placeholder="快速搜索站点"
onSearch={onSearch}
/>
{searchTreeValue !== '' ? (
<>
{treeData.length > 0 && (
<div style={{ height: '100%', overflowY: 'scroll' }}>
<Tree
showIcon="true"
showLine={{ showLeafIcon: false }}
blockNode
defaultExpandAll
selectedKeys={[currentStation]}
onSelect={onSelect}
treeData={treeData.map(t => mapTree(t))}
draggable
onDrop={handleDrop}
keepTree={keepTree}
/>
</div>
)}
</>
) : (
<>
{treeData.length > 0 && (
<div style={{ height: '100%', overflowY: 'scroll' }}>
<TreeComponents
showIcon="true"
showLine={{ showLeafIcon: false }}
blockNode
autoExpandParent
selectedKeys={[currentStation]}
onSelect={onSelect}
treeData={treeData.map(t => mapTree(t))}
expandedKeys={treeData[0].id}
draggable
onDrop={handleDrop}
keepTree={keepTree}
/>
</div>
)}
</>
)}
<div className={styles.switcher}>
{treeVisible && (
<Tooltip title="隐藏站点列表">
......@@ -790,8 +873,8 @@ const SiteManageV2 = () => {
allowClear
placeholder={placeholder}
onSearch={handleSearch}
// value={name}
// onChange={e => handleChange(e)}
value={name}
onChange={e => handleChange(e)}
enterButton
/>
......@@ -824,13 +907,11 @@ const SiteManageV2 = () => {
}}
>
<ul className={styles.siteSelectUl}>
{selectList.map((item, index) => (
{[...selectList].map((item, index) => (
<li
key={`${item.userName}${item.groupId}${index}`}
onClick={() => handleDel(index)}
>
{`${item.userName}(${item.groupName})`}
</li>
onClick={e => handleDel(e, item)}
>{`${item[1].userName}(${item[1].groupName})`}</li>
))}
</ul>
</div>
......@@ -912,16 +993,16 @@ const SiteManageV2 = () => {
);
};
const CheckBoxRow = React.memo(props => {
let { vIndex, index, isChecked, userName } = props;
const CheckBoxRow = props => {
let { vIndex, index, isChecked, userName, item, selectList, groupName } = props;
return (
<Checkbox
className={styles.siteList}
checked={isChecked}
onClick={e => props.handleChangeSignel(e, index, vIndex)}
checked={selectList.size > 0 && selectList.has(`${item.userId}|${item.groupId}`)}
onClick={e => props.handleChangeSignel(e, index, vIndex, item, groupName)}
>
{userName}
</Checkbox>
);
});
};
export default SiteManageV2;
......@@ -377,4 +377,7 @@
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
\ No newline at end of file
}
.titleSearch {
color: #f50;
}
......@@ -54,7 +54,7 @@ const RelateRoleModal = props => {
const submitRole = () => {
console.log(1212121212);
SetUserRelationList(
currentUser.userID,
currentUser.userId,
Object.keys(roleValueList)
.map(k => roleValueList[k])
.flat(),
......
......@@ -2,7 +2,7 @@
/* eslint-disable eqeqeq */
import React, { useState, useEffect, useRef } from 'react';
import {
// Tree,
Tree,
Table,
Space,
message,
......@@ -18,6 +18,7 @@ import {
Popconfirm,
Form,
Radio,
Pagination,
} from 'antd';
import {
UserOutlined,
......@@ -69,7 +70,7 @@ import {
SetGroupManager,
} from '@/services/userManage/api';
import { AddUserAuthSetting, GetUserAuthSet } from '@/services/database/api';
import Tree from '@/components/ExpendableTree';
import TreeComponents from '@/components/ExpendableTree';
import classnames from 'classnames';
import DraggleLayout from 'components/DraggleLayout';
import AddUserModal from './AddUserModal';
......@@ -176,8 +177,14 @@ const UserManage = () => {
const [keepDataList, setKeepDataList] = useState([]);
const [siteList, setSiteList] = useState([]);
const setRowClassName = record =>
record.userID === selectColor.userID ? styles.clickRowStyle : '';
record.userId === selectColor.userId ? styles.clickRowStyle : '';
const [demoVisivle, setDemoVisible] = useState(false);
const [searchTreeValue, setSearchTreeValue] = useState('');
const [total, setTotal] = useState(0);
const [pageSize, setPageSize] = useState(20);
const [currentPage, setCurrentPage] = useState(1);
// 用户表列名
const columns = [
{
......@@ -197,13 +204,13 @@ const UserManage = () => {
},
{
title: '所在机构',
dataIndex: 'OUName',
key: 'OUName',
dataIndex: 'groupName',
key: 'groupName',
// width: 150,
ellipsis: true,
filters: orgFilters,
filteredValue,
onFilter: (value, record) => record.OUName === value,
onFilter: (value, record) => record.groupName === value,
},
{
title: '手机号码',
......@@ -272,7 +279,7 @@ const UserManage = () => {
cancelText="取消"
onConfirm={() => {
console.log(groupId, 'groupId');
SetGroupManager({ groupId, userId: record.userID }).then(res => {
SetGroupManager({ groupId, userId: record.userId }).then(res => {
if (res.code === 0) {
// eslint-disable-next-line no-unused-expressions
currentSelectOrg === '-1' ? submitSearchUser() : onSelect([currentSelectOrg]);
......@@ -523,7 +530,7 @@ const UserManage = () => {
setSelectedRowKeys(RowKeys);
getCheckList(RowKeys);
setUserIDs(RowKeys.toString()); // 数组转字符串,逗号连接
setOrgIDs(Rows.map(item => item.OUID).toString());
setOrgIDs(Rows.map(item => item.groupId).toString());
// 选中行数大于0时设置批量操作可行
if (RowKeys.length > 0) {
setSelectColor({});
......@@ -538,6 +545,9 @@ const UserManage = () => {
// 渲染机构树
const mapTree = org => {
const haveChildren = Array.isArray(org.children) && org.children.length > 0;
const indexsearch = org.text.indexOf(searchTreeValue);
const beforeStr = org.text.substring(0, indexsearch);
const afterStr = org.text.slice(indexsearch + searchTreeValue.length);
return {
title: (
<div className={styles.title1}>
......@@ -554,7 +564,15 @@ const UserManage = () => {
) : (
<span />
)}
<span style={{ marginLeft: '5px' }}>{org.text}</span>
{org.text.includes(searchTreeValue) && searchTreeValue != '' ? (
<span>
{beforeStr}
<span className={styles.titleSearch}>{searchTreeValue}</span>
{afterStr}
</span>
) : (
<span>{org.text}</span>
)}
</span>
<span
className={classnames({
......@@ -617,7 +635,7 @@ const UserManage = () => {
};
// 重新渲染树
const updateTrees = () => {
const updateTrees = e => {
setTreeLoading(true);
// getUserTree(-1, -1)
// .then(res => {
......@@ -642,14 +660,15 @@ const UserManage = () => {
// setTreeLoading(false);
// message.error(err);
// });
GetOUTreeNew({ selectOU: -1 })
GetOUTreeNew({ selectOU: -1, keyword: e })
.then(newres => {
setTreeLoading(false);
if (newres.code === 0) {
let res = newres.data;
console.log(res);
setTreeLoading(false);
setTreeData(res);
setTreeDataCopy(res);
// setTreeDataCopy(res);
let aa = [];
res.forEach(i => {
aa.push(i.id);
......@@ -711,9 +730,7 @@ const UserManage = () => {
};
// 点击树节点,获取当前机构下所有用户
const onSelect = (props, e) => {
console.log(props);
console.log(e);
const onSelect = (props, e, size, index) => {
if (e) {
props[0] = e.node.key;
} else {
......@@ -747,39 +764,47 @@ const UserManage = () => {
// eslint-disable-next-line no-console
setGroupId(props[0]);
getOneOUUserListNew(props[0] || currentSelectOrg)
let sizedata = '';
let currentData = '';
if (currentSelectOrg !== props[0]) {
setPageSize(20);
setCurrentPage(1);
sizedata = size ? size : 20;
currentData = index ? index : 1;
} else {
// 分页查询
sizedata = size ? size : pageSize;
currentData = index ? index : currentPage;
}
getOneOUUserListNew(props[0] || currentSelectOrg, sizedata, currentData)
.then(res => {
setCurrentOrgOperate(false); // 重置禁用当前机构操作为false
setMultiOperate(true); // 重新禁止用户批量操作
setSelectedRowKeys([]); // 重置选中用户数
if (res.code === 0) {
setTotal(res.data.count);
setTableLoading(false);
setSearchWord(''); // 搜索框置空
setOrgTitle(res.data.GroupName);
setDescription(res.data.Description);
// 返回用户表数据结构处理,扁平化
console.log(res.data);
const temp = flatten(getUsers(res.data));
console.log(temp);
let temp = res.data.data;
// 设置过滤字段
let arr = temp.map(item => item.OUName);
console.log(arr);
let arr = temp.map(item => item.groupName);
arr = arr.filter((value, index) => arr.indexOf(value) === index);
console.log(arr);
setOrgFilters(arr.map(item => ({ text: item, value: item })));
setTableLength(temp.length);
let datalist = [];
const table = temp.map((item, index) => {
console.log(item);
if (item.loginName == 'panda' || item.loginName == 'admin') {
datalist.push(item.userID);
datalist.push(item.userId);
}
item.key = index;
return item;
});
console.log(datalist);
setKeepDataList(datalist);
setShowSearchStyle(false);
console.log(table);
setTableData(table);
} else {
setTableLoading(false);
......@@ -798,46 +823,47 @@ const UserManage = () => {
}
};
// 添加用户刷新表数据
const onSelect1 = () => {
console.log(orgID);
setTableLoading(true);
// eslint-disable-next-line no-console
getOneOUUserListNew(orgID.id || currentSelectOrg)
.then(res => {
setCurrentOrgOperate(false); // 重置禁用当前机构操作为false
setMultiOperate(true); // 重新禁止用户批量操作
setSelectedRowKeys([]); // 重置选中用户数
if (res.code === 0) {
setTableLoading(false);
setSearchWord(''); // 搜索框置空
setOrgTitle(res.data.GroupName);
setDescription(res.data.Description);
// 返回用户表数据结构处理,扁平化
const temp = flatten(getUsers(res.data));
// 设置过滤字段
let arr = temp.map(item => item.OUName);
arr = arr.filter((value, index) => arr.indexOf(value) === index);
setOrgFilters(arr.map(item => ({ text: item, value: item })));
setTableLength(temp.length);
const table = temp.map((item, index) => {
item.key = index;
return item;
});
setShowSearchStyle(false);
setTableData(table);
} else {
setTableLoading(false);
}
})
.catch(err => {
setTableLoading(false);
message.error(err);
});
};
// // 添加用户刷新表数据
// const onSelect1 = () => {
// console.log(orgID);
// setTableLoading(true);
// // eslint-disable-next-line no-console
// getOneOUUserListNew(orgID.id || currentSelectOrg, pageSize, currentPage)
// .then(res => {
// setCurrentOrgOperate(false); // 重置禁用当前机构操作为false
// setMultiOperate(true); // 重新禁止用户批量操作
// setSelectedRowKeys([]); // 重置选中用户数
// if (res.code === 0) {
// setTableLoading(false);
// setSearchWord(''); // 搜索框置空
// setOrgTitle(res.data.GroupName);
// // setDescription(res.data.Description);
// // 返回用户表数据结构处理,扁平化
// let temp = res.data.data;
// // const temp = flatten(getUsers(res.data));
// // 设置过滤字段
// let arr = temp.map(item => item.groupName);
// arr = arr.filter((value, index) => arr.indexOf(value) === index);
// setOrgFilters(arr.map(item => ({ text: item, value: item })));
// setTableLength(temp.length);
// const table = temp.map((item, index) => {
// item.key = index;
// return item;
// });
// setShowSearchStyle(false);
// setTableData(table);
// } else {
// setTableLoading(false);
// }
// })
// .catch(err => {
// setTableLoading(false);
// message.error(err);
// });
// };
const getDescription = e => {
getOneOUUserListNew(e).then(res => {
getOneOUUserListNew(e, pageSize, currentPage).then(res => {
if (res.code === 0) {
setDescription(res.data.Description);
}
......@@ -856,16 +882,16 @@ const UserManage = () => {
});
};
// 返回用户表数据结构处理,扁平化
const getUsers = orgObj => {
let result = orgObj.Users;
result.map(item => {
item.OUID = orgObj.GroupId;
item.OUName = orgObj.GroupName;
return item;
});
if (orgObj.Childs.length > 0) result = [...result, ...orgObj.Childs.map(o => getUsers(o))];
return result;
};
// const getUsers = orgObj => {
// let result = orgObj.Users;
// result.map(item => {
// item.OUID = orgObj.GroupId;
// item.OUName = orgObj.GroupName;
// return item;
// });
// if (orgObj.Childs.length > 0) result = [...result, ...orgObj.Childs.map(o => getUsers(o))];
// return result;
// };
const flatten = arr => {
while (arr.some(item => Array.isArray(item))) {
arr = [].concat(...arr);
......@@ -907,7 +933,7 @@ const UserManage = () => {
// 在currentUser变化后获取角色列表
// useEffect(() => {
// if (currentUser && currentUser.userID) {
// if (currentUser && currentUser.userId) {
// getRoleList();
// }
// }, [currentUser]);
......@@ -921,7 +947,7 @@ const UserManage = () => {
setRoleVisible(true);
setMultiRelateRoles(true);
};
// 更改机构
// 批量更改机构
const changeOrgs = () => {
setChangeOrgVisible(true);
setMultiChangeOrgs(true);
......@@ -935,7 +961,7 @@ const UserManage = () => {
/** ***右侧表格相关操作****** */
// 关联角色
const relateRole = record => {
// getEmptyRoleList(record.userID);
// getEmptyRoleList(record.userId);
setMult('No');
console.log(record);
getRoleList(record);
......@@ -946,9 +972,10 @@ const UserManage = () => {
// 更改机构
const changeOrg = record => {
setChangeOrgVisible(true);
setMultiChangeOrgs(false);
setCurrentUser(record);
setSelectColor(record);
setCurrentSelectOldOrg(record.OUID);
setCurrentSelectOldOrg(record.groupId);
};
// 修改密码
const changePassword = record => {
......@@ -975,7 +1002,7 @@ const UserManage = () => {
} else {
state = '0';
}
UserStateOUNew({ ouid: record.userID })
UserStateOUNew({ ouid: record.userId })
.then(res => {
if (res.code === 0) {
// 重新获取用户表
......@@ -1003,8 +1030,7 @@ const UserManage = () => {
setCurrentUser(record.userName);
setSelectColor(record);
DeleteUserNew({
userID: record.userID,
ouID: record.OUID,
userId: record.userId,
})
.then(res => {
if (res.code === 0) {
......@@ -1029,9 +1055,9 @@ const UserManage = () => {
// 用户鉴权
// useEffect(() => {
// currentUser.userID
// currentUser.userId
// GetUserAuthSet({
// UserId: currentUser.userID
// UserId: currentUser.userId
// }).then(
// res => {
// if(res.code == 0){
......@@ -1044,7 +1070,7 @@ const UserManage = () => {
// }, [currentUser])
const jianquan = record => {
GetUserAuthSet({
UserId: record.userID,
UserId: record.userId,
}).then(res => {
if (res.code === 0) {
setSelctValue(res.data);
......@@ -1059,7 +1085,7 @@ const UserManage = () => {
setCurrentUser(record);
console.log(selectValue);
AddUserAuthSetting({
userId: record.userID,
userId: record.userId,
userLevel: selectValue,
}).then(res => {
if (res.code === 0) {
......@@ -1074,9 +1100,11 @@ const UserManage = () => {
// message.warning('请输入搜索内容');
// return;
// }
setTableLoading(true);
let data = searchWord != '' ? { key: searchWord } : '';
GetUserByKeyNew(data)
.then(res => {
setTableLoading(false);
if (res.code === 0) {
setSelectedRowKeys([]); // 重置选中用户数
setCurrentOrgOperate(true); // 禁止当前机构操作
......@@ -1101,10 +1129,10 @@ const UserManage = () => {
};
/** ***表单提交相关操作****** */
// 根据当前 userID 获取用户关联角色
// 根据当前 userId 获取用户关联角色
const getRoleList = e => {
setLoading(true);
GetUserRelationListNew({ userID: e.userID })
GetUserRelationListNew({ userId: e.userId })
.then(res => {
console.log(111);
......@@ -1128,7 +1156,7 @@ const UserManage = () => {
// 获取全部未勾选的角色列表与站点列表
const getEmptyRoleList = () => {
setLoading(true);
GetUserRelationListNew({ userID: 0 })
GetUserRelationListNew({ userId: 0 })
.then(res => {
console.log(222);
if (res.code === 0) {
......@@ -1175,7 +1203,7 @@ const UserManage = () => {
};
// 提交-更改机构
const submitChangeOrg = () => {
// addToOrg(currentUser.userID, currentUser.OUID, newOrgID)
// addToOrg(currentUser.userId, currentUser.OUID, newOrgID)
// .then(res => {
// if (res.success) {
// setChangeOrgVisible(false);
......@@ -1196,9 +1224,10 @@ const UserManage = () => {
// .catch(err => {
// message.error(err);
// });
console.log(currentUser);
JumpToAnotherOUNew({
userID: currentUser.userID,
oldOUID: currentUser.OUID,
userId: currentUser.userId,
oldOUID: currentUser.groupId,
newOUID: newOrgID,
})
.then(res => {
......@@ -1257,7 +1286,7 @@ const UserManage = () => {
// } else {
// state = '0';
// }
// // postSetUserState(currentUser.userID, state)
// // postSetUserState(currentUser.userId, state)
// // .then(res => {
// // if (res.success) {
// // setFreezeUserVisible(false);
......@@ -1281,7 +1310,7 @@ const UserManage = () => {
// // setTableLoading(false);
// // message.error(err);
// // });
// UserStateOUNew({ ouid: currentUser.userID, state })
// UserStateOUNew({ ouid: currentUser.userId, state })
// .then(res => {
// if (res.code === 0) {
// // setFreezeUserVisible(false);
......@@ -1309,8 +1338,7 @@ const UserManage = () => {
// 提交-删除用户
const submitDeleteUser = () => {
DeleteUserNew({
userID: currentUser.userID,
ouID: currentUser.OUID,
userId: currentUser.userId,
})
.then(res => {
if (res.code === 0) {
......@@ -1334,9 +1362,6 @@ const UserManage = () => {
};
// 提交-批量删除用户
const submitDeleteUsers = () => {
console.log(userIDs);
console.log(keepDataList);
console.log(userIDs.split(','));
let data = [];
keepDataList.length > 0 &&
keepDataList.map(i => {
......@@ -1566,6 +1591,18 @@ const UserManage = () => {
setUserVisible(false);
};
const onSearch = value => {
setSearchTreeValue(value);
updateTrees(value);
};
// 监听分页
const paginationChange = (page, pageSizes) => {
setCurrentPage(page);
setPageSize(pageSizes);
onSelect([currentSelectOrg], '', pageSizes, page);
};
return (
<PageContainer className={styles.userManageContainer}>
<div className={styles.contentContainer}>
......@@ -1600,24 +1637,54 @@ const UserManage = () => {
}}
/>
</Tooltip>
</div>
<hr style={{ width: '95%', color: '#eeecec', marginLeft: '15px' }} />
{treeData.length > 0 && (
<div style={{ height: '100%', overflowY: 'scroll' }}>
<Tree
showIcon="true"
blockNode
autoExpandParent
onSelect={onSelect}
treeData={treeData.map(t => mapTree(t))}
draggable
onDrop={handleDrop}
selectedKeys={[menuID]}
keepTree={keepTree}
expandedKeys={expendKey}
/>
</div>
<Search
style={{
marginBottom: 8,
width: '98%',
marginLeft: '7px',
}}
placeholder="快速搜索机构"
onSearch={onSearch}
/>
{searchTreeValue !== '' ? (
<>
{treeData.length > 0 && (
<div style={{ height: '100%', overflowY: 'scroll' }}>
<Tree
showIcon="true"
blockNode
defaultExpandAll
onSelect={onSelect}
treeData={treeData.map(t => mapTree(t))}
draggable
onDrop={handleDrop}
selectedKeys={[menuID]}
keepTree={keepTree}
/>
</div>
)}
</>
) : (
<>
{treeData.length > 0 && (
<div style={{ height: '100%', overflowY: 'scroll' }}>
<TreeComponents
showIcon="true"
blockNode
autoExpandParent
onSelect={onSelect}
treeData={treeData.map(t => mapTree(t))}
draggable
onDrop={handleDrop}
selectedKeys={[menuID]}
keepTree={keepTree}
expandedKeys={expendKey}
/>
</div>
)}
</>
)}
</div>
<div className={styles.switcher}>
......@@ -1679,7 +1746,7 @@ const UserManage = () => {
}}
rowClassName={setRowClassName}
size="small"
rowKey={record => record.userID}
rowKey={record => record.userId}
locale={zhCN}
bordered
columns={columns}
......@@ -1689,14 +1756,7 @@ const UserManage = () => {
x: 'max-content',
y: `calc(${userContainer.current.clientHeight}px - 150px)`,
}}
// scroll={{ x: 'max-content' }}
pagination={{
showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`,
pageSizeOptions: [10, 20, 50, 100],
defaultPageSize: 20,
showQuickJumper: true,
showSizeChanger: true,
}}
pagination={false}
onRow={record => ({
onDoubleClick: () => {
editUser(record);
......@@ -1705,6 +1765,28 @@ const UserManage = () => {
onChange={onChangeInput}
/>
)}
<div
style={{
display: 'flex',
justifyContent: 'flex-end',
marginTop: '10px',
marginRight: '5px',
}}
>
<Pagination
total={total}
showTotal={(totals, range) => `第${range[0]}-${range[1]} 条/共 ${totals} 条`}
defaultPageSize={pageSize}
defaultCurrent={1}
showSizeChanger
pageSizeOptions={[10, 20, 40, 100]}
current={currentPage}
onChange={paginationChange}
style={{ marginBottom: '10px' }}
size="small"
showQuickJumper
/>
</div>
</div>
{/* Modal弹框 */}
......@@ -1732,7 +1814,7 @@ const UserManage = () => {
visible={editOrgVisible}
orgID={orgID}
orgTitle1={orgTitle1}
description={description}
// description={description}
onCancel={() => setEditOrgVisible(false)}
updateTrees={updateTrees}
/>
......@@ -1745,7 +1827,6 @@ const UserManage = () => {
updateTrees={updateTrees}
onCancel={() => setDeleteOrgVisible(false)}
/>
{/* 关联角色 */}
<RelateRoleModal
currentUser={currentUser}
......@@ -1790,7 +1871,7 @@ const UserManage = () => {
/>
<div style={{ height: '500px', overflowY: 'scroll' }}>
{changeOrgVisible && treeDataCopy.length > 0 && (
<Tree
<TreeComponents
showIcon="true"
showLine={{ showLeafIcon: false }}
// defaultExpandAll
......
......@@ -264,11 +264,11 @@
overflow: hidden;
.ant-table-wrapper {
height: calc(100% - 50px);
height: calc(100% - 100px);
}
.ant-table {
height: calc(100% - 50px)
height: calc(100% - 100px)
}
.title {
......@@ -404,4 +404,14 @@
// .ant-tree {
// overflow-y: scroll;
// height: calc(100vh - 150px);
// }
\ No newline at end of file
// }
.titleTop {
width: 20rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-left: 10px;
}
.titleSearch {
color: #f50;
}
\ No newline at end of file
......@@ -15,9 +15,11 @@ export const getUserTree = (selectOU, node) =>
// OUID,
// });
export const getOneOUUserListNew = OUID =>
export const getOneOUUserListNew = (OUID, size, index) =>
get(`${PUBLISH_SERVICE}/UserCenter/GroupUserList`, {
groupId: OUID,
pageSize: size,
pageIndex: index,
});
/**
......
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