Skip to content

C
CivManage
Commit c92c4e87 authored by 张烨's avatar 张烨
Browse files
Options

Merge branch 'master' of https://g.civnet.cn:8443/test/maintenance

parents 04d7ab35 82bc821b
Show whitespace changes
Inline Side-by-side
Showing with 108 additions and 138 deletions
package.json
View file @ c92c4e87
...@@ -118,7 +118,8 @@ ...@@ -118,7 +118,8 @@
"sanitize.css": "8.0.0", "sanitize.css": "8.0.0",
"sha1": "^1.1.1", "sha1": "^1.1.1",
"styled-components": "4.2.0", "styled-components": "4.2.0",
"use-merge-value": "^1.0.2" "use-merge-value": "^1.0.2",
"voca": "^1.4.0"
}, },
"devDependencies": { "devDependencies": {
"@ant-design/icons": "^4.0.0", "@ant-design/icons": "^4.0.0",
......
src/app.js
View file @ c92c4e87
...@@ -12,6 +12,8 @@ import { ConnectedRouter } from 'connected-react-router/immutable'; ...@@ -12,6 +12,8 @@ import { ConnectedRouter } from 'connected-react-router/immutable';
import Immutable from 'immutable'; import Immutable from 'immutable';
import { Provider } from 'react-redux'; import { Provider } from 'react-redux';
import { ConfigProvider } from 'antd';
import zhCN from 'antd/es/locale/zh_CN';
import configureStore from './configureStore'; import configureStore from './configureStore';
import App from './containers/App'; import App from './containers/App';
import history from './utils/history'; import history from './utils/history';
...@@ -24,7 +26,9 @@ const render = () => { ...@@ -24,7 +26,9 @@ const render = () => {
ReactDOM.render( ReactDOM.render(
<Provider store={store}> <Provider store={store}>
<ConnectedRouter history={history}> <ConnectedRouter history={history}>
<ConfigProvider locale={zhCN}>
<App /> <App />
</ConfigProvider>
</ConnectedRouter> </ConnectedRouter>
</Provider>, </Provider>,
MOUNT_NODE, MOUNT_NODE,
......
src/pages/userCenter/UserManage.js
View file @ c92c4e87
...@@ -35,8 +35,8 @@ import { ...@@ -35,8 +35,8 @@ import {
import PageContainer from '@/components/BasePageContainer'; import PageContainer from '@/components/BasePageContainer';
// import classnames from 'classnames'; // import classnames from 'classnames';
// import { get } from '../../services'; // import { get } from '../../services';
import styles from './UserManage.less'; import voca from 'voca';
import ListCardItem from '../orgnazation/listCardItem'; import zhCN from 'antd/es/locale/zh_CN';
import { import {
addToOrg, addToOrg,
editOrgInfo, editOrgInfo,
...@@ -53,6 +53,9 @@ import { ...@@ -53,6 +53,9 @@ import {
updateUserPassword, updateUserPassword,
setUserRelation, setUserRelation,
} from '@/services/userCenter/userManage/api'; } from '@/services/userCenter/userManage/api';
import { string } from 'prop-types';
import ListCardItem from '../orgnazation/listCardItem';
import styles from './UserManage.less';
const UserManage = () => { const UserManage = () => {
const [treeLoading, setTreeLoading] = useState(false); const [treeLoading, setTreeLoading] = useState(false);
...@@ -60,21 +63,20 @@ const UserManage = () => { ...@@ -60,21 +63,20 @@ const UserManage = () => {
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [treeData, setTreeData] = useState([]); // 用户机构树 const [treeData, setTreeData] = useState([]); // 用户机构树
const [expandedKeys, setExpandedKeys] = useState(['']);
const [treeDataCopy, setTreeDataCopy] = useState([]); // 机构树数据备份，用于更改机构 const [treeDataCopy, setTreeDataCopy] = useState([]); // 机构树数据备份，用于更改机构
const [treeState, setTreeState] = useState(true); // 树第一次加载 const [treeState, setTreeState] = useState(true); // 树第一次加载
const [treeVisible, setTreeVisible] = useState(true); // 树是否可见 const [treeVisible, setTreeVisible] = useState(true); // 树是否可见
const [tableData, setTableData] = useState([]); // 用户表 const [tableData, setTableData] = useState([]); // 用户表
const [pageSize, setPageSize] = useState(10); // 用户表-分页大小
const [pageNum, setPageNum] = useState(1); // 用户表-当前页码
const [orgFilters, setOrgFilters] = useState([]); // 用户列筛选 const [orgFilters, setOrgFilters] = useState([]); // 用户列筛选
// const [selectedRowKeys, setSelectedRowKeys] = useState([]); // 用户表
const [searchData, setSearchData] = useState([]); // 查找用户的结果表
const [searchWord, setSearchWord] = useState(''); // 关键字 const [searchWord, setSearchWord] = useState(''); // 关键字
const [userName, setUserName] = useState(''); // 查找用户的结果表
const [currentSelectOrg, setCurrentSelectOrg] = useState([]); // 左侧机构数-选中组织 const [currentSelectOrg, setCurrentSelectOrg] = useState([]); // 左侧机构数-选中组织
const [currentSelectOldOrg, setCurrentSelectOldOrg] = useState([]); // 更改机构时的树-原先选中组织 const [currentSelectOldOrg, setCurrentSelectOldOrg] = useState([]); // 更改机构时的树-原先选中组织
/** ***Modal弹框,是否可视**** */ /** ***Modal弹框,是否可视**** */
const [userVisible, setUserVisible] = useState(false); // 添加用户 const [userVisible, setUserVisible] = useState(false); // 添加用户
const [searchUserVisible, setSearchUserVisible] = useState(false); // 查找用户
const [addOrgVisible, setAddOrgVisible] = useState(false); // 添加机构 const [addOrgVisible, setAddOrgVisible] = useState(false); // 添加机构
const [editOrgVisible, setEditOrgVisible] = useState(false); // 编辑机构 const [editOrgVisible, setEditOrgVisible] = useState(false); // 编辑机构
const [deleteOrgVisible, setDeleteOrgVisible] = useState(false); // 删除机构 const [deleteOrgVisible, setDeleteOrgVisible] = useState(false); // 删除机构
...@@ -97,7 +99,6 @@ const UserManage = () => { ...@@ -97,7 +99,6 @@ const UserManage = () => {
const [stationValueList, setStationValueList] = useState({}); // 勾选的站点列表 const [stationValueList, setStationValueList] = useState({}); // 勾选的站点列表
/** ***表单相关**** */ /** ***表单相关**** */
const [searchUserForm] = Form.useForm(); // 查找用户
const [addUserForm] = Form.useForm(); // 添加用户 const [addUserForm] = Form.useForm(); // 添加用户
const [addOrgForm] = Form.useForm(); // 添加机构 const [addOrgForm] = Form.useForm(); // 添加机构
const [editOrgForm] = Form.useForm(); // 编辑机构 const [editOrgForm] = Form.useForm(); // 编辑机构
...@@ -161,32 +162,26 @@ const UserManage = () => { ...@@ -161,32 +162,26 @@ const UserManage = () => {
key: 'OUName', key: 'OUName',
width: 150, width: 150,
filters: orgFilters, filters: orgFilters,
onFilter: (value, record) => onFilter: (value, record) => record.OUName === value,
// let count = 0;
// if (record.OUName === value) {
// count += 1;
// }
// setTableTitle(count);
record.OUName === value,
}, },
{ {
title: '手机号码', title: '手机号码',
dataIndex: 'phone', dataIndex: 'phone',
key: 'phone', key: 'phone',
width: 150, width: 120,
ellipsis: true, ellipsis: true,
}, },
{ {
title: '钉钉账户', title: '钉钉账户',
dataIndex: 'ddid', dataIndex: 'ddid',
key: 'ddid', key: 'ddid',
width: 150, width: 100,
}, },
{ {
title: '微信账户', title: '微信账户',
dataIndex: 'wxid', dataIndex: 'wxid',
key: 'wxid', key: 'wxid',
width: 150, width: 100,
}, },
{ {
title: '操作', title: '操作',
...@@ -251,7 +246,7 @@ const UserManage = () => { ...@@ -251,7 +246,7 @@ const UserManage = () => {
), ),
}, },
]; ];
const [selectionType, setSelectionType] = useState('checkbox'); const [selectionType] = useState('checkbox');
const rowSelection = { const rowSelection = {
onChange: (selectedRowKeys, selectedRows) => { onChange: (selectedRowKeys, selectedRows) => {
console.log( console.log(
...@@ -261,53 +256,10 @@ const UserManage = () => { ...@@ -261,53 +256,10 @@ const UserManage = () => {
); );
}, },
getCheckboxProps: record => ({ getCheckboxProps: record => ({
// defaultChecked: selectedRowKeys.includes(`${record.id}`),
name: record.name, name: record.name,
}), }),
}; };
// 查找用户的结果表-列
const searchColumns = [
{
title: '所在机构',
dataIndex: 'OUName',
key: 'OUName',
},
{
title: '登录名称',
dataIndex: 'loginName',
key: 'loginName',
render: item => (
<div
ref={r => {
if (r) {
r.innerHTML = item;
}
}}
/>
),
},
{
title: '用户姓名',
dataIndex: 'userName',
key: 'userName',
render: item => (
<div
ref={r => {
if (r) {
r.innerHTML = item;
}
}}
/>
),
},
{
title: '手机号码',
dataIndex: 'phone',
key: 'phone',
},
];
// 渲染机构树 // 渲染机构树
const mapTree = org => { const mapTree = org => {
const haveChildren = Array.isArray(org.children) && org.children.length > 0; const haveChildren = Array.isArray(org.children) && org.children.length > 0;
...@@ -420,10 +372,6 @@ const UserManage = () => { ...@@ -420,10 +372,6 @@ const UserManage = () => {
return arr; return arr;
}; };
// 查找用户
const searchUser = () => {
setSearchUserVisible(true);
};
// 添加用户 // 添加用户
const addUser = () => { const addUser = () => {
setUserVisible(true); setUserVisible(true);
...@@ -468,10 +416,8 @@ const UserManage = () => { ...@@ -468,10 +416,8 @@ const UserManage = () => {
// 更改机构 // 更改机构
const changeOrg = record => { const changeOrg = record => {
setChangeOrgVisible(true); setChangeOrgVisible(true);
// setTreeData2(treeData1);
setCurrentUser(record); setCurrentUser(record);
setCurrentSelectOldOrg(record.OUID); setCurrentSelectOldOrg(record.OUID);
// onSelect1([record.OUID]);
}; };
// 修改密码 // 修改密码
const changePassword = record => { const changePassword = record => {
...@@ -486,8 +432,8 @@ const UserManage = () => { ...@@ -486,8 +432,8 @@ const UserManage = () => {
// console.log(record); // console.log(record);
setEditUserVisible(true); setEditUserVisible(true);
editUserForm.setFieldsValue({ editUserForm.setFieldsValue({
loginName: record.loginName, loginName: voca.stripTags(record.loginName),
userName: record.userName, userName: voca.stripTags(record.userName),
phone: record.phone || '', phone: record.phone || '',
email: record.email || '', email: record.email || '',
}); });
...@@ -509,8 +455,6 @@ const UserManage = () => { ...@@ -509,8 +455,6 @@ const UserManage = () => {
getUserByKey(searchWord) getUserByKey(searchWord)
.then(res => { .then(res => {
if (res.success) { if (res.success) {
// setSearchUserVisible(false);
// setSearchData(res.root);
setTableData(res.root); setTableData(res.root);
setTableTitle(res.root.length); setTableTitle(res.root.length);
} else { } else {
...@@ -574,6 +518,7 @@ const UserManage = () => { ...@@ -574,6 +518,7 @@ const UserManage = () => {
updateTrees().then(() => { updateTrees().then(() => {
// 只能是字符串，数字没有选择效果 // 只能是字符串，数字没有选择效果
onSelect([`${res.OUID}`]); onSelect([`${res.OUID}`]);
setExpandedKeys([`${res.OUID}`]);
}); });
} else { } else {
notification.error({ notification.error({
...@@ -604,6 +549,7 @@ const UserManage = () => { ...@@ -604,6 +549,7 @@ const UserManage = () => {
// 重新获取机构树与用户表 // 重新获取机构树与用户表
updateTrees(); updateTrees();
onSelect([orgID]); onSelect([orgID]);
setExpandedKeys([`${orgID}`]);
} else { } else {
notification.error({ notification.error({
message: '提交失败', message: '提交失败',
...@@ -675,7 +621,8 @@ const UserManage = () => { ...@@ -675,7 +621,8 @@ const UserManage = () => {
if (res.success) { if (res.success) {
setRoleVisible(false); setRoleVisible(false);
// 跳转到新组织机构下的用户表 // 跳转到新组织机构下的用户表
onSelect([newOrgID]); onSelect([`${currentUser.OUID}`]);
setExpandedKeys([`${currentUser.OUID}`]);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
}); });
...@@ -698,6 +645,7 @@ const UserManage = () => { ...@@ -698,6 +645,7 @@ const UserManage = () => {
setChangeOrgVisible(false); setChangeOrgVisible(false);
// 跳转到新组织机构下的用户表 // 跳转到新组织机构下的用户表
onSelect([newOrgID]); onSelect([newOrgID]);
setExpandedKeys([`${newOrgID}`]);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
}); });
...@@ -722,8 +670,6 @@ const UserManage = () => { ...@@ -722,8 +670,6 @@ const UserManage = () => {
.then(res => { .then(res => {
if (res.success) { if (res.success) {
setPasswordVisible(false); setPasswordVisible(false);
// 重新获取用户表
onSelect([orgID]);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
}); });
...@@ -737,6 +683,7 @@ const UserManage = () => { ...@@ -737,6 +683,7 @@ const UserManage = () => {
.catch(err => { .catch(err => {
message.error(err); message.error(err);
}); });
// 提交-编辑用户
const submitEditUser = () => const submitEditUser = () =>
postEditUser( postEditUser(
currentUser.userID, currentUser.userID,
...@@ -749,7 +696,8 @@ const UserManage = () => { ...@@ -749,7 +696,8 @@ const UserManage = () => {
if (res.success) { if (res.success) {
setEditUserVisible(false); setEditUserVisible(false);
// 重新获取用户表 // 重新获取用户表
onSelect([orgID]); onSelect([`${currentUser.OUID}`]);
setExpandedKeys([`${currentUser.OUID}`]);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
}); });
...@@ -764,9 +712,10 @@ const UserManage = () => { ...@@ -764,9 +712,10 @@ const UserManage = () => {
setTableLoading(false); setTableLoading(false);
message.error(err); message.error(err);
}); });
// 提交-冻结用户
const submitFreezeUser = () => { const submitFreezeUser = () => {
let state = ''; let state = '';
if (currentUser.state === '0') { if (currentUser.state === '0' || currentUser.state === null) {
state = '1'; state = '1';
} else { } else {
state = '0'; state = '0';
...@@ -776,7 +725,8 @@ const UserManage = () => { ...@@ -776,7 +725,8 @@ const UserManage = () => {
if (res.success) { if (res.success) {
setFreezeUserVisible(false); setFreezeUserVisible(false);
// 重新获取用户表 // 重新获取用户表
onSelect([orgID]); onSelect([`${currentUser.OUID}`]);
setExpandedKeys([`${currentUser.OUID}`]);
notification.success({ notification.success({
message: '提交成功', message: '提交成功',
}); });
...@@ -801,7 +751,8 @@ const UserManage = () => { ...@@ -801,7 +751,8 @@ const UserManage = () => {
message: '提交成功', message: '提交成功',
}); });
// 重新获取用户表 // 重新获取用户表
onSelect([orgID]); onSelect([`${currentUser.OUID}`]);
setExpandedKeys([`${currentUser.OUID}`]);
} else { } else {
notification.error({ notification.error({
message: '提交失败', message: '提交失败',
...@@ -834,6 +785,7 @@ const UserManage = () => { ...@@ -834,6 +785,7 @@ const UserManage = () => {
showIcon="true" showIcon="true"
showLine={{ showLeafIcon: false }} showLine={{ showLeafIcon: false }}
defaultExpandAll="true" defaultExpandAll="true"
// expandedKeys={[currentSelectOrg]}
selectedKeys={[currentSelectOrg]} selectedKeys={[currentSelectOrg]}
onSelect={onSelect} onSelect={onSelect}
treeData={treeData.map(t => mapTree(t))} treeData={treeData.map(t => mapTree(t))}
...@@ -843,7 +795,7 @@ const UserManage = () => { ...@@ -843,7 +795,7 @@ const UserManage = () => {
</Spin> </Spin>
<div style={{ color: '#1890FF', marginTop: '35vh', fontSize: '18px' }}> <div style={{ color: '#1890FF', marginTop: '35vh', fontSize: '18px' }}>
{treeVisible && ( {treeVisible && (
<Tooltip title="隐藏目录"> <Tooltip title="隐藏机构列表">
<DoubleLeftOutlined <DoubleLeftOutlined
onClick={() => setTreeVisible(false)} onClick={() => setTreeVisible(false)}
// style={{ background: 'white' }} // style={{ background: 'white' }}
...@@ -851,7 +803,7 @@ const UserManage = () => { ...@@ -851,7 +803,7 @@ const UserManage = () => {
</Tooltip> </Tooltip>
)} )}
{!treeVisible && ( {!treeVisible && (
<Tooltip title="显示目录"> <Tooltip title="显示机构列表">
<DoubleRightOutlined onClick={() => setTreeVisible(true)} /> <DoubleRightOutlined onClick={() => setTreeVisible(true)} />
</Tooltip> </Tooltip>
)} )}
...@@ -861,23 +813,18 @@ const UserManage = () => { ...@@ -861,23 +813,18 @@ const UserManage = () => {
<div className={styles.userContainer}> <div className={styles.userContainer}>
<div style={{ height: '50px' }}> <div style={{ height: '50px' }}>
<p style={{ margin: '16px 0 10px 16px', display: 'inline-block' }}> <p style={{ margin: '16px 0 10px 16px', display: 'inline-block' }}>
当前机构用户总数（ 用户数量（
<span className={styles.redText}>{tableTitle}</span>） <span className={styles.redText}>{tableTitle}</span>）
</p> </p>
<span style={{ float: 'right', margin: '10px' }}> <span style={{ float: 'right', margin: '10px' }}>
{/* <Button type="primary" onClick={searchUser}>
查找用户
</Button> */}
<Search <Search
style={{ width: 300 }} style={{ width: 266 }}
placeholder="请输入登录名称/用户名称/手机号" placeholder="搜索登录名称/用户名称/手机号"
onSearch={submitSearchUser} onSearch={submitSearchUser}
onChange={e => handleSearch(e)} onChange={e => handleSearch(e)}
enterButton enterButton
value={searchWord} value={searchWord}
/> />
<Button type="primary" onClick={addUser}> <Button type="primary" onClick={addUser}>
添加用户 添加用户
</Button> </Button>
...@@ -897,57 +844,32 @@ const UserManage = () => { ...@@ -897,57 +844,32 @@ const UserManage = () => {
type: selectionType, type: selectionType,
...rowSelection, ...rowSelection,
}} }}
size="small"
rowKey={record => record.userID} rowKey={record => record.userID}
locale={{ filterConfirm: '确定', filterReset: '重置' }} locale={zhCN}
bordered bordered
columns={columns} columns={columns}
dataSource={tableData} dataSource={tableData}
loading={tableLoading} loading={tableLoading}
scroll={{ x: 'max-content' }} scroll={{ x: 'max-content' }}
pagination={{ showTotal: () => `共${tableTitle}条`, pageSize: 10 }} pagination={{
showTotal: () => `共${tableTitle}条`,
pageSizeOptions: [10, 20, 50, 100],
// pageSize: { pageSize },
// current: { pageNum },
showQuickJumper: true,
showSizeChanger: true,
// onShowSizeChange: (current, pagesize) => {
// setPageSize(pagesize);
// setPageNum(current);
// },
// onChange: current => setPageNum(current),
}}
/> />
</div> </div>
{/* Modal弹框 */} {/* Modal弹框 */}
{/* 查找用户 */}
<Modal
title="查找用户"
visible={searchUserVisible}
onCancel={() => setSearchUserVisible(false)}
footer={[
<Button
key="back"
type="primary"
onClick={() => setSearchUserVisible(false)}
>
关闭
</Button>,
]}
>
<Form form={searchUserForm}>
<Form.Item
name="key"
label="关键字搜索"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="" onPressEnter={submitSearchUser} />
</Form.Item>
</Form>
<Table
bordered
rowKey={record => record.userID}
columns={searchColumns}
dataSource={searchData}
onRow={record => ({
onClick: () => {
onSelect([record.OUID]);
// setSelectedRowKeys([record.userID]);
setSearchUserVisible(false);
},
})}
/>
</Modal>
{/* 添加用户 */} {/* 添加用户 */}
<Modal <Modal
title={`在${orgTitle}下添加用户`} title={`在${orgTitle}下添加用户`}
...@@ -1195,8 +1117,10 @@ const UserManage = () => { ...@@ -1195,8 +1117,10 @@ const UserManage = () => {
> >
<p> <p>
将删除用户 将删除用户
<span className={styles.redText}>{currentUser.loginName}</span>, <span className={styles.redText}>
是否确认删除？ {voca.stripTags(currentUser.loginName)}
</span>
, 是否确认删除？
</p> </p>
</Modal> </Modal>
</div> </div>
......
src/pages/userCenter/UserManage.less
View file @ c92c4e87
@media screen and (min-width:1300px){
.hide{
display:none;
}
}
.redText{ .redText{
color: red; color: red;
cursor: pointer; cursor: pointer;
} }
.ant-layout{
overflow: auto;
.ant-layout-content{
margin:12px !important;
}
}
.userManageContainer{ .userManageContainer{
.ant-tree-treenode{ .ant-tree-treenode{
width: 100% !important; width: 100% !important;
...@@ -26,10 +37,9 @@ ...@@ -26,10 +37,9 @@
} }
} }
.contentContainer{ .contentContainer{
min-height: calc(100vh - 78px);
display: flex; display: flex;
.orgContainer{ .orgContainer{
min-height: calc(100vh - 78px); height: calc(100vh - 74px);
float: left; float: left;
padding: 10px; padding: 10px;
min-width: 240px; min-width: 240px;
...@@ -44,17 +54,22 @@ ...@@ -44,17 +54,22 @@
} }
.hide{ .hide{
display: none; display: none;
// width:0;
transition: 1s; transition: 1s;
} }
.userContainer{ .userContainer{
margin-left: 10px; height: calc(100vh - 168px) !important;
flex: 1; flex: 1;
height: calc(100vh - 78px); min-width: 840px;
min-width: 880px;
background: white; background: white;
.ant-table-pagination-right{ .ant-table-pagination{
padding-right: 12px; padding-right: 12px;
background: white;
margin: 1px 0;
padding:8px;
padding-right: 20px;
.ant-pagination-prev,.ant-pagination-next{
line-height: 8px !important;
}
} }
.ant-btn-primary{ .ant-btn-primary{
margin-left: 20px; margin-left: 20px;
...@@ -73,6 +88,32 @@ ...@@ -73,6 +88,32 @@
text-overflow:ellipsis; text-overflow:ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.ant-table-content{
height:calc(100vh - 168px);
border-right: white;
overflow: auto !important;
//滚动条整体部分
&::-webkit-scrollbar {
height: 10px;//x轴滚动条粗细
width:10px;//y轴滚动条粗细
border-bottom: 2px solid white;
}
//滚动条里面的小方块，能上下左右移动（取决于是垂直滚动条还是水平滚动条）
&::-webkit-scrollbar-thumb {
border-radius: 10px;
box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
background: rgba(74, 74, 75, 0.1);
margin-bottom: 10px;
}
//滚动条的轨道（里面装有thumb）滚动槽
&::-webkit-scrollbar-track {
box-shadow: 0;
border-radius: 0;
background: white;//滚动槽背景色
border-radius: 10px;//滚动条边框半径设置
}
}
} }
} }
} }
......
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