You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
259 lines
13 KiB
259 lines
13 KiB
import React, { useEffect, useState } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import { Spin, Row, Col, Card, Button, Tree, Empty, Checkbox } from 'antd';
|
|
import { getDepMessage, getDepUser } from '../actions/user';
|
|
import { getResource, getUserResource, postUserRes, postUserReso } from '../actions/authority';
|
|
import Resource from '../components/resource';
|
|
import user from './user';
|
|
|
|
const Authority = (props) => {
|
|
const CheckboxGroup = Checkbox.Group;
|
|
const { dispatch, loading, depMessage, depUser, resource, userResource, clientHeight, user } = props
|
|
const r1 = ['USERMANAGE', 'AUTHORIMANAGE', 'OVERLOADMANAGE', 'ROADMANAGE', 'BRIDGEMANAGE', 'MAINTENANCEMANAGE', 'TRANSPORTATIONMANAGE',
|
|
'CONSERVATIONMANAGE', 'PATROLMANAGE', 'PUBLICTRANSPORTMANAGE', 'FILEMANAGE', 'PUBLICITYVIDEO', 'FEEDBACKMANAGE', 'REPORTMANAGE']
|
|
const [depSelectedKeys, setDepSelectedKeys] = useState([])
|
|
const [userSelectedKeys, setUserSelectedKeys] = useState([])
|
|
const [depSelected, setDepSelected] = useState()
|
|
const [userSelected, setUserSelected] = useState()
|
|
const [resCode, setResCode] = useState(userResource.map(i => i.resourceId))
|
|
const [useName, setUseName] = useState()// 选中名字
|
|
const [userType, setUserType] = useState()
|
|
const [depMessagedata, setdepMessagedata] = useState(depMessage)
|
|
|
|
const rescodeall = resource[0]?.resources?.map(i => ({ label: i.name, value: i.code }))
|
|
//console.log(resource[0]?.resources?.map(i => ({ label: i.name, value: i.code })), '这个是总的骂')
|
|
const [indeterminate, setIndeterminate] = useState(false);
|
|
const [checkAll, setCheckAll] = useState(true);
|
|
const [rescheckAll, setrescheckAll] = useState(false)
|
|
const [isshow, setisshow] = useState(false);
|
|
let plainOptions = depUser.map(i => ({ label: i.name, value: i.id }));
|
|
const [checkedList, setCheckedList] = useState(depUser.map(i => i.id));
|
|
const onChange = (list) => {
|
|
// console.log(list,'选择的')
|
|
setCheckedList(list);
|
|
setIndeterminate(!!list.length && list.length < plainOptions.length);
|
|
// setResCode(userResource.map(i=>i.resourceId))
|
|
setCheckAll(list.length === plainOptions.length);
|
|
dispatch(getUserResource(list))
|
|
// if(list.length === plainOptions.length){
|
|
// setUseName('全部用户')
|
|
// }
|
|
};
|
|
// console.log(userSelectedKeys,'当前1')
|
|
const onresChange = (d) => {
|
|
setResCode(d)
|
|
setrescheckAll(d.length === r1.length)
|
|
}
|
|
const onresCheckAllChange = (d) => {
|
|
setrescheckAll(d.target.checked)
|
|
setResCode(d.target.checked ? r1 : [])
|
|
|
|
}
|
|
const onCheckAllChange = (e) => {
|
|
setCheckedList(e.target.checked ? plainOptions.map(i => i.value) : []);
|
|
setIndeterminate(false);
|
|
// if(e.target.checked){
|
|
// setUseName('全部用户')
|
|
// }
|
|
|
|
setCheckAll(e.target.checked);
|
|
// setResCode(userResource.map(i=>i.resourceId))
|
|
};
|
|
const onshowchange = (e) => {
|
|
setisshow(e.target.checked)
|
|
}
|
|
useEffect(() => {
|
|
dispatch(getResource())
|
|
if (!(depMessage && depMessage.length)) {
|
|
dispatch(getDepMessage())
|
|
}
|
|
setResCode(userResource.map(i => i.resourceId))
|
|
setisshow(userResource.some(i => i.isshow === "true"))
|
|
setrescheckAll(userResource.map(i => i.resourceId).length === 14)
|
|
}, [])
|
|
useEffect(() => {
|
|
setResCode(userResource.map(i => i.resourceId))
|
|
setisshow(userResource.some(i => i.isshow === "true"))
|
|
setrescheckAll(userResource.map(i => i.resourceId).length === 14)
|
|
}, [userResource])
|
|
useEffect(() => {
|
|
if (depMessage.length) {
|
|
console.log('depMessage', depMessage)
|
|
setdepMessagedata(depMessage)
|
|
setDepSelectedKeys([depMessage[0]?.id])
|
|
setDepSelected([depMessage[0]?.name])
|
|
dispatch(getDepUser(depMessage[0]?.id))
|
|
}
|
|
|
|
|
|
}, [depMessage])
|
|
useEffect(() => {
|
|
if (depUser.length) {
|
|
setUserSelectedKeys([depUser[0].id])
|
|
setUserSelected(depUser[0].username)
|
|
dispatch(getUserResource(depUser[0].id))
|
|
setUseName(depUser[0].name)
|
|
}
|
|
setCheckedList(depUser.map(i => i.id))
|
|
|
|
|
|
}, [depUser])
|
|
// console.log(depUser,'用户信息')
|
|
const handleSave = () => {
|
|
// console.log( userSelectedKeys[0],'当前选中的id')
|
|
// checkedList.map(i=>{
|
|
// dispatch(postUserRes({ userId: i, resCode: resCode,isShow:isshow })).then(res => {
|
|
// if (res.success) {
|
|
// dispatch(getUserResource(i))
|
|
// }
|
|
// })
|
|
// dispatch(postUserReso({ userId: i, resCode: resCode,isShow:isshow }))
|
|
// })
|
|
|
|
dispatch(postUserRes({ userId: userSelectedKeys[0], resCode: resCode, isShow: isshow })).then(res => {
|
|
if (res.success) {
|
|
dispatch(getUserResource(userSelectedKeys[0]))
|
|
}
|
|
})
|
|
dispatch(postUserReso({ userId: userSelectedKeys[0], resCode: resCode, isShow: isshow }))
|
|
}
|
|
|
|
return (
|
|
<Spin spinning={loading}>
|
|
<Row gutter={16}>
|
|
<Col span={4} style={{ height: '100%' }}>
|
|
<Card title="部门" bordered={false} bodyStyle={{ padding: 8, paddingTop: 24 }}>
|
|
{
|
|
depMessagedata.length ?
|
|
<Tree
|
|
height={clientHeight - 100}
|
|
defaultExpandedKeys={[depMessagedata[0].id]}
|
|
selectedKeys={depSelectedKeys}
|
|
onSelect={(selectedKeys, { selected, selectedNodes, node }) => {
|
|
setUserType(selectedNodes[0].type)
|
|
setCheckedList(depUser.map(i => i.id))
|
|
// setResCode(userResource.map(i=>i.resourceId))
|
|
|
|
|
|
if (selected) {
|
|
setCheckedList(depUser.map(i => i.id))
|
|
setDepSelectedKeys(selectedKeys)
|
|
setDepSelected(selectedNodes[0].name || "")
|
|
dispatch(getDepUser(selectedKeys[0]))
|
|
|
|
// setResCode(userResource.map(i=>i.resourceId))
|
|
|
|
}
|
|
|
|
}}
|
|
treeData={depMessagedata}
|
|
fieldNames={{
|
|
title: 'name',
|
|
key: 'id',
|
|
children: 'subordinate'
|
|
}}
|
|
/> : ''
|
|
}
|
|
</Card>
|
|
</Col>
|
|
<Col span={4} style={{ height: '100%', }}>
|
|
<Card title={` 用户列表`} bordered={false} bodyStyle={{ padding: 8, paddingTop: 24 }}>
|
|
{
|
|
depUser.length ?
|
|
<Tree
|
|
height={clientHeight - 100}
|
|
defaultSelectedKeys={[depUser[0].id]}
|
|
selectedKeys={userSelectedKeys}
|
|
onSelect={(selectedKeys, { selected, selectedNodes, node, event }) => {
|
|
const name = node.name
|
|
setUseName(name)
|
|
|
|
if (selected) {
|
|
// console.log(selectedKeys,'选中的selectedKeys')
|
|
// console.log(selectedNodes[0].username || '','node')
|
|
// console.log(selectedKeys[0],'请求的值')
|
|
setUserSelectedKeys(selectedKeys)
|
|
setUserSelected(selectedNodes[0].username || '')
|
|
dispatch(getUserResource(selectedKeys[0]))
|
|
}
|
|
|
|
}}
|
|
treeData={depUser}
|
|
fieldNames={{
|
|
title: 'name',
|
|
key: 'id'
|
|
}}
|
|
/> : <Empty />
|
|
|
|
// <div>
|
|
// <Checkbox indeterminate={indeterminate} onChange={onCheckAllChange} checked={checkAll} disabled={user?.department?.type==="qifu"&&user?.userResources?.filter(i=>i.resourceId==='AUTHORIMANAGE')[0].isShow==="true"?true:''}>
|
|
// 全选
|
|
// </Checkbox>
|
|
|
|
// <CheckboxGroup options={plainOptions} value={checkedList} onChange={onChange} disabled={user?.department?.type==="qifu"&&user?.userResources?.filter(i=>i.resourceId==='AUTHORIMANAGE')[0].isShow==="true"?true:''}/>
|
|
// </div> : <Empty />
|
|
|
|
}
|
|
</Card>
|
|
</Col>
|
|
<Col span={16} style={{ height: '100%', }}>
|
|
<Checkbox onChange={onshowchange} checked={isshow} disabled={user?.username !== 'SuperAdmin' && user?.userResources?.filter(i => i.resourceId === 'AUTHORIMANAGE')[0]?.isshow === "true" ? true : ''}>
|
|
不可编辑
|
|
</Checkbox>
|
|
{depUser.length ?
|
|
<Card title={` 功能范围`} bordered={false} bodyStyle={{ padding: 8, paddingTop: 24 }}>
|
|
{/* <Resource
|
|
userSelected={userSelected}
|
|
roleData={resource}
|
|
userRole={userResource}
|
|
setResCode={setResCode}
|
|
userType={user?.department?.type==="qifu"&&user?.userResources?.filter(i=>i.resourceId==='AUTHORIMANAGE')[0].isShow==="true"?4:userType}
|
|
/> */}
|
|
<div>
|
|
<Checkbox
|
|
onChange={onresCheckAllChange}
|
|
checked={rescheckAll}
|
|
disabled={user?.username !== 'SuperAdmin' && user?.userResources?.filter(i => i.resourceId === 'AUTHORIMANAGE')[0].isshow === "true" ? true : ''}
|
|
>
|
|
全选
|
|
</Checkbox>
|
|
<CheckboxGroup
|
|
options={rescodeall}
|
|
value={resCode}
|
|
onChange={onresChange}
|
|
disabled={user?.username !== 'SuperAdmin' && user?.userResources?.filter(i => i.resourceId === 'AUTHORIMANAGE')[0].isshow === "true" ? true : ''}
|
|
/>
|
|
</div>
|
|
<Row type="flex" justify="center" style={{ marginBottom: 16, marginTop: 16, textAlign: 'center' }}>
|
|
<Col span="24">
|
|
<Button
|
|
disabled={userSelected === "SuperAdmin" || userType === 4}
|
|
onClick={handleSave}
|
|
style={{ width: '60%' }}
|
|
type='primary'>保存修改</Button>
|
|
</Col></Row>
|
|
</Card>
|
|
: <Card title={`[]功能范围`} bordered={false} bodyStyle={{ padding: 8, paddingTop: 24 }}>
|
|
<Empty />
|
|
</Card>
|
|
}
|
|
</Col>
|
|
</Row>
|
|
</Spin >
|
|
)
|
|
}
|
|
|
|
function mapStateToProps(state) {
|
|
const { userResource, resource, depMessage, depUser, global, auth } = state;
|
|
return {
|
|
clientHeight: global.clientHeight,
|
|
loading: depMessage.isRequesting || depUser.isRequesting || resource.isRequesting,
|
|
userResource: userResource.data || [],
|
|
resource: resource.data || [],
|
|
depMessage: depMessage.data || [],
|
|
depUser: depUser.data || [],
|
|
user: auth.user
|
|
};
|
|
}
|
|
|
|
export default connect(mapStateToProps)(Authority);
|