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