Validation about total === sum(credits)

jtjun · Jun 19, 2019 · 6b12edf · 6b12edf
1 parent 6950b29
commit 6b12edf
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 6 deletions.
diff --git a/frontend/src/components/organisms/PaymentForm/index.js b/frontend/src/components/organisms/PaymentForm/index.js
@@ -4,7 +4,7 @@ import styled from 'styled-components'
 import { Link, } from 'react-router-dom'
 import { Form, Field, } from 'redux-form'
 
-import { Block, Button, FieldWithLabel, Input, Select, TwoLineBlock, } from 'components'
+import { Block, Button, FieldWithLabel, Input, LinkButton, Select, TwoLineBlock, } from 'components'
 
 const SimpleInput = props => <Input simple {...props} />
 
@@ -37,7 +37,8 @@ const PaymentForm = ({ handleSubmit, room, members, payment, amountLeft, total,
     <Form onSubmit={handleSubmit}>
       <Block>
         <FieldWithLabel label="결제 내용" name="forWhat" type="text" component={SimpleInput} required />
-        <FieldWithLabel label="결제자" name="fromWho" component={Select}>
+        <FieldWithLabel label="결제자" name="fromWho" component={Select} required>
+          <option selected value="">-- 멤버 목록 --</option>
           {members.map(
             ({ membername }) => (
               <option key={membername} value={membername}>
@@ -70,9 +71,13 @@ const PaymentForm = ({ handleSubmit, room, members, payment, amountLeft, total,
         )}
       </Block>
       <Block direction="row">
-        <Button type="button" light horizontal>
-          <Link to={`/room/${room.url}/`}>취소</Link>
-        </Button>
+        <LinkButton
+          type="button" 
+          to={`/room/${room.url}/`}
+          light horizontal
+        >
+            취소
+        </LinkButton>
         <Button type="submit" horizontal>확인</Button>
       </Block>
     </Form>

diff --git a/frontend/src/containers/PaymentForm.js b/frontend/src/containers/PaymentForm.js
@@ -1,6 +1,7 @@
 import React from 'react'
 import { connect } from 'react-redux'
-import { reduxForm, formValueSelector, change } from 'redux-form'
+import { toastr } from 'react-redux-toastr'
+import { reduxForm, formValueSelector, change, SubmissionError } from 'redux-form'
 
 import { PaymentForm } from 'components'
 import { paymentCreateRequest } from 'store/actions'
@@ -11,6 +12,18 @@ const PaymentReduxForm = reduxForm({
   form: FORM_NAME,
   onSubmit(values, dispatch) {
     const { room, ...payment } = values
+    const validationError = message => {
+      toastr.light(
+        "결제 추가 오류", message,
+        { icon: 'error', status: 'error' }
+      )
+      throw new SubmissionError({ _error: message})
+    }
+
+    if (payment.total !== payment.credits.map(c => c.amount).reduce((a,b)=>(a+b),0)) {
+      validationError("남은 돈이 0이 아닙니다!")
+    }
+
     dispatch(paymentCreateRequest(room, payment))
   }
 })(PaymentForm)