Skip to content

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

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

parents 7b5cda46 dc9158f4
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1801 additions and 34 deletions
src/pages/appConfig/AppMenu.js
View file @ 6e8b3970
This diff is collapsed.
src/pages/appConfig/AppMenu.less 0 → 100644
View file @ 6e8b3970
.contentContainer{
// min-height: calc(100vh - 194px);
display: flex;
.menuContainer{
min-width: 300px;
.ant-tree-list{
padding: 10px;
border:1px solid #abaeb1;
height:calc(100vh - 300px);
.ant-tree-switcher{
line-height: 1;
color:#1890FF;
}
}
}
.previewContainer{
margin-left: 12px;
flex: 1;
float: left;
// background: white;
.ant-table-pagination-right{
padding-right: 12px;
}
}
.ant-tree-treenode{
width: 100% !important;
.ant-tree-node-content-wrapper{
display: inline-block;
width: 100%;
}
.iconWraper1{
float: right;
span{
display: none;
}
}
}
.ant-tree-treenode:hover{
.iconWraper1>span{
margin-left: 12px;
font-size: 18px;
display: inline-block;
}
}
}
.redText{
color: red;
cursor: pointer;
}
// .ant-modal-root{
// .ant-tree-switcher{
// line-height: 1;
// color:#1890FF;
// }
// }
// .menuContainer{
// width: 300px;
// padding: 10px;
// background: #1890FF;
// }
\ No newline at end of file
src/pages/appConfig/index.js
View file @ 6e8b3970
import React from 'react';
import { Tabs } from 'antd';
import { Tabs, Card } from 'antd';
import { PageContainer } from '@ant-design/pro-layout';
import SevenParams from './SevenParams';
// import AppMenu from './AppMenu';
import AppMenu from './AppMenu';
const AppConfigPage = () => {
const { TabPane } = Tabs;
return (
<PageContainer>
<Tabs defaultActiveKey="1">
<TabPane tab="七参数" key="1">
<SevenParams />
</TabPane>
<TabPane tab="菜单管理" key="2">
{/* <AppMenu /> */}
123
</TabPane>
</Tabs>
<Card>
<Tabs defaultActiveKey="1" type="card">
<TabPane tab="应用配置" key="1">
<SevenParams />
</TabPane>
<TabPane tab="菜单管理" key="2" type="card">
<AppMenu />
</TabPane>
</Tabs>
</Card>
</PageContainer>
);
};
......
src/pages/database/CurrentSolution.less
View file @ 6e8b3970
......@@ -6,7 +6,7 @@
min-height: 200px;
}
.btnBox{
margin-top: 70px;
margin-top: 40px;
display: flex;
justify-content: center;
}
......
src/pages/database/InitDataBase.jsx
View file @ 6e8b3970
......@@ -177,11 +177,6 @@ const InitDataBase = props => {
.catch(err => {
setCardLoading(false);
console.log(err);
notification.error({
message: '提示',
duration: 3,
description: err || '保存失败',
});
});
};
// 测试连接
......
src/pages/database/databaseConfig/DatabaseConfig.jsx 0 → 100644
View file @ 6e8b3970
import React, { useState } from 'react';
import { Card, Tabs } from 'antd';
import { PageContainer } from '@ant-design/pro-layout';
import SQLServerTable from './sqlServer/SQLServerTable';
import OracleTable from './oracle/OracleTable';
import MongDBTable from './mongDB/MongDBTable';
import MySQLTable from './mysqltable/MySQLTable';
const { TabPane } = Tabs;
const dataArr = [
{
title: 'SQLServer数据库连接',
key: '0',
component: <SQLServerTable />,
},
{
title: 'Oracle数据库连接',
key: '1',
component: <OracleTable />,
},
{
title: 'MongoDB数据库连接',
key: '2',
component: <MongDBTable />,
},
{
title: 'MySQL数据库连接',
key: '3',
component: <MySQLTable />,
},
];
const DatabaseConnectConfig = props => {
const [flag, setFlag] = useState(false);
const [active, setActive] = useState('3');
const handleChange = e => {
console.log(e);
setActive(e);
};
return (
<PageContainer>
<Card>
<Tabs activeKey={active} onChange={e => handleChange(e)}>
{dataArr.map(item => (
<TabPane tab={item.title} key={item.key}>
{active === item.key && item.component}
</TabPane>
))}
</Tabs>
</Card>
</PageContainer>
);
};
export default DatabaseConnectConfig;
src/pages/database/databaseConfig/mongDB/AddModal.jsx 0 → 100644
View file @ 6e8b3970
import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, notification } from 'antd';
import {
addMongoDBConnString,
editMongoDBConnString,
} from '@/services/database/api';
const { Item } = Form;
const { Option } = Select;
const AddModal = props => {
const { callBackSubmit = () => {}, type, formObj, visible } = props;
const [loading, setLoading] = useState(false);
const [showReplicaSet, setShowReplicaSet] = useState(false);
const [form] = Form.useForm();
// 提交
const onSubmit = () => {
form.validateFields().then(validate => {
if (validate) {
setLoading(true);
let obj = form.getFieldsValue();
if (type === 'add') {
addMongoDBConnString({
_version: 9999,
_dc: Date.now(),
...obj,
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
callBackSubmit();
notification.success({
message: '提示',
duration: 3,
description: res.message || '新增成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '新增失败',
});
}
})
.catch(err => {
setLoading(false);
console.error(err);
});
} else if (type === 'edit') {
handleEdit();
}
}
});
};
const handleEdit = () => {
let obj = form.getFieldsValue();
editMongoDBConnString({
_version: 9999,
_dc: Date.now(),
...obj,
oldName: formObj.name,
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
callBackSubmit();
notification.success({
message: '提示',
duration: 3,
description: res.message || '编辑成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '编辑失败',
});
}
})
.catch(err => setLoading(false));
};
const onFinish = value => {};
const handleSelect = e => {
console.log(e);
e === '复制集' ? setShowReplicaSet(true) : setShowReplicaSet(false);
console.log(form.getFieldsValue());
};
useEffect(() => {
console.log(type);
switch (type) {
case 'add':
form.resetFields();
break;
case 'edit':
formObj.type === '复制集'
? setShowReplicaSet(true)
: setShowReplicaSet(false);
form.setFieldsValue({ ...formObj });
break;
default:
break;
}
return () => {
form.getFieldsValue().type === '复制集'
? setShowReplicaSet(true)
: setShowReplicaSet(false);
};
}, [visible]);
useEffect(() => {
console.log(form.getFieldsValue(), '103');
}, [type === 'edit']);
const layout = {
layout: 'horizontal',
labelCol: {
span: 4,
},
wrapperCol: {
span: 16,
},
};
const selectArr = [
{
key: '0',
title: '单实例',
value: '单实例',
},
{
key: '1',
title: '复制集',
value: '复制集',
},
{
key: '2',
title: '分片群',
value: '分片群',
},
];
return (
<Modal
title={`${type === 'add' ? '添加' : '编辑'}MongDB数据库配置连接`}
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '150px' }}
width="700px"
destroyOnClose
maskClosable={false}
cancelText="取消"
okText="确认"
{...props}
onOk={() => onSubmit()}
confirmLoading={loading}
>
{visible && (
<Form form={form} {...layout} onFinish={onFinish}>
<Item
label="实例类型"
name="type"
rules={[{ required: true, message: '请选择实例类型' }]}
>
<Select onChange={e => handleSelect(e)}>
{selectArr &&
selectArr.map(item => (
<Option key={item.key} value={item.value}>
{item.title}
</Option>
))}
</Select>
</Item>
<Item
label="标签"
name="name"
rules={[{ required: true, message: '请输入标签' }]}
>
<Input placeholder="请输入标签" allowClear />
</Item>
<Item
label="IP"
name="ip"
rules={[{ required: true, message: '请输入IP' }]}
>
<Input placeholder="请输入IP" allowClear />
</Item>
<Item
label="端口"
name="port"
rules={[{ required: true, message: '请输入端口号' }]}
>
<Input placeholder="请输入端口号" allowClear />
</Item>
<Item
label="数据库名"
name="dbName"
rules={[{ required: true, message: '请输入数据库名' }]}
>
<Input placeholder="请输入数据库名" allowClear />
</Item>
{showReplicaSet && (
<Item
label="复制集名称"
name="replicaSet"
rules={[{ required: true, message: '请输入复制集名称' }]}
>
<Input placeholder="请输入数据库名" allowClear />
</Item>
)}
{/* <Item
label="用户名"
name="userName"
rules={[{ required: true, message: '请输入用户名' }]}
>
<Input placeholder="请输入用户名" allowClear />
</Item>
<Item
label="密码"
name="password"
rules={[{ required: true, message: '请输入密码' }]}
>
<Input placeholder="请输入密码" allowClear />
</Item> */}
</Form>
)}
</Modal>
);
};
export default AddModal;
src/pages/database/databaseConfig/mongDB/MongDBTable.jsx 0 → 100644
View file @ 6e8b3970
import React, { useEffect, useState } from 'react';
import ProTable from '@ant-design/pro-table';
import { Button, Tag, Popconfirm, notification } from 'antd';
import {
getMongoDBConnString,
deleteConnString,
getMongoDBConnectionTest,
} from '@/services/database/api';
import AddModal from './AddModal';
const MongDBTable = props => {
const [flag, setFlag] = useState(1);
const [dataList, setDataList] = useState([]); // table数据
const [visible, setVisible] = useState(false); // 弹窗
const [tableLoading, setTableLoading] = useState(false); // tableLoading
const [type, setType] = useState('add'); // 弹窗类型
const [formObj, setFormObj] = useState({});
useEffect(() => {
setTableLoading(true);
getMongoDBConnString({
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setTableLoading(false);
if (res) {
setDataList(res);
}
})
.catch(err => {
setTableLoading(false);
});
}, [flag]);
// 新增
const handleAdd = (val, item) => {
setType('add');
setVisible(true);
};
// 测试连接
const handleCon = (val, item) => {
setTableLoading(true);
getMongoDBConnectionTest({
name: item.name,
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setTableLoading(false);
if (res.success) {
notification.success({
message: '通知',
description: res.message || '连接成功',
duration: 3,
});
} else {
notification.error({
message: '通知',
description: res.message || '连接失败',
duration: 3,
});
}
})
.catch(err => {
setTableLoading(false);
console.error(err);
});
};
// 删除
const handleDel = (val, item) => {
const { name = '' } = item;
deleteConnString({
name,
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setFlag(flag + 1);
if (res.success) {
notification.success({
message: '提示',
duration: 3,
description: res.message || '删除成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '删除失败',
});
}
})
.catch(err => console.error(err));
};
// 编辑
const handleEdit = (val, item) => {
setType('edit');
setFormObj(item);
setVisible(true);
};
const onSubmit = prop => {
console.log(prop);
setVisible(false);
setFlag(flag + 1);
};
const columns = [
{
title: '标签',
dataIndex: 'name',
key: 'name',
},
{
title: 'ip',
dataIndex: 'ip',
key: 'ip',
},
{
title: '端口',
dataIndex: 'port',
key: 'port',
},
{
title: '数据库名',
dataIndex: 'dbName',
key: 'dbName',
},
{
title: '类型',
dataIndex: 'type',
key: 'type',
},
{
title: '复制集',
dataIndex: 'replicaSet',
key: 'replicaSet',
},
// {
// title: '用户名',
// dataIndex: 'userName',
// key: 'userName',
// },
// {
// title: '密码',
// dataIndex: 'password',
// key: 'password',
// },
{
title: '操作',
dataIndex: 'options',
key: 'options',
width: 300,
render: (val, item) => [
<Tag color="#2db7f5" onClick={() => handleCon(val, item)}>
测试连接
</Tag>,
<Tag color="gold" onClick={() => handleEdit(val, item)}>
编辑
</Tag>,
<Popconfirm
title={`是否删除连接${item.name}`}
cancelText="取消"
okText="确认"
// placement="right"
onConfirm={() => handleDel(val, item)}
>
<Tag color="#f50">删除</Tag>
</Popconfirm>,
],
},
];
return (
<>
<ProTable
headerTitle="MongDB数据库"
rowKey="key"
search={false}
columns={columns}
bordered
loading={tableLoading}
dataSource={dataList}
options={{ reload: false, fullScreen: false }}
toolBarRender={() => [
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加MongDB数据库连接
</Button>,
]}
/>
<AddModal
visible={visible}
onCancel={() => setVisible(false)}
callBackSubmit={onSubmit}
type={type}
formObj={formObj}
/>
</>
);
};
export default MongDBTable;
src/pages/database/databaseConfig/mysqltable/AddModal.jsx 0 → 100644
View file @ 6e8b3970
import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, notification } from 'antd';
import {
addMySQLConnString,
editMySQLConnString,
} from '@/services/database/api';
const { Item } = Form;
const { Option } = Select;
const AddModal = props => {
console.log(props);
const { callBackSubmit = () => {}, type, formObj, visible } = props;
const [loading, setLoading] = useState(false);
const [form] = Form.useForm();
// 提交
const onSubmit = () => {
form.validateFields().then(validate => {
if (validate) {
setLoading(true);
let obj = form.getFieldsValue();
if (type === 'add') {
addMySQLConnString({
_version: 9999,
_dc: Date.now(),
...obj,
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
callBackSubmit();
notification.success({
message: '提示',
duration: 3,
description: res.message || '新增成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '新增失败',
});
}
})
.catch(err => {
setLoading(false);
console.error(err);
});
} else if (type === 'edit') {
handleEdit();
}
}
});
};
const handleEdit = () => {
let obj = form.getFieldsValue();
editMySQLConnString({
_version: 9999,
_dc: Date.now(),
...obj,
oldName: formObj.name,
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
callBackSubmit();
notification.success({
message: '提示',
duration: 3,
description: res.message || '编辑成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '编辑失败',
});
}
})
.catch(err => setLoading(false));
};
const onFinish = value => {
console.log(value, 'value');
};
useEffect(() => {
console.log(type);
switch (type) {
case 'add':
form.resetFields();
break;
case 'edit':
form.setFieldsValue({ ...formObj });
break;
default:
break;
}
}, [visible]);
const layout = {
layout: 'horizontal',
labelCol: {
span: 4,
},
wrapperCol: {
span: 16,
},
};
return (
<Modal
title={`${type === 'add' ? '添加' : '编辑'}MySQL数据库配置连接`}
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '150px' }}
width="700px"
destroyOnClose
maskClosable={false}
cancelText="取消"
okText="确认"
{...props}
onOk={() => onSubmit()}
confirmLoading={loading}
>
{visible && (
<Form form={form} {...layout} onFinish={onFinish}>
<Item
label="标签"
name="name"
rules={[{ required: true, message: '请输入标签' }]}
>
<Input placeholder="请输入标签" allowClear />
</Item>
<Item
label="IP"
name="ip"
rules={[{ required: true, message: '请输入IP' }]}
>
<Input placeholder="请输入IP" allowClear />
</Item>
<Item
label="数据库名"
name="dbName"
rules={[{ required: true, message: '请输入数据库名' }]}
>
<Input placeholder="请输入数据库名" allowClear />
</Item>
<Item
label="用户名"
name="userName"
rules={[{ required: true, message: '请输入用户名' }]}
>
<Input placeholder="请输入用户名" allowClear />
</Item>
<Item
label="密码"
name="password"
rules={[{ required: true, message: '请输入密码' }]}
>
<Input placeholder="请输入密码" allowClear />
</Item>
</Form>
)}
</Modal>
);
};
export default AddModal;
src/pages/database/databaseConfig/mysqltable/MySQLTable.jsx 0 → 100644
View file @ 6e8b3970
import React, { useEffect, useState } from 'react';
import ProTable from '@ant-design/pro-table';
import { Button, Tag, Popconfirm, notification } from 'antd';
import {
getMySQLConnString,
getMySQLConnectionTest,
deleteConnString,
} from '@/services/database/api';
import AddModal from './AddModal';
const MySQLTable = props => {
const [flag, setFlag] = useState(1);
const [dataList, setDataList] = useState([]); // table数据
const [visible, setVisible] = useState(false); // 弹窗
const [tableLoading, setTableLoading] = useState(false); // tableLoading
const [type, setType] = useState('add'); // 弹窗类型
const [formObj, setFormObj] = useState({});
useEffect(() => {
setTableLoading(true);
getMySQLConnString({
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setTableLoading(false);
if (res) {
setDataList(res);
}
})
.catch(err => {
setTableLoading(false);
});
}, [flag]);
// 新增
const handleAdd = (val, item) => {
setType('add');
setVisible(true);
};
// 测试连接
const handleCon = (val, item) => {
setTableLoading(true);
getMySQLConnectionTest({
name: item.name,
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setTableLoading(false);
if (res.success) {
notification.success({
message: '通知',
description: res.message || '连接成功',
duration: 3,
});
} else {
notification.error({
message: '通知',
description: res.message || '连接失败',
duration: 3,
});
}
})
.catch(err => {
setTableLoading(false);
console.error(err);
});
};
// 删除
const handleDel = (val, item) => {
const { name = '' } = item;
deleteConnString({
name,
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setFlag(flag + 1);
if (res.success) {
notification.success({
message: '提示',
duration: 3,
description: res.message || '删除成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '删除失败',
});
}
})
.catch(err => console.error(err));
};
// 编辑
const handleEdit = (val, item) => {
setType('edit');
setFormObj(item);
setVisible(true);
};
const onSubmit = prop => {
console.log(prop);
setVisible(false);
setFlag(flag + 1);
};
const columns = [
{
title: '标签',
dataIndex: 'name',
key: 'name',
},
{
title: 'IP',
dataIndex: 'ip',
key: 'ip',
},
{
title: '数据库名',
dataIndex: 'dbName',
key: 'dbName',
},
{
title: '用户名',
dataIndex: 'userName',
key: 'userName',
},
{
title: '密码',
dataIndex: 'password',
key: 'password',
},
{
title: '操作',
dataIndex: 'options',
key: 'options',
width: 300,
render: (val, item) => [
<Tag color="#2db7f5" onClick={() => handleCon(val, item)}>
测试连接
</Tag>,
<Tag color="gold" onClick={() => handleEdit(val, item)}>
编辑
</Tag>,
<Popconfirm
title={`是否删除连接${item.name}`}
cancelText="取消"
okText="确认"
// placement="right"
onConfirm={() => handleDel(val, item)}
>
<Tag color="#f50">删除</Tag>
</Popconfirm>,
],
},
];
return (
<>
<ProTable
headerTitle="MySQL数据库"
rowKey="key"
search={false}
columns={columns}
bordered
loading={tableLoading}
dataSource={dataList}
options={{ reload: false, fullScreen: false }}
toolBarRender={() => [
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加MySQL连接
</Button>,
]}
/>
<AddModal
visible={visible}
onCancel={() => setVisible(false)}
callBackSubmit={onSubmit}
type={type}
formObj={formObj}
/>
</>
);
};
export default MySQLTable;
src/pages/database/databaseConfig/oracle/AddModal.jsx 0 → 100644
View file @ 6e8b3970
import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, notification } from 'antd';
import {
addOracleConnString,
editOracleConnString,
} from '@/services/database/api';
const { Item } = Form;
const { Option } = Select;
const AddModal = props => {
const { callBackSubmit = () => {}, type, formObj, visible } = props;
const [loading, setLoading] = useState(false);
const [form] = Form.useForm();
// 提交
const onSubmit = () => {
form.validateFields().then(validate => {
if (validate) {
setLoading(true);
let obj = form.getFieldsValue();
if (type === 'add') {
addOracleConnString({
_version: 9999,
_dc: Date.now(),
...obj,
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
callBackSubmit();
notification.success({
message: '提示',
duration: 3,
description: res.message || '新增成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '新增失败',
});
}
})
.catch(err => {
setLoading(false);
console.error(err);
});
} else if (type === 'edit') {
handleEdit();
}
}
});
};
const handleEdit = () => {
let obj = form.getFieldsValue();
editOracleConnString({
_version: 9999,
_dc: Date.now(),
...obj,
oldName: formObj.name,
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
callBackSubmit();
notification.success({
message: '提示',
duration: 3,
description: res.message || '编辑成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '编辑失败',
});
}
})
.catch(err => setLoading(false));
};
const onFinish = value => {
console.log(value, 'value');
};
useEffect(() => {
console.log(type);
switch (type) {
case 'add':
form.resetFields();
break;
case 'edit':
form.setFieldsValue({ ...formObj });
break;
default:
break;
}
}, [visible]);
const layout = {
layout: 'horizontal',
labelCol: {
span: 4,
},
wrapperCol: {
span: 16,
},
};
return (
<Modal
title={`${type === 'add' ? '添加' : '编辑'}Oracle数据库配置连接`}
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '150px' }}
width="700px"
destroyOnClose
maskClosable={false}
cancelText="取消"
okText="确认"
{...props}
onOk={() => onSubmit()}
confirmLoading={loading}
>
{visible && (
<Form form={form} {...layout} onFinish={onFinish}>
<Item
label="标签"
name="name"
rules={[{ required: true, message: '请输入标签' }]}
>
{/* <Select>
<Option value={item.value}>{item.title}</Option>
</Select> */}
<Input placeholder="请输入标签" allowClear />
</Item>
<Item
label="网络服务名"
name="dbName"
rules={[{ required: true, message: '请输入网络服务名' }]}
>
<Input placeholder="请输入网络服务名" allowClear />
</Item>
<Item
label="用户名"
name="userName"
rules={[{ required: true, message: '请输入用户名' }]}
>
<Input placeholder="请输入用户名" allowClear />
</Item>
<Item
label="密码"
name="password"
rules={[{ required: true, message: '请输入密码' }]}
>
<Input placeholder="请输入密码" allowClear />
</Item>
</Form>
)}
</Modal>
);
};
export default AddModal;
src/pages/database/databaseConfig/oracle/OracleTable.jsx 0 → 100644
View file @ 6e8b3970
import React, { useEffect, useState } from 'react';
import ProTable from '@ant-design/pro-table';
import { Button, Tag, Popconfirm, notification } from 'antd';
import {
getOracleConnString,
getOracleConnectionTest,
deleteConnString,
} from '@/services/database/api';
import AddModal from './AddModal';
const OracleTable = props => {
const [flag, setFlag] = useState(1);
const [dataList, setDataList] = useState([]); // table数据
const [visible, setVisible] = useState(false); // 弹窗
const [tableLoading, setTableLoading] = useState(false); // tableLoading
const [type, setType] = useState('add'); // 弹窗类型
const [formObj, setFormObj] = useState({});
useEffect(() => {
setTableLoading(true);
getOracleConnString({
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setTableLoading(false);
if (res) {
setDataList(res);
}
})
.catch(err => {
setTableLoading(false);
});
}, [flag]);
// 新增
const handleAdd = (val, item) => {
setType('add');
setVisible(true);
};
// 测试连接
const handleCon = (val, item) => {
setTableLoading(true);
getOracleConnectionTest({
name: item.name,
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setTableLoading(false);
if (res.success) {
notification.success({
message: '通知',
description: res.message || '连接成功',
duration: 3,
});
} else {
notification.error({
message: '通知',
description: res.message || '连接失败',
duration: 3,
});
}
})
.catch(err => {
setTableLoading(false);
console.error(err);
});
};
// 删除
const handleDel = (val, item) => {
const { name = '' } = item;
deleteConnString({
name,
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setFlag(flag + 1);
if (res.success) {
notification.success({
message: '提示',
duration: 3,
description: res.message || '删除成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '删除失败',
});
}
})
.catch(err => console.error(err));
};
// 编辑
const handleEdit = (val, item) => {
setType('edit');
setFormObj(item);
setVisible(true);
};
const onSubmit = prop => {
console.log(prop);
setVisible(false);
setFlag(flag + 1);
};
const columns = [
{
title: '标签',
dataIndex: 'name',
key: 'name',
},
{
title: '网络服务名/(ip:port/实例名)',
dataIndex: 'dbName',
key: 'dbName',
},
{
title: '用户名',
dataIndex: 'userName',
key: 'userName',
},
{
title: '密码',
dataIndex: 'password',
key: 'password',
},
{
title: '操作',
dataIndex: 'options',
key: 'options',
width: 300,
render: (val, item) => [
<Tag color="#2db7f5" onClick={() => handleCon(val, item)}>
测试连接
</Tag>,
<Tag color="gold" onClick={() => handleEdit(val, item)}>
编辑
</Tag>,
<Popconfirm
title={`是否删除连接${item.name}`}
cancelText="取消"
okText="确认"
// placement="right"
onConfirm={() => handleDel(val, item)}
>
<Tag color="#f50">删除</Tag>
</Popconfirm>,
],
},
];
return (
<>
<ProTable
headerTitle="Oracle数据库"
rowKey="key"
search={false}
columns={columns}
bordered
loading={tableLoading}
dataSource={dataList}
options={{ reload: false, fullScreen: false }}
toolBarRender={() => [
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加Oracle连接
</Button>,
]}
/>
<AddModal
visible={visible}
onCancel={() => setVisible(false)}
callBackSubmit={onSubmit}
type={type}
formObj={formObj}
/>
</>
);
};
export default OracleTable;
src/pages/database/databaseConfig/sqlServer/AddModal.jsx 0 → 100644
View file @ 6e8b3970
import React, { useState, useEffect } from 'react';
import { Form, Modal, Input, Select, notification } from 'antd';
import {
addSQLServerConnString,
editSQLServerConnString,
} from '@/services/database/api';
const { Item } = Form;
const { Option } = Select;
const AddModal = props => {
console.log(props);
const { callBackSubmit = () => {}, type, formObj, visible } = props;
const [loading, setLoading] = useState(false);
const [form] = Form.useForm();
// 提交
const onSubmit = () => {
form.validateFields().then(validate => {
if (validate) {
setLoading(true);
let obj = form.getFieldsValue();
if (type === 'add') {
addSQLServerConnString({
_version: 9999,
_dc: Date.now(),
...obj,
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
callBackSubmit();
notification.success({
message: '提示',
duration: 3,
description: res.message || '新增成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '新增失败',
});
}
})
.catch(err => {
setLoading(false);
console.error(err);
});
} else if (type === 'edit') {
handleEdit();
}
}
});
};
const handleEdit = () => {
let obj = form.getFieldsValue();
editSQLServerConnString({
_version: 9999,
_dc: Date.now(),
...obj,
oldName: formObj.name,
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
callBackSubmit();
notification.success({
message: '提示',
duration: 3,
description: res.message || '编辑成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '编辑失败',
});
}
})
.catch(err => setLoading(false));
};
const onFinish = value => {
console.log(value, 'value');
};
useEffect(() => {
console.log(type);
switch (type) {
case 'add':
form.resetFields();
break;
case 'edit':
form.setFieldsValue({ ...formObj });
break;
default:
break;
}
}, [visible]);
const layout = {
layout: 'horizontal',
labelCol: {
span: 4,
},
wrapperCol: {
span: 16,
},
};
return (
<Modal
title={`${type === 'add' ? '添加' : '编辑'}SQL数据库配置连接`}
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: '150px' }}
width="700px"
destroyOnClose
maskClosable={false}
cancelText="取消"
okText="确认"
{...props}
onOk={() => onSubmit()}
confirmLoading={loading}
>
{visible && (
<Form form={form} {...layout} onFinish={onFinish}>
<Item
label="标签"
name="name"
rules={[{ required: true, message: '请输入标签' }]}
>
{/* <Select>
<Option value={item.value}>{item.title}</Option>
</Select> */}
<Input placeholder="请输入标签" allowClear />
</Item>
<Item
label="IP"
name="ip"
rules={[{ required: true, message: '请输入IP' }]}
>
<Input placeholder="请输入IP" allowClear />
</Item>
<Item
label="数据库名"
name="dbName"
rules={[{ required: true, message: '请输入数据库名' }]}
>
<Input placeholder="请输入数据库名" allowClear />
</Item>
<Item
label="用户名"
name="userName"
rules={[{ required: true, message: '请输入用户名' }]}
>
<Input placeholder="请输入用户名" allowClear />
</Item>
<Item
label="密码"
name="password"
rules={[{ required: true, message: '请输入密码' }]}
>
<Input placeholder="请输入密码" allowClear />
</Item>
</Form>
)}
</Modal>
);
};
export default AddModal;
src/pages/database/databaseConfig/sqlServer/SQLServerTable.jsx 0 → 100644
View file @ 6e8b3970
import React, { useEffect, useState } from 'react';
import ProTable from '@ant-design/pro-table';
import { Button, Tag, Popconfirm, notification } from 'antd';
import {
getSQLServerConnString,
deleteConnString,
getSQLServerConnectionTest,
} from '@/services/database/api';
import AddModal from './AddModal';
const SQLServerTable = props => {
const [flag, setFlag] = useState(1);
const [dataList, setDataList] = useState([]); // table数据
const [visible, setVisible] = useState(false); // 弹窗
const [tableLoading, setTableLoading] = useState(false); // tableLoading
const [type, setType] = useState('add'); // 弹窗类型
const [formObj, setFormObj] = useState({});
useEffect(() => {
setTableLoading(true);
getSQLServerConnString({
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setTableLoading(false);
if (res) {
setDataList(res);
}
})
.catch(err => {
setTableLoading(false);
});
}, [flag]);
// 新增
const handleAdd = (val, item) => {
setType('add');
setVisible(true);
};
// 测试连接
const handleCon = (val, item) => {
setTableLoading(true);
getSQLServerConnectionTest({
name: item.name,
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setTableLoading(false);
if (res.success) {
notification.success({
message: '通知',
description: '连接成功',
duration: 3,
});
} else {
notification.error({
message: '通知',
description: res.message || '连接失败',
duration: 3,
});
}
})
.catch(err => {
setTableLoading(false);
console.error(err);
});
};
// 删除
const handleDel = (val, item) => {
const { name = '' } = item;
deleteConnString({
name,
_version: 9999,
_dc: Date.now(),
})
.then(res => {
setFlag(flag + 1);
if (res.success) {
notification.success({
message: '提示',
duration: 3,
description: res.message || '删除成功',
});
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message || '删除失败',
});
}
})
.catch(err => console.error(err));
};
// 编辑
const handleEdit = (val, item) => {
setType('edit');
setFormObj(item);
setVisible(true);
};
const onSubmit = prop => {
console.log(prop);
setVisible(false);
setFlag(flag + 1);
};
const columns = [
{
title: '标签',
dataIndex: 'name',
key: 'name',
},
{
title: 'ip',
dataIndex: 'ip',
key: 'ip',
},
{
title: '数据库名',
dataIndex: 'dbName',
key: 'dbName',
},
{
title: '用户名',
dataIndex: 'userName',
key: 'userName',
},
{
title: '密码',
dataIndex: 'password',
key: 'password',
},
{
title: '操作',
dataIndex: 'options',
key: 'options',
width: 300,
render: (val, item) => [
<Tag color="#2db7f5" onClick={() => handleCon(val, item)}>
测试连接
</Tag>,
<Tag color="gold" onClick={() => handleEdit(val, item)}>
编辑
</Tag>,
<Popconfirm
title={`是否删除连接${item.name}`}
cancelText="取消"
okText="确认"
// placement="right"
onConfirm={() => handleDel(val, item)}
>
<Tag color="#f50">删除</Tag>
</Popconfirm>,
],
},
];
return (
<>
<ProTable
headerTitle="SQL数据库"
rowKey="key"
search={false}
columns={columns}
bordered
loading={tableLoading}
dataSource={dataList}
options={{ reload: false, fullScreen: false }}
toolBarRender={() => [
<Button
type="primary"
onClick={() => {
handleAdd();
}}
>
添加SQL数据库连接
</Button>,
]}
/>
<AddModal
visible={visible}
onCancel={() => setVisible(false)}
callBackSubmit={onSubmit}
type={type}
formObj={formObj}
/>
</>
);
};
export default SQLServerTable;
src/pages/mobileConfig/SiteConfig.jsx
View file @ 6e8b3970
......@@ -38,7 +38,7 @@ const SiteConfig = props => {
getWebsite({
_version: 9999,
_dc: Date.now(),
title: '新运维测试小程序222',
title: '熊猫掌天下小程序',
}).then(res => {
let obj = { ...form.getFieldsValue() };
let arr = Object.keys({ ...form.getFieldsValue() });
......
src/pages/userCenter/UserManage.js
View file @ 6e8b3970
......@@ -76,6 +76,7 @@ const UserManage = () => {
const [deleteUserVisible, setDeleteUserVisible] = useState(false);
const [orgTitle, setOrgTitle] = useState('机构');
const [tableTitle, setTableTitle] = useState('机构');
const [orgID, setOrgID] = useState();
const [newOrgID, setNewOrgID] = useState();
const [currentUser, setCurrentUser] = useState({});
......@@ -118,6 +119,12 @@ const UserManage = () => {
key: 'userName',
width: 100,
},
{
title: '所在机构',
dataIndex: 'OUName',
key: 'OUName',
width: 150,
},
{
title: '手机号码',
dataIndex: 'phone',
......@@ -141,7 +148,7 @@ const UserManage = () => {
title: '操作',
key: 'action',
fixed: 'right',
width: 300,
width: 250,
align: 'center',
render: (text, record) => (
<Space size="middle">
......@@ -169,12 +176,27 @@ const UserManage = () => {
style={{ fontSize: '16px' }}
/>
</Tooltip>
<Tooltip title="冻结用户">
<StopOutlined
onClick={() => freezeUser(record)}
style={{ fontSize: '16px', color: '#1890FF' }}
/>
</Tooltip>
{(record.state === '0' || record.state === null) && (
<>
<Tooltip title="冻结用户">
<StopOutlined
onClick={() => freezeUser(record)}
style={{ fontSize: '16px', color: '#1890FF' }}
/>
</Tooltip>
</>
)}
{record.state === '1' && (
<>
<Tooltip title="解冻用户">
<StopOutlined
onClick={() => freezeUser(record)}
style={{ fontSize: '16px' }}
/>
</Tooltip>
</>
)}
<Tooltip title="删除用户">
<DeleteTwoTone
onClick={() => deleteUser(record)}
......@@ -289,6 +311,7 @@ const UserManage = () => {
// 获取用户机构树
useEffect(() => {
setTreeLoading(true);
updateTrees();
}, []);
......@@ -303,9 +326,12 @@ const UserManage = () => {
setOrgID(props[0] || currentSelectOrg);
getOneOUUserListNew(props[0] || currentSelectOrg)
.then(res => {
if (res.success) {
if (res.IsSuccess) {
setTableLoading(false);
const table = res.root.map((item, index) => {
const temp = flatten(getUsers(res.Data));
console.log(temp);
setTableTitle(temp.length);
const table = temp.map((item, index) => {
item.key = index;
item.phone = item.phone || '-';
item.ddid = item.ddid ? '已绑定' : '未绑定';
......@@ -320,7 +346,25 @@ const UserManage = () => {
message.error(err);
});
};
// 返回数据结构处理，扁平化
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);
}
return arr;
};
const getTableTitle = () => `当前机构用户总数（ ${tableTitle} ）`;
// 左侧目录树相关操作
const searchUser = () => {
setSearchUserVisible(true);
......@@ -586,7 +630,7 @@ const UserManage = () => {
});
};
const submitChangeOrg = () =>
addToOrg(currentUser.userID, orgID, newOrgID)
addToOrg(currentUser.userID, currentUser.OUID, newOrgID)
.then(res => {
if (res.success) {
setChangeOrgVisible(false);
......@@ -658,7 +702,13 @@ const UserManage = () => {
message.error(err);
});
const submitFreezeUser = () => {
postSetUserState(currentUser.userID, +!currentUser.state)
let state = '';
if (currentUser.state === '0') {
state = '1';
} else {
state = '0';
}
postSetUserState(currentUser.userID, state)
.then(res => {
if (res.success) {
setFreezeUserVisible(false);
......@@ -746,6 +796,7 @@ const UserManage = () => {
</div>
<div className={styles.userContainer}>
<Table
title={getTableTitle}
bordered
columns={columns}
dataSource={tableData}
......@@ -1008,7 +1059,7 @@ const UserManage = () => {
</Form>
</Modal>
<Modal
title="请确认冻结用户"
title="请确认"
visible={freezeUserVisible}
onOk={submitFreezeUser}
onCancel={() => setFreezeUserVisible(false)}
......
src/routes/config.js
View file @ 6e8b3970
......@@ -17,6 +17,7 @@ import Welcome from '../pages/Welcome';
import RequestTest from '../pages/testPages/request';
import InitDataBase from '../pages/database/InitDataBase';
import ManagementDataBase from '../pages/database/ManagementDataBase';
import DatabaseConnectConfig from '@/pages/database/databaseConfig/DatabaseConfig';
import CurrentSolution from '@/pages/database/CurrentSolution';
import UserManage from '../pages/userCenter/UserManage';
import RoleManage from '@/pages/userCenter/roleManage/RoleManage';
......@@ -89,6 +90,12 @@ export default {
authority: superAuthority,
component: ManagementDataBase,
},
{
path: '/dbm/connectConfig',
name: '数据库连接配置',
authority: superAuthority,
component: DatabaseConnectConfig,
},
],
},
{
......
src/services/appConfig/api.js
View file @ 6e8b3970
import { get, post } from '@/services/index';
/** ***网站配置*** */
// 七参数初始化
export const getSevenParams = () =>
get(`/Cityinterface/rest/services/OMS.svc/M_GetSevenParams`, {
......@@ -19,3 +20,45 @@ export const postSevenParams = sevenFormData =>
`/Cityinterface/rest/services/OMS.svc/M_SetSevenParams?_version=9999`,
sevenFormData,
);
/** ***菜单管理*** */
// 获取菜单树
export const getTree = () =>
get(`/Cityinterface/rest/services/OMS.svc/MiniAppSiteTree`, {
_version: 9999,
_dc: new Date().getTime(),
node: -2,
userMode: 'super',
// subSystemValue: '手持系统',
// subSystemName: '手持系统',
select: '',
});
// 添加菜单
export const addMenuApi = (
menuID,
menuName,
shortName,
imageUrl,
pageUrl,
funParam,
) =>
get(`/Cityinterface/rest/services/OMS.svc/MiniApp_AddMenu`, {
_version: 9999,
_dc: new Date().getTime(),
parentID: menuID,
menuName,
shortName,
imageUrl,
pageUrl,
funParam,
subSystemValue: 'miniapp',
relatedRoleList: '',
});
// 添加菜单
export const getRoleList = () =>
get(`/Cityinterface/rest/services/OMS.svc/P_GetRoleListPlain`, {
_version: 9999,
_dc: new Date().getTime(),
subSystemValue: 'miniapp',
});
src/services/database/api.js
View file @ 6e8b3970
......@@ -26,3 +26,70 @@ export const updateDateBase = params =>
'/Cityinterface/rest/services/OMS.svc/DatabaseStandard_UpdateDateBase',
params,
);
/**
* @数据库连接配置
*/
// 删除数据库连接
export const deleteConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_DeleteConnString', params);
// SQL数据库连接
export const getSQLServerConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetSQLServerConnString', params);
// 新增SQLServer数据库连接
export const addSQLServerConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_AddSQLServerConnString', params);
// 删除SQL连接
export const editSQLServerConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_EditSQLServerConnString', params);
// SQL数据库测试连接
export const getSQLServerConnectionTest = params =>
get(
'/Cityinterface/rest/services/OMS.svc/S_GetSQLServerConnectionTest',
params,
);
/**
* @Oracle数据库
*/
// Oracle连接记录
export const getOracleConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetOracleConnString', params);
// 新增Oracle连接
export const addOracleConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_AddOracleConnString', params);
// 编辑Oracle连接
export const editOracleConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_EditOracleConnString', params);
// 测试连接
export const getOracleConnectionTest = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetOracleConnectionTest', params);
/**
* @MongoDB连接
*/
// MongoDB连接记录
export const getMongoDBConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetMongoDBConnString', params);
// 新增连接配置
export const addMongoDBConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_AddMongoDBConnString', params);
// 编辑分享
export const editMongoDBConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_EditMongoDBConnString', params);
// 测试连接
export const getMongoDBConnectionTest = params =>
get('/Cityinterface/rest/services/OMS.svc/S_MongoDBConnectionTest', params);
/**
* @MySQL连接
*/
// MySQL连接记录
export const getMySQLConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetMySQLConnString', params);
// 新增配置连接
export const addMySQLConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_AddMySQLConnString', params);
// 测试连接
export const getMySQLConnectionTest = params =>
get('/Cityinterface/rest/services/OMS.svc/S_GetMySQLConnectionTest', params);
export const editMySQLConnString = params =>
get('/Cityinterface/rest/services/OMS.svc/S_EditMySQLConnString', params);
src/services/userCenter/userManage/api.js
View file @ 6e8b3970
import { get, post } from '@/services/index';
// import { get, post } from '@/services/index';
import qs from 'qs';
import { CITY_SERVICE, get, post, PUBLISH_SERVICE } from '@/services/index';
export const getUserTree = (selectOU, node) =>
get(`/Cityinterface/rest/services/OMS.svc/U_GetOUTree`, {
......@@ -9,11 +10,18 @@ export const getUserTree = (selectOU, node) =>
node,
});
// export const getOneOUUserListNew = OUID =>
// get(`/Cityinterface/rest/services/OMS.svc/U_GetOneOUUserListNew`, {
// _version: 9999,
// _dc: new Date().getTime(),
// OUID,
// });
export const getOneOUUserListNew = OUID =>
get(`/Cityinterface/rest/services/OMS.svc/U_GetOneOUUserListNew`, {
get(`${PUBLISH_SERVICE}/UserCenter/GroupUserList`, {
_version: 9999,
_dc: new Date().getTime(),
OUID,
GroupId: OUID,
});
/**
......
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