修改体现未绑定银行卡弹框，添加去绑定事件 review by sunkai

@@ -13,6 +13,7 @@ import SureModal from "./SureModal";
 import WithdrawModal from "./WithdrawModal";
 import GuideModal from "./GuideModal";
 import BannerSwiper from './BannerSwiper';
+import { TipsAlertItem, TipsAlert } from '../../common/components/YH_TipsAlert';
 
 export default class Alliance extends Component {
     constructor(props) {
@@ -20,6 +21,7 @@ export default class Alliance extends Component {
 
         this._renderRow = this._renderRow.bind(this);
         this._renderHeader = this._renderHeader.bind(this);
+        this._jumpBindCardUrl = this._jumpBindCardUrl.bind(this);
 
         this.dataSource = new ListView.DataSource({
             rowHasChanged: (r1, r2) => !Immutable.is(r1, r2),
@@ -62,7 +64,7 @@ export default class Alliance extends Component {
                         <View style={[styles.textView, {paddingRight: 30}]}>
                             <TouchableOpacity activeOpacity={1} onPress={() => {
                                 if(!bindStatus){
-                                    this.props.showHelpDialog && this.props.showHelpDialog('请先完成银行卡绑定');
+                                    this.props.showTipsAlertDialog && this.props.showTipsAlertDialog('请先完成银行卡绑定');
                                     return
                                 }
                                 if (!this.props.settlementInfo.settlementInfoData.settlementAmount || this.props.settlementInfo.settlementInfoData.settlementAmount === 0) {
@@ -200,8 +202,16 @@ export default class Alliance extends Component {
         }
     }
 
+    _jumpBindCardUrl() {
+        let bindStatus = this.props.settlementInfo.settlementInfoData.hasBankCard;
+        let bindType = bindStatus ? '2' : '1';
+        this.props.jumpWithUrl && this.props.jumpWithUrl('我的银行卡', 'bankCard', bindType);
+        this.props.hiddenTipsAlertDialog && this.props.hiddenTipsAlertDialog();
+    }
+
     render() {
         let {
+            isShowTipsAlert,
             isShowHelp,
             isShowSure,
             isShowWithdrawal,
@@ -221,6 +231,13 @@ export default class Alliance extends Component {
         let productList = topList.product_list ? topList.product_list.toArray() : [];
         return (
             <View style={styles.container}>
+                <TipsAlert 
+                    tips={this.props.tips}
+                    isShow={isShowTipsAlert}
+                    >
+                    <TipsAlertItem showStatus='sure' handleAction={this._jumpBindCardUrl}>去绑定</TipsAlertItem>
+                    <TipsAlertItem showStatus='cancel' handleAction={this.props.hiddenTipsAlertDialog}>取消</TipsAlertItem>
+                </TipsAlert>
                 <GuideModal
                     isShowGuide={this.props.isShowGuide}
                     hiddenGuideDialog={this.props.hiddenGuideDialog}/>

@@ -9,6 +9,7 @@ import ScrollableTabView from 'react-native-scrollable-tab-view';
 import TabStatistics from '../components/TabStatistics';
 import Statistics from "./Statistics";
 import ReactNative from "react-native";
+import { TipsAlertItem, TipsAlert } from '../../common/components/YH_TipsAlert';
 
 
 const tabTitles = ['昨日', '本月', '上月'];
@@ -16,6 +17,7 @@ const tabTitles = ['昨日', '本月', '上月'];
 export default class Data extends Component {
     constructor(props) {
         super(props);
+        this._jumpBindCardUrl = this._jumpBindCardUrl.bind(this);
     }
 
     componentDidMount() {
@@ -28,8 +30,16 @@ export default class Data extends Component {
         this.subscription.remove();
     }
 
+    _jumpBindCardUrl() {
+        let bindStatus = this.props.settlementInfo.settlementInfoData.hasBankCard;
+        let bindType = bindStatus ? '2' : '1';
+        this.props.jumpWithUrl && this.props.jumpWithUrl('我的银行卡', 'bankCard', bindType);
+        this.props.hiddenTipsAlertDialog && this.props.hiddenTipsAlertDialog();
+    }
+
     render() {
         let {
+            isShowTipsAlert,
             isShowHelp,
             isShowSure,
             isShowWithdrawal,
@@ -40,6 +50,13 @@ export default class Data extends Component {
 
         return (
             <ScrollView style={styles.container} scrollEnabled = {scrollEnabled}>
+                <TipsAlert 
+                    tips={this.props.tips}
+                    isShow={isShowTipsAlert}
+                    >
+                    <TipsAlertItem showStatus='sure' handleAction={this._jumpBindCardUrl}>去绑定</TipsAlertItem>
+                    <TipsAlertItem showStatus='cancel' handleAction={this.props.hiddenTipsAlertDialog}>取消</TipsAlertItem>
+                </TipsAlert>
                 <HelpTipsModal
                     tips={this.props.tips}
                     isShowHelp={isShowHelp}
@@ -65,7 +82,7 @@ export default class Data extends Component {
                         <View style={[styles.textView, {paddingRight: 30}]}>
                             <TouchableOpacity activeOpacity={1} onPress={() => {
                                 if (!bindStatus) {
-                                    this.props.showHelpDialog && this.props.showHelpDialog('请先完成银行卡绑定');
+                                    this.props.showTipsAlertDialog && this.props.showTipsAlertDialog('请先完成银行卡绑定');
                                     return
                                 }
                                 if (!this.props.settlementInfo.settlementInfoData.settlementAmount || this.props.settlementInfo.settlementInfoData.settlementAmount === 0) {

@@ -7,6 +7,9 @@ export default keyMirror({
     SET_HOST: null,
     SET_SERVICE_HOST: null,
 
+    SHOW_TIPS_ALERT_DIALOG: null,
+    DISMISS_TIPS_ALERT_DIALOG: null,
+
     SHOW_HELP_DIALOG: null,
     DISMISS_HELP_DIALOG: null,
 

@@ -44,6 +44,8 @@ class AllianceContainer extends Component {
             firstFlag: '0'
         };
 
+        this._showTipsAlertDialog = this._showTipsAlertDialog.bind(this);
+        this._hiddenTipsAlertDialog = this._hiddenTipsAlertDialog.bind(this);
         this._hiddenGuideDialog = this._hiddenGuideDialog.bind(this);
         this._showHelpDialog = this._showHelpDialog.bind(this);
         this._hiddenHelpDialog = this._hiddenHelpDialog.bind(this);
@@ -97,10 +99,20 @@ class AllianceContainer extends Component {
         });
     }
 
+    _showTipsAlertDialog(tips) {
+        this.setState({
+            tips,
+        });
+        this.props.actions.showTipsAlertDialog();
+    }
+
+    _hiddenTipsAlertDialog() {
+        this.props.actions.hiddenTipsAlertDialog();
+    }
+
     _showHelpDialog(tips) {
-        this.state.tips = tips;
         this.setState({
-            tips: this.state.tips,
+            tips,
         });
         this.props.actions.showHelpDialog();
     }
@@ -170,6 +182,7 @@ class AllianceContainer extends Component {
 
     render() {
         let {
+            showTipsAlert,
             showHelpDialog,
             showSureDialog,
             showWithdrawalDialog,
@@ -185,6 +198,7 @@ class AllianceContainer extends Component {
         return (
             <View style={styles.container}>
                 <Alliance
+                    isShowTipsAlert={showTipsAlert}
                     isShowGuide={isShowGuide}
                     isShowHelp={showHelpDialog}
                     isShowSure={showSureDialog}
@@ -195,6 +209,8 @@ class AllianceContainer extends Component {
                     recentlyOrder={recentlyOrder}
                     topList={topList}
                     tips={tip}
+                    showTipsAlertDialog={this._showTipsAlertDialog}
+                    hiddenTipsAlertDialog={this._hiddenTipsAlertDialog}
                     hiddenGuideDialog={this._hiddenGuideDialog}
                     showHelpDialog={this._showHelpDialog}
                     hiddenHelpDialog={this._hiddenHelpDialog}

@@ -42,6 +42,8 @@ class DataContainer extends Component {
             tips: '',
         };
 
+        this._showTipsAlertDialog = this._showTipsAlertDialog.bind(this);
+        this._hiddenTipsAlertDialog = this._hiddenTipsAlertDialog.bind(this);
         this._showHelpDialog = this._showHelpDialog.bind(this);
         this._hiddenHelpDialog = this._hiddenHelpDialog.bind(this);
         this._showSureDialog = this._showSureDialog.bind(this);
@@ -64,10 +66,20 @@ class DataContainer extends Component {
 
     }
 
+    _showTipsAlertDialog(tips) {
+        this.setState({
+            tips,
+        });
+        this.props.actions.showTipsAlertDialog();
+    }
+
+    _hiddenTipsAlertDialog() {
+        this.props.actions.hiddenTipsAlertDialog();
+    }
+
     _showHelpDialog(tips) {
-        this.state.tips = tips;
         this.setState({
-            tips: this.state.tips,
+            tips,
         });
         this.props.actions.showHelpDialog();
     }
@@ -117,6 +129,7 @@ class DataContainer extends Component {
 
     render() {
         let {
+            showTipsAlert,
             showHelpDialog,
             showSureDialog,
             showWithdrawalDialog,
@@ -129,6 +142,7 @@ class DataContainer extends Component {
         return (
             <View style={styles.container}>
                 <Data
+                    isShowTipsAlert={showTipsAlert}
                     isShowHelp={showHelpDialog}
                     isShowSure={showSureDialog}
                     isShowWithdrawal={showWithdrawalDialog}
@@ -136,6 +150,8 @@ class DataContainer extends Component {
                     addSettlement={addSettlement}
                     statisticsInfo={statisticsInfo}
                     tips={tip}
+                    showTipsAlertDialog={this._showTipsAlertDialog}
+                    hiddenTipsAlertDialog={this._hiddenTipsAlertDialog}
                     showHelpDialog={this._showHelpDialog}
                     hiddenHelpDialog={this._hiddenHelpDialog}
                     showSureDialog={this._showSureDialog}

@@ -7,6 +7,9 @@ import {setproductPool, setSkns} from "../app/appActions";
 const Platform = require('Platform');
 
 const {
+    SHOW_TIPS_ALERT_DIALOG,
+    DISMISS_TIPS_ALERT_DIALOG,
+
     SHOW_HELP_DIALOG,
     DISMISS_HELP_DIALOG,
 
@@ -94,6 +97,18 @@ const {
 
 } = require('../../constants/actionTypes').default;
 
+export function showTipsAlertDialog() {
+    return {
+        type: SHOW_TIPS_ALERT_DIALOG,
+    }
+}
+
+export function hiddenTipsAlertDialog() {
+    return {
+        type: DISMISS_TIPS_ALERT_DIALOG,
+    }
+}
+
 export function showHelpDialog() {
     return {
         type: SHOW_HELP_DIALOG,

@@ -9,6 +9,7 @@ let InitialState = Record({
     jumpUrl: '',
     showHelpDialog: false,
     showSureDialog: false,
+    showTipsAlert: false,
     showWithdrawalDialog: false,
     showBankInfoDialog: false,
 

@@ -4,6 +4,9 @@ import InitialState from './allianceInitialState';
 import Immutable, {List} from 'immutable';
 
 const {
+    SHOW_TIPS_ALERT_DIALOG,
+    DISMISS_TIPS_ALERT_DIALOG,
+
     SHOW_HELP_DIALOG,
     DISMISS_HELP_DIALOG,
 
@@ -100,6 +103,12 @@ export default function couponReducer(state = initialState, action) {
     }
 
     switch (action.type) {
+        case SHOW_TIPS_ALERT_DIALOG: {
+            return state.set('showTipsAlert', true);
+        }
+        case DISMISS_TIPS_ALERT_DIALOG: {
+            return state.set('showTipsAlert', false);
+        }
         case SHOW_HELP_DIALOG: {
             return state.set('showHelpDialog', true);
         }

+/*
+ * @Author: QC.L 
+ * @Date: 2018-09-11 16:07:56 
+ * @Last Modified by: QC.L
+ * @Last Modified time: 2018-09-11 16:14:40
+ * @Description 弹框 Alert 效果
+ */
+'use strict';
+
+import React from 'react';
+import ReactNative from 'react-native';
+
+const {
+    StyleSheet,
+    Text,
+    View,
+    Dimensions,
+    TouchableOpacity,
+    Modal,
+} = ReactNative;
+
+/**
+ * 参数1: showStatus 值 sure/cancel
+ * 参数2: handleAction 要处理的事件
+ */
+function TipsAlertItem(props) {
+    return (
+        <TouchableOpacity style={styles.click} onPress={() => {
+            props.handleAction && props.handleAction();
+        }}>
+            <Text style={styles[props.showStatus]}>{props.children}</Text>
+        </TouchableOpacity>
+    );
+}
+
+/**
+ * 参数1: isShow true 显示 false 隐藏
+ * 参数2: tips 为标题
+ */
+class TipsAlert extends React.Component {
+    constructor(props) {
+        super(props);
+        this._renderChildren = this._renderChildren.bind(this);
+    }
+
+    _renderChildren(children) {
+        return children.map((element, index) => {
+            if (index === children.length) return element
+            return (
+                <React.Fragment>
+                    {element}
+                    <View style={{width: 0.5, height: '100%', backgroundColor: '#e0e0e0'}}></View>
+                </React.Fragment>
+            )
+        });
+    }
+
+    render() {
+        let { children } = this.props;
+        return (
+            <Modal
+                visible={this.props.isShow}
+                animationType={'none'}
+                transparent={true}
+                onRequestClose={() => {}}>
+                <View style={styles.modalContainer}>
+                    <View style={styles.modalView}>
+                        <View style={styles.confirmTitleContainer}>
+                            <Text style={styles.confirmTitle}>{this.props.tips}</Text>
+                        </View>
+                        <View style={{width: '100%', height: 0.5, backgroundColor: '#e0e0e0'}}/>
+                        <View style={styles.confirmBtnContainer}>
+                            {this._renderChildren(children)}
+                        </View>
+                    </View>
+                </View>
+            </Modal>
+        );
+    }
+};
+
+export { TipsAlert, TipsAlertItem };
+
+let {width, height} = Dimensions.get('window');
+
+let styles = StyleSheet.create({
+    modalContainer: {
+        flex: 1,
+        width: width,
+        height: height,
+        alignItems: 'center',
+        justifyContent: 'center',
+        backgroundColor: 'rgba(0, 0, 0, 0.4)',
+    },
+    modalView: {
+        width: 270,
+        borderRadius: 5,
+        alignItems: 'center',
+        backgroundColor: '#ffffff',
+    },
+    confirmBtnContainer: {
+        width: '100%',
+        height: 44.5,
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+    },
+    confirmTitleContainer: {
+        alignItems: 'center'
+    },
+    confirmTitle: {
+        paddingTop: 20,
+        paddingLeft: 30,
+        paddingRight: 30,
+        paddingBottom: 20,
+        color: '#444444',
+        fontSize: 14,
+        lineHeight: 24,
+        textAlign: 'center',
+        letterSpacing: -0.09,
+        fontFamily: 'PingFang-SC-Regular',
+    },
+    click: {
+        flex: 1,
+        alignItems: 'center',
+        justifyContent: 'center'
+    },
+    cancel: {
+        fontSize: 17,
+        color: '#444444',
+        letterSpacing: -0.41,
+        fontFamily: 'PingFang-SC-Regular',
+    },
+    sure: {
+        fontSize: 17,
+        color: '#D0021B',
+        letterSpacing: -0.41,
+        fontWeight: 'bold'
+    },
+});