Skip to content

C
CivManage
Commit dd04561a authored by Maofei94's avatar Maofei94
Browse files
Options

perf: a perf

parent ea962fac
Expand all Show whitespace changes
Inline Side-by-side
Showing with 1071 additions and 521 deletions
src/components/Modal/SiteModa.jsx
View file @ dd04561a
import React from 'react'
import {
Modal
} from 'antd'
import React from 'react';
import { Modal } from 'antd';
const SiteModal = (props) =>{
console.log(props)
const SiteModal = props => {
const defaultCofig = {
title:'测试',
visible:false,
}
const config = { ...defaultCofig, ...props}
title: '提示',
visible: false,
};
const config = { ...defaultCofig, ...props };
return (
<Modal
style={{width:"1000px"}}
{...config}
>
<Modal style={{ width: '1000px' }} {...config}>
{props.children}
</Modal>
)
}
);
};
export default SiteModal
\ No newline at end of file
export default SiteModal;
src/pages/database/InitDataBase.jsx
View file @ dd04561a
......@@ -15,7 +15,7 @@ import {
import { PageContainer } from '@ant-design/pro-layout';
import { connect } from 'react-redux';
import { get, post } from '../../services';
import { setTableSQLDirName, deleteConn } from '@/services/database/api'
import { setTableSQLDirName, deleteConn } from '@/services/database/api';
import styles from './InitDataBase.less';
const { Option } = Select;
......@@ -39,8 +39,8 @@ const InitDataBase = props => {
const [upData, setUpData] = useState(1); // 列表刷新标记
const [option, setOption] = useState([]); // 下拉列表数据
const [desc, setDesc] = useState(''); // 修改描述
const [allSqlDir, setAllSqulDir] = useState([]) //修改产品方案
const [defaultSqlDir, setDefaultSqlDir] = useState('') //修改产品方案默认值
const [allSqlDir, setAllSqulDir] = useState([]); // 修改产品方案
const [defaultSqlDir, setDefaultSqlDir] = useState(''); // 修改产品方案默认值
const [modalVisible, setModalVisible] = useState(false);
console.log(window.location.host);
// 获取数据库链接记录
......@@ -80,8 +80,8 @@ const InitDataBase = props => {
});
form.setFieldsValue(obj);
setDbForm(val => ({ ...val, ...obj }));
setAllSqulDir(res.allSqlDir)
setDefaultSqlDir(res.tableSQLDirName)
setAllSqulDir(res.allSqlDir);
setDefaultSqlDir(res.tableSQLDirName);
}
})
.catch(err => {
......@@ -201,7 +201,7 @@ const InitDataBase = props => {
};
// 点击表格回显到表单
const tableClick = item => {
console.log(item)
console.log(item);
let obj = { ...dbForm };
Object.keys(obj).forEach(k => {
obj[k] = item[k];
......@@ -209,29 +209,31 @@ const InitDataBase = props => {
form.setFieldsValue(obj);
};
// 产品方案选择框回调
const handleSelect = (value) =>{
const handleSelect = value => {
setTableSQLDirName({
dirName:value,
_version:9999,
_dc:new Date().getTime()
}).then(res =>{
if(res.success){
dirName: value,
_version: 9999,
_dc: new Date().getTime(),
})
.then(res => {
if (res.success) {
notification.success({
message: '提示',
duration: 3,
description: `已切换初始化脚本为:${value}`,
});
}else{
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message,
});
}
}).catch(err =>{
console.error(err)
})
}
.catch(err => {
console.error(err);
});
};
// 展示修改描述
const changeDesc = () => {
setModalVisible(true);
......@@ -265,34 +267,37 @@ const InitDataBase = props => {
setModalVisible(false);
});
};
//删除数据库连接记录
const delConn = (value)=>{
setTableLoading(true)
const { key='' } =value
// 删除数据库连接记录
const delConn = value => {
setTableLoading(true);
const { key = '' } = value;
deleteConn({
rowIndex:key,
_version:9999,
_dc:new Date().getTime()
}).then(res =>{
setTableLoading(false)
if(res.success){
rowIndex: key,
_version: 9999,
_dc: new Date().getTime(),
})
.then(res => {
setTableLoading(false);
if (res.success) {
setUpData(upData + 1);
notification.success({
message:'提示',
duration:3,
description:'操作成功'
})
}else{
message: '提示',
duration: 3,
description: '操作成功',
});
} else {
notification.error({
message:'提示',
duration:3,
description:res.message
})
}
}).catch(err => {
setTableLoading(false)
console.error(err)})
message: '提示',
duration: 3,
description: res.message,
});
}
})
.catch(err => {
setTableLoading(false);
console.error(err);
});
};
const columns = [
{
title: '服务器名或IP地址',
......@@ -320,10 +325,11 @@ const InitDataBase = props => {
key: 'desc',
},
{
title: '修改描述',
dataIndex: 'name',
key: 'name',
render: () => (
title: '操作',
dataIndex: 'action',
key: 'action',
render: (text, record) => (
<Space>
<Button
type="primary"
size="small"
......@@ -333,18 +339,10 @@ const InitDataBase = props => {
>
修改描述
</Button>
),
},
{
title: '删除',
dataIndex: 'del',
key: 'del',
render: (text,record) => (
<Button size="small" danger
onClick={() => delConn(record)}
>
<Button size="small" danger onClick={() => delConn(record)}>
删除
</Button>
</Space>
),
},
];
......@@ -418,19 +416,27 @@ const InitDataBase = props => {
>
数据库初始化
</Button>
{defaultSqlDir && <Select
placeholder='请选择解决方案'
style={
{width:'200px'}
}
{defaultSqlDir && (
<Select
placeholder="请选择解决方案"
style={{ width: '200px' }}
defaultValue={defaultSqlDir}
onChange = { (e)=>{ handleSelect(e)}}
onChange={e => {
handleSelect(e);
}}
>
{allSqlDir && allSqlDir.map( (item, index) => {
console.log(defaultSqlDir)
return <Option value={item} key={index}> {item} </Option>
}) }
</Select>}
{allSqlDir &&
allSqlDir.map((item, index) => {
console.log(defaultSqlDir);
return (
<Option value={item} key={index}>
{' '}
{item}{' '}
</Option>
);
})}
</Select>
)}
{/* <span>{dbForm.inUse}</span> */}
</Space>
</div>
......@@ -464,10 +470,9 @@ const InitDataBase = props => {
bodyStyle={{
minHeight: '100px',
}}
cancelText="取消"
okText="确认修改"
destroyOnClose={true}
destroyOnClose
>
<Row>
<Col span={2} className={styles.decsBox}>
......
src/pages/database/ManagementDataBase.jsx
View file @ dd04561a
......@@ -2,13 +2,13 @@ import React, { useEffect, useState } from 'react';
import { Card, Button, Table, Space, Modal } from 'antd';
import { PageContainer } from '@ant-design/pro-layout';
import { get } from '../../services';
import styles from './ManagementDataBase.less'
import styles from './ManagementDataBase.less';
const ManagementDataBase = () => {
const [autoCheckList, setAutoCheckList] = useState([]);
const [checkList, setCheckList] = useState([]);
const [logList, setLogList] = useState([]);
const [checkFlag, setCheckFlag] = useState(1)
const [checkFlag, setCheckFlag] = useState(1);
const [checkLoading, setCheckLoading] = useState(false);
const [logLoading, setLogLoading] = useState(false);
const [modalVisible, setModalVisible] = useState(false); // 弹窗
......@@ -45,7 +45,7 @@ const ManagementDataBase = () => {
console.error(err);
});
}, [checkFlag]);
//获取数据库升级记录
// 获取数据库升级记录
useEffect(() => {
setLogLoading(true);
get(`/Cityinterface/rest/services/OMS.svc/DatabaseStandard_GetLog`, {
......@@ -70,18 +70,15 @@ const ManagementDataBase = () => {
});
}, []);
const handleCheck = () => {
setCheckFlag(checkFlag+1)
setCheckFlag(checkFlag + 1);
};
const handleUpdate = () => {
alert('updatedb')
alert('updatedb');
console.log('updatedb');
};
const handleLog = text => {
let arr = []
arr.push(
text.split(/[(\r\n)\r\n]+/).map(item =>{
return (<p>${item}</p>)
}))
let arr = [];
arr.push(text.split(/[(\r\n)\r\n]+/).map(item => <p>${item}</p>));
setModalVisible(true);
setContent(text);
};
......@@ -141,38 +138,33 @@ const ManagementDataBase = () => {
title: '版本日志',
dataIndex: 'despersion',
key: 'despersion',
render: text => {
return (
render: text => (
<Button
size='small'
size="small"
onClick={() => {
handleLog(text);
}}
>
日志
</Button>
);
},
),
},
{
title: '升级内容',
dataIndex: 'content',
key: 'content',
ellipsis: true,
render: text => {
return (
render: text => (
<Button
size='small'
type='primary'
size="small"
type="primary"
onClick={() => {
handleLog(text);
}}
>
升级内容
</Button>
);
},
),
},
];
......@@ -187,12 +179,20 @@ const ManagementDataBase = () => {
dataSource={autoCheckList}
bordered
loading={checkLoading}
size='small'
size="small"
/>
<div className={ styles.tCenter}>
<div className={styles.tCenter}>
<Space>
<Button type='primary' onClick={handleCheck} loading={checkLoading}>检查</Button>
<Button danger type='primary' onClick={handleUpdate}>升级</Button>
<Button
type="primary"
onClick={handleCheck}
loading={checkLoading}
>
检查
</Button>
<Button danger type="primary" onClick={handleUpdate}>
升级
</Button>
</Space>
</div>
</Card>
......@@ -207,7 +207,7 @@ const ManagementDataBase = () => {
dataSource={checkList}
bordered
loading={checkLoading}
size='small'
size="small"
/>
</Card>
<Card className={styles.mgTop20}>
......@@ -218,7 +218,7 @@ const ManagementDataBase = () => {
dataSource={logList}
bordered
loading={logLoading}
size='small'
size="small"
/>
</Card>
</PageContainer>
......@@ -232,13 +232,15 @@ const ManagementDataBase = () => {
onCancel={() => setModalVisible(false)}
width="1000px"
bodyStyle={{
minHeight:'100px',
maxHeight:'600px',
overflowY:'scroll'
minHeight: '100px',
maxHeight: '600px',
overflowY: 'scroll',
}}
style={{top:"40px"}}
style={{ top: '40px' }}
footer={[
<Button type='primary' onClick={() => setModalVisible(false)}>关闭窗口</Button>,
<Button type="primary" onClick={() => setModalVisible(false)}>
关闭窗口
</Button>,
]}
>
{content}
......
src/pages/orgnazation/DefaultComponent.jsx
View file @ dd04561a
This diff is collapsed.
src/pages/orgnazation/ListCard.jsx
View file @ dd04561a
import React, { useState, useEffect, useCallback} from 'react';
import { Spin } from 'antd';
import React, { useState, useEffect, useCallback } from 'react';
import { Spin, Button } from 'antd';
import ListCardItem from './listCardItem';
import { get, post } from '../../services';
import { orgTest} from '../../services/orgnazation/api';
import { orgTest } from '@/services/orgnazation/api';
const tip ='loading...'
const ListCard = (props) =>{
const { ouid, searchWord } = props
const [valueList, setValueList]=useState([])
const [testList, setTestList] = useState([])
const [loading, setLoading] = useState(true)
const { optionsList} = props
const getValueCallback = useCallback(
(value,index) => {
console.log(value,index)
setValueList(valueList[index]=value)
console.log(valueList,'valueList')
},[])
useEffect(()=>{
setLoading(true)
const defaultConfig ={
optionsList:[],
title:'默认组',
id:'',
}
get("/Cityinterface/rest/services/OMS.svc/U_GetUserListForBatchOper",{
OUID:ouid||'',
_version:9999,
_dc:new Date().getTime()
}).then(res =>{
setLoading(false)
const list = []
res && res.map(item =>{
list.push({...defaultConfig,...item})
const tip = 'loading...';
const ListCard = props => {
const { ouid, searchWord, valueCallback } = props;
const [valueList, setValueList] = useState([]);
const [dataList, setdataList] = useState([]);
const [loading, setLoading] = useState(true);
const { optionsList } = props;
const getValueCallback = useCallback((value, index) => {
console.log(value, index);
setValueList((valueList[index] = value));
console.log(valueList, 'valueList');
}, []);
useEffect(() => {
setLoading(true);
const defaultConfig = {
optionsList: [],
title: '默认组',
id: '',
};
// /Cityinterface/rest/services/OMS.svc/U_GetUserListForBatchOper
get('/Cityinterface/rest/services/OMS.svc/P_GetUserByStation', {
// OUID:ouid||'',
stationID: ouid || '',
_version: 9999,
_dc: new Date().getTime(),
})
setTestList(list)
}).catch(err =>{
console.error(err)
setLoading(false)
.then(res => {
setLoading(false);
const list = [];
res &&
res.map(item => {
list.push({ ...defaultConfig, ...item });
});
setdataList(list);
})
//多级嵌套测试
orgTest().then(res =>{
console.log(res,'res')
})
},[ouid])
.catch(err => {
console.error(err);
setLoading(false);
});
// 多级嵌套测试
// orgTest().then(res =>{
// console.log(res,'res')
// })
}, [ouid]);
return (
<>
{
loading? <Spin size="large" spinning = {loading} tip={tip} style={{position:'absolute',top:'30%',left:'0',right:'0',bottom:'0'}}/> :
testList && testList.map((item,index) =>{
return (<ListCardItem {...item} itemid={index} key={index}
getValueCallback={getValueCallback} searchWord ={ searchWord} {...props}></ListCardItem>)
})
}
</>
)
}
<div>
{loading ? (
<Spin
size="large"
spinning={loading}
tip={tip}
style={{
position: 'absolute',
top: '30%',
left: '0',
right: '0',
bottom: '0',
}}
/>
) : (
dataList &&
dataList.length > 0 &&
dataList.map((item, index) => (
<ListCardItem
{...item}
itemid={index}
key={`item${index}key`}
getValueCallback={getValueCallback}
searchWord={searchWord}
{...props}
/>
))
)}
{false && !loading && dataList && (
<Button
type="primary"
onClick={() => valueCallback(valueList)}
style={{ marginTop: '20px' }}
>
提交
</Button>
)}
</div>
);
};
export default ListCard
\ No newline at end of file
export default ListCard;
src/pages/orgnazation/ListCardItem.less
View file @ dd04561a
:global{
.spans span{
background-color: red !important;
}
}
.divBox {
display: flex;
flex-wrap: wrap;
border: 1px solid #b5b8c8;
margin-top: 20px;
min-height: 40px;
min-height: 50px;
.topCheckbox{
height: 20px;
background-color: #fff;
......@@ -20,17 +15,12 @@
margin-left: 20px;
justify-content: space-between;
.check {
margin: 10px 0 ;
flex: 1;
.spans {
background-color: red !important;
span{
font-size: 200px;
display: none;
color: chartreuse !important;
}
}
// margin: 10px 0 ;
// flex: 1;
}
}
}
.isSearch{
color: red;
background-color: yellow;
}
\ No newline at end of file
src/pages/orgnazation/listCardItem.jsx
View file @ dd04561a
import React,{ useState ,useEffect} from 'react'
import {
Checkbox,
Row,
Col
} from 'antd';
import styles from './ListCardItem.less'
import React, { useState, useEffect, useRef, useLayoutEffect } from 'react';
import { Checkbox, Row, Col } from 'antd';
import styles from './ListCardItem.less';
const CheckGroup = Checkbox.Group;
const ListCardItem = (props) =>{
console.log(props.searchWord)
const [ indeterminate, setIndeterminate ] = useState(false)
const [ allChecked, setAllChecked ] = useState(false) //全选状态
const [ checkList, setCheckList] = useState([]) //复选框列表
const { getValueCallback, itemid, userList, OUName, searchWord } = props
const defaultList = userList && userList.map( (item,index) =>{
// if(!searchWord){
// return
// }else{
// if(!item.userName.includes(searchWord))return
// }
item.label = item.userName || item.label
item.value = item.userID || item.label
return item
}) || []
const handleAllChecked = (e) =>{
const { checked } = e.target
setAllChecked(checked)
let arr = []
if(checked){
arr = defaultList.map(item =>{
item.isChecked=checked
return item
})
}else{
arr = []
const ListCardItem = props => {
const { getValueCallback, itemid, userList, OUName, searchWord } = props;
const [indeterminate, setIndeterminate] = useState(false);
const [allChecked, setAllChecked] = useState(false); // 全选状态
const [checkList, setCheckList] = useState([]); // 复选框列表选中的值
const [defaultList, setDefaultList] = useState([]); // 默认的选项
useEffect(() => {
console.log(userList, '执行了`````');
let arr = [];
userList.map((item, index) => {
let obj = { ...item };
obj.label = (
<span
className={
searchWord && obj.userName.includes(searchWord)
? styles.isSearch
: ''
}
setCheckList(arr)
setIndeterminate(false)
getValueCallback(arr,itemid)
>
{obj.userName}
</span>
);
obj.value = obj.userID;
arr.push(obj);
});
setDefaultList(arr);
}, [searchWord]);
useEffect(() => {
console.log(userList, '执行了`````');
let arr2 = [];
userList.map((item, index) => {
if (item.isChecked) {
arr2.push(item.userID);
}
const handleChecked = (e) =>{
setCheckList(e) ;
setAllChecked(e.length === defaultList.length)
setIndeterminate(!!e.length && e.length <defaultList.length)
getValueCallback(e,itemid)
});
setCheckList(arr2);
}, [userList]);
const handleAllChecked = e => {
const { checked } = e.target;
setAllChecked(checked);
let arr = [];
if (checked) {
arr = defaultList.map(item => item.value);
} else {
arr = [];
}
setCheckList(arr);
setIndeterminate(false);
getValueCallback(arr, itemid);
};
const handleChecked = e => {
console.log(e, 'e45');
setCheckList(e);
setAllChecked(e.length === defaultList.length);
setIndeterminate(!!e.length && e.length < defaultList.length);
getValueCallback(e, itemid);
};
return (
<>
<div className ={`${styles.divBox}`}>
<div className={ styles.topCheckbox}>
<div className={`${styles.divBox}`}>
<div className={styles.topCheckbox}>
<Checkbox
indeterminate = { indeterminate}
checked={ allChecked}
onChange= { (e) =>{ handleAllChecked(e)}}
>{OUName}</Checkbox>
indeterminate={indeterminate}
checked={allChecked}
onChange={e => {
handleAllChecked(e);
}}
>
{OUName}
</Checkbox>
</div>
<div style={{width:"100%"}} className = {styles.checkdiv}>
{/* {defaultList && defaultList.length>0 && <CheckGroup className = {`${styles.check} ${styles.span}`} onChange = {(e) => { handleChecked(e)}} value={checkList} options = {defaultList} /> } */}
<CheckGroup onChange = {(e) => { handleChecked(e)}}>
<div style={{ width: '100%' }} className={styles.checkdiv}>
{defaultList && defaultList.length > 0 && (
<CheckGroup
className={styles.check}
onChange={e => {
handleChecked(e);
}}
value={checkList}
options={defaultList}
/>
)}
{/* { <CheckGroup onChange = {(e) => { handleChecked(e)}} >
{defaultList && defaultList.length>0 &&
defaultList.map( (item, index) =>{
return item.label.includes(searchWord) && <Checkbox key={index} checked={item.isChecked} className={ item.label.includes(searchWord)&&styles.spans} value={item.value} >{item.label}</Checkbox>
return item.label.includes(searchWord) &&
<Checkbox key={index} value={item.value} >{item.label}{item.userID}{String(item.isChecked)}</Checkbox>
})
}
</CheckGroup>
</CheckGroup>} */}
</div>
</div>
</>
)
}
);
};
export default ListCardItem
\ No newline at end of file
export default ListCardItem;
src/pages/userCenter/RoleManage/AddModal.jsx 0 → 100644
View file @ dd04561a
import React, { useState } from 'react';
import { Form, Input, notification } from 'antd';
import SiteModal from '@/components/Modal/SiteModa';
import { addStation } from '@/services/userCenter/siteManage/api';
const { Item } = Form;
const AddModal = props => {
const [form] = Form.useForm();
const [formLayout, setFormLayout] = useState('horizontal');
const [loading, setLoading] = useState(false);
const { confirmModal } = props;
const onSubmit = () => {
form
.validateFields()
.then(res => {
console.log(res, 'res');
setLoading(true);
addStation({
stationName: res.stationName,
description: res.description,
_version: 9999,
_dc: new Date().getTime(),
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
notification.success({
message: '通知',
duration: 3,
description: '新增成功',
});
confirmModal();
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message,
});
}
})
.catch(err => {
setLoading(false);
notification.error({
message: '提示',
duration: 3,
description: err,
});
});
})
.catch(err => {
console.error(err);
});
};
const onFinish = value => {};
return (
<SiteModal
{...props}
title="新增角色"
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: 200, borderRadius: '20px' }}
width="600px"
destroyOnClose
cancelText="取消"
okText="确认选择"
onOk={() => onSubmit()}
confirmLoading={loading}
>
<Form form={form} layout={formLayout} onFinish={onFinish}>
<Item
label="角色名称"
name="stationName"
rules={[
{
required: true,
message: '请输入角色名称',
},
]}
>
<Input placeholder="请输入角色名称" />
</Item>
<Item label="角色类别">all</Item>
<Item label="角色描述" name="description">
<Input placeholder="请输入角色描述" />
</Item>
</Form>
</SiteModal>
);
};
export default AddModal;
src/pages/userCenter/RoleManage/DelModal.jsx 0 → 100644
View file @ dd04561a
import React, { useState } from 'react';
import { notification } from 'antd';
import SiteModal from '@/components/Modal/SiteModa';
import { deleteStation } from '@/services/userCenter/siteManage/api';
const DelModal = props => {
const { confirmModal, stationId } = props;
const [loading, setLoading] = useState(false);
const onSubmit = props => {
setLoading(true);
deleteStation({
stationID: stationId,
_version: 9999,
_dc: new Date().getTime(),
})
.then(res => {
setLoading(false);
if (res.success) {
notification.success({
message: '通知',
duration: 3,
description: '删除成功',
});
confirmModal();
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message,
});
}
})
.catch(err => {
setLoading(false);
notification.error({
message: '提示',
duration: 3,
description: err,
});
});
};
return (
<SiteModal
{...props}
title="删除角色"
bodyStyle={{ width: '100%', minHeight: '50px' }}
style={{ top: 200 }}
width="400px"
destroyOnClose
cancelText="取消"
okText="确认删除"
onOk={() => onSubmit()}
confirmLoading={loading}
>
是否删除该角色?
</SiteModal>
);
};
export default DelModal;
src/pages/userCenter/RoleManage/EditModal.jsx 0 → 100644
View file @ dd04561a
import React, { useState, useEffect, useRef } from 'react';
import { Form, Input, notification } from 'antd';
import SiteModal from '@/components/Modal/SiteModa';
import { editStation } from '@/services/userCenter/siteManage/api';
const { Item } = Form;
const EditModal = props => {
const [form] = Form.useForm();
const [formLayout, setFormLayout] = useState('horizontal');
const [loading, setLoading] = useState(false);
const flag = useRef();
const { confirmModal, stationObj } = props;
const onSubmit = () => {
form
.validateFields()
.then(res => {
setLoading(true);
flag.current = res;
editStation({
stationName: res.stationName,
description: res.description,
stationID: stationObj.stationID,
_version: 9999,
_dc: new Date().getTime(),
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
notification.success({
message: '通知',
duration: 3,
description: '编辑成功',
});
confirmModal();
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message,
});
}
})
.catch(err => {
setLoading(false);
notification.error({
message: '提示',
duration: 3,
description: err,
});
});
})
.catch(err => {
console.error(err);
});
};
useEffect(() => {
form.setFieldsValue({
stationName: stationObj.text,
description: stationObj.description,
});
}, [stationObj]);
return (
<SiteModal
{...props}
title="编辑角色"
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: 200, borderRadius: '20px' }}
width="600px"
destroyOnClose
cancelText="取消"
okText="确认编辑"
onOk={() => onSubmit()}
confirmLoading={loading}
>
<Form form={form} layout={formLayout}>
<Item
label="角色名称"
name="stationName"
rules={[
{
required: true,
message: '请输入角色名称',
},
]}
>
<Input placeholder="请输入角色名称" />
</Item>
<Item label="角色类别">all</Item>
<Item label="角色描述" name="description">
<Input placeholder="请输入角色描述" />
</Item>
</Form>
</SiteModal>
);
};
export default EditModal;
src/pages/userCenter/RoleManage/RoleManage.jsx 0 → 100644
View file @ dd04561a
import React, { useState, useEffect } from 'react';
import { Row, Col, Tree, Card, Input, Tooltip, Button } from 'antd';
import { FileAddTwoTone, EditTwoTone, DeleteTwoTone } from '@ant-design/icons';
import { PageContainer, GridContent } from '@ant-design/pro-layout';
import { getWebModuleTree } from '@/services/userCenter/RoleManage/api';
import ListCard from '@/pages/orgnazation/ListCard';
import styles from '@/pages/userCenter/RoleManage/RoleManage.less';
import AddModal from './AddModal';
import DelModal from './DelModal';
import EditModal from './EditModal';
const { Search } = Input;
const placeholder = '请输入人员姓名';
const SiteManage = () => {
const [treeData, setTreeData] = useState([]);
const [searchWord, setSearchWord] = useState('');
const [ouid, setOuid] = useState('');
const [saveTreeId, setSaveTreeId] = useState(''); // 保存点击回调的ird
const [modalVisible, setModalVisible] = useState(false); // 新增弹窗
const [flag, setFlag] = useState(1);
const [stationId, setStationId] = useState(''); // 选择的站点
const [stationObj, setStationObj] = useState({}); // 选择的站点
const [delVisible, setDelVisible] = useState(false); // 删除弹窗
const [editVisible, setEditVisible] = useState(false); // 修改弹窗
const now = new Date().getTime();
// 点击树的回调
const handleTreeSelect = e => {
console.log(e);
let id = e[0];
if (id) {
setSaveTreeId(id);
setOuid(id);
} else {
setOuid(saveTreeId);
}
};
useEffect(() => {
getWebModuleTree({
userMode: 'super',
select: '',
_version: 9999,
_dc: now,
node: -2,
})
.then(res => {
let arr = [];
if (res) {
arr.push(res.find(item => item.id === 'Web4StationRoot'));
console.log(arr, 'arr');
}
let arr2 = transTree(arr);
setTreeData(arr2);
})
.catch(err => {
console.error(err);
});
}, [flag]);
const Title = props => {
const { text } = props;
console.log(props);
return (
<div className={styles.treeTitle}>
{text}
<div className={styles.titleBox}>
<Tooltip title="新增站点">
<FileAddTwoTone
onClick={() => {
handleAdd(props);
}}
/>
</Tooltip>
<Tooltip title="编辑站点">
<EditTwoTone
onClick={() => {
handleEdit(props);
}}
/>
</Tooltip>
<Tooltip title="删除站点">
<DeleteTwoTone
onClick={() => {
handleDel(props);
}}
/>
</Tooltip>
</div>
</div>
);
};
const handleAdd = e => {
console.log(e);
setModalVisible(true);
};
// 站点删除
const handleDel = e => {
setStationId(e.stationID);
setDelVisible(true);
};
// 编辑站点
const handleEdit = e => {
setStationObj(e);
setEditVisible(true);
};
// 树形数据转换
const transTree = val => {
console.log(val);
let arr = val;
return arr.map((item, index) => {
item.title = Title(item) || item.text;
item.key = item.stationID || '';
let obj = {};
if (Array.isArray(item.children) && item.children.length > 0) {
transTree(item.children);
obj = item;
return obj;
}
return item;
});
};
// 获取搜索框的值
const handleSearch = value => {
setSearchWord(value);
};
const confirmModal = e => {
setModalVisible(false);
setFlag(flag + 1);
};
const delModal = () => {
setDelVisible(false);
setFlag(flag + 1);
};
const editModal = () => {
setEditVisible(false);
setFlag(flag + 1);
};
const valueCallback = props => {
console.log(props);
};
return (
<PageContainer>
<GridContent>
<Row gutter={12}>
<Col lg={6} md={24}>
<Card className={styles.cardBox}>
<Tree
showLine={{ showLeafIcon: false }}
showIcon
onSelect={e => handleTreeSelect(e)}
treeData={treeData}
/>
<AddModal
visible={modalVisible}
onCancel={() => setModalVisible(false)}
confirmModal={confirmModal}
/>
<DelModal
visible={delVisible}
stationId={stationId}
onCancel={() => setDelVisible(false)}
confirmModal={delModal}
/>
<EditModal
visible={editVisible}
stationObj={stationObj}
onCancel={() => setEditVisible(false)}
confirmModal={editModal}
/>
</Card>
</Col>
<Col lg={18} md={24}>
<Card className={styles.cardBox}>
<Row align="middle">
<Col span={1}>搜索</Col>
<Col span={8}>
<Search
allowClear
placeholder={placeholder}
onSearch={handleSearch}
enterButton
/>
</Col>
</Row>
{ouid && (
<ListCard
ouid={ouid}
searchWord={searchWord}
valueCallback={valueCallback}
/>
)}
</Card>
</Col>
</Row>
</GridContent>
</PageContainer>
);
};
export default SiteManage;
src/pages/userCenter/RoleManage/RoleManage.less 0 → 100644
View file @ dd04561a
.cardBox{
min-height: calc(100vh - 200px);
}
.ant-tree-node-content-wrapper-open{
display: flex;
align-items: center;
}
.treeTitle {
display: flex;
span {
display: none;
}
}
.treeTitle:hover {
span {
margin-left: 20px;
display: block;
}
}
.titleBox{
display: flex;
// flex-wrap: wrap;
justify-content: space-around;
align-items: center;
}
\ No newline at end of file
src/pages/userCenter/siteManage/AddModal.jsx
View file @ dd04561a
import React, { useState} from 'react';
import {
Form,
Input,
notification
} from 'antd'
import React, { useState } from 'react';
import { Form, Input, notification } from 'antd';
import SiteModal from '@/components/Modal/SiteModa';
import { addStation } from '@/services/userCenter/siteManage/api';
const { Item } = Form
const AddModal = (props) =>{
const { Item } = Form;
const AddModal = props => {
const [form] = Form.useForm();
const [formLayout, setFormLayout] = useState('horizontal');
const [loading,setLoading] = useState(false)
const { confirmModal } =props
const onSubmit = () =>{
form.validateFields().then(res =>{
console.log(res,'res')
setLoading(true)
const [loading, setLoading] = useState(false);
const { confirmModal } = props;
const onSubmit = () => {
form
.validateFields()
.then(res => {
console.log(res, 'res');
setLoading(true);
addStation({
stationName:res.stationName,
description:res.description,
_version:9999,
_dc:new Date().getTime()
}).then(res =>{
setLoading(false)
if(res.success){
form.resetFields()
stationName: res.stationName,
description: res.description,
_version: 9999,
_dc: new Date().getTime(),
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
notification.success({
message: '通知',
duration: 3,
description: '新增成功',
});
confirmModal()
}else{
confirmModal();
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message,
});
}
}).catch(err =>{
setLoading(false)
})
.catch(err => {
setLoading(false);
notification.error({
message: '提示',
duration: 3,
description: err,
});
});
})
}).catch(err =>{
console.error(err)
})
}
.catch(err => {
console.error(err);
});
};
const onFinish = (value)=>{
}
return(
<SiteModal {...props} title='新增站点'
bodyStyle ={{width:"100%",minHeight:"100px"}}
style= {{top:200,borderRadius:"20px",}}
const onFinish = value => {};
return (
<SiteModal
{...props}
title="新增站点"
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: 200, borderRadius: '20px' }}
width="600px"
destroyOnClose={true}
cancelText='取消'
okText='确认选择'
onOk={()=>onSubmit()}
destroyOnClose
cancelText="取消"
okText="确认选择"
onOk={() => onSubmit()}
confirmLoading={loading}
>
<Form
form={form}
layout={formLayout}
onFinish={onFinish}
>
<Item label='站点名称' name='stationName'
<Form form={form} layout={formLayout} onFinish={onFinish}>
<Item
label="站点名称"
name="stationName"
rules={[
{
required: true,
......@@ -77,15 +77,15 @@ const AddModal = (props) =>{
},
]}
>
<Input placeholder='请输入站点名称'></Input>
<Input placeholder="请输入站点名称" />
</Item>
<Item label='站点类别'>all</Item>
<Item label='站点描述' name='description'>
<Input placeholder='请输入站点描述'></Input>
<Item label="站点类别">all</Item>
<Item label="站点描述" name="description">
<Input placeholder="请输入站点描述" />
</Item>
</Form>
</SiteModal>
)
}
);
};
export default AddModal
export default AddModal;
src/pages/userCenter/siteManage/DelModal.jsx
View file @ dd04561a
import React, { useState} from 'react';
import {
notification
} from 'antd'
import React, { useState } from 'react';
import { notification } from 'antd';
import SiteModal from '@/components/Modal/SiteModa';
import { deleteStation } from '@/services/userCenter/siteManage/api'
const DelModal = (props) =>{
const { confirmModal, stationId } =props
const [loading,setLoading] = useState(false)
const onSubmit = (props) =>{
setLoading(true)
import { deleteStation } from '@/services/userCenter/siteManage/api';
const DelModal = props => {
const { confirmModal, stationId } = props;
const [loading, setLoading] = useState(false);
const onSubmit = props => {
setLoading(true);
deleteStation({
stationID: stationId,
_version: 9999,
_dc: new Date().getTime()
}).then(res =>{
setLoading(false)
if(res.success){
_dc: new Date().getTime(),
})
.then(res => {
setLoading(false);
if (res.success) {
notification.success({
message: '通知',
duration: 3,
description: '删除成功',
});
confirmModal()
}else{
confirmModal();
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message,
});
}
}).catch(err =>{
setLoading(false)
})
.catch(err => {
setLoading(false);
notification.error({
message: '提示',
duration: 3,
description: err
description: err,
});
})
}
return(
<SiteModal {...props} title='删除站点'
bodyStyle ={{width:"100%",minHeight:"50px",}}
style= {{top:200}}
});
};
return (
<SiteModal
{...props}
title="删除站点"
bodyStyle={{ width: '100%', minHeight: '50px' }}
style={{ top: 200 }}
width="400px"
destroyOnClose={true}
cancelText='取消'
okText='确认删除'
onOk={()=>onSubmit()}
destroyOnClose
cancelText="取消"
okText="确认删除"
onOk={() => onSubmit()}
confirmLoading={loading}
>
是否删除该站点?
</SiteModal>
)
}
);
};
export default DelModal
export default DelModal;
src/pages/userCenter/siteManage/EditModal.jsx
View file @ dd04561a
import React, { useState, useEffect, useRef} from 'react';
import {
Form,
Input,
notification
} from 'antd'
import React, { useState, useEffect, useRef } from 'react';
import { Form, Input, notification } from 'antd';
import SiteModal from '@/components/Modal/SiteModa';
import { editStation } from '@/services/userCenter/siteManage/api';
const { Item } = Form
const EditModal = (props) =>{
const { Item } = Form;
const EditModal = props => {
const [form] = Form.useForm();
const [formLayout, setFormLayout] = useState('horizontal');
const [loading,setLoading] = useState(false)
const flag = useRef()
const { confirmModal, stationObj } =props
const onSubmit = () =>{
form.validateFields().then(res =>{
setLoading(true)
flag.current=res
const [loading, setLoading] = useState(false);
const flag = useRef();
const { confirmModal, stationObj } = props;
const onSubmit = () => {
form
.validateFields()
.then(res => {
setLoading(true);
flag.current = res;
editStation({
stationName:res.stationName,
description:res.description,
stationName: res.stationName,
description: res.description,
stationID: stationObj.stationID,
_version:9999,
_dc:new Date().getTime()
}).then(res =>{
setLoading(false)
if(res.success){
form.resetFields()
_version: 9999,
_dc: new Date().getTime(),
})
.then(res => {
setLoading(false);
if (res.success) {
form.resetFields();
notification.success({
message: '通知',
duration: 3,
description: '编辑成功',
});
confirmModal()
}else{
confirmModal();
} else {
notification.error({
message: '提示',
duration: 3,
description: res.message,
});
}
}).catch(err =>{
setLoading(false)
})
.catch(err => {
setLoading(false);
notification.error({
message: '提示',
duration: 3,
description: err,
});
});
})
}).catch(err =>{
console.error(err)
})
}
useEffect( () =>{
.catch(err => {
console.error(err);
});
};
useEffect(() => {
form.setFieldsValue({
stationName:stationObj.text,
description:stationObj.description
})
return ()=>{
console.log(flag.current)
form.setFieldsValue(flag.current)
}
},[stationObj])
return(
<SiteModal {...props} title='编辑站点'
bodyStyle ={{width:"100%",minHeight:"100px"}}
style= {{top:200,borderRadius:"20px",}}
stationName: stationObj.text,
description: stationObj.description,
});
}, [stationObj]);
return (
<SiteModal
{...props}
title="编辑站点"
bodyStyle={{ width: '100%', minHeight: '100px' }}
style={{ top: 200, borderRadius: '20px' }}
width="600px"
destroyOnClose={true}
cancelText='取消'
okText='确认编辑'
onOk={()=>onSubmit()}
destroyOnClose
cancelText="取消"
okText="确认编辑"
onOk={() => onSubmit()}
confirmLoading={loading}
>
<Form
form={form}
layout={formLayout}
>
<Item label='站点名称' name='stationName'
<Form form={form} layout={formLayout}>
<Item
label="站点名称"
name="stationName"
rules={[
{
required: true,
......@@ -85,15 +83,15 @@ const EditModal = (props) =>{
},
]}
>
<Input placeholder='请输入站点名称'></Input>
<Input placeholder="请输入站点名称" />
</Item>
<Item label='站点类别'>all</Item>
<Item label='站点描述' name='description'>
<Input placeholder='请输入站点描述'></Input>
<Item label="站点类别">all</Item>
<Item label="站点描述" name="description">
<Input placeholder="请输入站点描述" />
</Item>
</Form>
</SiteModal>
)
}
);
};
export default EditModal
export default EditModal;
src/pages/userCenter/siteManage/SiteManage.jsx
View file @ dd04561a
import React, { useState, useEffect} from 'react';
import { Row, Col, Tree, Card, Input, Tooltip} from 'antd';
import {
FileAddTwoTone,
EditTwoTone,
DeleteTwoTone,
} from '@ant-design/icons';
import React, { useState, useEffect } from 'react';
import { Row, Col, Tree, Card, Input, Tooltip, Button } from 'antd';
import { FileAddTwoTone, EditTwoTone, DeleteTwoTone } from '@ant-design/icons';
import { PageContainer, GridContent } from '@ant-design/pro-layout';
import { getOUTree, getWebModuleTree} from '@/services/userCenter/siteManage/api';
import { getWebModuleTree } from '@/services/userCenter/siteManage/api';
import ListCard from '@/pages/orgnazation/ListCard';
import styles from '@/pages/userCenter/siteManage/SiteManage.less';
import AddModal from './AddModal'
import DelModal from './DelModal'
import EditModal from './EditModal'
import AddModal from './AddModal';
import DelModal from './DelModal';
import EditModal from './EditModal';
const { Search } = Input;
const placeholder = '请输入人员姓名'
const SiteManage = ()=>{
const [ treeData, setTreeData ] = useState([])
const [ searchWord, setSearchWord] = useState( '')
const [ ouid, setOuid ] = useState('')
const [saveTreeId, setSaveTreeId] = useState('')//保存点击回调的id
const [modalVisible, setModalVisible] = useState(false) //新增弹窗
const [flag, setFlag] = useState(1)
const [ stationId, setStationId] = useState('') //选择的站点
const [ stationObj, setStationObj] = useState({}) //选择的站点
const [delVisible, setDelVisible] = useState(false) //删除弹窗
const [editVisible, setEditVisible] = useState(false) //修改弹窗
const now = new Date().getTime()
//点击树的回调
const handleTreeSelect = (e) =>{
console.log(e)
let id = e[0]
if(id){
setSaveTreeId(id)
setOuid(id)
}else{
setOuid(saveTreeId)
const placeholder = '请输入人员姓名';
const SiteManage = () => {
const [treeData, setTreeData] = useState([]);
const [searchWord, setSearchWord] = useState('');
const [ouid, setOuid] = useState('');
const [saveTreeId, setSaveTreeId] = useState(''); // 保存点击回调的id
const [modalVisible, setModalVisible] = useState(false); // 新增弹窗
const [flag, setFlag] = useState(1);
const [stationId, setStationId] = useState(''); // 选择的站点
const [stationObj, setStationObj] = useState({}); // 选择的站点
const [delVisible, setDelVisible] = useState(false); // 删除弹窗
const [editVisible, setEditVisible] = useState(false); // 修改弹窗
const now = new Date().getTime();
// 点击树的回调
const handleTreeSelect = e => {
console.log(e);
let id = e[0];
if (id) {
setSaveTreeId(id);
setOuid(id);
} else {
setOuid(saveTreeId);
}
}
useEffect(()=>{
};
useEffect(() => {
getWebModuleTree({
userMode:"super",
select:'',
_version:9999,
_dc:now ,
node:-2
}).then(res =>{
let arr =[]
if(res){
arr.push( res.find(item =>{
return item.id==='Web4StationRoot'
}))
console.log(arr,'arr')
userMode: 'super',
select: '',
_version: 9999,
_dc: now,
node: -2,
})
.then(res => {
let arr = [];
if (res) {
arr.push(res.find(item => item.id === 'Web4StationRoot'));
console.log(arr, 'arr');
}
let arr2 = transTree(arr)
setTreeData(arr2)
}).catch(err =>{
console.error(err)
let arr2 = transTree(arr);
setTreeData(arr2);
})
// getOUTree().then(res =>{
// let arr = transTree(res)
// setTreeData(arr)
// }).catch(err =>{
// console.error(err)
// })
},[flag])
const Title = (props) =>{
const { text } = props
.catch(err => {
console.error(err);
});
}, [flag]);
const Title = props => {
const { text } = props;
return (
<div className={styles.treeTitle}>
{text}
<div className={styles.titleBox}>
<Tooltip title='新增站点'><FileAddTwoTone onClick={()=>{ handleAdd(props)}} /></Tooltip>
<Tooltip title='编辑站点'><EditTwoTone onClick={()=>{ handleEdit(props)}} /></Tooltip>
<Tooltip title='删除站点'><DeleteTwoTone onClick={()=>{ handleDel(props)}}/></Tooltip>
<Tooltip title="新增站点">
<FileAddTwoTone
onClick={() => {
handleAdd(props);
}}
/>
</Tooltip>
<Tooltip title="编辑站点">
<EditTwoTone
onClick={() => {
handleEdit(props);
}}
/>
</Tooltip>
<Tooltip title="删除站点">
<DeleteTwoTone
onClick={() => {
handleDel(props);
}}
/>
</Tooltip>
</div>
</div>
)
}
const handleAdd = (e) =>{
console.log(e)
setModalVisible(true)
}
//站点删除
const handleDel = (e) =>{
setStationId(e.stationID)
setDelVisible(true)
}
//编辑站点
const handleEdit =(e) =>{
setStationObj(e)
setEditVisible(true)
}
//树形数据转换
const transTree = (val) =>{
let arr = val
return arr.map( item =>{
item.title = Title(item) || item.text
item.key = item.id
// item.icon = (<img src={user_green} style={{marginBottom:'2px'}}/>)
let obj = {}
if(Array.isArray(item.children) && item.children.length > 0){
transTree(item.children)
return obj = item
}else{
return item
}
})
}
//获取搜索框的值
const handleSearch = (value) =>{
setSearchWord(value)
}
const confirmModal = (e) =>{
setModalVisible(false)
setFlag(flag+1)
}
const delModal = ()=>{
setDelVisible(false)
setFlag(flag+1)
}
const editModal = () =>{
setEditVisible(false)
setFlag(flag+1)
);
};
const handleAdd = e => {
console.log(e);
setModalVisible(true);
};
// 站点删除
const handleDel = e => {
setStationId(e.stationID);
setDelVisible(true);
};
// 编辑站点
const handleEdit = e => {
setStationObj(e);
setEditVisible(true);
};
// 树形数据转换
const transTree = val => {
let arr = val;
return arr.map((item, index) => {
item.title = Title(item) || item.text;
item.key = item.stationID || '';
let obj = {};
if (Array.isArray(item.children) && item.children.length > 0) {
transTree(item.children);
obj = item;
return obj;
}
return item;
});
};
// 获取搜索框的值
const handleSearch = value => {
setSearchWord(value);
};
const confirmModal = e => {
setModalVisible(false);
setFlag(flag + 1);
};
const delModal = () => {
setDelVisible(false);
setFlag(flag + 1);
};
const editModal = () => {
setEditVisible(false);
setFlag(flag + 1);
};
const valueCallback = props => {
console.log(props);
};
return (
<PageContainer>
<GridContent>
<Row gutter={12}>
<Col lg={6} md={24}>
<Card className={ styles.cardBox}>
<Card className={styles.cardBox}>
<Tree
showLine={{showLeafIcon:false}}
showLine={{ showLeafIcon: false }}
showIcon
onSelect={(e)=> handleTreeSelect(e)}
onSelect={e => handleTreeSelect(e)}
treeData={treeData}
/>
<AddModal
visible = {modalVisible}
visible={modalVisible}
onCancel={() => setModalVisible(false)}
confirmModal={confirmModal}
/>
......@@ -144,35 +154,42 @@ const SiteManage = ()=>{
visible={delVisible}
stationId={stationId}
onCancel={() => setDelVisible(false)}
confirmModal = { delModal}/>
confirmModal={delModal}
/>
<EditModal
visible={editVisible}
stationObj={stationObj}
onCancel={() => setEditVisible(false)}
confirmModal = { editModal}
confirmModal={editModal}
/>
</Card>
</Col>
<Col lg={18} md={24}>
<Card className={ styles.cardBox}>
<Row align='middle'>
<Card className={styles.cardBox}>
<Row align="middle">
<Col span={1}>搜索</Col>
<Col span={ 8}>
<Col span={8}>
<Search
allowClear
placeholder = {placeholder}
onSearch = { handleSearch}
placeholder={placeholder}
onSearch={handleSearch}
enterButton
/>
</Col>
</Row>
{ ouid && <ListCard ouid={ouid} searchWord = { searchWord }></ListCard>}
{ouid && (
<ListCard
ouid={ouid}
searchWord={searchWord}
valueCallback={valueCallback}
/>
)}
</Card>
</Col>
</Row>
</GridContent>
</PageContainer>
)
}
);
};
export default SiteManage
export default SiteManage;
src/pages/userCenter/siteManage/SiteManage.less
View file @ dd04561a
......@@ -19,9 +19,7 @@
}
.titleBox{
display: flex;
// flex-wrap: wrap;
justify-content: space-around;
align-items: center;
}
.test{
border-radius: 200px;
}
\ No newline at end of file
src/routes/config.js
View file @ dd04561a
......@@ -17,7 +17,7 @@ import RequestTest from '../pages/testPages/request';
import InitDataBase from '../pages/database/InitDataBase';
import ManagementDataBase from '../pages/database/ManagementDataBase';
import UserManage from '../pages/userCenter/UserManage';
import RoleManage from '../pages/userCenter/RoleManage';
import RoleManage from '../pages/userCenter/RoleManage/RoleManage';
import SiteManage from '../pages/userCenter/siteManage/SiteManage';
// import DefaultComponent from '../pages/orgnazation/DefaultComponent';
import TestTable from '../pages/orgnazation/TestTable';
......
src/services/userCenter/RoleManage/api.js 0 → 100644
View file @ dd04561a
import { get, post } from '@/services/index';
// 获取站点信息
export const getWebModuleTree = params =>
get('/Cityinterface/rest/services/OMS.svc/W4_GetWeb4ModuleTree', params);
// 新增站点
export const addStation = params =>
get('/Cityinterface/rest/services/OMS.svc/W4_AddStation', params);
// 删除站点
export const deleteStation = params =>
get('/Cityinterface/rest/services/OMS.svc/P_DeleteStation', params);
// 编辑站点
export const editStation = params =>
get('/Cityinterface/rest/services/OMS.svc/P_EditStation', params);
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