mashangyoujiu/Application/Retail/View/Uuerrands/index.html

<!--[1.6.48]-->
<style>
    table {
        border: 1px solid #f1f1f1;
        margin-top: 40px;
    }

    .funalert {
        box-sizing: border-box;
        padding: 20px;
    }

    .layui-form-checkbox[lay-skin=primary] span {
        float: right;
        padding-right: 0;
        line-height: 18px;
        background: 0 0;
        color: #666;
    }

    .pass-content {
        text-align: center;
        display: none;
    }

    .pass {
        display: block;
        width: 200px;
        padding: 10px;
        border: 1px solid #ccc;
    }

    .layui-form-label {
        font-weight: bold;
        width: 161px;
    }

    .layui-form-item .layui-form-checkbox[lay-skin="primary"] {
        margin-top: 0;
    }

    .pass-wrap {
        display: flex;
        justify-content: center;
        padding: 20px 0;
    }

    #getcode {
        box-sizing: border-box;
        padding: 0 15px;
        font-size: 15px;
        background: #009688;
        border: none;
        outline: none;
        color: #fff;
    }

    .phone-wrap {
        padding: 10px 70px;
    }
</style>
<div>
    <div class="goods_edit">
        <if condition="$authArr['getopenid'] eq true">
            <button type="button" class="layui-btn" id="sure">获取openid</button>
        </if>
    </div>
    <table class="layui-hide" id="test" lay-filter="demo"></table>
    <div class="funalert">
        <div class="pass-content">
            <div class="phone-wrap">
                <input type="text" name="city_name" class="pass" id="city_name" placeholder="城市名称如郑州市(必填)">

            </div>
            <div class="phone-wrap">

                <input type="text" name="county_name" class="pass" id="county_name" placeholder="区名称如金水区(非必填)">

            </div>
            <div class="phone-wrap">

                <input type="text" name="password" class="pass" id="phone" placeholder="请输入绑定的UU跑腿手机号">
            </div>
            <div class="pass-wrap">
                <input type="text" name="password" class="pass" id="pass" placeholder="请输入商户验证码">
                <button id="getcode" type="button">获取验证码</button>
            </div>
        </div>
    </div>

    <script type="text/html" id="barDemo">
        <if condition="$authArr['recharge'] eq true">
            <button class="layui-btn layui-btn-xs" lay-event="recharge">充值</button>
        </if>
        <if condition="$authArr['balance'] eq true">
            <button class="layui-btn layui-btn-xs" lay-event="record">余额查询</button>
        </if>
    </script>
</div>
<script>
    layui.use(['form', 'layer', 'table'], function () {
        var table = layui.table;
        table.render({
            elem: '#test',
            url: "{:U('getmerchantinfo')}",
            method: 'post',
            cols: [
                [ //标题栏
                    {
                        field: 'phone',
                        title: '手机号',
                        align: 'center',
                    }, {
                    field: 'openid',
                    title: 'Openid',
                    align: 'center',
                }, {
                    field: 'city_name',
                    title: '商户城市名称',
                    align: 'center',
                }, {
                    field: 'county_name',
                    title: '区/县',
                    align: 'center',
                }, {
                    field: 'addtime',
                    title: '注册时间',
                    align: 'center',
                }, {
                    field: 'right',
                    title: '操作',
                    align: 'center',
                    toolbar: '#barDemo',
                    width: 260,
                }]
            ],
            page: {
                layout: ['count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
            }, //是否开启分页
        });
        table.on('tool(demo)', function (obj) {
            var data = obj.data;
            var layEvent = obj.event;
            if (layEvent === 'recharge') {
                var openid = data.openid;
                if (!openid) {
                    layer.msg("openid错误", {time: 1500})
                    return false;
                }
                $.ajax({
                    url: "{:U('recharge')}",
                    type: "post",
                    data: {openid: openid},
                    success: function (res) {
                        if (res.status == 1) {
                            window.open(res.url);
                        } else {
                            layer.msg(res.msg, {time: 1500})
                        }
                    }
                })
            } else if (layEvent === 'record') {
                var openid = data.openid
                top.layer.open({
                    type: 2,
                    content: "{:U('balance')}?openid=" + openid,
                    title: "余额查询",
                    area: ["600px", '300px'],
                    end: function () {

                    }
                })
            }
        });
        $('#sure').click(function () {
            layer.open({
                type: 1,
                content: $('.pass-content'),
                title: "请绑定UU账号",
                area: '450px',
                shade: false,
                btn: ['确定'],
                btnAlign: 'c',
                yes: function () {
                    var mobile = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;//手机号
                    var phone = $('#phone').val();
                    var pass = $('#pass').val();
                    var city_name = $('#city_name').val();
                    var county_name = $('#county_name').val();
                    if (!city_name) {
                        layer.msg("请输入城市名称", {time: 1500}, function () {
                        })
                        return false
                    }
                    if (!phone) {
                        layer.msg("请输入手机号", {time: 1500}, function () {
                        })
                        return false
                    }
                    if (!mobile.test(phone)) {
                        layer.msg("请输正确手机号", {time: 1500}, function () {
                        })
                        return false
                    }
                    if (!pass) {
                        layer.msg('请输入商户验证码', {time: 800});
                        return false;
                    }
                    $.ajax({
                        url: "{:U('getopenid')}",
                        type: "post",
                        data: {phone: phone, pass: pass, city_name: city_name, county_name: county_name},
                        success: function (res) {
                            if (res.status == 1) {
                                layer.msg(res.msg, {time: 3000}, function () {
                                    MenuApp.refreshWindow();
                                })
                            } else {
                                layer.msg(res.msg, {time: 3000}, function () {

                                })
                            }
                        }
                    })
                },
                end: function () {
                    $('.pass-content').hide();
                }
            })
        })
        $('#getcode').click(function () {
            var mobile = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;//手机号
            var phone = $('#phone').val();
            var city_name = $('#city_name').val();
            if (!phone) {
                layer.msg("请输入手机号", {time: 1500}, function () {
                })
                return false
            }
            if (!mobile.test(phone)) {
                layer.msg("请输入正确手机号", {time: 1500}, function () {
                })
                return false
            }
            if (!city_name) {
                layer.msg("请输入城市名称", {time: 1500}, function () {
                })
                return false
            }
            $.ajax({
                url: "{:U('getcode')}",
                type: "post",
                data: {phone: phone},
                success: function (res) {
                    if (res.status == 1) {
                        layer.msg(res.msg, {time: 1500});
                        code()
                    } else {
                        layer.msg(res.msg, {time: 1500});
                    }
                }
            })

        })
        var time = 60;

        function code() {
            var but = $('#getcode');
            if (time == 0) {
                but.attr('disabled', false);
                but.html('获取验证码');
                time = 60;
                return;
            } else {
                but.attr('disabled', true);
                but.html("重新获取(" + time + "s)");
                time--;
            }
            setTimeout(function () {
                code();
            }, 1000)
        }
    })
</script>