增加了新增银行卡逻辑。review by 张丽霞。
Showing
7 changed files
with
140 additions
and
27 deletions
@@ -83,26 +83,31 @@ export default class BankCardAdd extends React.Component { | @@ -83,26 +83,31 @@ export default class BankCardAdd extends React.Component { | ||
83 | } | 83 | } |
84 | } | 84 | } |
85 | 85 | ||
86 | - onPressButton(){ | ||
87 | - | ||
88 | - } | ||
89 | - | ||
90 | - | ||
91 | - | ||
92 | render() { | 86 | render() { |
93 | 87 | ||
94 | - if(true){ | 88 | + let {showResult, result, message, description, buttonText} = this.props.cardAddState; |
89 | + | ||
90 | + if(showResult){ | ||
95 | return ( | 91 | return ( |
96 | <ResultView | 92 | <ResultView |
97 | - result={"success"} | 93 | + result={result} |
98 | fromPage={"BankCardAdd"} | 94 | fromPage={"BankCardAdd"} |
99 | - message={"恭喜您,新增还款银行卡成功!"} | ||
100 | - buttonText={"确认"} | ||
101 | - onPressButton={this.onPressButton} | 95 | + message={message} |
96 | + description={description} | ||
97 | + buttonText={buttonText} | ||
98 | + onPressButton={() => { | ||
99 | + if(result == 'success'){ | ||
100 | + this.props.onPressSuccessButton && this.props.onPressSuccessButton(); | ||
101 | + } | ||
102 | + else{ | ||
103 | + this.props.onPressFailButton && this.props.onPressFailButton(); | ||
104 | + } | ||
105 | + }} | ||
102 | /> | 106 | /> |
103 | ); | 107 | ); |
104 | } | 108 | } |
105 | 109 | ||
110 | + | ||
106 | let cardAddState = this.props.cardAddState; | 111 | let cardAddState = this.props.cardAddState; |
107 | 112 | ||
108 | let bankName = cardAddState.get("bankName"); | 113 | let bankName = cardAddState.get("bankName"); |
@@ -111,8 +116,7 @@ export default class BankCardAdd extends React.Component { | @@ -111,8 +116,7 @@ export default class BankCardAdd extends React.Component { | ||
111 | let bankSupport = cardAddState.get("bankSupport"); | 116 | let bankSupport = cardAddState.get("bankSupport"); |
112 | let showBankInfo = cardAddState.get("showBankInfo"); | 117 | let showBankInfo = cardAddState.get("showBankInfo"); |
113 | 118 | ||
114 | - | ||
115 | - let userName = "**聪"; | 119 | + let userName = ''; |
116 | 120 | ||
117 | let nextBtnBgColor = this.state.nextBtnEnable ? {backgroundColor:'#444444'} : {backgroundColor:'#b0b0b0'}; | 121 | let nextBtnBgColor = this.state.nextBtnEnable ? {backgroundColor:'#444444'} : {backgroundColor:'#b0b0b0'}; |
118 | 122 |
@@ -32,7 +32,7 @@ export default class ResultView extends React.Component { | @@ -32,7 +32,7 @@ export default class ResultView extends React.Component { | ||
32 | 32 | ||
33 | render() { | 33 | render() { |
34 | 34 | ||
35 | - let {result, fromPage, message, buttonText} = this.props; | 35 | + let {result, fromPage, message, description, buttonText} = this.props; |
36 | let resultImg = this.getResultImg(result, fromPage); | 36 | let resultImg = this.getResultImg(result, fromPage); |
37 | 37 | ||
38 | 38 | ||
@@ -48,6 +48,10 @@ export default class ResultView extends React.Component { | @@ -48,6 +48,10 @@ export default class ResultView extends React.Component { | ||
48 | {message} | 48 | {message} |
49 | </Text> | 49 | </Text> |
50 | 50 | ||
51 | + <Text style={styles.description}> | ||
52 | + {description} | ||
53 | + </Text> | ||
54 | + | ||
51 | <TouchableOpacity onPress={() => {this.props.onPressButton && this.props.onPressButton()}} > | 55 | <TouchableOpacity onPress={() => {this.props.onPressButton && this.props.onPressButton()}} > |
52 | <View style={styles.buttonContainer}> | 56 | <View style={styles.buttonContainer}> |
53 | <Text style={styles.button}> | 57 | <Text style={styles.button}> |
@@ -91,8 +95,15 @@ let styles = StyleSheet.create({ | @@ -91,8 +95,15 @@ let styles = StyleSheet.create({ | ||
91 | textAlign: 'center', | 95 | textAlign: 'center', |
92 | lineHeight: Math.ceil(16 * DEVICE_WIDTH_RATIO), | 96 | lineHeight: Math.ceil(16 * DEVICE_WIDTH_RATIO), |
93 | color: '#444444', | 97 | color: '#444444', |
94 | - | ||
95 | }, | 98 | }, |
99 | + description: { | ||
100 | + fontSize: 12 * DEVICE_WIDTH_RATIO, | ||
101 | + width: 200 * DEVICE_WIDTH_RATIO, | ||
102 | + textAlign: 'center', | ||
103 | + lineHeight: Math.ceil(16 * DEVICE_WIDTH_RATIO), | ||
104 | + color: '#b0b0b0', | ||
105 | + }, | ||
106 | + | ||
96 | reason: { | 107 | reason: { |
97 | width: 260 * DEVICE_WIDTH_RATIO, | 108 | width: 260 * DEVICE_WIDTH_RATIO, |
98 | fontSize: 12 * DEVICE_WIDTH_RATIO, | 109 | fontSize: 12 * DEVICE_WIDTH_RATIO, |
@@ -48,10 +48,12 @@ class InstallmentMyCardAddContainer extends Component { | @@ -48,10 +48,12 @@ class InstallmentMyCardAddContainer extends Component { | ||
48 | super(props); | 48 | super(props); |
49 | this._onCardNoComplete = this._onCardNoComplete.bind(this); | 49 | this._onCardNoComplete = this._onCardNoComplete.bind(this); |
50 | this._onPressBindingCard = this._onPressBindingCard.bind(this); | 50 | this._onPressBindingCard = this._onPressBindingCard.bind(this); |
51 | + this._onPressSuccessButton = this._onPressSuccessButton.bind(this); | ||
52 | + this._onPressFailButton = this._onPressFailButton.bind(this); | ||
51 | } | 53 | } |
52 | 54 | ||
53 | componentDidMount() { | 55 | componentDidMount() { |
54 | - // this.props.actions.getBankCards(); | 56 | + |
55 | } | 57 | } |
56 | 58 | ||
57 | 59 | ||
@@ -69,6 +71,22 @@ class InstallmentMyCardAddContainer extends Component { | @@ -69,6 +71,22 @@ class InstallmentMyCardAddContainer extends Component { | ||
69 | this.props.actions.bindingCard(cardNo, mobile, bankName, bankCode); | 71 | this.props.actions.bindingCard(cardNo, mobile, bankName, bankCode); |
70 | } | 72 | } |
71 | 73 | ||
74 | + /** | ||
75 | + * 返回我的银行卡页面 | ||
76 | + **/ | ||
77 | + _onPressSuccessButton(){ | ||
78 | + this.props.actions.backToMyCardList(); | ||
79 | + } | ||
80 | + | ||
81 | + /** | ||
82 | + * 返回新增银行卡页面 | ||
83 | + **/ | ||
84 | + _onPressFailButton(){ | ||
85 | + this.props.actions.backToMyCardAdd(); | ||
86 | + } | ||
87 | + | ||
88 | + | ||
89 | + | ||
72 | render() { | 90 | render() { |
73 | 91 | ||
74 | let {myCardAdd} = this.props; | 92 | let {myCardAdd} = this.props; |
@@ -79,6 +97,8 @@ class InstallmentMyCardAddContainer extends Component { | @@ -79,6 +97,8 @@ class InstallmentMyCardAddContainer extends Component { | ||
79 | cardAddState={myCardAdd} | 97 | cardAddState={myCardAdd} |
80 | onCardNoComplete={this._onCardNoComplete} | 98 | onCardNoComplete={this._onCardNoComplete} |
81 | onPressBindingCard={this._onPressBindingCard} | 99 | onPressBindingCard={this._onPressBindingCard} |
100 | + onPressSuccessButton={this._onPressSuccessButton} | ||
101 | + onPressFailButton={this._onPressFailButton} | ||
82 | /> | 102 | /> |
83 | ); | 103 | ); |
84 | } | 104 | } |
@@ -7,7 +7,8 @@ const { | @@ -7,7 +7,8 @@ const { | ||
7 | 7 | ||
8 | SET_ERROR, | 8 | SET_ERROR, |
9 | SHOW_BANK_INFO, | 9 | SHOW_BANK_INFO, |
10 | - | 10 | +SHOW_RESULT_INFO, |
11 | +RESET_CARD_ADD_INFO, | ||
11 | 12 | ||
12 | } = require('../../constants/actionTypes').default; | 13 | } = require('../../constants/actionTypes').default; |
13 | 14 | ||
@@ -17,7 +18,7 @@ export function getBankInfo(cardNo) { | @@ -17,7 +18,7 @@ export function getBankInfo(cardNo) { | ||
17 | return (dispatch, getState) => { | 18 | return (dispatch, getState) => { |
18 | 19 | ||
19 | let bankInfo = (uid) => { | 20 | let bankInfo = (uid) => { |
20 | - let {app, myCardAdd} = getState(); | 21 | + let {app} = getState(); |
21 | let info = { | 22 | let info = { |
22 | bankCode: '', | 23 | bankCode: '', |
23 | bankName: '', | 24 | bankName: '', |
@@ -80,20 +81,30 @@ export function bindingCard(cardNo, mobile, bankName, bankCode) { | @@ -80,20 +81,30 @@ export function bindingCard(cardNo, mobile, bankName, bankCode) { | ||
80 | 81 | ||
81 | let bindCards = (uid) => { | 82 | let bindCards = (uid) => { |
82 | let {app} = getState(); | 83 | let {app} = getState(); |
84 | + let result = { | ||
85 | + showResult: false, | ||
86 | + result: '', | ||
87 | + message: '', | ||
88 | + description: '', | ||
89 | + buttonText: '', | ||
90 | + }; | ||
83 | 91 | ||
84 | return new InstallmentService(app.host).bindingCards(uid, cardNo, mobile, bankName, bankCode) | 92 | return new InstallmentService(app.host).bindingCards(uid, cardNo, mobile, bankName, bankCode) |
85 | .then(json => { | 93 | .then(json => { |
86 | - | ||
87 | - console.log("chenlin9999", JSON.stringify(json)); | ||
88 | - | ||
89 | - // dispatch(showBankInfo(info)); | 94 | + result.showResult = true; |
95 | + result.result = 'success'; | ||
96 | + result.message = '恭喜您,新增还款银行卡成功!'; | ||
97 | + result.description = ''; | ||
98 | + result.buttonText = '确认'; | ||
99 | + dispatch(showResultInfo(result)); | ||
90 | }) | 100 | }) |
91 | .catch(error => { | 101 | .catch(error => { |
92 | - console.log("chenlin6666", JSON.stringify(error)); | ||
93 | - let url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.instalmentMyCardAdd","params":{}}`; | ||
94 | - ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url); | ||
95 | - | ||
96 | - | 102 | + result.showResult = true; |
103 | + result.result = 'fail'; | ||
104 | + result.message = '对不起,绑定银行卡失败!'; | ||
105 | + result.description = '失败的原因可能是:银行卡户名、银行卡、预留的手机号不一致'; | ||
106 | + result.buttonText = '重新绑定银行卡'; | ||
107 | + dispatch(showResultInfo(result)); | ||
97 | }); | 108 | }); |
98 | } | 109 | } |
99 | 110 | ||
@@ -114,7 +125,47 @@ export function bindingCard(cardNo, mobile, bankName, bankCode) { | @@ -114,7 +125,47 @@ export function bindingCard(cardNo, mobile, bankName, bankCode) { | ||
114 | } | 125 | } |
115 | 126 | ||
116 | 127 | ||
128 | +export function showResultInfo(result) { | ||
129 | + return { | ||
130 | + type: SHOW_RESULT_INFO, | ||
131 | + payload: result, | ||
132 | + } | ||
133 | +} | ||
134 | + | ||
135 | + | ||
136 | +export function backToMyCardList() { | ||
137 | + return (dispatch, getState) => { | ||
138 | + let url = `http://m.yohobuy.com?openby:yohobuy={"action":"go.instalmentMyCard","params":{}}`; | ||
139 | + ReactNative.NativeModules.YH_CommonHelper.jumpWithUrl(url); | ||
140 | + } | ||
141 | +} | ||
117 | 142 | ||
118 | 143 | ||
144 | +export function backToMyCardAdd() { | ||
145 | + return (dispatch, getState) => { | ||
146 | + | ||
147 | + let reset = { | ||
148 | + bankCode: '', | ||
149 | + bankName: '', | ||
150 | + cardNO: '', | ||
151 | + bankSupport: false, | ||
152 | + showBankInfo: false, | ||
153 | + showResult: false, | ||
154 | + result: '', | ||
155 | + message: '', | ||
156 | + description: '', | ||
157 | + buttonText: '', | ||
158 | + }; | ||
159 | + | ||
160 | + dispatch(resetStateInfo(reset)); | ||
161 | + } | ||
162 | +} | ||
163 | + | ||
164 | +export function resetStateInfo(state) { | ||
165 | + return { | ||
166 | + type: RESET_CARD_ADD_INFO, | ||
167 | + payload: state, | ||
168 | + } | ||
169 | +} | ||
119 | 170 | ||
120 | 171 |
@@ -14,6 +14,12 @@ let InitialState = Record({ | @@ -14,6 +14,12 @@ let InitialState = Record({ | ||
14 | showBankInfo: false, | 14 | showBankInfo: false, |
15 | 15 | ||
16 | banks: bankList.join('、'), | 16 | banks: bankList.join('、'), |
17 | + | ||
18 | + showResult: false, | ||
19 | + result: '', | ||
20 | + message: '', | ||
21 | + description: '', | ||
22 | + buttonText: '', | ||
17 | }); | 23 | }); |
18 | 24 | ||
19 | 25 |
@@ -5,6 +5,8 @@ import Immutable, {Map} from 'immutable'; | @@ -5,6 +5,8 @@ import Immutable, {Map} from 'immutable'; | ||
5 | 5 | ||
6 | const { | 6 | const { |
7 | SHOW_BANK_INFO, | 7 | SHOW_BANK_INFO, |
8 | + SHOW_RESULT_INFO, | ||
9 | + RESET_CARD_ADD_INFO, | ||
8 | 10 | ||
9 | } = require('../../constants/actionTypes').default; | 11 | } = require('../../constants/actionTypes').default; |
10 | 12 | ||
@@ -20,6 +22,23 @@ export default function cardAddReducer(state = initialState, action) { | @@ -20,6 +22,23 @@ export default function cardAddReducer(state = initialState, action) { | ||
20 | .set('cardNO', action.payload.cardNO) | 22 | .set('cardNO', action.payload.cardNO) |
21 | .set('bankSupport', action.payload.bankSupport) | 23 | .set('bankSupport', action.payload.bankSupport) |
22 | .set('showBankInfo', action.payload.showBankInfo); | 24 | .set('showBankInfo', action.payload.showBankInfo); |
25 | + case SHOW_RESULT_INFO: | ||
26 | + return state.set('showResult', action.payload.showResult) | ||
27 | + .set('result', action.payload.result) | ||
28 | + .set('message', action.payload.message) | ||
29 | + .set('description', action.payload.description) | ||
30 | + .set('buttonText', action.payload.buttonText); | ||
31 | + case RESET_CARD_ADD_INFO: | ||
32 | + return state.set('bankCode', action.payload.bankCode) | ||
33 | + .set('bankName', action.payload.bankName) | ||
34 | + .set('cardNO', action.payload.cardNO) | ||
35 | + .set('bankSupport', action.payload.bankSupport) | ||
36 | + .set('showBankInfo', action.payload.showBankInfo) | ||
37 | + .set('showResult', action.payload.showResult) | ||
38 | + .set('result', action.payload.result) | ||
39 | + .set('message', action.payload.message) | ||
40 | + .set('description', action.payload.description) | ||
41 | + .set('buttonText', action.payload.buttonText); | ||
23 | } | 42 | } |
24 | 43 | ||
25 | return state; | 44 | return state; |
-
Please register or login to post a comment