{layout name="layout" /}
<style>
    a ,a:hover{
        color: #fff;
        text-decoration: none;
    }
    .set_con {
        width: 100%;
        height: auto;
        float: left;
        background-color: #fff;
        min-width: 1130px;
        overflow: auto;
        box-sizing: border-box;
        padding-left: 50px;
    }
    .layui-form-item {
        /* margin-bottom: 15px; */
        clear: both;
        width: 1130px;
        margin: 10px 0;
        float: left;
    }
    .layui-input, .layui-textarea {
        width: 190px;
    }
    #if_con {
        overflow: auto;
        background:#fff;
    }
    .height150{
        height:150px;
    }
    .display{ display:none}
</style>
<div class="if_wrap">
    <div id="if_con">
        <div class="cus-con">
            <div class="set-top">
            <!-- <div class="layui-btn"><a href="{:url('vip/scorerule/cardrulelist');}">会员卡生成规则列表</a></div> -->
            <div class="layui-btn" ><a href="{:url('vip/level/index')}">用户级别管理</div>
			<div class="layui-btn" ><a href="{:url('vip/scorerule/index')}">积分规则管理</a></div>
			<div class="layui-btn" ><a href="{:url('vip/scorerule/cardadd')}">会员卡生成规则管理</a></div>
			<div class="layui-btn" ><a href="{:url('vip/memberq/index')}">会员权益管理</a></div>
            
            </div>
            <form class="layui-form layui-form-pane1" action="" method="post" id="addform" enctype="multipart/form-data">
                <div class="layui-form-item">
                    <label class="layui-form-label">编号实例:</label>
                    <div class="layui-form-mid layui-word-aux">VIP-0687259588888</div>
                    <div class="layui-input-block"><span></span></div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">会员卡前缀</label>
                    <div class="layui-input-block">
                        <input type="text" name="card_prefix" class="layui-input"  id="card_prefix" lay-verify="required|card_prefix" required placeholder="请输入5位前缀" autocomplete="off" value="">
                        <div class="layui-form-mid layui-word-aux">请输入a-zA-Z/_/-任意5位字母</div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">会员卡后缀</label>
                    <div class="layui-input-block">
                        <input type="text" name="card_next" class="layui-input"  id="card_next" lay-verify="required|card_next" required placeholder="请输入会员卡前缀" autocomplete="off" value="">
                        <div class="layui-form-mid layui-word-aux">请输入0-9任意5位可选数字</div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">会员卡长度</label>
                    <div class="layui-input-block">
                        <input type="text" name="card_lenght" class="layui-input"  id="card_lenght" lay-verify="required|card_lenght" required placeholder="请选择长度为6-10之间的长度数" autocomplete="off" value="">
                        <div class="layui-form-mid layui-word-aux">建议选择6位长度(最高10位)</div>
                    </div>
                 </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">选择卡号长度生成数字</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="card_number[1]" value="1" title="1" checked>
                        <input type="checkbox" name="card_number[2]" value="2" title="2" checked>
                        <input type="checkbox" name="card_number[3]" value="3" title="3" checked>
                        <input type="checkbox" name="card_number[4]" value="4" title="4">
                        <input type="checkbox" name="card_number[5]" value="5" title="5" checked>
                        <input type="checkbox" name="card_number[6]" value="6" title="6" checked>
                        <input type="checkbox" name="card_number[7]" value="7" title="7" checked>
                        <input type="checkbox" name="card_number[8]" value="8" title="8" checked>
                        <input type="checkbox" name="card_number[9]" value="9" title="9" checked>
                        <input type="checkbox" name="card_number[0]" value="0" title="0" checked>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否默认手机号</label>
                    <div class="layui-input-block">
                        <input type="radio" name="this_phone" value="1" title="是">
                        <input type="radio" name="this_phone" value="2" title="否" checked>
                    </div>
                </div>
                <div class="layui-form-item height150">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="*">添加生成规则</button>
                        <button type="reset" class="layui-btn layui-btn-primary back">返回</button>
                    </div>
                </div>
            </form>
        </div>
    </div></div>
<script>
    $(".back").on('click',function(){
        location.href="{:url('vip/link/add')}";
    })
    layui.use('form', function(){
        var form = layui.form;
        //自定义验证规则
        form.verify({
            card_prefix: function(value){
                var regs = /[^a-z|A-Z|\-|_]{0,5}/g;
                if(value.length > 5){
                    return '请输入5位前缀';
                }
                if(!regs.test(value)){
                    return '请输入正确的格式';
                }
            }
            ,card_lenght:function(value){
                if (parseInt(value) <6 || parseInt(value) >10) {
                    return '请选择长度为6-10之间的长度数';
                }
            }
            ,card_next: function(value){
                var regs = /^[0-9]{0,5}$/;
                if (!regs.test(value) || value.length >5) {
                    return '请输入正确格式';
                }
            }
        });

        //事件监听
        form.on('select', function(data){
        });
        form.on('radio', function(data){
        });

        //监听提交
        form.on('submit(*)', function(data){
            var card_prefix = $.trim($("#card_prefix").val());
            var formid = document.getElementById("addform");
            var sformData = new FormData(formid);
            if(card_prefix){
                $.ajax({
                    type:'post',
                    data:sformData,
                    url:"{:url('vip/scorerule/cardAdd')}",
                    processData: false,  // 不处理数据
                    contentType:false,
                    success:function(s){
                        if(s.code==1){
                            layer.open({
                                content: '恭喜您添加卡号规则成功！',
                                btn: ['确认'],
                                yes: function(index, layero) {
                                    window.location.href="{:url('vip/scorerule/cardrulelist')}";
                                }
                            });
                        } else if (s.code == 2) {
                            layer.msg('一个事业部下只能有一条会员卡编号生成记录', {
                                icon: 2
                            });
                        } else {
                            layer.msg('添加失败', {
                                icon: 2
                            });
                        }
                    }
                })
            }
            return false;
        });
    });

    // 图片显示
    $("#imginput").on('change',function(){
        imgView(this);
        $("#imgbox").removeClass("display");
    });

    // 图片显示处理函数
    function imgView(filedom){
        console.log(filedom);
        // 判断是否支持fileReader
        if(window.FileReader){
            var reader = new FileReader();
            // 获取文件
            var file = filedom.files[0];
            var imagetype = /^image\//;
            // 判断是否是图片
            console.log(file);
            console.log(file.type);
            console.log(file.size);
            if(!imagetype.test(file.type)){
                layer.msg('请上传正确图片类型文件', {
                    icon: 2
                });
                return;
            }
            // 读取完成
            reader.onload = function(e){
                // 获取图片dom
                var img = document.getElementById('imgbox');
                // 图片路径设置为读取的图片
                img.src = e.target.result;
            };
            reader.readAsDataURL(file);
        }
    }
</script>
</body>
</html>