|
|
|
@ -1,27 +1,35 @@
|
|
|
|
|
import { useEffect, useState } from 'react'; |
|
|
|
|
import { useDispatch, useSelector } from 'react-redux'; |
|
|
|
|
import { useHistory } from 'react-router-dom'; |
|
|
|
|
import { Button } from 'reactstrap'; |
|
|
|
|
import { Button, Row, Col } from 'reactstrap'; |
|
|
|
|
import { BasisGroupGrid } from '../../../components/basis/group/BasisGroupGrid'; |
|
|
|
|
import { BasisGroupUsersGrid } from '../../../components/basis/group/BasisGroupUsersGrid'; |
|
|
|
|
import { BasisGroupUsersSearch } from '../../../components/basis/group/BasisGroupUsersSearch'; |
|
|
|
|
import { CustomMainLayout } from '../../../components/layout/CustomMainLayout'; |
|
|
|
|
import { ConfirmModal } from '../../../components/modal/ConfirmModal'; |
|
|
|
|
import { InfoModal } from '../../../components/modal/InfoModal'; |
|
|
|
|
import * as Actions from '../../../modules/basis/group/actions/basisGroupAction'; |
|
|
|
|
|
|
|
|
|
export const BasisGroupUsersContainer = props => { |
|
|
|
|
const { userList, userCount, joinList, joinListCount } = useSelector( |
|
|
|
|
state => state.groupState |
|
|
|
|
); |
|
|
|
|
|
|
|
|
|
const { user } = useSelector(state => state.authState); |
|
|
|
|
|
|
|
|
|
const dispatch = useDispatch(); |
|
|
|
|
const history = useHistory(); |
|
|
|
|
const { |
|
|
|
|
joinList, |
|
|
|
|
joinListCount, |
|
|
|
|
selectGroup, |
|
|
|
|
groupList, |
|
|
|
|
groupListCount, |
|
|
|
|
userList, |
|
|
|
|
userListCount |
|
|
|
|
} = useSelector(state => state.groupState); |
|
|
|
|
const { user } = useSelector(state => state.authState); |
|
|
|
|
|
|
|
|
|
const [params, setParams] = useState({ |
|
|
|
|
cstmrSno: user?.cstmrSno |
|
|
|
|
cstmrSno: user?.cstmrSno, |
|
|
|
|
groupId: '', |
|
|
|
|
groupAuthCd: '', |
|
|
|
|
aprvlYn: '' |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const titleName = '사용자 관리'; |
|
|
|
|
|
|
|
|
|
const [saveData, setSaveData] = useState({ |
|
|
|
@ -36,7 +44,76 @@ export const BasisGroupUsersContainer = props => {
|
|
|
|
|
desc: '' |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const [infoModal, setInfoModal] = useState({ |
|
|
|
|
isOpen: false, |
|
|
|
|
title: '', |
|
|
|
|
desc: '' |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const columns = [ |
|
|
|
|
{ |
|
|
|
|
name: '그룹명', |
|
|
|
|
selector: 'groupNm', |
|
|
|
|
minWidth: '102px', |
|
|
|
|
sortable: true, |
|
|
|
|
cell: row => { |
|
|
|
|
return row?.groupNm; |
|
|
|
|
// return selectData;
|
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
name: '그룹 코드', |
|
|
|
|
selector: 'groupId', |
|
|
|
|
minWidth: '102px', |
|
|
|
|
sortable: true, |
|
|
|
|
cell: row => { |
|
|
|
|
return row?.groupId; |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
name: '', |
|
|
|
|
sortable: true, |
|
|
|
|
cell: row => { |
|
|
|
|
// return selectData?.groupId === row?.groupId ? (
|
|
|
|
|
// <Button.Ripple
|
|
|
|
|
// color='danger'
|
|
|
|
|
// className='badge badge-danger'
|
|
|
|
|
// onClick={() => handlerCancel()}
|
|
|
|
|
// >
|
|
|
|
|
// 선택취소
|
|
|
|
|
// </Button.Ripple>
|
|
|
|
|
// ) : (
|
|
|
|
|
// <Button.Ripple
|
|
|
|
|
// color='primary'
|
|
|
|
|
// className='badge badge-primary'
|
|
|
|
|
// onClick={() =>
|
|
|
|
|
// handlerDetail(
|
|
|
|
|
// row?.groupId,
|
|
|
|
|
// row?.groupNm,
|
|
|
|
|
// row?.groupAuthCd,
|
|
|
|
|
// row?.aprvlYn
|
|
|
|
|
// )
|
|
|
|
|
// }
|
|
|
|
|
// >
|
|
|
|
|
// 상세보기
|
|
|
|
|
// </Button.Ripple>
|
|
|
|
|
// );
|
|
|
|
|
return ( |
|
|
|
|
<Button.Ripple |
|
|
|
|
color='primary' |
|
|
|
|
className='badge badge-primary' |
|
|
|
|
onClick={() => |
|
|
|
|
handlerDetail(row?.groupId, row?.groupAuthCd, row?.aprvlYn) |
|
|
|
|
} |
|
|
|
|
> |
|
|
|
|
상세보기 |
|
|
|
|
</Button.Ripple> |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
]; |
|
|
|
|
|
|
|
|
|
const userColumns = [ |
|
|
|
|
{ |
|
|
|
|
name: '그룹명', |
|
|
|
|
selector: 'groupNm', |
|
|
|
@ -68,7 +145,7 @@ export const BasisGroupUsersContainer = props => {
|
|
|
|
|
{ |
|
|
|
|
name: '사용자 ID', |
|
|
|
|
selector: 'userId', |
|
|
|
|
minWidth: '150px', |
|
|
|
|
minWidth: '120px', |
|
|
|
|
sortable: true, |
|
|
|
|
cell: row => { |
|
|
|
|
return row?.userId; |
|
|
|
@ -78,7 +155,7 @@ export const BasisGroupUsersContainer = props => {
|
|
|
|
|
{ |
|
|
|
|
name: '권한명', |
|
|
|
|
selector: 'groupAuthCd', |
|
|
|
|
minWidth: '102px', |
|
|
|
|
minWidth: '105px', |
|
|
|
|
sortable: true, |
|
|
|
|
cell: row => { |
|
|
|
|
return row?.groupAuthCd; |
|
|
|
@ -87,7 +164,7 @@ export const BasisGroupUsersContainer = props => {
|
|
|
|
|
{ |
|
|
|
|
name: '가입 일시', |
|
|
|
|
selector: 'joinDt', |
|
|
|
|
minWidth: '200px', |
|
|
|
|
minWidth: '150px', |
|
|
|
|
sortable: true, |
|
|
|
|
cell: row => { |
|
|
|
|
return row?.joinDt; |
|
|
|
@ -166,38 +243,57 @@ export const BasisGroupUsersContainer = props => {
|
|
|
|
|
} |
|
|
|
|
]; |
|
|
|
|
|
|
|
|
|
// useEffect(() => {
|
|
|
|
|
// handlerSearch();
|
|
|
|
|
// }, []);
|
|
|
|
|
|
|
|
|
|
const handlerSearch = () => { |
|
|
|
|
if (params.cstmrSno && user?.cstmrSno) { |
|
|
|
|
dispatch( |
|
|
|
|
Actions.USER_LIST.request({ |
|
|
|
|
searchParams: params, |
|
|
|
|
cstmrSno: user?.cstmrSno |
|
|
|
|
}) |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
if (user?.cstmrSno) { |
|
|
|
|
dispatch(Actions.JOIN_LIST.request({ cstmrSno: user?.cstmrSno })); |
|
|
|
|
// setParams({
|
|
|
|
|
// ...params,
|
|
|
|
|
// cstmrSno: user?.cstmrSno
|
|
|
|
|
// });
|
|
|
|
|
|
|
|
|
|
// dispatch(
|
|
|
|
|
// Actions.USER_LIST.request({
|
|
|
|
|
// searchParams: { cstmrSno: user?.cstmrSno }
|
|
|
|
|
// })
|
|
|
|
|
// );
|
|
|
|
|
setParams({ |
|
|
|
|
...params, |
|
|
|
|
cstmrSno: user?.cstmrSno |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
}, [user]); |
|
|
|
|
|
|
|
|
|
// useEffect(() => {
|
|
|
|
|
|
|
|
|
|
// }, [params]);
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
handlerSearch(); |
|
|
|
|
}, []); |
|
|
|
|
const handlerDetail = (groupId, groupAuthCd, aprvlYn) => { |
|
|
|
|
if ( |
|
|
|
|
groupAuthCd === 'MASTER' || |
|
|
|
|
user.authId === 'SUPER' || |
|
|
|
|
user.authId === 'ADMIN' || |
|
|
|
|
(aprvlYn === 'Y' && groupAuthCd === 'LEADER') |
|
|
|
|
) { |
|
|
|
|
const param = params; |
|
|
|
|
param.groupId = groupId; |
|
|
|
|
param.groupAuthCd = groupAuthCd; |
|
|
|
|
param.aprvlYn = aprvlYn; |
|
|
|
|
|
|
|
|
|
const handlerSearch = () => { |
|
|
|
|
if (params.cstmrSno && user?.cstmrSno) { |
|
|
|
|
dispatch( |
|
|
|
|
Actions.USER_LIST.request({ |
|
|
|
|
searchParams: params, |
|
|
|
|
cstmrSno: user?.cstmrSno |
|
|
|
|
searchParams: param |
|
|
|
|
}) |
|
|
|
|
); |
|
|
|
|
|
|
|
|
|
console.log('볼 수 있음'); |
|
|
|
|
} else { |
|
|
|
|
console.log('볼 수 없다'); |
|
|
|
|
setInfoModal({ |
|
|
|
|
isOpen: true, |
|
|
|
|
title: '권한 확인', |
|
|
|
|
desc: '사용자관리 확인을 위해서는 운영자 권한이 필요합니다. 운영자에게 권한을 부여받고 다시 시도해 주세요.' |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
@ -274,7 +370,7 @@ export const BasisGroupUsersContainer = props => {
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<CustomMainLayout title={titleName}> |
|
|
|
|
<BasisGroupUsersSearch |
|
|
|
|
{/* <BasisGroupUsersSearch |
|
|
|
|
handlerInput={handlerInput} |
|
|
|
|
handlerSearch={handlerSearch} |
|
|
|
|
params={params} |
|
|
|
@ -284,10 +380,56 @@ export const BasisGroupUsersContainer = props => {
|
|
|
|
|
<BasisGroupUsersGrid |
|
|
|
|
data={userList} |
|
|
|
|
title={'사용자'} |
|
|
|
|
columns={columns} |
|
|
|
|
columns={userColumns} |
|
|
|
|
count={userCount} |
|
|
|
|
pagination={false} |
|
|
|
|
/> */} |
|
|
|
|
<div className='pal-card-box'> |
|
|
|
|
<Row> |
|
|
|
|
<Col sm='4'> |
|
|
|
|
<BasisGroupGrid |
|
|
|
|
data={joinList} |
|
|
|
|
title={'그룹'} |
|
|
|
|
columns={columns} |
|
|
|
|
count={joinListCount} |
|
|
|
|
pagination={true} |
|
|
|
|
/> |
|
|
|
|
</Col> |
|
|
|
|
<Col sm='8'> |
|
|
|
|
{!userList ? ( |
|
|
|
|
<div className='no-dataTable'> |
|
|
|
|
그룹 목록에서 상세보기를 클릭하세요. |
|
|
|
|
</div> |
|
|
|
|
) : ( |
|
|
|
|
<> |
|
|
|
|
<BasisGroupUsersSearch |
|
|
|
|
handlerInput={handlerInput} |
|
|
|
|
// handlerSearch={handlerSearch}
|
|
|
|
|
params={params} |
|
|
|
|
onKeyPress={onKeyPress} |
|
|
|
|
setParams={setParams} |
|
|
|
|
/> |
|
|
|
|
{/* <BasisGroupUsersGrid |
|
|
|
|
data={userList} |
|
|
|
|
title={'그룹'} |
|
|
|
|
columns={userColumns} |
|
|
|
|
count={userListCount} |
|
|
|
|
pagination={false} |
|
|
|
|
/> */} |
|
|
|
|
</> |
|
|
|
|
)} |
|
|
|
|
</Col> |
|
|
|
|
<Col sm='12'> |
|
|
|
|
<BasisGroupUsersGrid |
|
|
|
|
data={userList} |
|
|
|
|
title={'그룹'} |
|
|
|
|
columns={userColumns} |
|
|
|
|
count={userListCount} |
|
|
|
|
pagination={false} |
|
|
|
|
/> |
|
|
|
|
</Col> |
|
|
|
|
</Row> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<ConfirmModal |
|
|
|
|
modal={modal} |
|
|
|
@ -295,6 +437,7 @@ export const BasisGroupUsersContainer = props => {
|
|
|
|
|
handlerConfirm={handlerAuthSave} |
|
|
|
|
color='primary' |
|
|
|
|
/> |
|
|
|
|
{/* <InfoModal model={infoModal} setModal={setInfoModal} /> */} |
|
|
|
|
</CustomMainLayout> |
|
|
|
|
); |
|
|
|
|
}; |
|
|
|
|