my_cash.html 9.8 KB
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <script src="../../assets/js/fontsize.js"></script>
    <link rel="stylesheet" href="../../assets/css/api.css"/>
    <link rel="stylesheet" href="../../assets/css/style.css">
    <link rel="stylesheet" href="../../assets/css/index.css">
    <link rel="stylesheet" href="../../assets/css/doc.css">
    <link rel="stylesheet" href="../../assets/css/pay.css">
    <link rel="stylesheet" href="../../assets/css/my_news.css">
    <link rel="stylesheet" href="../../assets/css/login_index.css">
    <link rel="stylesheet" href="../../assets/icon/iconfont.css">
    <title></title>
    <style>
        .cash_input {
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-size: 14px;
            color: #424242;
            border-bottom: 1px solid #F7f7f7;
            padding: 0 0.55rem 0 0.64rem;
        }

        .cash_input input {
            padding: 0.36rem 0;
            text-align: right;
        }

        .cash_input input::-webkit-input-placeholder {
            color: #C0C0C0;
            font-size: 12px;
        }

        .bank {
            padding: 0.25rem 0.55rem 0.25rem 0.64rem;
        }

        .cash_input .iconfont {
            color: #C0C0C0;
        }

        .cash_time {
            color: #424242;
            font-size: 11px;
            padding: 0.18rem 0.64rem;
        }

        .cash_time .iconfont {
            color: #DDBB73;
            margin-right: 0.1rem;
        }

        .bank_name {
            color: #C0C0C0;
            font-size: 13px;
        }
    </style>
</head>
<body>
<div id="loadStart"></div>
<div id="app" v-cloak>
    <form action="">
        <div class="cash_input">
            <span>银行户名</span>
            <div><input type="text" placeholder="请输入姓名" v-model="bank_user_name"></div>
        </div>
        <div class="cash_input">
            <span>银行卡号</span>
            <div><input type="number" placeholder="请输入您的银行卡号" v-model="bank_num" @change="takeInfo(bank_num)"></div>
        </div>
        <div class="cash_input bank">
            <span>所属银行</span>
            <div><span v-if="bank_info.bankName">{{bank_info.bankName}}<span
                    class="bank_name">({{bank_info.cardTypeName}})</span></span><span
                    class="bank_name"
                    v-else>输入卡号自动获取</span>
            </div>
        </div>
        <div class="cash_input">
            <span>提现金额 <span class="bank_name">(剩余余额:{{balance-bank_value<0?0:balance-bank_value}})</span></span>
            <div><input type="number" placeholder="提现金额" v-model="bank_value" @input="bank_money"></div>
        </div>
        <div class="cash_input">
            <span>预留手机号</span>
            <div><input type="number" placeholder="请输入您的手机号" v-model="bank_phone"
                        onkeyup="value=value.replace(/[^\0-9\.]/g,'')" onpaste="value=value.replace(/[^\0-9\.]/g,'')"
                        oncontextmenu="value=value.replace(/[^\0-9\.]/g,'')"></div>
        </div>
        <div class="login_input"><input type="number" placeholder="请输入验证码" v-model="bank_code">
            <span v-if="show" @click="getCode" class="count">获取验证码</span>
            <span v-else class="count">{{count}}秒重新发送</span>
        </div>
    </form>
    <div class="cash_time"><span class="iconfont icon-lababofang"></span><span>5-7个工作日审核到账</span></div>
    <div class="save_btn" @click="applyCash">确认提现</div>
</div>
</body>
</html>

<script type="text/javascript" src="../../assets/js/api.js"></script>
<script type="text/javascript" src="../../assets/js/public.js"></script>
<script type="text/javascript" src="../../assets/js/fastclick.js"></script>
<script>
    new FastClick(document.body);
</script>
<script type="text/javascript" src="../../assets/js/vue.min.js"></script>
<script type="text/javascript" src="../../assets/js/bank.js"></script>
<script type="text/javascript" src="../../assets/js/axios.min.js"></script>
<script type="text/javascript" src="../../assets/icon/iconfont.js"></script>
<script>
    var app = new Vue({
        el: '#app',
        data: {
            bank_user_name: '',
            bank_num: '',
            bank_value: '',
            bank_phone: '',
            bank_code: '',
            show: true,
            bank_info: [],
            count: '',
            timer: null,
            balance: 0,
            balance_num: 0
        },
        created: function () {
            apiready = function () {
                app.balance = api.pageParam.balance;
                loadEnd();
            }
        },
        methods: {
            // 监听input的变化值
            bank_money: function () {
                if (parseFloat(app.bank_value) > parseFloat(app.balance)) {
                    toastMsg('超过最大限额,已改为最大额度');
                    app.bank_value = parseFloat(app.balance);
                } else if (parseFloat(app.bank_value) < 0) {
                    app.bank_value = 0
                } else {
                    console.log(app.bank_value)
                }
            },
            // 获取银行卡号信息
            takeInfo: function (bank_num) {
                if (bank_num == '') {
                    toastMsg('银行卡号不正确')
                } else {
                    app.bank_info = bankCar(bank_num);
                }
            },
            // 获取验证码
            getCode: function () {
                const TIME_COUNT = 60;
                var post = {
                    tel: app.bank_phone
                };
                var header = {
                    "XX-Device-Type": getDevice(),
                    'XX-Token': getToken()
                };
                if (!mobileReg.test(app.bank_phone)) {
                    toastMsg('请输入正确的手机号')
                } else {
                    getRequest('post', 'user/index/getCashCode', post, header).then(function (res) {
                        toastMsg(res.data.msg);
                        if (!app.timer) {
                            app.count = TIME_COUNT;
                            app.show = false;
                            app.timer = setInterval(function () {
                                if (app.count > 0 && app.count <= TIME_COUNT) {
                                    app.count--;
                                } else {
                                    app.show = true;
                                    clearInterval(app.timer);
                                    app.timer = null;
                                }
                            }, 1000)
                        }
                    })
                }
            },
            // 确认提现
            applyCash: function () {
                if (app.bank_user_name == '') {
                    toastMsg('请输入银行户名')
                } else if (app.bank_num == '') {
                    toastMsg('请输入银行卡号')
                } else if (app.bank_value > app.balance && app.bank_value < 0) {
                    toastMsg('请输入正确金额')
                } else if (!mobileReg.test(app.bank_phone)) {
                    toastMsg('手机号不正确')
                } else if (app.bank_code == '') {
                    toastMsg('请输入正确的验证码')
                } else {
                    var post = {
                        code: app.bank_code,
                        bank_account: app.bank_user_name,
                        account_id: app.bank_num,
                        bank_name: app.bank_info,
                        tel: app.bank_phone,
                        price: app.bank_value
                    };
                    var header = {
                        "XX-Device-Type": getDevice(),
                        'XX-Token': getToken()
                    };
                    api.confirm({
                        title: '确认提现',
                        msg: '请您仔细核对银行卡相关信息,因信息错误,导致提现损失,由您自行承担',
                        buttons: ['确定', '取消']
                    }, function (ret, err) {
                        var index = ret.buttonIndex;
                        if (index == 1) {
                            getRequest('post', 'user/index/applyCash', post, header).then(function (res) {
                                // alert(JSON.stringify(res));
                                toastMsg(res.data.msg);
                                setTimeout(function () {
                                    api.openWin({
                                        name: 'index_win',
                                        url: '../common/index_win.html',
                                    });
                                    api.sendEvent({
                                        name: 'index0',
                                        extra: {
                                            index: 2
                                        }
                                    });
                                    api.sendEvent({
                                        name: 'cash',
                                    });
                                }, 2000)
                            });
                        } else {
                            toastMsg('已取消')
                        }
                    });
                }
            },
        }
    })
</script>