Skip to content

C
CivManage
Commit 9acd1f6b authored by 陈前坚's avatar 陈前坚
Browse files
Options

perf: userStyle

parent 9ebaced0
Hide whitespace changes
Inline Side-by-side
Showing with 55 additions and 67 deletions
src/pages/userCenter/UserManage.js
View file @ 9acd1f6b
...@@ -22,16 +22,15 @@ import { ...@@ -22,16 +22,15 @@ import {
FolderAddTwoTone, FolderAddTwoTone,
EditTwoTone, EditTwoTone,
DeleteTwoTone, DeleteTwoTone,
PlayCircleOutlined,
ShareAltOutlined, ShareAltOutlined,
KeyOutlined, UnlockOutlined,
ApartmentOutlined, ApartmentOutlined,
SearchOutlined, SearchOutlined,
StopOutlined, StopOutlined,
} from '@ant-design/icons'; } from '@ant-design/icons';
import { PageContainer } from '@ant-design/pro-layout'; import { PageContainer } from '@ant-design/pro-layout';
// import classnames from 'classnames'; // import classnames from 'classnames';
import { get } from '../../services'; // import { get } from '../../services';
import styles from './UserManage.less'; import styles from './UserManage.less';
import ListCardItem from '../orgnazation/listCardItem'; import ListCardItem from '../orgnazation/listCardItem';
import { import {
...@@ -110,30 +109,39 @@ const UserManage = () => { ...@@ -110,30 +109,39 @@ const UserManage = () => {
title: '登录名', title: '登录名',
dataIndex: 'loginName', dataIndex: 'loginName',
key: 'loginName', key: 'loginName',
fixed: 'left',
width: 100,
}, },
{ {
title: '用户姓名', title: '用户姓名',
dataIndex: 'userName', dataIndex: 'userName',
key: 'userName', key: 'userName',
width: 100,
}, },
{ {
title: '手机号码', title: '手机号码',
dataIndex: 'phone', dataIndex: 'phone',
key: 'phone', key: 'phone',
width: 150,
ellipsis: true,
}, },
{ {
title: '钉钉账户', title: '钉钉账户',
dataIndex: 'ddid', dataIndex: 'ddid',
key: 'ddid', key: 'ddid',
width: 150,
}, },
{ {
title: '微信账户', title: '微信账户',
dataIndex: 'wxid', dataIndex: 'wxid',
key: 'wxid', key: 'wxid',
width: 150,
}, },
{ {
title: '操作', title: '操作',
key: 'action', key: 'action',
fixed: 'right',
width: 300,
align: 'center', align: 'center',
render: (text, record) => ( render: (text, record) => (
<Space size="middle"> <Space size="middle">
...@@ -150,7 +158,7 @@ const UserManage = () => { ...@@ -150,7 +158,7 @@ const UserManage = () => {
/> />
</Tooltip> </Tooltip>
<Tooltip title="修改密码"> <Tooltip title="修改密码">
<KeyOutlined <UnlockOutlined
onClick={() => changePassword(record)} onClick={() => changePassword(record)}
style={{ fontSize: '16px', color: '#1890FF' }} style={{ fontSize: '16px', color: '#1890FF' }}
/> />
...@@ -242,7 +250,7 @@ const UserManage = () => { ...@@ -242,7 +250,7 @@ const UserManage = () => {
</> </>
), ),
key: org.id, key: org.id,
// icon: <CaretDownOutlined />, // icon: <SolutionOutlined />,
// 判断它是否存在子集，若果存在就进行再次进行遍历操作，知道不存在子集便对其他的元素进行操作 // 判断它是否存在子集，若果存在就进行再次进行遍历操作，知道不存在子集便对其他的元素进行操作
children: haveChildren ? org.children.map(i => mapTree(i)) : [], children: haveChildren ? org.children.map(i => mapTree(i)) : [],
}; };
...@@ -252,13 +260,14 @@ const UserManage = () => { ...@@ -252,13 +260,14 @@ const UserManage = () => {
return { return {
title: `${org.text}`, title: `${org.text}`,
key: org.id, key: org.id,
// icon: <CaretDownOutlined />, // icon: <SolutionOutlined />,
// 判断它是否存在子集，若果存在就进行再次进行遍历操作，知道不存在子集便对其他的元素进行操作 // 判断它是否存在子集，若果存在就进行再次进行遍历操作，知道不存在子集便对其他的元素进行操作
children: haveChildren ? org.children.map(i => mapTree1(i)) : [], children: haveChildren ? org.children.map(i => mapTree1(i)) : [],
}; };
}; };
const updateTrees = () => const updateTrees = () => {
setTreeLoading(true);
getUserTree(-1, -1) getUserTree(-1, -1)
.then(res => { .then(res => {
if (res.length > 0) { if (res.length > 0) {
...@@ -276,6 +285,7 @@ const UserManage = () => { ...@@ -276,6 +285,7 @@ const UserManage = () => {
setTreeLoading(false); setTreeLoading(false);
message.error(err); message.error(err);
}); });
};
// 获取用户机构树 // 获取用户机构树
useEffect(() => { useEffect(() => {
...@@ -297,6 +307,7 @@ const UserManage = () => { ...@@ -297,6 +307,7 @@ const UserManage = () => {
setTableLoading(false); setTableLoading(false);
const table = res.root.map((item, index) => { const table = res.root.map((item, index) => {
item.key = index; item.key = index;
item.phone = item.phone || '-';
item.ddid = item.ddid ? '已绑定' : '未绑定'; item.ddid = item.ddid ? '已绑定' : '未绑定';
item.wxid = item.wxid ? '已绑定' : '未绑定'; item.wxid = item.wxid ? '已绑定' : '未绑定';
return item; return item;
...@@ -337,7 +348,7 @@ const UserManage = () => { ...@@ -337,7 +348,7 @@ const UserManage = () => {
const deleteOrg = (e, title, id) => { const deleteOrg = (e, title, id) => {
// e.stopPropagation(); // e.stopPropagation();
setDeleteOrgVisible(true); setDeleteOrgVisible(true);
setOrgTitle(`在${title}下添加用户`); setOrgTitle(`删除组织${title}`);
setOrgID(id); setOrgID(id);
// 删除后默认选择第一个组织 // 删除后默认选择第一个组织
setTreeState(true); setTreeState(true);
...@@ -399,7 +410,6 @@ const UserManage = () => { ...@@ -399,7 +410,6 @@ const UserManage = () => {
if (res.success) { if (res.success) {
// setSearchUserVisible(false); // setSearchUserVisible(false);
setSearchData(res.root); setSearchData(res.root);
// setSearchData(res.root);
} else { } else {
notification.error({ notification.error({
message: '提交失败', message: '提交失败',
...@@ -488,7 +498,7 @@ const UserManage = () => { ...@@ -488,7 +498,7 @@ const UserManage = () => {
message: '提交成功', message: '提交成功',
}); });
// 重新获取机构树与用户表 // 重新获取机构树与用户表
getUserTree(-1, -1); updateTrees();
onSelect([orgID]); onSelect([orgID]);
} else { } else {
notification.error({ notification.error({
...@@ -703,7 +713,7 @@ const UserManage = () => { ...@@ -703,7 +713,7 @@ const UserManage = () => {
style={{ style={{
fontSize: '18px', fontSize: '18px',
float: 'right', float: 'right',
marginLeft: '12px', margin: '4px 4px 0px 12px',
color: '#1890FF', color: '#1890FF',
}} }}
onClick={searchUser} onClick={searchUser}
...@@ -711,16 +721,21 @@ const UserManage = () => { ...@@ -711,16 +721,21 @@ const UserManage = () => {
</Tooltip> </Tooltip>
<Tooltip title="添加下级机构"> <Tooltip title="添加下级机构">
<FolderAddTwoTone <FolderAddTwoTone
style={{ fontSize: '18px', float: 'right' }} style={{
fontSize: '18px',
float: 'right',
marginTop: '4px',
}}
onClick={e => addSubOrg(e, '根目录', '-1')} onClick={e => addSubOrg(e, '根目录', '-1')}
/> />
</Tooltip> </Tooltip>
</span> </span>
{treeData.length > 0 && ( {treeData.length > 0 && (
<Spin spinning={treeLoading} tip="loading"> <Spin spinning={treeLoading} tip="loading...">
<Tree <Tree
showLine="true" // showLine="true"
showIcon="true" showIcon="true"
showLine={{ showLeafIcon: false }}
defaultExpandAll="true" defaultExpandAll="true"
selectedKeys={[currentSelectOrg]} selectedKeys={[currentSelectOrg]}
onSelect={onSelect} onSelect={onSelect}
...@@ -731,10 +746,11 @@ const UserManage = () => { ...@@ -731,10 +746,11 @@ const UserManage = () => {
</div> </div>
<div className={styles.userContainer}> <div className={styles.userContainer}>
<Table <Table
bordered
columns={columns} columns={columns}
dataSource={tableData} dataSource={tableData}
loading={tableLoading} loading={tableLoading}
scroll={{ scrollToFirstRowOnChange: 'true', x: true }} scroll={{ scrollToFirstRowOnChange: 'true', x: 'max-content' }}
/> />
</div> </div>
{/* 查找用户 */} {/* 查找用户 */}
...@@ -756,11 +772,7 @@ const UserManage = () => { ...@@ -756,11 +772,7 @@ const UserManage = () => {
<Form.Item <Form.Item
name="key" name="key"
label="关键字搜索" label="关键字搜索"
rules={[ rules={[{ required: true, message: '不能为空' }]}
{
required: true,
},
]}
> >
<Input <Input
placeholder="请输入登录名称/用户名称/手机号 ，回车键查找" placeholder="请输入登录名称/用户名称/手机号 ，回车键查找"
...@@ -769,6 +781,7 @@ const UserManage = () => { ...@@ -769,6 +781,7 @@ const UserManage = () => {
</Form.Item> </Form.Item>
</Form> </Form>
<Table <Table
bordered
columns={searchColumns} columns={searchColumns}
dataSource={searchData} dataSource={searchData}
onRow={record => ({ onRow={record => ({
...@@ -792,33 +805,21 @@ const UserManage = () => { ...@@ -792,33 +805,21 @@ const UserManage = () => {
<Form.Item <Form.Item
name="loginName" name="loginName"
label="登录名称" label="登录名称"
rules={[ rules={[{ required: true, message: '不能为空' }]}
{
required: true,
},
]}
> >
<Input placeholder="请输入登录名称" /> <Input placeholder="请输入登录名称" />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="password" name="password"
label="账户密码" label="账户密码"
rules={[ rules={[{ required: true, message: '不能为空' }]}
{
required: true,
},
]}
> >
<Input placeholder="请输入账户密码" /> <Input placeholder="请输入账户密码" />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="userName" name="userName"
label="用户名称" label="用户名称"
rules={[ rules={[{ required: true, message: '不能为空' }]}
{
required: true,
},
]}
> >
<Input placeholder="请输入用户姓名" /> <Input placeholder="请输入用户姓名" />
</Form.Item> </Form.Item>
...@@ -843,11 +844,7 @@ const UserManage = () => { ...@@ -843,11 +844,7 @@ const UserManage = () => {
<Form.Item <Form.Item
name="OUName" name="OUName"
label="机构名称" label="机构名称"
rules={[ rules={[{ required: true, message: '不能为空' }]}
{
required: true,
},
]}
> >
<Input placeholder="请输入机构名称" /> <Input placeholder="请输入机构名称" />
</Form.Item> </Form.Item>
...@@ -869,11 +866,7 @@ const UserManage = () => { ...@@ -869,11 +866,7 @@ const UserManage = () => {
<Form.Item <Form.Item
name="OUName" name="OUName"
label="机构名称" label="机构名称"
rules={[ rules={[{ required: true, message: '不能为空' }]}
{
required: true,
},
]}
> >
<Input placeholder="请输入机构名称" /> <Input placeholder="请输入机构名称" />
</Form.Item> </Form.Item>
...@@ -942,8 +935,8 @@ const UserManage = () => { ...@@ -942,8 +935,8 @@ const UserManage = () => {
<span>请选择要更改的目标机构：</span> <span>请选择要更改的目标机构：</span>
{changeOrgVisible && treeData2.length > 0 && ( {changeOrgVisible && treeData2.length > 0 && (
<Tree <Tree
showLine="true"
showIcon="true" showIcon="true"
showLine={{ showLeafIcon: false }}
defaultExpandAll="true" defaultExpandAll="true"
defaultSelectedKeys={[currentSelectOrg]} defaultSelectedKeys={[currentSelectOrg]}
onSelect={props => { onSelect={props => {
...@@ -969,22 +962,14 @@ const UserManage = () => { ...@@ -969,22 +962,14 @@ const UserManage = () => {
<Form.Item <Form.Item
name="newPassword" name="newPassword"
label="新- 密-码" label="新- 密-码"
rules={[ rules={[{ required: true, message: '不能为空' }]}
{
required: true,
},
]}
> >
<Input placeholder="请输入新密码" /> <Input placeholder="请输入新密码" />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="passwordConfirm" name="passwordConfirm"
label="确认密码" label="确认密码"
rules={[ rules={[{ required: true, message: '不能为空' }]}
{
required: true,
},
]}
> >
<Input placeholder="再次确认新密码" /> <Input placeholder="再次确认新密码" />
</Form.Item> </Form.Item>
...@@ -1003,22 +988,14 @@ const UserManage = () => { ...@@ -1003,22 +988,14 @@ const UserManage = () => {
<Form.Item <Form.Item
name="loginName" name="loginName"
label="登录名称" label="登录名称"
rules={[ rules={[{ required: true, message: '不能为空' }]}
{
required: true,
},
]}
> >
<Input placeholder="请输入登录名称" /> <Input placeholder="请输入登录名称" />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="userName" name="userName"
label="用户姓名" label="用户姓名"
rules={[ rules={[{ required: true, message: '不能为空' }]}
{
required: true,
},
]}
> >
<Input placeholder="请输入用户姓名" /> <Input placeholder="请输入用户姓名" />
</Form.Item> </Form.Item>
......
src/pages/userCenter/UserManage.less
View file @ 9acd1f6b
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
.ant-tree-treenode:hover{ .ant-tree-treenode:hover{
.iconWraper1>span{ .iconWraper1>span{
margin-left: 12px; margin-left: 12px;
font-size: 16px; font-size: 18px;
display: inline-block; display: inline-block;
} }
} }
...@@ -45,6 +45,10 @@ ...@@ -45,6 +45,10 @@
background: white; background: white;
.ant-tree{ .ant-tree{
padding-top: 6px; padding-top: 6px;
.ant-tree-switcher{
line-height: 1;
color:#1890FF;
}
} }
} }
.userContainer{ .userContainer{
...@@ -58,3 +62,9 @@ ...@@ -58,3 +62,9 @@
} }
} }
} }
.ant-modal-root{
.ant-tree-switcher{
line-height: 1;
color:#1890FF;
}
}
\ No newline at end of file
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