Account Page bugs

frontend/src/components/pages/IndividualPage/index.js

@@ -1,9 +1,16 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import { Link } from 'react-router-dom'
-import { Button, Header, List, Block } from 'components'
+import { Button, Header, List, Block, ListItem } from 'components'
 
 const IndividualPage = ({ sendlist, getlist, roomurl, nickname }) => (
+
+    /*
+    sendlist = [{to:"1", label:"123"}],
+    roomurl = "cenkuwj",
+    nickname = "1",
+    */
+
     <div>
         <Header />
 
@@ -13,7 +20,7 @@ const IndividualPage = ({ sendlist, getlist, roomurl, nickname }) => (
                 {
                     sendlist && sendlist.map(
                         ({ to, label }, idx) => (
-                            <Listitem key={idx} title={to} description={label} linkTo={`/room/${roomurl}/member/${nickname}/${to}`} />
+                            <ListItem key={idx} title={to} description={`${label}원`} linkTo={`/room/${roomurl}/member/${nickname}/${to}`} />
                         )
                     )
                 }
@@ -22,11 +29,12 @@ const IndividualPage = ({ sendlist, getlist, roomurl, nickname }) => (
 
         <Block>
             <h1>받을 돈</h1>
+
             <List>
                 {
                     getlist && getlist.map(
                         ({ to, label }, idx) => (
-                            <Listitem key={idx} title={to} description={label} linkTo={`NULL_NEED_TO_CHANGE`} />
+                            <ListItem key={idx} title={to} description={label} />
                         )
                     )
                 }

frontend/src/components/pages/MainPage/index.js

@@ -5,7 +5,7 @@ import { Link } from 'react-router-dom'
  * import할 때 복잡하게 상대참조 할 필요 없이 'components', 'containers'만 지정해주면 된다.
  * ???Form 계열, ???Page 계열은 redux 로직이 필요하므로 'components'가 아닌 'containers'에서 import 한다.
  */ 
-import { Block } from 'components'
+import { Block, Header } from 'components'
 import { LoginForm } from 'containers'
 
 /**
@@ -17,8 +17,8 @@ import { LoginForm } from 'containers'
 const MainPage = (props) => {
   return (
     <div>
+      <Header />
       <Block>
-        <h1>Dutch Broomstick</h1>
         <LoginForm />
       </Block>
       <Block>

frontend/src/containers/AccountPage.js

@@ -3,30 +3,38 @@ import { connect } from 'react-redux'
 import { AccountPage } from 'components'
 import { Redirect } from 'react-router-dom'
 
-const AccountPageContainer = (props) => {
+class AccountPageContainer extends React.Component {
+
+  componentDidMount(){
+    const { roomname, toname, member, money, account, onAccoutPage } = this.props
+    onAccoutPage(toname)
+  }
 
+  render(){
+
     /*
 
-  if( !props.roomname ){
-    return(
-        <Redirect to="/" />
-    )
-  }
-  else if( !props.toname ){
-    return(
-      <Redirect to={`/room/${props.roomname}`}/>
-    )
-  } 
-  else {
+    if( !props.roomname ){
+      return(
+          <Redirect to="/" />
+      )
+    }
+    else if( !props.toname ){
+      return(
+        <Redirect to={`/room/${props.roomname}`}/>
+      )
+    } 
+    else {
+      return (
+        <AccountPage {...props} />
+      )
+    }
+    */
     return (
-      <AccountPage {...props} />
+        <AccountPage {...props} />
     )
-  }
-  */
 
-  return (
-      <AccountPage {...props} />
-  )
+  }
 
 }
 
@@ -35,9 +43,14 @@ const mapStateToProps = (state) => ({
     roomname : state.room.room.roomname,
 
     toname : state.payment.senddata.to,
+    member: state.member.members,
     money : state.payment.senddata.label,
     account : state.payment.account,
 
 })
 
-export default connect(mapStateToProps)(AccountPageContainer)
+const mapDispatchToProps = dispatch => ({
+  onAccoutPage: (toname,member) => dispatch(accountinRequest(toname,member)),
+})
+
+export default connect(mapStateToProps,mapDispatchToProps)(AccountPageContainer)

frontend/src/containers/IndividualPage.js

@@ -5,6 +5,7 @@ import { Redirect } from 'react-router-dom'
 
 const IndividualPageContainer = (props) => {
 
+  /*
   if( !props.roomname ){
     return(
         <Redirect to="/" />
@@ -20,6 +21,10 @@ const IndividualPageContainer = (props) => {
       <IndividualPage {...props} />
     )
   }
+  */
+  return (
+    <IndividualPage {...props} />
+  )
 
 }
 
@@ -33,4 +38,8 @@ const mapStateToProps = (state) => ({
     roomurl : state.room.room.url
 })
 
-export default connect(mapStateToProps)(IndividualPageContainer)
+const mapDispatchToProps = dispatch => ({
+
+})
+
+export default connect(mapStateToProps,mapDispatchToProps)(IndividualPageContainer)

frontend/src/containers/RoomPage.js

@@ -17,7 +17,7 @@ class RoomPageContainer extends React.Component {
     const { room, member } = this.props
 
     if (member) {
-      return <Redirect to={`/room/${room.url}/${member.id}/`} />
+      return <Redirect to={`/room/${room.url}/member/${member.id}/`} />
     }
 
     if (room) {

frontend/src/store/payment/actions.js

@@ -40,3 +40,11 @@ export const paymentGetFailed = error => ({
   type: PAYMENT_GET_FAILED,
   error,
 })
+
+export const ACCOUNT_IN_REQUEST = "ACCOUNT_IN_REQUEST"
+
+export const accountinRequest = ( toname, member ) => ({
+  type : ACCOUNT_IN_REQUEST,
+  toname,
+  member,
+})

frontend/src/store/payment/reducer.js

@@ -19,6 +19,14 @@ import * as actions from './actions';
 
   const paymentReducer = (state = initialState, action) => {
     switch(action.type) {
+      case actions.ACCOUNT_IN_REQUEST:
+        const edge = state.getlist.find(m => action.toname == m.to)
+        const acc = action.member.find(m => edge.to == m.membername)
+        return {
+          ...state,
+          senddata: edge,
+          accounts: acc.account,
+        }
       case actions.PAYMENT_CREATE_SUCCESS:
         return {
           ...state,