junh_eee(이준희)
2 years ago
2 changed files with 555 additions and 379 deletions
@ -1,362 +1,405 @@ |
|||||||
// ** React Imports
|
// ** React Imports
|
||||||
import { useState, useEffect } from 'react' |
import { useState, useEffect } from 'react'; |
||||||
import { useParams, Link } from 'react-router-dom' |
import { useParams, Link } from 'react-router-dom'; |
||||||
import { useSelector, useDispatch } from 'react-redux' |
import { useSelector, useDispatch } from 'react-redux'; |
||||||
// ** Styles
|
// ** Styles
|
||||||
import '../../../assets/css/custom.css'; |
import '../../../assets/css/custom.css'; |
||||||
// ** Third Party Components
|
// ** Third Party Components
|
||||||
import { User, Info, CreditCard, Lock, Check, X } from 'react-feather' |
import { User, Info, CreditCard, Lock, Check, X } from 'react-feather'; |
||||||
import { |
import { |
||||||
Card, CardBody, Row, Col, Nav, NavItem, NavLink, TabContent, TabPane, Alert, FormGroup, Form, Input, Label, Button, |
Card, |
||||||
Modal, ModalHeader, ModalBody, ModalFooter |
CardBody, |
||||||
} from 'reactstrap' |
Row, |
||||||
|
Col, |
||||||
|
Nav, |
||||||
|
NavItem, |
||||||
|
NavLink, |
||||||
|
TabContent, |
||||||
|
TabPane, |
||||||
|
Alert, |
||||||
|
FormGroup, |
||||||
|
Form, |
||||||
|
Input, |
||||||
|
Label, |
||||||
|
Button, |
||||||
|
Modal, |
||||||
|
ModalHeader, |
||||||
|
ModalBody, |
||||||
|
ModalFooter |
||||||
|
} from 'reactstrap'; |
||||||
import { accountApi } from '../../../modules/account/register/apis/accountApi'; |
import { accountApi } from '../../../modules/account/register/apis/accountApi'; |
||||||
import AccountMypagePwForm from '../../../components/account/mypage/AccountMypagePwForm'; |
import AccountMypagePwForm from '../../../components/account/mypage/AccountMypagePwForm'; |
||||||
import AccountMypageForm from '../../../components/account/mypage/AccountMypageForm'; |
import AccountMypageForm from '../../../components/account/mypage/AccountMypageForm'; |
||||||
import { userPageAction, userupdateAction } from '../../../modules/account/login/actions/authAction'; |
import { |
||||||
|
userPageAction, |
||||||
|
userupdateAction |
||||||
|
} from '../../../modules/account/login/actions/authAction'; |
||||||
|
|
||||||
import { MessageErrorModal } from '../../../components/message/MessageErrorModal'; |
import { MessageErrorModal } from '../../../components/message/MessageErrorModal'; |
||||||
import { MessageInfoModal } from '../../../components/message/MessageInfoModal'; |
import { MessageInfoModal } from '../../../components/message/MessageInfoModal'; |
||||||
import { USER_LIST } from '../../../modules/basis/group/actions/basisGroupAction'; |
import { USER_LIST } from '../../../modules/basis/group/actions/basisGroupAction'; |
||||||
|
import { ConfirmModal } from '../../../components/modal/ConfirmModal'; |
||||||
|
|
||||||
// ** Function to toggle tabs
|
// ** Function to toggle tabs
|
||||||
const AccountMypageContainer = () => { |
const AccountMypageContainer = () => { |
||||||
const [activeTab, setActiveTab] = useState('1'), |
const [activeTab, setActiveTab] = useState('1'), |
||||||
store = useSelector(state => state.users), |
store = useSelector(state => state.users), |
||||||
dispatch = useDispatch(), |
dispatch = useDispatch(), |
||||||
{ id } = useParams() |
{ id } = useParams(); |
||||||
|
|
||||||
const toggle = tab => setActiveTab(tab) |
|
||||||
const [formModal, setFormModal] = useState(false) |
|
||||||
const { userPage } = useSelector(state => state.UserPageState); |
|
||||||
const { user } = useSelector(state => state.authState); |
|
||||||
const { userPwPage } = useSelector(state => state.UserPwState); |
|
||||||
|
|
||||||
const [userInfo, setUserInfo] = useState(); |
|
||||||
|
|
||||||
const [inputHpno, setInputHpno] = useState(''); |
|
||||||
const [inputCrtfy, setInputCrtfy] = useState(''); |
|
||||||
|
|
||||||
const [minutes_Counter, setMinutes_Counter] = useState('03'); |
|
||||||
const [seconds_Counter, setSeconds_Counter] = useState('00'); |
|
||||||
const [timer, setTimer] = useState(null); |
|
||||||
const [isRunning, setIsRunning] = useState(false); |
|
||||||
const [sendCount, setSendCount] = useState(0); |
|
||||||
const [isCrtfy, setIsCrtfy] = useState(false); |
|
||||||
|
|
||||||
const [okinput, setOkinput] = useState(false) |
|
||||||
const [okcheck, setOkcheck] = useState(''); |
|
||||||
|
|
||||||
const [modal, setModal] = useState({ |
|
||||||
isOpen: false, |
|
||||||
title: '', |
|
||||||
desc: '', |
|
||||||
color: '' |
|
||||||
}); |
|
||||||
|
|
||||||
const timerStart = count => { |
const toggle = tab => setActiveTab(tab); |
||||||
let minutes, seconds; |
const [formModal, setFormModal] = useState(false); |
||||||
|
const { userPage } = useSelector(state => state.UserPageState); |
||||||
const timer = setInterval(() => { |
const { user } = useSelector(state => state.authState); |
||||||
setIsRunning(true); |
const { userPwPage } = useSelector(state => state.UserPwState); |
||||||
minutes = parseInt(count / 60, 10); |
|
||||||
seconds = parseInt(count % 60, 10); |
const [userInfo, setUserInfo] = useState(); |
||||||
minutes = minutes < 10 ? '0' + minutes : minutes; |
|
||||||
seconds = seconds < 10 ? '0' + seconds : seconds; |
const [inputHpno, setInputHpno] = useState(''); |
||||||
setMinutes_Counter(minutes); |
const [inputCrtfy, setInputCrtfy] = useState(''); |
||||||
setSeconds_Counter(seconds); |
|
||||||
|
const [minutes_Counter, setMinutes_Counter] = useState('03'); |
||||||
//타이머 끝
|
const [seconds_Counter, setSeconds_Counter] = useState('00'); |
||||||
if (--count < 0) { |
const [timer, setTimer] = useState(null); |
||||||
clearInterval(timer); |
const [isRunning, setIsRunning] = useState(false); |
||||||
setIsRunning(false); |
const [sendCount, setSendCount] = useState(0); |
||||||
setInputCrtfy('crtfyhpNo', ''); |
const [isCrtfy, setIsCrtfy] = useState(false); |
||||||
// setCrtfyNo('');
|
|
||||||
setModal({ |
const [okinput, setOkinput] = useState(false); |
||||||
isOpen: true, |
const [okcheck, setOkcheck] = useState(''); |
||||||
title: '인증번호 만료', |
|
||||||
desc: '인증번호가 만료되었습니다.', |
const [modal, setModal] = useState({ |
||||||
color: 'modal-danger' |
isOpen: false, |
||||||
}) |
title: '', |
||||||
} |
desc: '', |
||||||
}, 1000); |
color: '' |
||||||
|
}); |
||||||
setTimer(timer); |
const [quite, setQuite] = useState({ |
||||||
|
isOpen: false, |
||||||
return () => { |
title: '', |
||||||
clearInterval(timer); |
desc: '', |
||||||
}; |
color: '' |
||||||
}; |
}); |
||||||
useEffect(() => { |
|
||||||
if (userInfo) { |
const timerStart = count => { |
||||||
setOkcheck(!okinput ? userInfo.hpno : inputHpno) |
let minutes, seconds; |
||||||
}
|
|
||||||
}, [userInfo]) |
const timer = setInterval(() => { |
||||||
|
setIsRunning(true); |
||||||
//휴대폰 인증번호 보내기
|
minutes = parseInt(count / 60, 10); |
||||||
const handlerSmsSend = async () => { |
seconds = parseInt(count % 60, 10); |
||||||
// const vData = getValues();
|
minutes = minutes < 10 ? '0' + minutes : minutes; |
||||||
|
seconds = seconds < 10 ? '0' + seconds : seconds; |
||||||
if (!inputHpno) { |
setMinutes_Counter(minutes); |
||||||
setModal({ |
setSeconds_Counter(seconds); |
||||||
isOpen: true, |
|
||||||
title: '인증번호 발송', |
|
||||||
desc: '휴대폰 번호를 입력해 주세요.', |
|
||||||
color: 'modal-danger' |
|
||||||
}); |
|
||||||
return; |
|
||||||
} |
|
||||||
if (sendCount >= 3) { |
|
||||||
setModal({ |
|
||||||
isOpen: true, |
|
||||||
title: '인증번호 발송', |
|
||||||
desc: '인증번호 발송은 3회까지만 가능합니다.', |
|
||||||
color: 'modal-danger' |
|
||||||
}); |
|
||||||
return; |
|
||||||
} |
|
||||||
if(inputHpno.length < 11) { |
|
||||||
setModal({ |
|
||||||
isOpen: true, |
|
||||||
title: '인증번호 발송', |
|
||||||
desc: '올바른 번호를 입력해 주세요.', |
|
||||||
color: 'modal-danger' |
|
||||||
}) |
|
||||||
return; |
|
||||||
} |
|
||||||
|
|
||||||
const res = await accountApi.crtfyhp(inputHpno); |
|
||||||
|
|
||||||
if (!res.data.result) { |
|
||||||
if (res.data.code === -1) { |
|
||||||
setModal({ |
|
||||||
isOpen: true, |
|
||||||
title: '인증번호 발송', |
|
||||||
desc: '이미 가입된 휴대폰입니다.', |
|
||||||
color: 'modal-danger' |
|
||||||
}); |
|
||||||
} else { |
|
||||||
setModal({ |
|
||||||
isOpen: true, |
|
||||||
title: '인증번호 발송', |
|
||||||
desc: '인증번호 발송을 실패하였습니다.', |
|
||||||
color: 'modal-danger' |
|
||||||
}); |
|
||||||
} |
|
||||||
return; |
|
||||||
} else { |
|
||||||
{ |
|
||||||
setModal({ |
|
||||||
isOpen: true, |
|
||||||
title: '인증번호 발송', |
|
||||||
desc: '인증번호를 발송했습니다.', |
|
||||||
color: 'modal-primary' |
|
||||||
}); |
|
||||||
} |
|
||||||
} |
|
||||||
// console.log(res);
|
|
||||||
if (isRunning) { |
|
||||||
clearInterval(timer); |
|
||||||
} |
|
||||||
setIsRunning(true); |
|
||||||
setSendCount(sendCount + 1); |
|
||||||
timerStart(180); |
|
||||||
|
|
||||||
// handlerSmsSend();
|
|
||||||
}; |
|
||||||
|
|
||||||
useEffect(() => { |
//타이머 끝
|
||||||
// setIsRunning(true);
|
if (--count < 0) { |
||||||
if (isRunning) { |
clearInterval(timer); |
||||||
clearInterval(timer); |
setIsRunning(false); |
||||||
} |
setInputCrtfy('crtfyhpNo', ''); |
||||||
return () => { |
// setCrtfyNo('');
|
||||||
clearInterval(timer); |
setModal({ |
||||||
// setIsRunning(false);
|
isOpen: true, |
||||||
}; |
title: '인증번호 만료', |
||||||
}, []); |
desc: '인증번호가 만료되었습니다.', |
||||||
|
color: 'modal-danger' |
||||||
//휴대폰 인증하기
|
}); |
||||||
const handlerSmsConfirm = async () => { |
} |
||||||
//const vData = getValues();
|
}, 1000); |
||||||
|
|
||||||
if (!inputHpno) { |
setTimer(timer); |
||||||
setModal({ |
|
||||||
isOpen: true, |
return () => { |
||||||
title: '인증번호 인증', |
clearInterval(timer); |
||||||
desc: '휴대폰 번호를 입력해 주세요.', |
|
||||||
color: 'modal-danger' |
|
||||||
}); |
|
||||||
|
|
||||||
return false; |
|
||||||
} |
|
||||||
if (!inputCrtfy) { |
|
||||||
setModal({ |
|
||||||
isOpen: true, |
|
||||||
title: '인증번호 인증', |
|
||||||
desc: '인증번호를 입력해 주세요.', |
|
||||||
color: 'modal-danger' |
|
||||||
}); |
|
||||||
return false; |
|
||||||
} |
|
||||||
|
|
||||||
const res = await accountApi.crtfyhpConfirm(inputHpno, inputCrtfy); |
|
||||||
|
|
||||||
if (!res.data.result) { |
|
||||||
setModal({ |
|
||||||
isOpen: true, |
|
||||||
title: '인증번호 인증', |
|
||||||
desc: '인증번호가 잘못되었습니다.', |
|
||||||
color: 'modal-danger' |
|
||||||
}) |
|
||||||
} |
|
||||||
else if (res?.data.code === 0) { |
|
||||||
setModal({ |
|
||||||
isOpen: true, |
|
||||||
title: '인증번호 발송', |
|
||||||
desc: '인증번호가 발송되었습니다.', |
|
||||||
color: 'modal-primary' |
|
||||||
}) |
|
||||||
} else { |
|
||||||
setModal({ |
|
||||||
isOpen: true, |
|
||||||
title: '인증번호 성공', |
|
||||||
desc: '인증되었습니다', |
|
||||||
color: 'modal-primary' |
|
||||||
}) |
|
||||||
setOkinput(!okinput); |
|
||||||
} |
|
||||||
setIsRunning(true); |
|
||||||
setIsCrtfy(true); |
|
||||||
}; |
}; |
||||||
|
}; |
||||||
|
useEffect(() => { |
||||||
|
if (userInfo) { |
||||||
|
setOkcheck(!okinput ? userInfo.hpno : inputHpno); |
||||||
|
} |
||||||
|
}, [userInfo]); |
||||||
|
|
||||||
|
//휴대폰 인증번호 보내기
|
||||||
|
const handlerSmsSend = async () => { |
||||||
|
// const vData = getValues();
|
||||||
|
|
||||||
|
if (!inputHpno) { |
||||||
|
setModal({ |
||||||
|
isOpen: true, |
||||||
|
title: '인증번호 발송', |
||||||
|
desc: '휴대폰 번호를 입력해 주세요.', |
||||||
|
color: 'modal-danger' |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (sendCount >= 3) { |
||||||
|
setModal({ |
||||||
|
isOpen: true, |
||||||
|
title: '인증번호 발송', |
||||||
|
desc: '인증번호 발송은 3회까지만 가능합니다.', |
||||||
|
color: 'modal-danger' |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (inputHpno.length < 11) { |
||||||
|
setModal({ |
||||||
|
isOpen: true, |
||||||
|
title: '인증번호 발송', |
||||||
|
desc: '올바른 번호를 입력해 주세요.', |
||||||
|
color: 'modal-danger' |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
useEffect(() => { |
const res = await accountApi.crtfyhp(inputHpno); |
||||||
if (userPage) |
|
||||||
setUserInfo(userPage[0]) |
|
||||||
}, [userPage]) |
|
||||||
|
|
||||||
const handlerInput = e => { |
if (!res.data.result) { |
||||||
const { name, value } = e.target; |
if (res.data.code === -1) { |
||||||
setUserInfo({ |
setModal({ |
||||||
...userInfo, |
isOpen: true, |
||||||
[name]: value |
title: '인증번호 발송', |
||||||
|
desc: '이미 가입된 휴대폰입니다.', |
||||||
|
color: 'modal-danger' |
||||||
|
}); |
||||||
|
} else { |
||||||
|
setModal({ |
||||||
|
isOpen: true, |
||||||
|
title: '인증번호 발송', |
||||||
|
desc: '인증번호 발송을 실패하였습니다.', |
||||||
|
color: 'modal-danger' |
||||||
|
}); |
||||||
|
} |
||||||
|
return; |
||||||
|
} else { |
||||||
|
{ |
||||||
|
setModal({ |
||||||
|
isOpen: true, |
||||||
|
title: '인증번호 발송', |
||||||
|
desc: '인증번호를 발송했습니다.', |
||||||
|
color: 'modal-primary' |
||||||
}); |
}); |
||||||
|
} |
||||||
|
} |
||||||
|
// console.log(res);
|
||||||
|
if (isRunning) { |
||||||
|
clearInterval(timer); |
||||||
|
} |
||||||
|
setIsRunning(true); |
||||||
|
setSendCount(sendCount + 1); |
||||||
|
timerStart(180); |
||||||
|
|
||||||
|
// handlerSmsSend();
|
||||||
|
}; |
||||||
|
|
||||||
|
useEffect(() => { |
||||||
|
// setIsRunning(true);
|
||||||
|
if (isRunning) { |
||||||
|
clearInterval(timer); |
||||||
|
} |
||||||
|
return () => { |
||||||
|
clearInterval(timer); |
||||||
|
// setIsRunning(false);
|
||||||
}; |
}; |
||||||
|
}, []); |
||||||
|
|
||||||
|
//휴대폰 인증하기
|
||||||
|
const handlerSmsConfirm = async () => { |
||||||
|
//const vData = getValues();
|
||||||
|
|
||||||
useEffect(() => { |
if (!inputHpno) { |
||||||
if (user) { |
setModal({ |
||||||
dispatch(userPageAction.request(user.cstmrSno)); |
isOpen: true, |
||||||
} |
title: '인증번호 인증', |
||||||
}, []); |
desc: '휴대폰 번호를 입력해 주세요.', |
||||||
|
color: 'modal-danger' |
||||||
|
}); |
||||||
|
|
||||||
const handler = () => { |
return false; |
||||||
setFormModal(!formModal) |
|
||||||
} |
} |
||||||
|
if (!inputCrtfy) { |
||||||
|
setModal({ |
||||||
|
isOpen: true, |
||||||
|
title: '인증번호 인증', |
||||||
|
desc: '인증번호를 입력해 주세요.', |
||||||
|
color: 'modal-danger' |
||||||
|
}); |
||||||
|
return false; |
||||||
|
} |
||||||
|
|
||||||
|
const res = await accountApi.crtfyhpConfirm(inputHpno, inputCrtfy); |
||||||
|
|
||||||
let hpno = ''; |
if (!res.data.result) { |
||||||
let crtfyhp = ''; |
setModal({ |
||||||
const handlerChange = (e) => { |
isOpen: true, |
||||||
const { name, value } = e.target; |
title: '인증번호 인증', |
||||||
|
desc: '인증번호가 잘못되었습니다.', |
||||||
if (name == 'hpno') { |
color: 'modal-danger' |
||||||
const regex = /^[0-9]{0,11}$/; |
}); |
||||||
if(regex.test(value)){ |
} else if (res?.data.code === 0) { |
||||||
hpno = value; |
setModal({ |
||||||
setInputHpno(hpno) |
isOpen: true, |
||||||
} |
title: '인증번호 발송', |
||||||
} else if (name == 'crtfyhpNo') { |
desc: '인증번호가 발송되었습니다.', |
||||||
const regex = /^[0-9]{0,6}$/; |
color: 'modal-primary' |
||||||
if(regex.test(value)) { |
}); |
||||||
crtfyhp = value; |
} else { |
||||||
setInputCrtfy(crtfyhp) |
setModal({ |
||||||
} |
isOpen: true, |
||||||
} |
title: '인증번호 성공', |
||||||
|
desc: '인증되었습니다', |
||||||
|
color: 'modal-primary' |
||||||
|
}); |
||||||
|
setOkinput(!okinput); |
||||||
} |
} |
||||||
//업데이트
|
setIsRunning(true); |
||||||
const handlerUpdate = () => { |
setIsCrtfy(true); |
||||||
const param = { |
}; |
||||||
cstmrSno: user.cstmrSno, |
|
||||||
email: userInfo.email, |
useEffect(() => { |
||||||
updateUserId: userInfo.userId, |
if (userPage) setUserInfo(userPage[0]); |
||||||
hpno: okcheck |
}, [userPage]); |
||||||
} |
|
||||||
|
const handlerInput = e => { |
||||||
dispatch(userupdateAction.request(param)); |
const { name, value } = e.target; |
||||||
|
setUserInfo({ |
||||||
|
...userInfo, |
||||||
|
[name]: value |
||||||
|
}); |
||||||
|
}; |
||||||
|
|
||||||
|
useEffect(() => { |
||||||
|
if (user) { |
||||||
|
dispatch(userPageAction.request(user.cstmrSno)); |
||||||
|
} |
||||||
|
}, []); |
||||||
|
|
||||||
|
const handler = () => { |
||||||
|
setFormModal(!formModal); |
||||||
|
}; |
||||||
|
|
||||||
|
let hpno = ''; |
||||||
|
let crtfyhp = ''; |
||||||
|
const handlerChange = e => { |
||||||
|
const { name, value } = e.target; |
||||||
|
|
||||||
|
if (name == 'hpno') { |
||||||
|
const regex = /^[0-9]{0,11}$/; |
||||||
|
if (regex.test(value)) { |
||||||
|
hpno = value; |
||||||
|
setInputHpno(hpno); |
||||||
|
} |
||||||
|
} else if (name == 'crtfyhpNo') { |
||||||
|
const regex = /^[0-9]{0,6}$/; |
||||||
|
if (regex.test(value)) { |
||||||
|
crtfyhp = value; |
||||||
|
setInputCrtfy(crtfyhp); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
//업데이트
|
||||||
|
const handlerUpdate = () => { |
||||||
|
const param = { |
||||||
|
cstmrSno: user.cstmrSno, |
||||||
|
email: userInfo.email, |
||||||
|
updateUserId: userInfo.userId, |
||||||
|
hpno: okcheck |
||||||
}; |
}; |
||||||
|
|
||||||
return ( |
dispatch(userupdateAction.request(param)); |
||||||
<div className='pal-card'> |
}; |
||||||
<div className='card-body-tab-menu'> |
|
||||||
<Nav pills> |
const handlerTest = () => { |
||||||
<NavItem> |
setQuite({ |
||||||
<NavLink active={activeTab === '1'} onClick={() => toggle('1')}> |
isOpen: true, |
||||||
<User size={14} /> |
title: '탈퇴 확인', |
||||||
<span className='align-middle d-none d-sm-block'>내정보</span> |
desc: '정말로 탈퇴 하시겠습니까?' |
||||||
</NavLink> |
}); |
||||||
</NavItem> |
return; |
||||||
<NavItem> |
}; |
||||||
<NavLink active={activeTab === '2'} onClick={() => toggle('2')}> |
|
||||||
<Lock size={14} /> |
const waitwait = () => { |
||||||
<span className='align-middle d-none d-sm-block'>비밀번호 변경</span> |
alert('아직 탈퇴 못해용~'); |
||||||
</NavLink> |
}; |
||||||
</NavItem> |
|
||||||
</Nav> |
return ( |
||||||
</div> |
<div className='pal-card'> |
||||||
{activeTab == 1 ? <AccountMypageForm |
<div className='card-body-tab-menu'> |
||||||
userInfo={userInfo} |
<Nav pills> |
||||||
handler={handler} |
<NavItem> |
||||||
formModal={formModal} |
<NavLink active={activeTab === '1'} onClick={() => toggle('1')}> |
||||||
handlerUpdate={handlerUpdate} |
<User size={14} /> |
||||||
handlerInput={handlerInput} |
<span className='align-middle d-none d-sm-block'>내정보</span> |
||||||
inputHpno={inputHpno} |
</NavLink> |
||||||
inputCrtfy={inputCrtfy} |
</NavItem> |
||||||
okinput={okinput} |
<NavItem> |
||||||
handlerChange={handlerChange} |
<NavLink active={activeTab === '2'} onClick={() => toggle('2')}> |
||||||
handlerSmsConfirm={handlerSmsConfirm} |
<Lock size={14} /> |
||||||
modal={modal} |
<span className='align-middle d-none d-sm-block'> |
||||||
isRunning={isRunning} |
비밀번호 변경 |
||||||
minutes_Counter={minutes_Counter} |
</span> |
||||||
seconds_Counter={seconds_Counter} |
</NavLink> |
||||||
handlerSmsSend={handlerSmsSend} |
</NavItem> |
||||||
isCrtfy={isCrtfy} |
</Nav> |
||||||
/> |
</div> |
||||||
: |
{activeTab == 1 ? ( |
||||||
<></> |
<> |
||||||
} |
<AccountMypageForm |
||||||
{activeTab == 2 ? |
userInfo={userInfo} |
||||||
<AccountMypagePwForm |
handler={handler} |
||||||
user={user} |
formModal={formModal} |
||||||
/> |
handlerUpdate={handlerUpdate} |
||||||
: |
handlerInput={handlerInput} |
||||||
<></> |
inputHpno={inputHpno} |
||||||
} |
inputCrtfy={inputCrtfy} |
||||||
<div className='vertically-centered-modal'> |
okinput={okinput} |
||||||
<Modal |
handlerChange={handlerChange} |
||||||
isOpen={modal.isOpen} |
handlerSmsConfirm={handlerSmsConfirm} |
||||||
toggle={() => setModal({ ...modal, isOpen: !modal.isOpen })} |
modal={modal} |
||||||
modalClassName={modal.color} |
isRunning={isRunning} |
||||||
className='modal-dialog-centered' |
minutes_Counter={minutes_Counter} |
||||||
> |
seconds_Counter={seconds_Counter} |
||||||
<ModalHeader |
handlerSmsSend={handlerSmsSend} |
||||||
toggle={() => setModal({ ...modal, isOpen: !modal.isOpen })} |
isCrtfy={isCrtfy} |
||||||
> |
handlerWidthrow={handlerTest} |
||||||
{modal.title} |
/> |
||||||
</ModalHeader> |
<ConfirmModal |
||||||
<ModalBody>{modal.desc}</ModalBody> |
modal={quite} |
||||||
<ModalFooter> |
setModal={setQuite} |
||||||
<Button |
handlerConfirm={waitwait} |
||||||
color='danger' |
color='danger' |
||||||
onClick={() => setModal({ ...modal, isOpen: !modal.isOpen })} |
/> |
||||||
> |
</> |
||||||
확인 |
) : ( |
||||||
</Button>{' '} |
<></> |
||||||
</ModalFooter> |
)} |
||||||
</Modal> |
{activeTab == 2 ? <AccountMypagePwForm user={user} /> : <></>} |
||||||
</div> |
<div className='vertically-centered-modal'> |
||||||
<MessageErrorModal /> |
<Modal |
||||||
<MessageInfoModal /> |
isOpen={modal.isOpen} |
||||||
</div> |
toggle={() => setModal({ ...modal, isOpen: !modal.isOpen })} |
||||||
) |
modalClassName={modal.color} |
||||||
} |
className='modal-dialog-centered' |
||||||
|
> |
||||||
|
<ModalHeader |
||||||
|
toggle={() => setModal({ ...modal, isOpen: !modal.isOpen })} |
||||||
|
> |
||||||
|
{modal.title} |
||||||
|
</ModalHeader> |
||||||
|
<ModalBody>{modal.desc}</ModalBody> |
||||||
|
<ModalFooter> |
||||||
|
<Button |
||||||
|
color='danger' |
||||||
|
onClick={() => setModal({ ...modal, isOpen: !modal.isOpen })} |
||||||
|
> |
||||||
|
확인 |
||||||
|
</Button>{' '} |
||||||
|
</ModalFooter> |
||||||
|
</Modal> |
||||||
|
</div> |
||||||
|
<MessageErrorModal /> |
||||||
|
<MessageInfoModal /> |
||||||
|
</div> |
||||||
|
); |
||||||
|
}; |
||||||
export default AccountMypageContainer; |
export default AccountMypageContainer; |
||||||
|
|||||||
Loading…
Reference in new issue