Commit 2d071160 authored by 张烨's avatar 张烨

feat: global header breadCrumb

parents 42bc3ca8 2aae7b09
......@@ -5,7 +5,7 @@ const BasePageContainer = props => {
const { children, ...rest } = props;
return (
<PageContainer {...rest} title={false}>
<PageContainer {...rest} pageHeaderRender={() => null}>
{children}
</PageContainer>
);
......
import React from 'react';
import { Tooltip } from 'antd';
import React, { useContext } from 'react';
import { RouteContext } from '@ant-design/pro-layout';
import { Tooltip, Breadcrumb } from 'antd';
import { QuestionCircleOutlined } from '@ant-design/icons';
......@@ -12,15 +12,18 @@ import styles from './index.less';
const GlobalHeaderRight = props => {
const { theme, layout } = props;
let className = styles.right;
const value = useContext(RouteContext);
if (theme === 'dark' && layout === 'top') {
className = `${styles.right} ${styles.dark}`;
}
return (
<div className={className}>
{/* <span className={styles.left}>{value.title}</span> */}
<Breadcrumb {...value.breadcrumb} className={styles.lineHeight} />
<div style={{ flex: 1 }} />
<HeaderSearch
className={`${styles.action} ${styles.search}`}
className={`${styles.action} ${styles.search} ${styles.toRight}`}
placeholder="站内搜索"
defaultValue=""
options={
......@@ -57,8 +60,8 @@ const GlobalHeaderRight = props => {
<QuestionCircleOutlined />
</a>
</Tooltip> */}
<NoticeIcon className={styles.action} />
<Avatar />
<NoticeIcon className={`${styles.action} ${styles.toRight}`} />
<Avatar className={styles.toRight} />
{/* <SelectLang className={styles.action} /> */}
</div>
);
......
......@@ -10,8 +10,14 @@
}
}
.lineHeight{
line-height: 48px;
}
.right {
display: flex;
// flex: 100;
width: 100%;
float: right;
height: 48px;
margin-left: auto;
......
......@@ -52,3 +52,6 @@ ol {
min-height: 100vh;
}
}
.ant-pro-global-header-layout-side>div:first-child /deep/{
flex: 0 !important;
}
\ No newline at end of file
......@@ -68,7 +68,7 @@ const BasicLayout = props => {
return <Link to={menuItemProps.path}>{defaultDom}</Link>;
}}
itemRender={(route, params, routes, paths) => {
const first = routes.indexOf(route) === 0;
const first = false; // routes.indexOf(route) === 0;
return first ? (
<Link to={paths.join('/')}>{route.breadcrumbName}</Link>
) : (
......
......@@ -162,6 +162,7 @@ const AppMenu = () => {
// 获取当前菜单详细
const onSelect = (props, e) => {
// e.node.pos节点类型,根据这个渲染不同的编辑表单item,0-x一级菜单,0-0-x二级,0-0-0-x三级
console.log(e);
if (e) {
if (e.node.pos.lastIndexOf('-') === 1) {
setNodeType(1);
......
.contentContainer{
// min-height: calc(100vh - 194px);
// min-height: calc(100vh - 48px);
overflow-x: auto;
display: flex;
.menuContainer{
......
......@@ -50,17 +50,13 @@ const CurrentSolution = () => {
notification.error({
message: '提示',
description: res.message || '切换失败',
duration: 10,
duration: 15,
});
}
})
.catch(err => {
setLoading(false);
notification.error({
message: '提示',
description: err,
duration: 3,
});
console.error(err);
});
};
return (
......
......@@ -3,12 +3,13 @@
align-items: center;
}
.cardbox{
min-height: 200px;
min-height: 100px;
}
.btnBox{
margin-top: 40px;
display: flex;
justify-content: center;
align-items: center;
}
.tAlign{
text-align: center;
......
......@@ -16,12 +16,18 @@ import {
} from 'antd';
import PageContainer from '@/components/BasePageContainer';
import { connect } from 'react-redux';
import { get, post } from '../../services';
import {
setTableSQLDirName,
deleteConn,
initDBv4,
getInitDBLog,
getConnRecord,
getDataBaseConfig,
saveConnection,
getConnectionTest,
getDataBaseList,
updateConnDesc,
deleteInitDBLog,
connectionTest,
} from '@/services/database/api';
import styles from './InitDataBase.less';
......@@ -52,14 +58,15 @@ const InitDataBase = props => {
const [modalVisible, setModalVisible] = useState(false); // 修改秒速弹窗
const [initVisible, setInitVisible] = useState(false); // 数据库初始化弹窗
const [initContent, setInitContent] = useState(''); // 数据库初始化内容
const [initLoading, setInitLoading] = useState(false);
const [cardLoading, setCardLoading] = useState(false); // 初始化card Loading
const [finish, setFinish] = useState(false);
// 获取数据库链接记录
useEffect(() => {
setTableLoading(true);
get(`/Cityinterface/rest/services/OMS.svc/S_GetConnRecord`, {
getConnRecord({
_version: 9999,
dc: 1603334559186,
dc: Date.now(),
})
.then(res => {
setTableLoading(false);
......@@ -79,9 +86,9 @@ const InitDataBase = props => {
// 获取数据库配置信息
useEffect(() => {
setCardLoading(true);
get(`/Cityinterface/rest/services/OMS.svc/S_GetDataBaseConfig`, {
getDataBaseConfig({
_version: 9999,
dc: 1603334559186,
dc: Date.now(),
})
.then(res => {
setCardLoading(false);
......@@ -101,38 +108,58 @@ const InitDataBase = props => {
console.error(err);
});
}, []);
// 获取日志
const doInitLog = () => {
getInitDBLog({
_version: 9999,
_dc: Date.now(),
})
.then(res => {
if (res.success) {
let arr = [];
arr.push(
res.content
.split(/(\r\n)|(\n)/)
.map((item, index) => <p key={index}>{item}</p>),
);
setInitContent(arr);
}
})
.catch(err => {
setFinish(true);
});
};
// 数据库初始化
const initClick = () => {
setInitLoading(true);
setInitContent('');
setCardLoading(true);
setInitVisible(true);
let obj = form.getFieldsValue();
doInitLog();
for (let i = 0; i < 9; i++) {
setTimeout(() => {
doInitLog();
}, 100);
}
initDBv4({
_version: 9999,
_dc: Date.now(),
...obj,
})
.then(res => {
setInitLoading(false);
setCardLoading(false);
if (res.GetMe) {
getInitDBLog({
_version: 9999,
_dc: Date.now(),
}).then(res => {
if (res.success) {
setInitVisible(true);
setInitContent(res.content);
}
console.log(res.content.split(/[(\r\n)\r\n]+/));
});
console.log(res);
} else {
notification.error({
message: '提示',
duration: 3,
duration: 15,
description: res.Say.Message || '初始化失败',
});
}
})
.catch(err => {
setInitLoading(false);
setCardLoading(false);
console.log(err);
});
};
......@@ -150,7 +177,7 @@ const InitDataBase = props => {
const onFinish = values => {
setCardLoading(true);
const obj = values;
get('/Cityinterface/rest/services/OMS.svc/S_SaveConnection', {
saveConnection({
_version: 9999,
_dc: new Date().getTime(),
ip: obj.ip,
......@@ -170,7 +197,7 @@ const InitDataBase = props => {
} else {
notification.error({
message: '提示',
duration: 3,
duration: 15,
description: res.Say.Message || '保存失败',
});
}
......@@ -185,7 +212,7 @@ const InitDataBase = props => {
console.log(dbForm);
setCardLoading(true);
const obj = form.getFieldsValue();
get('/Cityinterface/rest/services/OMS.svc/S_GetConnectionTest', {
getConnectionTest({
_version: 9999,
_dc: new Date().getTime(),
ip: obj.ip,
......@@ -204,7 +231,7 @@ const InitDataBase = props => {
} else {
notification.error({
message: '提示',
duration: 3,
duration: 15,
description: res.Say.Message || '连接失败',
});
}
......@@ -212,19 +239,15 @@ const InitDataBase = props => {
.catch(err => {
setCardLoading(false);
console.log(err);
notification.error({
message: '提示',
duration: 3,
description: err || '连接失败',
});
});
};
// 获取数据库列表
const selectFocus = e => {
setOption([]);
let params = form.getFieldsValue();
get(`/Cityinterface/rest/services/OMS.svc/S_GetDataBaseList`, {
getDataBaseList({
_version: 9999,
_dc: 1603334559186,
_dc: Date.now(),
userName: params.userName || '',
password: params.password || '',
ip: params.ip || '',
......@@ -235,12 +258,11 @@ const InitDataBase = props => {
} else {
notification.error({
message: '通知',
duration: 3,
duration: 15,
description: res.message,
});
setOption([]);
}
console.log(res);
})
.catch(err => {
console.error(err);
......@@ -272,7 +294,7 @@ const InitDataBase = props => {
} else {
notification.error({
message: '提示',
duration: 3,
duration: 15,
description: res.message,
});
}
......@@ -283,7 +305,6 @@ const InitDataBase = props => {
};
// 展示修改描述
const changeDesc = val => {
console.log(val);
setDesc(val);
setModalVisible(true);
};
......@@ -291,12 +312,22 @@ const InitDataBase = props => {
const { value } = e.target;
setDesc(value);
};
// 关闭弹窗
const handleClick = () => {
setInitVisible(false);
setInitContent('');
setFinish(false);
deleteInitDBLog({
_version: 9999,
_dc: Date.now(),
});
};
// 弹窗确认回调
const modalOkCallback = () => {
console.log(form.getFieldsValue());
const obj = form.getFieldsValue();
// 更新描述
get('/Cityinterface/rest/services/OMS.svc/S_UpdateConnDesc', {
updateConnDesc({
_version: 9999,
_dc: new Date().getTime(),
ip: obj.ip,
......@@ -336,7 +367,7 @@ const InitDataBase = props => {
} else {
notification.error({
message: '提示',
duration: 3,
duration: 15,
description: res.message,
});
}
......@@ -351,31 +382,42 @@ const InitDataBase = props => {
title: '服务器名或IP地址',
dataIndex: 'ip',
key: 'ip',
width: 180,
ellipsis: true,
},
{
title: '数据库名称',
dataIndex: 'dbName',
key: 'dbName',
width: 180,
ellipsis: true,
},
{
title: '数据库用户名称',
dataIndex: 'userName',
key: 'userName',
width: 180,
ellipsis: true,
},
{
title: '保存时间',
dataIndex: 'saveTime',
key: 'saveTime',
width: 180,
ellipsis: true,
},
{
title: '描述',
dataIndex: 'desc',
key: 'desc',
ellipsis: true,
},
{
title: '操作',
dataIndex: 'action',
key: 'action',
width: 250,
ellipsis: true,
render: (text, record) => (
<Space>
<Button
......@@ -481,9 +523,7 @@ const InitDataBase = props => {
initClick();
}}
>
<Button type="primary" loading={initLoading}>
数据库初始化
</Button>
<Button type="primary">数据库初始化</Button>
</Popconfirm>
{defaultSqlDir && (
<Select
......@@ -541,8 +581,7 @@ const InitDataBase = props => {
footer={[
<Button
onClick={() => {
setInitVisible(false);
setInitContent('');
handleClick();
}}
type="primary"
>
......@@ -563,13 +602,14 @@ const InitDataBase = props => {
minHeight: '100px',
}}
cancelText="取消"
okText="确认修改"
okText="确认"
destroyOnClose
>
<Row>
<Col span={2} className={styles.decsBox}>
描述:
</Col>
<Col span={22}>
<Input
placeholder="请输入描述"
......
......@@ -7,11 +7,15 @@ import {
Modal,
Popconfirm,
notification,
Spin,
} from 'antd';
import PageContainer from '@/components/BasePageContainer';
import { get } from '../../services';
import styles from './ManagementDataBase.less';
import { updateDateBase } from '@/services/database/api';
import {
tableCheck,
updateDateBase,
databaseStandardGetLog,
} from '@/services/database/api';
const ManagementDataBase = () => {
const [autoCheckList, setAutoCheckList] = useState([]); // 自动列表
......@@ -26,7 +30,7 @@ const ManagementDataBase = () => {
// 检查数据库表
useEffect(() => {
setCheckLoading(true);
get(`/Cityinterface/rest/services/OMS.svc/TableCheck`, {
tableCheck({
_version: 9999,
_dc: new Date().getTime(),
})
......@@ -58,7 +62,7 @@ const ManagementDataBase = () => {
// 获取数据库升级记录
useEffect(() => {
setLogLoading(true);
get(`/Cityinterface/rest/services/OMS.svc/DatabaseStandard_GetLog`, {
databaseStandardGetLog({
_version: 9999,
_dc: new Date().getTime(),
})
......@@ -102,7 +106,7 @@ const ManagementDataBase = () => {
} else {
notification.error({
message: '通知',
duration: 3,
duration: 15,
description: res.message,
});
}
......@@ -113,21 +117,27 @@ const ManagementDataBase = () => {
});
};
const handleLog = text => {
console.log(text);
let arr = [];
arr.push(text.split(/[(\r\n)\r\n]+/).map(item => <p>${item}</p>));
arr.push(text.split(/(\r\n)|(\n)/).map(item => <p>{item}</p>));
setModalVisible(true);
setContent(text);
// setContent(text);
setContent(arr);
};
const autoCheckColumns = [
{
title: '表名称',
dataIndex: 'tableName',
key: 'tableName',
width: 200,
ellipsis: true,
},
{
title: '类型',
dataIndex: 'type',
key: 'type',
width: 180,
ellipsis: true,
},
{
title: '差异比较',
......@@ -141,6 +151,7 @@ const ManagementDataBase = () => {
dataIndex: 'tableName',
key: 'tableName',
width: 200,
ellipsis: true,
},
{
title: '差异比较',
......@@ -154,21 +165,29 @@ const ManagementDataBase = () => {
title: '登录名',
dataIndex: 'updateBy',
key: 'updateBy',
width: 200,
ellipsis: true,
},
{
title: '数据库名称',
dataIndex: 'name',
key: 'name',
width: 200,
ellipsis: true,
},
{
title: '数据库版本',
dataIndex: 'version',
key: 'version',
width: 200,
ellipsis: true,
},
{
title: '升级时间',
dataIndex: 'updateTime',
key: 'updateTime',
width: 200,
ellipsis: true,
},
{
title: '版本日志',
......@@ -209,21 +228,17 @@ const ManagementDataBase = () => {
<PageContainer>
<Card>
<div className={styles.tableTitle}>表结构自动化修复</div>
<Spin tip="loading..." spinning={checkLoading}>
<Table
className={styles.mgTop20}
columns={autoCheckColumns}
dataSource={autoCheckList}
bordered
loading={checkLoading}
size="small"
/>
<div className={styles.btnBox}>
<Space>
<Button
type="primary"
onClick={handleCheck}
loading={checkLoading}
>
<Button type="primary" onClick={handleCheck}>
检查
</Button>
<Popconfirm
......@@ -235,12 +250,13 @@ const ManagementDataBase = () => {
handleUpdate();
}}
>
<Button danger type="primary" loading={checkLoading}>
<Button danger type="primary">
升级
</Button>
</Popconfirm>
</Space>
</div>
</Spin>
</Card>
<Card className={styles.mgTop20}>
<div className={styles.tableTitle}>数据库升级记录</div>
......
......@@ -111,31 +111,43 @@ const MongDBTable = props => {
title: '标签',
dataIndex: 'name',
key: 'name',
width: '200px',
ellipsis: true,
},
{
title: 'ip',
dataIndex: 'ip',
key: 'ip',
width: 200,
ellipsis: true,
},
{
title: '端口',
dataIndex: 'port',
key: 'port',
width: 200,
ellipsis: true,
},
{
title: '数据库名',
dataIndex: 'dbName',
key: 'dbName',
width: 200,
ellipsis: true,
},
{
title: '类型',
dataIndex: 'type',
key: 'type',
width: 200,
ellipsis: true,
},
{
title: '复制集',
dataIndex: 'replicaSet',
key: 'replicaSet',
width: 200,
ellipsis: true,
},
// {
// title: '用户名',
......@@ -151,7 +163,6 @@ const MongDBTable = props => {
title: '操作',
dataIndex: 'options',
key: 'options',
width: 300,
render: (val, item) => [
<Tag color="#2db7f5" onClick={() => handleCon(val, item)}>
测试连接
......
......@@ -107,26 +107,36 @@ const MySQLTable = props => {
title: '标签',
dataIndex: 'name',
key: 'name',
width: 200,
ellipsis: true,
},
{
title: 'IP',
dataIndex: 'ip',
key: 'ip',
width: 200,
ellipsis: true,
},
{
title: '数据库名',
dataIndex: 'dbName',
key: 'dbName',
width: 200,
ellipsis: true,
},
{
title: '用户名',
dataIndex: 'userName',
key: 'userName',
width: 200,
ellipsis: true,
},
{
title: '密码',
dataIndex: 'password',
key: 'password',
width: 200,
ellipsis: true,
},
{
title: '操作',
......
......@@ -107,21 +107,29 @@ const OracleTable = props => {
title: '标签',
dataIndex: 'name',
key: 'name',
width: 200,
ellipsis: true,
},
{
title: '网络服务名/(ip:port/实例名)',
dataIndex: 'dbName',
key: 'dbName',
width: 400,
ellipsis: true,
},
{
title: '用户名',
dataIndex: 'userName',
key: 'userName',
width: 200,
ellipsis: true,
},
{
title: '密码',
dataIndex: 'password',
key: 'password',
width: 200,
ellipsis: true,
},
{
title: '操作',
......
......@@ -107,26 +107,36 @@ const SQLServerTable = props => {
title: '标签',
dataIndex: 'name',
key: 'name',
width: 200,
ellipsis: true,
},
{
title: 'ip',
dataIndex: 'ip',
key: 'ip',
width: 200,
ellipsis: true,
},
{
title: '数据库名',
dataIndex: 'dbName',
key: 'dbName',
width: 200,
ellipsis: true,
},
{
title: '用户名',
dataIndex: 'userName',
key: 'userName',
width: 200,
ellipsis: true,
},
{
title: '密码',
dataIndex: 'password',
key: 'password',
width: 200,
ellipsis: true,
},
{
title: '操作',
......
......@@ -18,7 +18,7 @@ import {
Spin,
} from 'antd';
import {
FileAddTwoTone,
UsergroupAddOutlined,
FolderAddTwoTone,
EditTwoTone,
DeleteTwoTone,
......@@ -29,6 +29,8 @@ import {
StopOutlined,
FolderOpenOutlined,
FileOutlined,
DoubleLeftOutlined,
DoubleRightOutlined,
} from '@ant-design/icons';
import PageContainer from '@/components/BasePageContainer';
// import classnames from 'classnames';
......@@ -58,42 +60,46 @@ const UserManage = () => {
const [loading, setLoading] = useState(true);
const [treeData, setTreeData] = useState([]); // 用户机构树
const [treeData1, setTreeData1] = useState([]); // 用户机构树-备份,供更改机构使用
const [treeData2, setTreeData2] = useState([]);
const [treeState, setTreeState] = useState(true); // 树第一次加载
const [treeVisible, setTreeVisible] = useState(true); // 树是否可见
const [tableData, setTableData] = useState([]); // 用户表
const [searchData, setSearchData] = useState([]);
const [currentSelectOrg, setCurrentSelectOrg] = useState([]);
const [orgFilters, setOrgFilters] = useState([]); // 用户列筛选
// const [selectedRowKeys, setSelectedRowKeys] = useState([]); // 用户表
const [searchData, setSearchData] = useState([]); // 查找用户的结果表
const [currentSelectOrg, setCurrentSelectOrg] = useState([]); // 左侧机构数-选中组织
const [currentSelectOldOrg, setCurrentSelectOldOrg] = useState([]); // 更改机构时的树-选中组织
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);
const [roleVisible, setRoleVisible] = useState(false);
const [changeOrgVisible, setChangeOrgVisible] = useState(false);
const [passwordVisible, setPasswordVisible] = useState(false);
const [editUserVisible, setEditUserVisible] = useState(false);
const [treeState, setTreeState] = useState(true);
const [freezeUserVisible, setFreezeUserVisible] = useState(false);
const [deleteUserVisible, setDeleteUserVisible] = useState(false);
/** ***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); // 删除机构
const [roleVisible, setRoleVisible] = useState(false); // 用户关联
const [changeOrgVisible, setChangeOrgVisible] = useState(false); // 更改机构
const [passwordVisible, setPasswordVisible] = useState(false); // 修改密码
const [editUserVisible, setEditUserVisible] = useState(false); // 编辑用户
const [freezeUserVisible, setFreezeUserVisible] = useState(false); // 冻结用户
const [deleteUserVisible, setDeleteUserVisible] = useState(false); // 删除用户
const [orgTitle, setOrgTitle] = useState('机构');
const [tableTitle, setTableTitle] = useState('0');
const [orgID, setOrgID] = useState();
const [newOrgID, setNewOrgID] = useState();
const [currentUser, setCurrentUser] = useState({});
const [rolelist, setRolelist] = useState([]);
const [stationlist, setStationlist] = useState([]);
const [orgTitle, setOrgTitle] = useState('机构'); // 弹框标题
const [tableTitle, setTableTitle] = useState(0); // 表格标题
const [orgID, setOrgID] = useState(); // 机构ID
const [newOrgID, setNewOrgID] = useState(); // 更改机构新选择的ID
const [currentUser, setCurrentUser] = useState({}); // 当前用户
const [roleValueList, setRoleValueList] = useState({});
const [stationValueList, setStationValueList] = useState({});
const [rolelist, setRolelist] = useState([]); // 角色列表
const [stationlist, setStationlist] = useState([]); // 站点列表
const [roleValueList, setRoleValueList] = useState({}); // 勾选的角色列表
const [stationValueList, setStationValueList] = useState({}); // 勾选的站点列表
const [searchUserForm] = Form.useForm();
const [addUserForm] = Form.useForm();
const [addOrgForm] = Form.useForm();
const [editOrgForm] = Form.useForm();
const [editUserForm] = Form.useForm();
const [passwordForm] = Form.useForm();
/** ***表单相关**** */
const [searchUserForm] = Form.useForm(); // 查找用户
const [addUserForm] = Form.useForm(); // 添加用户
const [addOrgForm] = Form.useForm(); // 添加机构
const [editOrgForm] = Form.useForm(); // 编辑机构
const [editUserForm] = Form.useForm(); // 编辑用户
const [passwordForm] = Form.useForm(); // 修改密码
const { TabPane } = Tabs;
const getRoleValueCallback = useCallback((value, index) => {
......@@ -126,6 +132,8 @@ const UserManage = () => {
dataIndex: 'OUName',
key: 'OUName',
width: 150,
filters: orgFilters,
onFilter: (value, record) => record.OUName === value,
},
{
title: '手机号码',
......@@ -209,6 +217,22 @@ const UserManage = () => {
),
},
];
const [selectionType, setSelectionType] = useState('checkbox');
const rowSelection = {
onChange: (selectedRowKeys, selectedRows) => {
console.log(
`selectedRowKeys: ${selectedRowKeys}`,
'selectedRows: ',
selectedRows,
);
},
getCheckboxProps: record => ({
disabled: record.name === 'Disabled User', // Column configuration not to be checked
name: record.name,
}),
};
// 查找用户的结果表-列
const searchColumns = [
{
title: '所在机构',
......@@ -254,53 +278,25 @@ const UserManage = () => {
const mapTree = org => {
const haveChildren = Array.isArray(org.children) && org.children.length > 0;
return {
title: (
<>
<span>{org.text}</span>
<div className={styles.iconWraper1}>
<Tooltip title="添加用户">
<FileAddTwoTone onClick={e => addUser(e, org.text, org.id)} />
</Tooltip>
<Tooltip title="添加下级机构">
<FolderAddTwoTone onClick={e => addSubOrg(e, org.text, org.id)} />
</Tooltip>
<Tooltip title="编辑当前机构">
<EditTwoTone onClick={e => editOrg(e, org.text, org.id)} />
</Tooltip>
<Tooltip title="删除当前机构">
<DeleteTwoTone onClick={e => deleteOrg(e, org.text, org.id)} />
</Tooltip>
</div>
</>
),
title: org.text,
key: org.id,
// icon: org.leaf ? <FileOutlined /> : <FolderOpenOutlined />,
// 判断它是否存在子集,若果存在就进行再次进行遍历操作,知道不存在子集便对其他的元素进行操作
children: haveChildren ? org.children.map(i => mapTree(i)) : [],
};
};
const mapTree1 = org => {
const haveChildren = Array.isArray(org.children) && org.children.length > 0;
return {
title: `${org.text}`,
key: org.id,
// icon: org.leaf ? <FileOutlined /> : <FolderOpenOutlined />,
// 判断它是否存在子集,若果存在就进行再次进行遍历操作,知道不存在子集便对其他的元素进行操作
children: haveChildren ? org.children.map(i => mapTree1(i)) : [],
};
};
// 重新渲染树
const updateTrees = () => {
setTreeLoading(true);
getUserTree(-1, -1)
.then(res => {
if (res.length > 0) {
setTreeLoading(false);
setTreeData1(res);
// setTreeData1(res);
setTreeData(res);
// 第一次加载,默认选择第一个组织
if (treeState) {
onSelect([res[0].id]);
onSelect([res[0].id], false);
setTreeState(false);
}
} else {
......@@ -323,8 +319,12 @@ const UserManage = () => {
}, []);
// 获取当前机构下所有用户
const onSelect = props => {
const onSelect = (props, e) => {
console.log(e);
setTableLoading(true);
if (e) {
setOrgTitle(e.node.title);
}
if (!props[0]) {
setCurrentSelectOrg(currentSelectOrg);
} else {
......@@ -335,7 +335,13 @@ const UserManage = () => {
.then(res => {
if (res.code === 0) {
setTableLoading(false);
setOrgTitle(res.data.GroupName);
// 返回用户表数据结构处理,扁平化
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 })));
console.log(temp);
setTableTitle(temp.length);
const table = temp.map((item, index) => {
......@@ -347,7 +353,7 @@ const UserManage = () => {
});
setTableData(table);
} else {
setTreeLoading(false);
setTableLoading(false);
notification.error({
message: '获取失败',
description: res.message,
......@@ -359,7 +365,7 @@ const UserManage = () => {
message.error(err);
});
};
// 返回数据结构处理,扁平化
// 返回用户表数据结构处理,扁平化
const getUsers = orgObj => {
let result = orgObj.Users;
result.map(item => {
......@@ -377,59 +383,60 @@ const UserManage = () => {
}
return arr;
};
const getTableTitle = () => `当前机构用户总数( ${tableTitle} )`;
// 左侧目录树相关操作
// 查找用户
const searchUser = () => {
setSearchUserVisible(true);
};
const addUser = (e, title, id) => {
// e.stopPropagation();
// 添加用户
const addUser = () => {
setUserVisible(true);
setOrgTitle(`在${title}下添加用户`);
setOrgID(id);
};
const addSubOrg = (e, title, id) => {
// e.stopPropagation();
// 在根目录下添加机构
const addOrg = (title, id) => {
setAddOrgVisible(true);
setOrgTitle(`在${title}下添加机构`);
setOrgTitle(title);
setOrgID(id);
};
const editOrg = (e, title, id) => {
// e.stopPropagation();
// 添加下级机构
const addSubOrg = () => {
setAddOrgVisible(true);
};
// 编辑机构
const editOrg = () => {
setEditOrgVisible(true);
editOrgForm.setFieldsValue({
OUName: title,
OUName: orgTitle,
});
setOrgID(id);
};
const deleteOrg = (e, title, id) => {
// e.stopPropagation();
// 删除机构
const deleteOrg = () => {
setDeleteOrgVisible(true);
setOrgTitle(`删除组织${title}`);
setOrgID(id);
// 删除后默认选择第一个组织
setTreeState(true);
};
// 在currentUser变化后获取
// 在currentUser变化后获取角色列表
useEffect(() => {
if (currentUser && currentUser.userID) {
getRoleList();
}
}, [currentUser]);
// 右侧表格相关操作
/** ***右侧表格相关操作****** */
// 用户关联
const relateRole = record => {
setRoleVisible(true);
setCurrentUser(record);
};
// 更改机构
const changeOrg = record => {
setChangeOrgVisible(true);
setTreeData2(treeData1);
// setTreeData2(treeData1);
setCurrentUser(record);
setCurrentSelectOldOrg(record.OUID);
};
// 修改密码
const changePassword = record => {
setPasswordVisible(true);
passwordForm.setFieldsValue({
......@@ -437,7 +444,7 @@ const UserManage = () => {
});
setCurrentUser(record);
};
// 编辑用户
const editUser = record => {
// console.log(record);
setEditUserVisible(true);
......@@ -449,12 +456,12 @@ const UserManage = () => {
});
setCurrentUser(record);
};
// 冻结用户
const freezeUser = record => {
setFreezeUserVisible(true);
setCurrentUser(record);
};
// 删除用户
const deleteUser = record => {
setDeleteUserVisible(true);
setCurrentUser(record);
......@@ -479,6 +486,7 @@ const UserManage = () => {
});
};
/** ***表单提交相关操作****** */
// 提交-添加用户
const submitAddUser = () => {
postAddUser({
......@@ -568,7 +576,7 @@ const UserManage = () => {
message.error(err);
});
// 提交删除机构
// 提交-删除机构
const submitDeleteOrg = () =>
postDeleteOrg(orgID)
.then(res => {
......@@ -590,7 +598,7 @@ const UserManage = () => {
setTableLoading(false);
message.error(err);
});
// 根据当前 userID 获取用户关联角色
const getRoleList = () => {
setLoading(true);
getUserRelationList(currentUser.userID)
......@@ -613,6 +621,7 @@ const UserManage = () => {
message.error(err);
});
};
// 提交-关联角色
const submitRole = () => {
setUserRelation(
currentUser.userID,
......@@ -642,6 +651,7 @@ const UserManage = () => {
message.error(err);
});
};
// 提交-更改机构
const submitChangeOrg = () =>
addToOrg(currentUser.userID, currentUser.OUID, newOrgID)
.then(res => {
......@@ -662,6 +672,7 @@ const UserManage = () => {
.catch(err => {
message.error(err);
});
// 提交-修改密码
const submitChangePassword = () =>
updateUserPassword(
currentUser.userID,
......@@ -769,32 +780,14 @@ const UserManage = () => {
<PageContainer className={styles.userManageContainer}>
<div className={styles.contentContainer}>
<Spin spinning={treeLoading} tip="loading...">
<div className={styles.orgContainer}>
<span style={{ padding: '8px', fontSize: '16px' }}>
机构列表
<Tooltip title="查找用户">
<SearchOutlined
style={{
fontSize: '18px',
float: 'right',
margin: '4px 4px 0px 12px',
color: '#1890FF',
}}
onClick={searchUser}
/>
</Tooltip>
<Tooltip title="添加下级机构">
<FolderAddTwoTone
style={{
fontSize: '18px',
float: 'right',
marginTop: '4px',
}}
onClick={e => addSubOrg(e, '根目录', '-1')}
<div className={treeVisible ? styles.orgContainer : styles.hide}>
<span style={{ margin: '10px' }}>机构列表</span>
<Tooltip title="添加机构">
<UsergroupAddOutlined
onClick={() => addOrg('根目录', '-1')}
style={{ float: 'right', color: '#1890FF', fontSize: '18px' }}
/>
</Tooltip>
</span>
{treeData.length > 0 && (
<Tree
// showLine="true"
......@@ -808,14 +801,56 @@ const UserManage = () => {
)}
</div>
</Spin>
<div style={{ color: '#1890FF', marginTop: '35vh', fontSize: '18px' }}>
{treeVisible && (
<Tooltip title="隐藏目录">
<DoubleLeftOutlined
onClick={() => setTreeVisible(false)}
// style={{ background: 'white' }}
/>
</Tooltip>
)}
{!treeVisible && (
<Tooltip title="显示目录">
<DoubleRightOutlined onClick={() => setTreeVisible(true)} />
</Tooltip>
)}
</div>
<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>
<Button type="primary" onClick={addUser}>
添加用户
</Button>
<Button type="primary" onClick={addSubOrg}>
添加机构
</Button>
<Button type="primary" onClick={editOrg}>
编辑机构
</Button>
<Button type="primary" onClick={deleteOrg}>
删除机构
</Button>
</span>
</div>
<Table
title={getTableTitle}
rowSelection={{
type: selectionType,
...rowSelection,
}}
locale={{ filterConfirm: '确定', filterReset: '重置' }}
bordered
columns={columns}
dataSource={tableData}
loading={tableLoading}
scroll={{ scrollToFirstRowOnChange: 'true', x: 'max-content' }}
scroll={{ x: 'max-content' }}
/>
</div>
{/* 查找用户 */}
......@@ -859,7 +894,7 @@ const UserManage = () => {
</Modal>
{/* 添加用户 */}
<Modal
title={orgTitle}
title={`在${orgTitle}下添加用户`}
visible={userVisible}
onOk={submitAddUser}
onCancel={() => setUserVisible(false)}
......@@ -898,7 +933,7 @@ const UserManage = () => {
</Modal>
{/* 添加下级机构 */}
<Modal
title={orgTitle}
title={`在${orgTitle}下添加机构`}
visible={addOrgVisible}
onOk={submitAddOrg}
onCancel={() => setAddOrgVisible(false)}
......@@ -920,7 +955,7 @@ const UserManage = () => {
</Modal>
{/* 编辑机构 */}
<Modal
title={orgTitle}
title={`编辑${orgTitle}`}
visible={editOrgVisible}
onOk={submitEditOrg}
onCancel={() => setEditOrgVisible(false)}
......@@ -950,6 +985,7 @@ const UserManage = () => {
>
<p>即将删除该机构,是否确认删除?</p>
</Modal>
{/* 用户关联 */}
<Modal
title="用户关联"
visible={roleVisible}
......@@ -988,6 +1024,7 @@ const UserManage = () => {
</Tabs>
</Spin>
</Modal>
{/* 更改机构 */}
<Modal
title="更改机构"
visible={changeOrgVisible}
......@@ -998,16 +1035,16 @@ const UserManage = () => {
width="330px"
>
<span>请选择要更改的目标机构:</span>
{changeOrgVisible && treeData2.length > 0 && (
{changeOrgVisible && treeData.length > 0 && (
<Tree
showIcon="true"
showLine={{ showLeafIcon: false }}
defaultExpandAll="true"
defaultSelectedKeys={[currentSelectOrg]}
defaultSelectedKeys={[currentSelectOldOrg]}
onSelect={props => {
setNewOrgID(props[0]);
}}
treeData={treeData2.map(t => mapTree1(t))}
treeData={treeData.map(t => mapTree(t))}
/>
)}
</Modal>
......@@ -1072,6 +1109,7 @@ const UserManage = () => {
</Form.Item>
</Form>
</Modal>
{/* 冻结用户 */}
<Modal
title="请确认"
visible={freezeUserVisible}
......@@ -1087,6 +1125,7 @@ const UserManage = () => {
{+currentUser.state ? '激活' : '冻结'}
</p>
</Modal>
{/* 删除用户 */}
<Modal
title="确认删除用户"
visible={deleteUserVisible}
......
......@@ -18,14 +18,6 @@
}
}
}
.freeze{
color:gray;
}
.freezeGray{
color:#1890FF;
}
.ant-tree-treenode:hover{
.iconWraper1>span{
margin-left: 12px;
......@@ -34,14 +26,13 @@
}
}
.contentContainer{
min-height: calc(100vh - 194px);
min-height: calc(100vh - 48px);
display: flex;
.orgContainer{
width: 20%;
height: calc(100vh - 194px);
min-height: calc(100vh - 48px);
float: left;
padding: 10px;
min-width: 300px;
min-width: 240px;
background: white;
.ant-tree{
padding-top: 6px;
......@@ -51,15 +42,33 @@
}
}
}
.hide{
display: none;
// width:0;
transition: 1s;
}
.userContainer{
padding: 12px;
margin-left: 12px;
margin-left: 10px;
flex: 1;
height: calc(100vh - 194px);
height: calc(100vh - 48px);
background: white;
.ant-table-pagination-right{
padding-right: 12px;
}
.ant-btn-primary{
margin-left: 30px;
background: #50aefc;
}
.ant-table-thead tr th{
font-weight: 600;
color:rgba(0,0,0,0.85);
}
.ant-table-cell{
text-align:center;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
}
}
}
}
......
import React, { useState, useEffect } from 'react';
import { Row, Col, Tree, Card, Input, Tooltip, Spin, notification } from 'antd';
import { FileAddTwoTone, EditTwoTone, DeleteTwoTone } from '@ant-design/icons';
import { PageContainer, GridContent } from '@ant-design/pro-layout';
import { GridContent } from '@ant-design/pro-layout';
import PageContainer from '@/components/BasePageContainer';
import {
getWebModuleTree,
chooseUserToStation,
getUserRelationList,
setMenuToRole,
} from '@/services/userCenter/roleManage/api';
......
.cardBox{
min-height: calc(100vh - 200px);
max-height: calc(100vh - 200px);
min-height: calc(100vh - 80px);
max-height: calc(100vh - 80px);
overflow-y: scroll;
}
.ant-tree-node-content-wrapper-open{
......@@ -26,7 +26,7 @@
align-items: center;
}
.cardBoxR{
min-height: calc(100vh - 292px);
max-height: calc(100vh - 292px);
min-height: calc(100vh - 172px);
max-height: calc(100vh - 172px);
overflow-y: scroll;
}
\ No newline at end of file
......@@ -12,7 +12,8 @@ import {
Space,
} from 'antd';
import { FileAddTwoTone, EditTwoTone, DeleteTwoTone } from '@ant-design/icons';
import { PageContainer, GridContent } from '@ant-design/pro-layout';
import { GridContent } from '@ant-design/pro-layout';
import PageContainer from '@/components/BasePageContainer';
import {
getWebModuleTree,
chooseUserToStation,
......
.cardBox{
height: calc(100vh - 200px);
height: calc(100vh - 80px);
overflow: auto;
}
.cardBoxR{
min-height: calc(100vh - 292px);
min-height: calc(100vh - 172px);
}
.ant-tree-node-content-wrapper-open{
display: flex;
......@@ -29,6 +29,7 @@
}
.listItem{
padding-left: 5px;
cursor: pointer;
}
.selected{
background-color: #bae7ff;
......
......@@ -17,12 +17,43 @@ import { get, post } from '@/services/index';
export const connectionTest = params =>
get('/DBManager/ConnectionTest', params);
// 获取数据库配置信息
export const getDataBaseConfig = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetDataBaseConfig', params);
// 获取数据库连接记录
export const getConnRecord = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetConnRecord', params);
// 测试连接
export const getConnectionTest = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetConnectionTest', params);
// 保存数据库连接
export const saveConnection = params =>
get('/Cityinterface/rest/services/OMS.svc/S_SaveConnection', params);
// 获取数据库列表
export const getDataBaseList = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetDataBaseList', params);
// 数据库初始化
export const initDBv4 = params =>
get('/Cityinterface/rest/services/OMS.svc/S_InitDBv4', params);
// 更新描述
export const updateConnDesc = params =>
get('/Cityinterface/rest/services/OMS.svc/S_UpdateConnDesc', params);
// 获取日志
export const getInitDBLog = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetInitDBLog', params);
// 删除初始化日志
export const deleteInitDBLog = params =>
get('/Cityinterface/rest/services/OMS.svc/S_DeleteInitDBLog', params);
// 修改产品解决方案
export const setTableSQLDirName = params =>
get('/Cityinterface/rest/services/OMS.svc/S_SetTableSQLDirName', params);
......@@ -31,13 +62,31 @@ export const setTableSQLDirName = params =>
export const deleteConn = params =>
get('/Cityinterface/rest/services/OMS.svc/S_DeleteConn', params);
/**
*
* @解决方案管理
*/
// 切换解决方案配置
export const getSolutionList = params =>
get('/Cityinterface/rest/services/OMS.svc/W4_GetSolutionList', params);
// 切换解决方案
export const changeSolution = params =>
get('/Cityinterface/rest/services/OMS.svc/W4_ChangeSolution', params);
// 更新站点人员
/**
*
* @数据库标准化管理
*/
// 检查数据库表
export const tableCheck = params =>
get(`/Cityinterface/rest/services/OMS.svc/TableCheck`, params);
// 获取数据库升级记录
export const databaseStandardGetLog = params =>
get('/Cityinterface/rest/services/OMS.svc/DatabaseStandard_GetLog', params);
// 更新
export const updateDateBase = params =>
get(
'/Cityinterface/rest/services/OMS.svc/DatabaseStandard_UpdateDateBase',
......
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