valitydev/checkout
14
0
Fork 0
mirror of https://github.com/valitydev/checkout.git synced 2024-11-06 10:35:20 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

FE-237: fix validation, clean up

Browse Source
This commit is contained in:
Alexandra Usacheva 2017-05-10 15:44:40 +03:00
parent 2ea3bd8cd1
commit 1a7f9af4a6
3 changed files with 16 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
package.json
View File

@ -18,7 +18,8 @@
"react-dom": "^15.4.1",
"urijs": "^1.18.2",
"url-parse": "^1.1.8",
"whatwg-fetch": "^1.0.0"
"whatwg-fetch": "^1.0.0",
"react-transition-group": "^1.1.3"
},
"devDependencies": {
"autoprefixer": "6.7.7",
@ -39,7 +40,6 @@
"image-webpack-loader": "^3.2.0",
"ismobilejs": "^0.4.1",
"node-sass": "^4.5.1",
"react-transition-group": "^1.1.3",
"sass-loader": "^6.0.3",
"style-loader": "^0.15.0",
"webpack": "^2.2.1",

13
src/payframe/components/Modal.js
View File

@ -30,6 +30,7 @@ export default class Modal extends React.Component {
this.handlePay = this.handlePay.bind(this);
this.setPayformState = this.setPayformState.bind(this);
this.setShowErrorPanel = this.setShowErrorPanel.bind(this);
}
componentDidMount() {
@ -38,7 +39,7 @@ export default class Modal extends React.Component {
.catch(() => {
this.isPayButtonDisabled = true;
this.errorMessage = 'Tokenizer is not available';
this.isShowErrorPanel = true;
this.setShowErrorPanel(true);
this.forceUpdate();
});
}
@ -55,6 +56,10 @@ export default class Modal extends React.Component {
.catch(error => this.handleError(error));
}
setShowErrorPanel(state) {
this.isShowErrorPanel = state;
}
setPayformState(data, name) {
this.setState({
payformState: Object.assign(this.state.payformState, {
@ -82,7 +87,7 @@ export default class Modal extends React.Component {
checkmark: false
});
this.errorMessage = error.message;
this.isShowErrorPanel = true;
this.setShowErrorPanel(true);
this.forceUpdate();
}
@ -111,7 +116,7 @@ export default class Modal extends React.Component {
handlePay() {
const formData = this.state.payformState;
this.isShowErrorPanel = false;
this.setShowErrorPanel(false);
this.setState({
payform: true,
interact: false,
@ -146,6 +151,7 @@ export default class Modal extends React.Component {
errorMessage={this.errorMessage}
isPayButtonDisabled={this.isPayButtonDisabled}
isShowErrorPanel={this.isShowErrorPanel}
setShowErrorPanel={this.setShowErrorPanel}
amount={this.props.amount}
currency={this.props.currency}
payformState={this.state.payformState}
@ -160,7 +166,6 @@ export default class Modal extends React.Component {
renderInteract() {
return (
<div ref="3ds" className="payform--interact"/>
);
}

5
src/payframe/components/payform/Payform.js
View File

@ -41,22 +41,27 @@ class Payform extends React.Component {
}
handleCardHolder(value) {
this.props.setShowErrorPanel(false);
this.props.setPayformState(Payform.assignValue(this.props.payformState.cardHolder, value), 'cardHolder');
}
handleCardNumber(value) {
this.props.setShowErrorPanel(false);
this.props.setPayformState(Payform.assignValue(this.props.payformState.cardNumber, value), 'cardNumber');
}
handleCardExpire(value) {
this.props.setShowErrorPanel(false);
this.props.setPayformState(Payform.assignValue(this.props.payformState.cardExpire, value), 'cardExpire');
}
handleCardCvv(value) {
this.props.setShowErrorPanel(false);
this.props.setPayformState(Payform.assignValue(this.props.payformState.cardCvv, value), 'cardCvv');
}
handleEmail(value) {
this.props.setShowErrorPanel(false);
this.props.setPayformState(Payform.assignValue(this.props.payformState.email, value), 'email');
}