마이페이지 수정

src/components/account/mypage/AccountMypageForm.js

@@ -12,7 +12,8 @@ import '../../../assets/css/custom.css';
 //import {UserPageState,UserPageData,initResponseUserPageData} from '../../../../modules/account/login/models/authModel';
 //const [detailData, setDetailData] = useState(userPage.UserPageData);
 
-const MypageForm = ({ userInfo, formModal }) => {
+const AccountMypageForm = ({ userInfo, handler, formModal}) => {
+
     return (
         <Row className='app-user-edit'>
             <Col sm='12'>
@@ -69,7 +70,7 @@ const MypageForm = ({ userInfo, formModal }) => {
                                                     휴대폰 번호
                                                 </Label>
                                                 <div className='user-phone-btn' >
-                                                    <Button.Ripple type='button' color='primary' onClick={() => setFormModal(!formModal)}>
+                                                    <Button.Ripple type='button' color='primary' onClick={handler}>
                                                         <span className='d-sm-inline-block'>변경</span>
                                                     </Button.Ripple>
                                                 </div>
@@ -77,10 +78,10 @@ const MypageForm = ({ userInfo, formModal }) => {
                                                 <div>
                                                     <Modal
                                                         isOpen={formModal}
-                                                        toggle={() => setFormModal(!formModal)}
+                                                        toggle={handler}
                                                         className='modal-dialog-centered'
                                                     >
-                                                        <ModalHeader toggle={() => setFormModal(!formModal)}>
+                                                        <ModalHeader toggle={handler}>
                                                             휴대폰번호 변경
                                                         </ModalHeader>
                                                         <ModalBody>
@@ -128,7 +129,7 @@ const MypageForm = ({ userInfo, formModal }) => {
                                                         <ModalFooter>
                                                             <Button
                                                                 color='primary'
-                                                                onClick={() => setFormModal(!formModal)}
+                                                                onClick={handler}
                                                             >
                                                                 확인
                                                             </Button>
@@ -153,4 +154,4 @@ const MypageForm = ({ userInfo, formModal }) => {
         </Row>
     )
 }
-export default MypageForm;
+export default AccountMypageForm;

src/components/account/mypage/AccountMypagePwForm.js

@@ -9,7 +9,7 @@ import {
 // ** Styles
 import '../../../assets/css/custom.css';
 
-const MypagePwForm = ({ userInfo, formModal }) => {
+const AccountMypagePwForm = ({ userInfo, formModal }) => {
     return (
         <TabPane tabId='2'>
             <div className='search-info-box'>
@@ -47,5 +47,5 @@ const MypagePwForm = ({ userInfo, formModal }) => {
         </TabPane>
     )
 }
-export default MypagePwForm;
+export default AccountMypagePwForm;
 

src/containers/account/mypage/AccountMypageContainer.js

@@ -11,12 +11,12 @@ import {
     Modal, ModalHeader, ModalBody, ModalFooter
 } from 'reactstrap'
 
-import MypagePwForm from '../../../components/account/mypage/MypagePwForm';
-import MypageForm from '../../../components/account/mypage/MypageForm';
+import AccountMypagePwForm from '../../../components/account/mypage/AccountMypagePwForm';
+import AccountMypageForm from '../../../components/account/mypage/AccountMypageForm';
 import { userPageAction } from '../../../modules/account/login/actions/authAction';
 
 // ** Function to toggle tabs
-const MypageContainer = () => {
+const AccountMypageContainer = () => {
     const [activeTab, setActiveTab] = useState('1'),
         store = useSelector(state => state.users),
         dispatch = useDispatch(),
@@ -39,6 +39,10 @@ const MypageContainer = () => {
         }
     }, []);
 
+    const handler = () => {
+      setFormModal(!formModal)
+    }
+
     return (
         <div className='pal-card'>
             <div className='card-body-tab-menu'>
@@ -57,20 +61,21 @@ const MypageContainer = () => {
                     </NavItem>
                 </Nav>
             </div>
-            {activeTab == 1 ? <MypageForm
+            {activeTab == 1 ? <AccountMypageForm
                 userInfo={userInfo}
                 toggle={toggle}
+                handler={handler}
                 formModal={formModal}
             />
                 :
                 <></>
             }
             {activeTab == 2 ?
-                <MypagePwForm />
+                <AccountMypagePwForm />
                 :
                 <></>
             }
         </div>
     )
 }
-export default MypageContainer;
+export default AccountMypageContainer;

src/router/routes/RouteAccount.js

@@ -20,7 +20,7 @@ const RouteAccount = [
   {
     path: '/mypage/myinfo/',
     component: lazy(() =>
-      import('../../views/Mypage/Mypage')
+      import('../../views/account/AccountMypage')
     )
   },
   {

src/views/account/AccountMypage.js

@@ -3,12 +3,12 @@ import { Card, CardBody, Row, Col, Nav, NavItem, NavLink, TabContent, TabPane, A
   Modal, ModalHeader, ModalBody, ModalFooter  } from 'reactstrap'
 import React from 'react';
 import '../../assets/css/custom.css';
-import MypageContainer from '../../containers/analysis/mypage/MypageContainer';
+import AccountMypageContainer from '../../containers/account/mypage/AccountMypageContainer';
 
-const Mypage = props => {
+const AccountMypage = props => {
   return (
-    <MypageContainer />
+    <AccountMypageContainer />
   );
 };
 
-export default Mypage;
+export default AccountMypage;